@ifsworld/granite-components 7.7.0 → 8.0.0

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 (136) hide show
  1. package/date-picker/lib/date-picker-base.d.ts +3 -3
  2. package/date-picker/lib/date-picker-trigger-for.directive.d.ts +1 -1
  3. package/date-picker/lib/date-picker.component.d.ts +1 -1
  4. package/date-picker/lib/date-picker.module.d.ts +6 -7
  5. package/date-picker/lib/date-range-picker.component.d.ts +1 -1
  6. package/esm2020/date-picker/lib/date-picker-base.mjs +4 -4
  7. package/esm2020/date-picker/lib/date-picker-trigger-for.directive.mjs +4 -4
  8. package/esm2020/date-picker/lib/date-picker.component.mjs +9 -9
  9. package/esm2020/date-picker/lib/date-picker.module.mjs +14 -20
  10. package/esm2020/date-picker/lib/date-range-picker.component.mjs +9 -9
  11. package/esm2020/lib/arrange-grid/arrange-grid-item.component.mjs +12 -12
  12. package/esm2020/lib/arrange-grid/arrange-grid.component.mjs +19 -19
  13. package/esm2020/lib/arrange-grid/arrange-grid.module.mjs +5 -5
  14. package/esm2020/lib/badge/badge.component.mjs +4 -4
  15. package/esm2020/lib/badge/badge.module.mjs +5 -5
  16. package/esm2020/lib/button/button.component.mjs +9 -9
  17. package/esm2020/lib/button/button.module.mjs +5 -5
  18. package/esm2020/lib/checkbox/checkbox-group.component.mjs +4 -4
  19. package/esm2020/lib/checkbox/checkbox.component.mjs +5 -5
  20. package/esm2020/lib/checkbox/checkbox.module.mjs +5 -5
  21. package/esm2020/lib/chips/chip-input.mjs +25 -25
  22. package/esm2020/lib/chips/chip-list.component.mjs +46 -46
  23. package/esm2020/lib/chips/chip.component.mjs +47 -47
  24. package/esm2020/lib/chips/chips.module.mjs +5 -5
  25. package/esm2020/lib/core/common-behaviors/disabled.mjs +4 -4
  26. package/esm2020/lib/core/core.module.mjs +5 -5
  27. package/esm2020/lib/core/devices/client-input-desktop.directive.mjs +4 -4
  28. package/esm2020/lib/core/devices/client-input-touch.directive.mjs +4 -4
  29. package/esm2020/lib/core/devices/client-output-desktop.directive.mjs +4 -4
  30. package/esm2020/lib/core/devices/client-output-touch.directive.mjs +4 -4
  31. package/esm2020/lib/core/pipes/pure-pipes.module.mjs +5 -5
  32. package/esm2020/lib/core/pipes/title.pipe.mjs +4 -4
  33. package/esm2020/lib/core/radio-checkbox-base.mjs +4 -4
  34. package/esm2020/lib/grid/grid.component.mjs +10 -10
  35. package/esm2020/lib/grid/grid.module.mjs +5 -5
  36. package/esm2020/lib/icon/icon.component.mjs +4 -4
  37. package/esm2020/lib/icon/icon.module.mjs +5 -5
  38. package/esm2020/lib/input-field/input-field.component.mjs +6 -6
  39. package/esm2020/lib/input-field/input-field.module.mjs +5 -5
  40. package/esm2020/lib/label/label.component.mjs +4 -4
  41. package/esm2020/lib/label/label.module.mjs +5 -5
  42. package/esm2020/lib/menu/divider.directive.mjs +4 -4
  43. package/esm2020/lib/menu/menu-base.mjs +31 -31
  44. package/esm2020/lib/menu/menu-item.component.mjs +7 -7
  45. package/esm2020/lib/menu/menu-touch-close.component.mjs +4 -4
  46. package/esm2020/lib/menu/menu-touch-title.component.mjs +7 -7
  47. package/esm2020/lib/menu/menu-trigger-for.directive.mjs +4 -4
  48. package/esm2020/lib/menu/menu.component.mjs +7 -7
  49. package/esm2020/lib/menu/menu.module.mjs +5 -5
  50. package/esm2020/lib/menu/title.directive.mjs +4 -4
  51. package/esm2020/lib/radio-button/radio-button.component.mjs +5 -5
  52. package/esm2020/lib/radio-button/radio-button.module.mjs +5 -5
  53. package/esm2020/lib/radio-button/radio-group.component.mjs +4 -4
  54. package/esm2020/lib/toggle-switch/toggle-switch.component.mjs +4 -4
  55. package/esm2020/lib/toggle-switch/toggle-switch.module.mjs +5 -5
  56. package/esm2020/table/lib/cell/cell-align/cell-align-classes.directive.mjs +4 -4
  57. package/esm2020/table/lib/cell/cell.mjs +4 -4
  58. package/esm2020/table/lib/cell/table-data-cell.component.mjs +5 -5
  59. package/esm2020/table/lib/cell/table-header-cell.component.mjs +4 -4
  60. package/esm2020/table/lib/column/table-column.directive.mjs +4 -4
  61. package/esm2020/table/lib/table.component.mjs +9 -9
  62. package/esm2020/table/lib/table.module.mjs +5 -5
  63. package/esm2020/tooltip/lib/tooltip-trigger-for.directive.mjs +4 -4
  64. package/esm2020/tooltip/lib/tooltip.component.mjs +4 -4
  65. package/esm2020/tooltip/lib/tooltip.module.mjs +5 -5
  66. package/fesm2015/ifsworld-granite-components-date-picker.mjs +32 -38
  67. package/fesm2015/ifsworld-granite-components-date-picker.mjs.map +1 -1
  68. package/fesm2015/ifsworld-granite-components-table.mjs +25 -25
  69. package/fesm2015/ifsworld-granite-components-table.mjs.map +1 -1
  70. package/fesm2015/ifsworld-granite-components-tooltip.mjs +10 -10
  71. package/fesm2015/ifsworld-granite-components-tooltip.mjs.map +1 -1
  72. package/fesm2015/ifsworld-granite-components.mjs +333 -333
  73. package/fesm2015/ifsworld-granite-components.mjs.map +1 -1
  74. package/fesm2020/ifsworld-granite-components-date-picker.mjs +32 -38
  75. package/fesm2020/ifsworld-granite-components-date-picker.mjs.map +1 -1
  76. package/fesm2020/ifsworld-granite-components-table.mjs +25 -25
  77. package/fesm2020/ifsworld-granite-components-table.mjs.map +1 -1
  78. package/fesm2020/ifsworld-granite-components-tooltip.mjs +10 -10
  79. package/fesm2020/ifsworld-granite-components-tooltip.mjs.map +1 -1
  80. package/fesm2020/ifsworld-granite-components.mjs +333 -333
  81. package/fesm2020/ifsworld-granite-components.mjs.map +1 -1
  82. package/lib/arrange-grid/arrange-grid-item.component.d.ts +1 -1
  83. package/lib/arrange-grid/arrange-grid.component.d.ts +1 -1
  84. package/lib/badge/badge.component.d.ts +1 -1
  85. package/lib/button/button.component.d.ts +2 -2
  86. package/lib/checkbox/checkbox-group.component.d.ts +1 -1
  87. package/lib/checkbox/checkbox.component.d.ts +1 -1
  88. package/lib/chips/chip-input.d.ts +1 -1
  89. package/lib/chips/chip-list.component.d.ts +1 -1
  90. package/lib/chips/chip.component.d.ts +1 -1
  91. package/lib/core/client-environment.d.ts +2 -2
  92. package/lib/core/common-behaviors/disabled.d.ts +1 -1
  93. package/lib/core/devices/client-input-desktop.directive.d.ts +1 -1
  94. package/lib/core/devices/client-input-touch.directive.d.ts +1 -1
  95. package/lib/core/devices/client-output-desktop.directive.d.ts +1 -1
  96. package/lib/core/devices/client-output-touch.directive.d.ts +1 -1
  97. package/lib/core/pipes/title.pipe.d.ts +1 -1
  98. package/lib/core/radio-checkbox-base.d.ts +1 -1
  99. package/lib/core/types.d.ts +2 -2
  100. package/lib/grid/grid.component.d.ts +2 -2
  101. package/lib/icon/icon.component.d.ts +1 -1
  102. package/lib/input-field/input-field.component.d.ts +1 -1
  103. package/lib/label/label.component.d.ts +1 -1
  104. package/lib/menu/divider.directive.d.ts +1 -1
  105. package/lib/menu/menu-base.d.ts +3 -3
  106. package/lib/menu/menu-item.component.d.ts +1 -1
  107. package/lib/menu/menu-panel.d.ts +1 -1
  108. package/lib/menu/menu-positions.d.ts +2 -2
  109. package/lib/menu/menu-touch-close.component.d.ts +1 -1
  110. package/lib/menu/menu-touch-title.component.d.ts +1 -1
  111. package/lib/menu/menu-trigger-for.directive.d.ts +1 -1
  112. package/lib/menu/menu.component.d.ts +1 -1
  113. package/lib/menu/title.directive.d.ts +1 -1
  114. package/lib/radio-button/radio-button.component.d.ts +1 -1
  115. package/lib/radio-button/radio-group.component.d.ts +1 -1
  116. package/lib/toggle-switch/toggle-switch.component.d.ts +1 -1
  117. package/package.json +18 -14
  118. package/src/lib/core/style/_mixins.scss +8 -4
  119. package/src/lib/core/style/_overlay.scss +2 -2
  120. package/src/lib/core/style/_z-index.scss +4 -0
  121. package/table/lib/cell/cell-align/cell-align-classes.directive.d.ts +1 -1
  122. package/table/lib/cell/cell.d.ts +1 -1
  123. package/table/lib/cell/table-data-cell.component.d.ts +1 -1
  124. package/table/lib/cell/table-header-cell.component.d.ts +1 -1
  125. package/table/lib/column/table-column.directive.d.ts +1 -1
  126. package/table/lib/table.component.d.ts +1 -1
  127. package/table/lib/table.types.d.ts +1 -1
  128. package/tooltip/lib/tooltip-trigger-for.directive.d.ts +1 -1
  129. package/tooltip/lib/tooltip.component.d.ts +1 -1
  130. package/date-picker/ifsworld-granite-components-date-picker.d.ts +0 -5
  131. package/date-picker/package.json +0 -19
  132. package/ifsworld-granite-components.d.ts +0 -5
  133. package/table/ifsworld-granite-components-table.d.ts +0 -5
  134. package/table/package.json +0 -18
  135. package/tooltip/ifsworld-granite-components-tooltip.d.ts +0 -5
  136. package/tooltip/package.json +0 -10
@@ -1,13 +1,13 @@
1
1
  import * as i0 from '@angular/core';
2
2
  import { Component, ChangeDetectionStrategy, Input, HostBinding, ContentChildren, NgModule, InjectionToken, Attribute, Inject, Optional, EventEmitter, QueryList, TemplateRef, Directive, ViewChild, Output, Self, HostListener, ViewEncapsulation, Pipe } from '@angular/core';
3
- import * as i3 from '@angular/common';
3
+ import * as i1$1 from '@angular/common';
4
4
  import { CommonModule, DOCUMENT } from '@angular/common';
5
5
  import { coerceNumberProperty, coerceBooleanProperty } from '@angular/cdk/coercion';
6
6
  import { Subject, BehaviorSubject, combineLatest, Subscription, merge, of, asapScheduler, fromEvent } from 'rxjs';
7
7
  import { takeUntil, filter, map, startWith, switchMap, take, delay } from 'rxjs/operators';
8
8
  import { __awaiter } from 'tslib';
9
9
  import { ComponentHarness, HarnessPredicate, TestKey } from '@angular/cdk/testing';
10
- import * as i1$1 from '@angular/cdk/overlay';
10
+ import * as i1$2 from '@angular/cdk/overlay';
11
11
  import { OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
12
12
  import { TemplatePortal, PortalModule } from '@angular/cdk/portal';
13
13
  import { trigger, state, style, transition, group, query, animate, sequence } from '@angular/animations';
@@ -15,13 +15,21 @@ import * as i1 from '@angular/cdk/a11y';
15
15
  import { FocusKeyManager, isFakeMousedownFromScreenReader } from '@angular/cdk/a11y';
16
16
  import { hasModifierKey, SPACE, BACKSPACE, DELETE, ENTER, TAB } from '@angular/cdk/keycodes';
17
17
  import { normalizePassiveListenerOptions } from '@angular/cdk/platform';
18
- import * as i3$1 from '@angular/cdk/bidi';
18
+ import * as i3 from '@angular/cdk/bidi';
19
19
  import * as i2 from '@angular/cdk/collections';
20
20
  import { SelectionModel } from '@angular/cdk/collections';
21
21
  import * as i2$1 from '@angular/forms';
22
22
  import { FormsModule, ReactiveFormsModule } from '@angular/forms';
23
23
 
24
24
  class GraniteArrangeGridItemComponent {
25
+ /**
26
+ * Number of cells the item would span. Used by arrange grid in column
27
+ * orientation to fill any unused space caused by wrapped items.
28
+ */
29
+ set columnSpan(value) {
30
+ this._columnSpan = value;
31
+ this.updateStyles();
32
+ }
25
33
  constructor(element) {
26
34
  this.element = element;
27
35
  /**
@@ -32,14 +40,6 @@ class GraniteArrangeGridItemComponent {
32
40
  this._columnSpan = null;
33
41
  /* no-op */
34
42
  }
35
- /**
36
- * Number of cells the item would span. Used by arrange grid in column
37
- * orientation to fill any unused space caused by wrapped items.
38
- */
39
- set columnSpan(value) {
40
- this._columnSpan = value;
41
- this.updateStyles();
42
- }
43
43
  /**
44
44
  * Update element styles
45
45
  */
@@ -56,9 +56,9 @@ class GraniteArrangeGridItemComponent {
56
56
  this.element.nativeElement.style.setProperty(variable, value);
57
57
  }
58
58
  }
59
- GraniteArrangeGridItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteArrangeGridItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
60
- GraniteArrangeGridItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteArrangeGridItemComponent, selector: "granite-arrange-grid-item", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{--columnSpan: $default-column-span;display:grid;grid-column:span var(--columnSpan, 1)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
61
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteArrangeGridItemComponent, decorators: [{
59
+ GraniteArrangeGridItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteArrangeGridItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
60
+ GraniteArrangeGridItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteArrangeGridItemComponent, selector: "granite-arrange-grid-item", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{--columnSpan: $default-column-span;display:grid;grid-column:span var(--columnSpan, 1)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
61
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteArrangeGridItemComponent, decorators: [{
62
62
  type: Component,
63
63
  args: [{ selector: 'granite-arrange-grid-item', template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--columnSpan: $default-column-span;display:grid;grid-column:span var(--columnSpan, 1)}\n"] }]
64
64
  }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
@@ -69,20 +69,6 @@ var GraniteArrangeGridOrientation;
69
69
  GraniteArrangeGridOrientation["rows"] = "rows";
70
70
  })(GraniteArrangeGridOrientation || (GraniteArrangeGridOrientation = {}));
71
71
  class GraniteArrangeGridComponent {
72
- constructor(element) {
73
- this.element = element;
74
- /** How to present grid items; `columns` (default) or `rows` */
75
- this.orientation = GraniteArrangeGridOrientation.columns;
76
- /** Exposes column orientation to template */
77
- this.classColumnOrientation = false;
78
- /** Exposes row orientation to template */
79
- this.classRowOrientation = false;
80
- /** Number of columns to render */
81
- this._cols = GraniteArrangeGridComponent.defaultCols;
82
- /** Nexted on component destruction to complete other observables. */
83
- this.destroy$ = new Subject();
84
- /* no-op */
85
- }
86
72
  /**
87
73
  * Number of grid columns to use when orientation is set to `column`. The
88
74
  * default is two columns.
@@ -100,6 +86,20 @@ class GraniteArrangeGridComponent {
100
86
  get rows() {
101
87
  return this._rows;
102
88
  }
89
+ constructor(element) {
90
+ this.element = element;
91
+ /** How to present grid items; `columns` (default) or `rows` */
92
+ this.orientation = GraniteArrangeGridOrientation.columns;
93
+ /** Exposes column orientation to template */
94
+ this.classColumnOrientation = false;
95
+ /** Exposes row orientation to template */
96
+ this.classRowOrientation = false;
97
+ /** Number of columns to render */
98
+ this._cols = GraniteArrangeGridComponent.defaultCols;
99
+ /** Nexted on component destruction to complete other observables. */
100
+ this.destroy$ = new Subject();
101
+ /* no-op */
102
+ }
103
103
  ngAfterContentInit() {
104
104
  // Update style whenever grid item components change in content
105
105
  this.arrangeGridItemComponents.changes
@@ -162,11 +162,11 @@ class GraniteArrangeGridComponent {
162
162
  }
163
163
  /** Default number of columns to use in column orientation */
164
164
  GraniteArrangeGridComponent.defaultCols = 2;
165
- GraniteArrangeGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteArrangeGridComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
166
- GraniteArrangeGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteArrangeGridComponent, selector: "granite-arrange-grid", inputs: { orientation: "orientation", cols: "cols" }, host: { properties: { "class.column-orientation": "this.classColumnOrientation", "class.row-orientation": "this.classRowOrientation" } }, queries: [{ propertyName: "arrangeGridItemComponents", predicate: GraniteArrangeGridItemComponent }], usesOnChanges: true, ngImport: i0, template: "<ng-content select=\"granite-arrange-grid-item\"></ng-content>\n", styles: ["@media only screen and (min-width: 960px){:host{--cols: 1;--rows: 1;display:grid;grid-template-columns:repeat(var(--cols, 1),1fr);grid-column-gap:.5rem;column-gap:.5rem;grid-row-gap:.5rem;row-gap:.5rem}:host.row-orientation{grid-template-columns:auto;grid-template-rows:repeat(calc(var(--rows, 1) - 1),max-content)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
167
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteArrangeGridComponent, decorators: [{
165
+ GraniteArrangeGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteArrangeGridComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
166
+ GraniteArrangeGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteArrangeGridComponent, selector: "granite-arrange-grid", inputs: { orientation: "orientation", cols: "cols" }, host: { properties: { "class.column-orientation": "this.classColumnOrientation", "class.row-orientation": "this.classRowOrientation" } }, queries: [{ propertyName: "arrangeGridItemComponents", predicate: GraniteArrangeGridItemComponent }], usesOnChanges: true, ngImport: i0, template: "<ng-content select=\"granite-arrange-grid-item\"></ng-content>\n", styles: ["@media only screen and (min-width: 960px){:host{--cols: 1;--rows: 1;display:grid;grid-template-columns:repeat(var(--cols, 1),1fr);column-gap:.5rem;row-gap:.5rem}:host.row-orientation{grid-template-columns:auto;grid-template-rows:repeat(calc(var(--rows, 1) - 1),max-content)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
167
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteArrangeGridComponent, decorators: [{
168
168
  type: Component,
169
- args: [{ selector: 'granite-arrange-grid', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"granite-arrange-grid-item\"></ng-content>\n", styles: ["@media only screen and (min-width: 960px){:host{--cols: 1;--rows: 1;display:grid;grid-template-columns:repeat(var(--cols, 1),1fr);grid-column-gap:.5rem;column-gap:.5rem;grid-row-gap:.5rem;row-gap:.5rem}:host.row-orientation{grid-template-columns:auto;grid-template-rows:repeat(calc(var(--rows, 1) - 1),max-content)}}\n"] }]
169
+ args: [{ selector: 'granite-arrange-grid', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"granite-arrange-grid-item\"></ng-content>\n", styles: ["@media only screen and (min-width: 960px){:host{--cols: 1;--rows: 1;display:grid;grid-template-columns:repeat(var(--cols, 1),1fr);column-gap:.5rem;row-gap:.5rem}:host.row-orientation{grid-template-columns:auto;grid-template-rows:repeat(calc(var(--rows, 1) - 1),max-content)}}\n"] }]
170
170
  }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { orientation: [{
171
171
  type: Input
172
172
  }], classColumnOrientation: [{
@@ -184,10 +184,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
184
184
 
185
185
  class GraniteArrangeGridModule {
186
186
  }
187
- GraniteArrangeGridModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteArrangeGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
188
- GraniteArrangeGridModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteArrangeGridModule, declarations: [GraniteArrangeGridComponent, GraniteArrangeGridItemComponent], imports: [CommonModule], exports: [GraniteArrangeGridComponent, GraniteArrangeGridItemComponent] });
189
- GraniteArrangeGridModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteArrangeGridModule, imports: [[CommonModule]] });
190
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteArrangeGridModule, decorators: [{
187
+ GraniteArrangeGridModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteArrangeGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
188
+ GraniteArrangeGridModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteArrangeGridModule, declarations: [GraniteArrangeGridComponent, GraniteArrangeGridItemComponent], imports: [CommonModule], exports: [GraniteArrangeGridComponent, GraniteArrangeGridItemComponent] });
189
+ GraniteArrangeGridModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteArrangeGridModule, imports: [CommonModule] });
190
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteArrangeGridModule, decorators: [{
191
191
  type: NgModule,
192
192
  args: [{
193
193
  declarations: [GraniteArrangeGridComponent, GraniteArrangeGridItemComponent],
@@ -226,9 +226,9 @@ class GraniteGridItemComponent {
226
226
  this.renderer.setStyle(this.element.nativeElement, property, value || '');
227
227
  }
228
228
  }
229
- GraniteGridItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteGridItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
230
- GraniteGridItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteGridItemComponent, selector: "granite-grid-item", inputs: { columnStart: "columnStart", columnEnd: "columnEnd", rowStart: "rowStart", rowEnd: "rowEnd" }, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
231
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteGridItemComponent, decorators: [{
229
+ GraniteGridItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteGridItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
230
+ GraniteGridItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteGridItemComponent, selector: "granite-grid-item", inputs: { columnStart: "columnStart", columnEnd: "columnEnd", rowStart: "rowStart", rowEnd: "rowEnd" }, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
231
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteGridItemComponent, decorators: [{
232
232
  type: Component,
233
233
  args: [{
234
234
  selector: 'granite-grid-item',
@@ -251,9 +251,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
251
251
  * `GridItemComponent` is recommended for common cases.
252
252
  */
253
253
  class GraniteGridComponent {
254
- constructor(element) {
255
- this.element = element;
256
- }
257
254
  /**
258
255
  * Number of grid columns, unless set via styling (grid-template-columns)
259
256
  *
@@ -276,6 +273,9 @@ class GraniteGridComponent {
276
273
  get rows() {
277
274
  return this._rows;
278
275
  }
276
+ constructor(element) {
277
+ this.element = element;
278
+ }
279
279
  ngAfterContentInit() {
280
280
  this.updateStyles();
281
281
  }
@@ -310,9 +310,9 @@ class GraniteGridComponent {
310
310
  this.setCssProperty('--rows', (this._rows && this._rows.toString()) || null);
311
311
  }
312
312
  }
313
- GraniteGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteGridComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
314
- GraniteGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteGridComponent, selector: "granite-grid", inputs: { cols: "cols", rows: "rows" }, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{--cols: 1;--rows: 1;display:grid;grid-template-columns:repeat(var(--cols, 1),1fr);grid-template-rows:repeat(var(--rows, 1),1fr)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
315
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteGridComponent, decorators: [{
313
+ GraniteGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteGridComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
314
+ GraniteGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteGridComponent, selector: "granite-grid", inputs: { cols: "cols", rows: "rows" }, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{--cols: 1;--rows: 1;display:grid;grid-template-columns:repeat(var(--cols, 1),1fr);grid-template-rows:repeat(var(--rows, 1),1fr)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
315
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteGridComponent, decorators: [{
316
316
  type: Component,
317
317
  args: [{ selector: 'granite-grid', template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--cols: 1;--rows: 1;display:grid;grid-template-columns:repeat(var(--cols, 1),1fr);grid-template-rows:repeat(var(--rows, 1),1fr)}\n"] }]
318
318
  }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { cols: [{
@@ -323,10 +323,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
323
323
 
324
324
  class GraniteGridModule {
325
325
  }
326
- GraniteGridModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
327
- GraniteGridModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteGridModule, declarations: [GraniteGridComponent, GraniteGridItemComponent], imports: [CommonModule], exports: [GraniteGridComponent, GraniteGridItemComponent] });
328
- GraniteGridModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteGridModule, imports: [[CommonModule]] });
329
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteGridModule, decorators: [{
326
+ GraniteGridModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
327
+ GraniteGridModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteGridModule, declarations: [GraniteGridComponent, GraniteGridItemComponent], imports: [CommonModule], exports: [GraniteGridComponent, GraniteGridItemComponent] });
328
+ GraniteGridModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteGridModule, imports: [CommonModule] });
329
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteGridModule, decorators: [{
330
330
  type: NgModule,
331
331
  args: [{
332
332
  declarations: [GraniteGridComponent, GraniteGridItemComponent],
@@ -414,9 +414,9 @@ class GraniteBadgeComponent {
414
414
  }
415
415
  }
416
416
  }
417
- GraniteBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteBadgeComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
418
- GraniteBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteBadgeComponent, selector: "granite-badge", inputs: { backgroundColor: "backgroundColor", color: "color", pill: "pill" }, host: { properties: { "class.granite-badge-pill": "pill" }, classAttribute: "granite-badge" }, exportAs: ["graniteBadge"], usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:-moz-inline-flex;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;align-items:center;background-color:var(--granite-color-signal-neutral);color:var(--granite-color-text-static-light);border-radius:.25rem;font-size:var(--granite-font-size-body-small);padding-inline:var(--granite-spacing-s);padding-block:var(--granite-spacing-xs)}:host(.granite-badge-pill){border-radius:1rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
419
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteBadgeComponent, decorators: [{
417
+ GraniteBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteBadgeComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
418
+ GraniteBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteBadgeComponent, selector: "granite-badge", inputs: { backgroundColor: "backgroundColor", color: "color", pill: "pill" }, host: { properties: { "class.granite-badge-pill": "pill" }, classAttribute: "granite-badge" }, exportAs: ["graniteBadge"], usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:-moz-inline-flex;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;align-items:center;background-color:var(--granite-color-signal-neutral);color:var(--granite-color-text-static-light);border-radius:.25rem;font-size:var(--granite-font-size-body-small);padding-inline:var(--granite-spacing-s);padding-block:var(--granite-spacing-xs)}:host(.granite-badge-pill){border-radius:1rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
419
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteBadgeComponent, decorators: [{
420
420
  type: Component,
421
421
  args: [{ selector: 'granite-badge', exportAs: 'graniteBadge', host: {
422
422
  class: 'granite-badge',
@@ -432,10 +432,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
432
432
 
433
433
  class GraniteBadgeModule {
434
434
  }
435
- GraniteBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
436
- GraniteBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteBadgeModule, declarations: [GraniteBadgeComponent], imports: [CommonModule], exports: [GraniteBadgeComponent] });
437
- GraniteBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteBadgeModule, imports: [[CommonModule]] });
438
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteBadgeModule, decorators: [{
435
+ GraniteBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
436
+ GraniteBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteBadgeModule, declarations: [GraniteBadgeComponent], imports: [CommonModule], exports: [GraniteBadgeComponent] });
437
+ GraniteBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteBadgeModule, imports: [CommonModule] });
438
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteBadgeModule, decorators: [{
439
439
  type: NgModule,
440
440
  args: [{
441
441
  declarations: [GraniteBadgeComponent],
@@ -731,9 +731,9 @@ class GraniteIconComponent {
731
731
  }
732
732
  }
733
733
  }
734
- GraniteIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteIconComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: 'aria-hidden', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
735
- GraniteIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteIconComponent, selector: "granite-icon", inputs: { fontIcon: "fontIcon" }, host: { attributes: { "role": "img" }, classAttribute: "granite-icon" }, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host.granite-icon{background-repeat:no-repeat;display:inline-block;padding:0 calc(var(--granite-spacing-xs) / 2);font-size:1em;line-height:1em;position:relative;top:.1em}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
736
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteIconComponent, decorators: [{
734
+ GraniteIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteIconComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: 'aria-hidden', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
735
+ GraniteIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteIconComponent, selector: "granite-icon", inputs: { fontIcon: "fontIcon" }, host: { attributes: { "role": "img" }, classAttribute: "granite-icon" }, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host.granite-icon{background-repeat:no-repeat;display:inline-block;padding:0 calc(var(--granite-spacing-xs) / 2);font-size:1em;line-height:1em;position:relative;top:.1em}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
736
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteIconComponent, decorators: [{
737
737
  type: Component,
738
738
  args: [{ selector: 'granite-icon', template: '<ng-content></ng-content>', host: {
739
739
  role: 'img',
@@ -788,8 +788,8 @@ class GraniteMenuItemComponent {
788
788
  return this._elementRef.nativeElement;
789
789
  }
790
790
  }
791
- GraniteMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuItemComponent, deps: [{ token: i0.ElementRef }, { token: i1.FocusMonitor }, { token: GRANITE_MENU_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component });
792
- GraniteMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteMenuItemComponent, selector: "[graniteMenuItem]", inputs: { role: "role" }, host: { listeners: { "mouseenter": "_hovered.next(this)" }, properties: { "attr.role": "role", "class.granite-menu-item": "true", "class.granite-menu-item-highlighted": "_highlighted", "class.granite-menu-item-submenu-trigger": "_triggersSubmenu", "class.granite-device-output-touch": "_clientOutput?.device === \"touch\"" } }, exportAs: ["graniteMenuItem"], ngImport: i0, template: `<ng-content></ng-content>
791
+ GraniteMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuItemComponent, deps: [{ token: i0.ElementRef }, { token: i1.FocusMonitor }, { token: GRANITE_MENU_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component });
792
+ GraniteMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteMenuItemComponent, selector: "[graniteMenuItem]", inputs: { role: "role" }, host: { listeners: { "mouseenter": "_hovered.next(this)" }, properties: { "attr.role": "role", "class.granite-menu-item": "true", "class.granite-menu-item-highlighted": "_highlighted", "class.granite-menu-item-submenu-trigger": "_triggersSubmenu", "class.granite-device-output-touch": "_clientOutput?.device === \"touch\"" } }, exportAs: ["graniteMenuItem"], ngImport: i0, template: `<ng-content></ng-content>
793
793
  <ng-container *ngIf="_triggersSubmenu">
794
794
  <granite-icon
795
795
  class="caret-left"
@@ -799,8 +799,8 @@ GraniteMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0
799
799
  class="caret-right"
800
800
  [fontIcon]="'icon-caret-right'"
801
801
  ></granite-icon>
802
- </ng-container>`, isInline: true, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-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):not([disabled]){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):not([disabled]){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-webkit-user-select:none;user-select:none;display:flex;align-items:center;line-height:1.5rem;width:100%;outline:none;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.cdk-program-focused,:host.cdk-keyboard-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{padding-inline-end:var(--granite-spacing-l)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left{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:3rem;font-size:var(--granite-font-size-body-small);text-align:center;padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-title{padding:0;justify-content:center;line-height:1.5rem;font-size:var(--granite-font-size-micro)}: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:3rem;height:3rem;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)}}html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right{display:none}:host:disabled:not(.granite-menu-item-title){opacity:.4;cursor:default}\n"], components: [{ type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
803
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuItemComponent, decorators: [{
802
+ </ng-container>`, isInline: true, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-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):not([disabled]){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):not([disabled]){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-webkit-user-select:none;user-select:none;display:flex;align-items:center;line-height:1.5rem;width:100%;outline:none;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.cdk-program-focused,:host.cdk-keyboard-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{padding-inline-end:var(--granite-spacing-l)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left{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:3rem;font-size:var(--granite-font-size-body-small);text-align:center;padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-title{padding:0;justify-content:center;line-height:1.5rem;font-size:var(--granite-font-size-micro)}: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:3rem;height:3rem;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)}}html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right{display:none}:host:disabled:not(.granite-menu-item-title){opacity:.4;cursor:default}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }] });
803
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuItemComponent, decorators: [{
804
804
  type: Component,
805
805
  args: [{ selector: '[graniteMenuItem]', template: `<ng-content></ng-content>
806
806
  <ng-container *ngIf="_triggersSubmenu">
@@ -845,6 +845,33 @@ const transformMenuDefault = {
845
845
  /** Base class with all of the menu functionality. */
846
846
  // eslint-disable-next-line @angular-eslint/directive-class-suffix
847
847
  class _MenuBaseComponent {
848
+ /** Position of the menu in the X axis. */
849
+ get xPosition() {
850
+ return this._xPosition;
851
+ }
852
+ set xPosition(value) {
853
+ if (value !== 'before' && value !== 'after') {
854
+ throwGraniteMenuInvalidPositionX();
855
+ }
856
+ this._xPosition = value;
857
+ }
858
+ /** Position of the menu in the Y axis. */
859
+ get yPosition() {
860
+ return this._yPosition;
861
+ }
862
+ set yPosition(value) {
863
+ if (value !== 'above' && value !== 'below') {
864
+ throwGraniteMenuInvalidPositionY();
865
+ }
866
+ this._yPosition = value;
867
+ }
868
+ /** Current state of the panel animation. */
869
+ set _panelAnimationState(state) {
870
+ this._transformMenu.next({
871
+ value: state,
872
+ params: { xOffset: this.xOffset },
873
+ });
874
+ }
848
875
  constructor(_changeDetectorRef) {
849
876
  this._changeDetectorRef = _changeDetectorRef;
850
877
  this.openOnHover = true;
@@ -887,33 +914,6 @@ class _MenuBaseComponent {
887
914
  */
888
915
  this.xOffset = 0;
889
916
  }
890
- /** Position of the menu in the X axis. */
891
- get xPosition() {
892
- return this._xPosition;
893
- }
894
- set xPosition(value) {
895
- if (value !== 'before' && value !== 'after') {
896
- throwGraniteMenuInvalidPositionX();
897
- }
898
- this._xPosition = value;
899
- }
900
- /** Position of the menu in the Y axis. */
901
- get yPosition() {
902
- return this._yPosition;
903
- }
904
- set yPosition(value) {
905
- if (value !== 'above' && value !== 'below') {
906
- throwGraniteMenuInvalidPositionY();
907
- }
908
- this._yPosition = value;
909
- }
910
- /** Current state of the panel animation. */
911
- set _panelAnimationState(state) {
912
- this._transformMenu.next({
913
- value: state,
914
- params: { xOffset: this.xOffset },
915
- });
916
- }
917
917
  ngAfterContentChecked() {
918
918
  this._menuEmpty$.next(this._allItems.length < 1 ? true : false);
919
919
  }
@@ -1149,9 +1149,9 @@ class _MenuBaseComponent {
1149
1149
  });
1150
1150
  }
1151
1151
  }
1152
- _MenuBaseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: _MenuBaseComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
1153
- _MenuBaseComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: _MenuBaseComponent, inputs: { xPosition: "xPosition", yPosition: "yPosition", title: "title", closeLabel: "closeLabel", openOnHover: "openOnHover" }, outputs: { closed: "closed" }, queries: [{ propertyName: "_allItems", predicate: GraniteMenuItemComponent, descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0 });
1154
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: _MenuBaseComponent, decorators: [{
1152
+ _MenuBaseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: _MenuBaseComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
1153
+ _MenuBaseComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: _MenuBaseComponent, inputs: { xPosition: "xPosition", yPosition: "yPosition", title: "title", closeLabel: "closeLabel", openOnHover: "openOnHover" }, outputs: { closed: "closed" }, queries: [{ propertyName: "_allItems", predicate: GraniteMenuItemComponent, descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0 });
1154
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: _MenuBaseComponent, decorators: [{
1155
1155
  type: Directive
1156
1156
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { xPosition: [{
1157
1157
  type: Input
@@ -1173,6 +1173,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
1173
1173
  type: Output
1174
1174
  }] } });
1175
1175
 
1176
+ class GraniteMenuTouchCloseComponent {
1177
+ }
1178
+ GraniteMenuTouchCloseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuTouchCloseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1179
+ GraniteMenuTouchCloseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteMenuTouchCloseComponent, selector: "[graniteMenuTouchCloseItem]", host: { properties: { "class.granite-device-output-touch": "true" } }, exportAs: ["graniteMenuTouchCloseItem"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-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):not([disabled]){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):not([disabled]){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-webkit-user-select:none;user-select:none;display:flex;align-items:center;line-height:1.5rem;width:100%;outline:none;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.cdk-program-focused,:host.cdk-keyboard-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{padding-inline-end:var(--granite-spacing-l)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left{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:3rem;font-size:var(--granite-font-size-body-small);text-align:center;padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-title{padding:0;justify-content:center;line-height:1.5rem;font-size:var(--granite-font-size-micro)}: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:3rem;height:3rem;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)}}html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right{display:none}:host:disabled:not(.granite-menu-item-title){opacity:.4;cursor:default}\n"] });
1180
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuTouchCloseComponent, decorators: [{
1181
+ type: Component,
1182
+ args: [{ selector: '[graniteMenuTouchCloseItem]', template: '<ng-content></ng-content>', exportAs: 'graniteMenuTouchCloseItem', host: {
1183
+ '[class.granite-device-output-touch]': 'true',
1184
+ }, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-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):not([disabled]){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):not([disabled]){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-webkit-user-select:none;user-select:none;display:flex;align-items:center;line-height:1.5rem;width:100%;outline:none;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.cdk-program-focused,:host.cdk-keyboard-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{padding-inline-end:var(--granite-spacing-l)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left{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:3rem;font-size:var(--granite-font-size-body-small);text-align:center;padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-title{padding:0;justify-content:center;line-height:1.5rem;font-size:var(--granite-font-size-micro)}: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:3rem;height:3rem;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)}}html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right{display:none}:host:disabled:not(.granite-menu-item-title){opacity:.4;cursor:default}\n"] }]
1185
+ }] });
1186
+
1176
1187
  class GraniteMenuTouchTitleItemComponent {
1177
1188
  constructor(
1178
1189
  /** If this is an item on a _submenu_, its parent menu will have a parent */
@@ -1185,8 +1196,8 @@ class GraniteMenuTouchTitleItemComponent {
1185
1196
  this._triggersBack = !!_parentMenu.parentMenu;
1186
1197
  }
1187
1198
  }
1188
- GraniteMenuTouchTitleItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuTouchTitleItemComponent, deps: [{ token: GRANITE_MENU_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1189
- GraniteMenuTouchTitleItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteMenuTouchTitleItemComponent, selector: "[graniteMenuTouchTitleItem]", host: { properties: { "class.granite-menu-item-title": "true", "class.granite-menu-item-back-trigger": "_triggersBack", "class.granite-device-output-touch": "true" } }, exportAs: ["graniteMenuTouchTitleItem"], ngImport: i0, template: `
1199
+ GraniteMenuTouchTitleItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuTouchTitleItemComponent, deps: [{ token: GRANITE_MENU_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1200
+ GraniteMenuTouchTitleItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteMenuTouchTitleItemComponent, selector: "[graniteMenuTouchTitleItem]", host: { properties: { "class.granite-menu-item-title": "true", "class.granite-menu-item-back-trigger": "_triggersBack", "class.granite-device-output-touch": "true" } }, exportAs: ["graniteMenuTouchTitleItem"], ngImport: i0, template: `
1190
1201
  <ng-container *ngIf="_triggersBack">
1191
1202
  <granite-icon
1192
1203
  class="caret-left"
@@ -1198,8 +1209,8 @@ GraniteMenuTouchTitleItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersio
1198
1209
  ></granite-icon>
1199
1210
  </ng-container>
1200
1211
  <ng-content></ng-content>
1201
- `, isInline: true, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-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):not([disabled]){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):not([disabled]){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-webkit-user-select:none;user-select:none;display:flex;align-items:center;line-height:1.5rem;width:100%;outline:none;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.cdk-program-focused,:host.cdk-keyboard-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{padding-inline-end:var(--granite-spacing-l)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left{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:3rem;font-size:var(--granite-font-size-body-small);text-align:center;padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-title{padding:0;justify-content:center;line-height:1.5rem;font-size:var(--granite-font-size-micro)}: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:3rem;height:3rem;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)}}html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right{display:none}:host:disabled:not(.granite-menu-item-title){opacity:.4;cursor:default}\n"], components: [{ type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
1202
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuTouchTitleItemComponent, decorators: [{
1212
+ `, isInline: true, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-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):not([disabled]){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):not([disabled]){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-webkit-user-select:none;user-select:none;display:flex;align-items:center;line-height:1.5rem;width:100%;outline:none;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.cdk-program-focused,:host.cdk-keyboard-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{padding-inline-end:var(--granite-spacing-l)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left{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:3rem;font-size:var(--granite-font-size-body-small);text-align:center;padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-title{padding:0;justify-content:center;line-height:1.5rem;font-size:var(--granite-font-size-micro)}: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:3rem;height:3rem;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)}}html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right{display:none}:host:disabled:not(.granite-menu-item-title){opacity:.4;cursor:default}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }] });
1213
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuTouchTitleItemComponent, decorators: [{
1203
1214
  type: Component,
1204
1215
  args: [{ selector: '[graniteMenuTouchTitleItem]', template: `
1205
1216
  <ng-container *ngIf="_triggersBack">
@@ -1227,28 +1238,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
1227
1238
  }] }];
1228
1239
  } });
1229
1240
 
1230
- class GraniteMenuTouchCloseComponent {
1231
- }
1232
- GraniteMenuTouchCloseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuTouchCloseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1233
- GraniteMenuTouchCloseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteMenuTouchCloseComponent, selector: "[graniteMenuTouchCloseItem]", host: { properties: { "class.granite-device-output-touch": "true" } }, exportAs: ["graniteMenuTouchCloseItem"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-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):not([disabled]){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):not([disabled]){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-webkit-user-select:none;user-select:none;display:flex;align-items:center;line-height:1.5rem;width:100%;outline:none;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.cdk-program-focused,:host.cdk-keyboard-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{padding-inline-end:var(--granite-spacing-l)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left{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:3rem;font-size:var(--granite-font-size-body-small);text-align:center;padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-title{padding:0;justify-content:center;line-height:1.5rem;font-size:var(--granite-font-size-micro)}: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:3rem;height:3rem;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)}}html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right{display:none}:host:disabled:not(.granite-menu-item-title){opacity:.4;cursor:default}\n"] });
1234
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuTouchCloseComponent, decorators: [{
1235
- type: Component,
1236
- args: [{ selector: '[graniteMenuTouchCloseItem]', template: '<ng-content></ng-content>', exportAs: 'graniteMenuTouchCloseItem', host: {
1237
- '[class.granite-device-output-touch]': 'true',
1238
- }, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-s);width:100%;max-width:100%;-webkit-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):not([disabled]){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):not([disabled]){background:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}}:host.granite-title{-webkit-user-select:none;user-select:none;display:flex;align-items:center;line-height:1.5rem;width:100%;outline:none;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.cdk-program-focused,:host.cdk-keyboard-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{padding-inline-end:var(--granite-spacing-l)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-xs)}[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon.caret-right{display:none}[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon.caret-left{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:3rem;font-size:var(--granite-font-size-body-small);text-align:center;padding:0 var(--granite-spacing-l)}:host.granite-device-output-touch.granite-title{padding:0;justify-content:center;line-height:1.5rem;font-size:var(--granite-font-size-micro)}: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:3rem;height:3rem;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)}}html[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-xs)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-xs)}[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-left{display:none}[dir=ltr] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon.caret-right{display:none}:host:disabled:not(.granite-menu-item-title){opacity:.4;cursor:default}\n"] }]
1239
- }] });
1240
-
1241
1241
  class GraniteMenuComponent extends _MenuBaseComponent {
1242
1242
  }
1243
- GraniteMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1244
- GraniteMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteMenuComponent, selector: "granite-menu", providers: [
1243
+ GraniteMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1244
+ GraniteMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteMenuComponent, selector: "granite-menu", providers: [
1245
1245
  { provide: GRANITE_MENU_PANEL, useExisting: GraniteMenuComponent },
1246
- ], exportAs: ["graniteMenu"], usesInheritance: true, ngImport: i0, 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", 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;user-select:none;filter:drop-shadow(var(--granite-shadow-l));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):not(.is-menu-empty){min-height:2rem}.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;user-select:none;filter:drop-shadow(var(--granite-shadow-l));border-radius:.25rem}.granite-menu.granite-device-output-touch.ng-animating{pointer-events:none}.granite-menu.granite-device-output-touch:not(.is-menu-empty){min-height:3rem}.granite-menu.granite-device-output-touch:not(.close){margin:var(--granite-spacing-xs)}.granite-menu.granite-device-output-touch.close{margin-inline-start:var(--granite-spacing-xs);margin-inline-end:var(--granite-spacing-xs);margin-block-end:var(--granite-spacing-xs)}.granite-menu.granite-device-output-touch .header-container{position:sticky;top:0;background-color:var(--granite-color-background-variant);z-index:1}.granite-menu.granite-device-output-touch .footer-container{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;user-select:none;filter:drop-shadow(var(--granite-shadow-l));border-radius:.25rem}.close:not(:empty).ng-animating{pointer-events:none}.close:not(:empty):not(.is-menu-empty){min-height:3rem}.close:not(:empty):not(.close){margin:var(--granite-spacing-xs)}.close:not(:empty).close{margin-inline-start:var(--granite-spacing-xs);margin-inline-end:var(--granite-spacing-xs);margin-block-end:var(--granite-spacing-xs)}\n"], components: [{ type: GraniteMenuTouchTitleItemComponent, selector: "[graniteMenuTouchTitleItem]", exportAs: ["graniteMenuTouchTitleItem"] }, { type: GraniteMenuTouchCloseComponent, selector: "[graniteMenuTouchCloseItem]", exportAs: ["graniteMenuTouchCloseItem"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i3.AsyncPipe }, animations: [
1246
+ ], exportAs: ["graniteMenu"], usesInheritance: true, ngImport: i0, 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", 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;user-select:none;filter:drop-shadow(var(--granite-shadow-l));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):not(.is-menu-empty){min-height:2rem}.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;user-select:none;filter:drop-shadow(var(--granite-shadow-l));border-radius:.25rem}.granite-menu.granite-device-output-touch.ng-animating{pointer-events:none}.granite-menu.granite-device-output-touch:not(.is-menu-empty){min-height:3rem}.granite-menu.granite-device-output-touch:not(.close){margin:var(--granite-spacing-xs)}.granite-menu.granite-device-output-touch.close{margin-inline-start:var(--granite-spacing-xs);margin-inline-end:var(--granite-spacing-xs);margin-block-end:var(--granite-spacing-xs)}.granite-menu.granite-device-output-touch .header-container{position:sticky;top:0;background-color:var(--granite-color-background-variant);z-index:1}.granite-menu.granite-device-output-touch .footer-container{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;user-select:none;filter:drop-shadow(var(--granite-shadow-l));border-radius:.25rem}.close:not(:empty).ng-animating{pointer-events:none}.close:not(:empty):not(.is-menu-empty){min-height:3rem}.close:not(:empty):not(.close){margin:var(--granite-spacing-xs)}.close:not(:empty).close{margin-inline-start:var(--granite-spacing-xs);margin-inline-end:var(--granite-spacing-xs);margin-block-end:var(--granite-spacing-xs)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: GraniteMenuTouchCloseComponent, selector: "[graniteMenuTouchCloseItem]", exportAs: ["graniteMenuTouchCloseItem"] }, { kind: "component", type: GraniteMenuTouchTitleItemComponent, selector: "[graniteMenuTouchTitleItem]", exportAs: ["graniteMenuTouchTitleItem"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], animations: [
1247
1247
  graniteMenuDesktopAnimations.transformMenuDesktop,
1248
1248
  graniteMenuTouchAnimations.transformMenuTouch,
1249
1249
  graniteMenuTouchAnimations.transformCloseButton,
1250
1250
  ], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1251
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuComponent, decorators: [{
1251
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuComponent, decorators: [{
1252
1252
  type: Component,
1253
1253
  args: [{ selector: 'granite-menu', changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'graniteMenu', animations: [
1254
1254
  graniteMenuDesktopAnimations.transformMenuDesktop,
@@ -1920,9 +1920,9 @@ class GraniteMenuTriggerForDirective {
1920
1920
  : target * (-Math.pow(2, (-10 * current) / end) + 1) + offset;
1921
1921
  }
1922
1922
  }
1923
- GraniteMenuTriggerForDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuTriggerForDirective, deps: [{ token: i1$1.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: GRANITE_MENU_PANEL, optional: true }, { token: GRANITE_CLIENT_INPUT, optional: true }, { token: GRANITE_CLIENT_OUTPUT, optional: true }, { token: GraniteMenuItemComponent, optional: true, self: true }, { token: i3$1.Directionality, optional: true }, { token: i1.FocusMonitor }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
1924
- GraniteMenuTriggerForDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: GraniteMenuTriggerForDirective, selector: "[graniteMenuTriggerFor]", inputs: { menu: ["graniteMenuTriggerFor", "menu"], openOnClick: "openOnClick" }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "mousedown": "_handleMousedown($event)", "keydown": "_handleKeydown($event)", "click": "_handleClick($event)" }, properties: { "attr.aria-expanded": "_isMenuOpen || null", "attr.aria-controls": "_isMenuOpen ? menu.panelId : null" }, classAttribute: "granite-menu-trigger" }, usesOnChanges: true, ngImport: i0 });
1925
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuTriggerForDirective, decorators: [{
1923
+ GraniteMenuTriggerForDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuTriggerForDirective, deps: [{ token: i1$2.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: GRANITE_MENU_PANEL, optional: true }, { token: GRANITE_CLIENT_INPUT, optional: true }, { token: GRANITE_CLIENT_OUTPUT, optional: true }, { token: GraniteMenuItemComponent, optional: true, self: true }, { token: i3.Directionality, optional: true }, { token: i1.FocusMonitor }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
1924
+ GraniteMenuTriggerForDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: GraniteMenuTriggerForDirective, selector: "[graniteMenuTriggerFor]", inputs: { menu: ["graniteMenuTriggerFor", "menu"], openOnClick: "openOnClick" }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "mousedown": "_handleMousedown($event)", "keydown": "_handleKeydown($event)", "click": "_handleClick($event)" }, properties: { "attr.aria-expanded": "_isMenuOpen || null", "attr.aria-controls": "_isMenuOpen ? menu.panelId : null" }, classAttribute: "granite-menu-trigger" }, usesOnChanges: true, ngImport: i0 });
1925
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuTriggerForDirective, decorators: [{
1926
1926
  type: Directive,
1927
1927
  args: [{
1928
1928
  selector: `[graniteMenuTriggerFor]`,
@@ -1937,7 +1937,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
1937
1937
  },
1938
1938
  }]
1939
1939
  }], ctorParameters: function () {
1940
- return [{ type: i1$1.Overlay }, { type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: _MenuBaseComponent, decorators: [{
1940
+ return [{ type: i1$2.Overlay }, { type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: _MenuBaseComponent, decorators: [{
1941
1941
  type: Inject,
1942
1942
  args: [GRANITE_MENU_PANEL]
1943
1943
  }, {
@@ -1956,7 +1956,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
1956
1956
  type: Optional
1957
1957
  }, {
1958
1958
  type: Self
1959
- }] }, { type: i3$1.Directionality, decorators: [{
1959
+ }] }, { type: i3.Directionality, decorators: [{
1960
1960
  type: Optional
1961
1961
  }] }, { type: i1.FocusMonitor }, { type: undefined, decorators: [{
1962
1962
  type: Inject,
@@ -1974,9 +1974,9 @@ class GraniteDividerDirective {
1974
1974
  this.dividerDirection = 'top';
1975
1975
  }
1976
1976
  }
1977
- GraniteDividerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteDividerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1978
- GraniteDividerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: GraniteDividerDirective, selector: "[graniteDivider]", inputs: { dividerDirection: "dividerDirection" }, host: { properties: { "class.granite-divider-top": "dividerDirection === \"top\"", "class.granite-divider-bottom": "dividerDirection === \"bottom\"" } }, exportAs: ["graniteDivider"], ngImport: i0 });
1979
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteDividerDirective, decorators: [{
1977
+ GraniteDividerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteDividerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1978
+ GraniteDividerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: GraniteDividerDirective, selector: "[graniteDivider]", inputs: { dividerDirection: "dividerDirection" }, host: { properties: { "class.granite-divider-top": "dividerDirection === \"top\"", "class.granite-divider-bottom": "dividerDirection === \"bottom\"" } }, exportAs: ["graniteDivider"], ngImport: i0 });
1979
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteDividerDirective, decorators: [{
1980
1980
  type: Directive,
1981
1981
  args: [{
1982
1982
  selector: '[graniteDivider]',
@@ -1992,10 +1992,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
1992
1992
 
1993
1993
  class GraniteIconModule {
1994
1994
  }
1995
- GraniteIconModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1996
- GraniteIconModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteIconModule, declarations: [GraniteIconComponent], exports: [GraniteIconComponent] });
1997
- GraniteIconModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteIconModule });
1998
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteIconModule, decorators: [{
1995
+ GraniteIconModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1996
+ GraniteIconModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteIconModule, declarations: [GraniteIconComponent], exports: [GraniteIconComponent] });
1997
+ GraniteIconModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteIconModule });
1998
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteIconModule, decorators: [{
1999
1999
  type: NgModule,
2000
2000
  args: [{
2001
2001
  declarations: [GraniteIconComponent],
@@ -2005,9 +2005,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2005
2005
 
2006
2006
  class GraniteTitleDirective {
2007
2007
  }
2008
- GraniteTitleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2009
- GraniteTitleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: GraniteTitleDirective, selector: "[graniteTitle]", host: { properties: { "class.granite-title": "true" } }, exportAs: ["graniteTitle"], ngImport: i0 });
2010
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteTitleDirective, decorators: [{
2008
+ GraniteTitleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2009
+ GraniteTitleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: GraniteTitleDirective, selector: "[graniteTitle]", host: { properties: { "class.granite-title": "true" } }, exportAs: ["graniteTitle"], ngImport: i0 });
2010
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteTitleDirective, decorators: [{
2011
2011
  type: Directive,
2012
2012
  args: [{
2013
2013
  selector: '[graniteTitle]',
@@ -2020,8 +2020,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2020
2020
 
2021
2021
  class GraniteMenuModule {
2022
2022
  }
2023
- GraniteMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2024
- GraniteMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuModule, declarations: [GraniteMenuComponent,
2023
+ GraniteMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2024
+ GraniteMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuModule, declarations: [GraniteMenuComponent,
2025
2025
  GraniteMenuItemComponent,
2026
2026
  GraniteMenuTriggerForDirective,
2027
2027
  GraniteMenuTouchCloseComponent,
@@ -2034,8 +2034,8 @@ GraniteMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
2034
2034
  GraniteMenuTouchTitleItemComponent,
2035
2035
  GraniteDividerDirective,
2036
2036
  GraniteTitleDirective] });
2037
- GraniteMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuModule, imports: [[CommonModule, OverlayModule, PortalModule, GraniteIconModule]] });
2038
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteMenuModule, decorators: [{
2037
+ GraniteMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuModule, imports: [CommonModule, OverlayModule, PortalModule, GraniteIconModule] });
2038
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteMenuModule, decorators: [{
2039
2039
  type: NgModule,
2040
2040
  args: [{
2041
2041
  declarations: [
@@ -2248,9 +2248,9 @@ class GraniteToggleSwitchComponent {
2248
2248
  return this._inputElement.nativeElement;
2249
2249
  }
2250
2250
  }
2251
- GraniteToggleSwitchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteToggleSwitchComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component });
2252
- GraniteToggleSwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteToggleSwitchComponent, selector: "granite-toggle-switch", inputs: { id: "id", checked: "checked", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange", toggleChange: "toggleChange", toggleBlur: "toggleBlur" }, host: { properties: { "class.granite-toggle-switch-checked": "checked", "class.granite-toggle-switch-disabled": "disabled", "class.granite-toggle-switch-readonly": "readonly", "class.granite-toggle-switch-label-before": "_positionBefore" }, classAttribute: "granite-toggle-switch" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteToggleSwitch"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{box-shadow:0 0 0 .0625rem var(--granite-color-focus)}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-s);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2253
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteToggleSwitchComponent, decorators: [{
2251
+ GraniteToggleSwitchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteToggleSwitchComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component });
2252
+ GraniteToggleSwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteToggleSwitchComponent, selector: "granite-toggle-switch", inputs: { id: "id", checked: "checked", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange", toggleChange: "toggleChange", toggleBlur: "toggleBlur" }, host: { properties: { "class.granite-toggle-switch-checked": "checked", "class.granite-toggle-switch-disabled": "disabled", "class.granite-toggle-switch-readonly": "readonly", "class.granite-toggle-switch-label-before": "_positionBefore" }, classAttribute: "granite-toggle-switch" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteToggleSwitch"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{box-shadow:0 0 0 .0625rem var(--granite-color-focus)}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-s);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2253
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteToggleSwitchComponent, decorators: [{
2254
2254
  type: Component,
2255
2255
  args: [{ selector: 'granite-toggle-switch', exportAs: 'graniteToggleSwitch', host: {
2256
2256
  class: 'granite-toggle-switch',
@@ -2288,10 +2288,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2288
2288
 
2289
2289
  class GraniteToggleSwitchModule {
2290
2290
  }
2291
- GraniteToggleSwitchModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteToggleSwitchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2292
- GraniteToggleSwitchModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteToggleSwitchModule, declarations: [GraniteToggleSwitchComponent], exports: [GraniteToggleSwitchComponent] });
2293
- GraniteToggleSwitchModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteToggleSwitchModule });
2294
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteToggleSwitchModule, decorators: [{
2291
+ GraniteToggleSwitchModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteToggleSwitchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2292
+ GraniteToggleSwitchModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteToggleSwitchModule, declarations: [GraniteToggleSwitchComponent], exports: [GraniteToggleSwitchComponent] });
2293
+ GraniteToggleSwitchModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteToggleSwitchModule });
2294
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteToggleSwitchModule, decorators: [{
2295
2295
  type: NgModule,
2296
2296
  args: [{
2297
2297
  declarations: [GraniteToggleSwitchComponent],
@@ -2369,9 +2369,9 @@ class GraniteRadioButtonComponent {
2369
2369
  return this._inputElement.nativeElement;
2370
2370
  }
2371
2371
  }
2372
- GraniteRadioButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioButtonComponent, deps: [{ token: i1.FocusMonitor }, { token: i2.UniqueSelectionDispatcher }], target: i0.ɵɵFactoryTarget.Component });
2373
- GraniteRadioButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteRadioButtonComponent, selector: "granite-radio-button", inputs: { value: "value", id: "id", name: "name", checked: "checked", required: "required", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { radioChange: "radioChange", radioBlur: "radioBlur" }, host: { properties: { "class.granite-radio-button-disabled": "disabled", "class.granite-radio-button-label-before": "_positionBefore", "class.granite-radio-button-checked": "checked", "class.granite-radio-button-readonly": "readonly" }, classAttribute: "granite-radio-button" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteRadioButton"], usesOnChanges: true, ngImport: i0, template: "<label class=\"granite-radio-button-label\">\n <div class=\"granite-radio-button-outer-circle\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-radio-button-input cdk-visually-hidden\"\n type=\"radio\"\n [attr.name]=\"name\"\n [disabled]=\"_radioDisabled\"\n [checked]=\"checked\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-checked]=\"checked.toString()\"\n [value]=\"value\"\n (change)=\"_radioChange($event.target)\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-radio-button-inner-circle\"></div>\n </div>\n <span class=\"granite-radio-button-text\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-label:hover{cursor:pointer}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-label:hover .granite-radio-button-outer-circle{border-color:var(--granite-color-background-active-hover)}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-label:hover .granite-radio-button-inner-circle{background-color:var(--granite-color-background-active-hover)}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle:focus-within{border:.0625rem solid var(--granite-color-focus)}:host(.granite-radio-button-label-before) .granite-radio-button-label{flex-direction:row-reverse}:host(.granite-radio-button-label-before) .granite-radio-button-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}:host(.granite-radio-button-checked) .granite-radio-button-inner-circle{visibility:visible;animation:growAnimation .1s}:host(.granite-radio-button-checked) .granite-radio-button-outer-circle{border-color:var(--granite-color-background-active)}:host(.granite-radio-button-checked).granite-radio-button-disabled .granite-radio-button-inner-circle{background-color:var(--granite-color-text)}:host(.granite-radio-button-checked).granite-radio-button-disabled .granite-radio-button-outer-circle{border:.0625rem solid var(--granite-color-text);background-color:transparent}:host(.granite-radio-button-checked).granite-radio-button-readonly .granite-radio-button-inner-circle{background-color:var(--granite-color-text)}:host(.granite-radio-button-checked).granite-radio-button-readonly .granite-radio-button-outer-circle{border:.0625rem solid var(--granite-color-text)}.granite-radio-button-text{padding-inline-start:var(--granite-spacing-s);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small)}.granite-radio-button-text:empty{display:none}.granite-radio-button-label{display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-xl);margin-block-end:var(--granite-spacing-xs)}:host(.granite-radio-button-disabled) .granite-radio-button-text{opacity:.6}:host(.granite-radio-button-disabled) .granite-radio-button-outer-circle{opacity:.3;background-color:var(--granite-color-border-soft)}.granite-radio-button-outer-circle{height:1rem;width:1rem;border-radius:50%;box-sizing:border-box;border:.0625rem solid var(--granite-color-border-hard);display:flex;justify-content:center;position:relative;align-items:center}.granite-radio-button-inner-circle{width:.625rem;height:.625rem;visibility:hidden;position:absolute;border-radius:50%;background-color:var(--granite-color-background-active);margin:auto}@keyframes growAnimation{0%{transform:scale(0)}to{transform:scale(1)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2374
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioButtonComponent, decorators: [{
2372
+ GraniteRadioButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioButtonComponent, deps: [{ token: i1.FocusMonitor }, { token: i2.UniqueSelectionDispatcher }], target: i0.ɵɵFactoryTarget.Component });
2373
+ GraniteRadioButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteRadioButtonComponent, selector: "granite-radio-button", inputs: { value: "value", id: "id", name: "name", checked: "checked", required: "required", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { radioChange: "radioChange", radioBlur: "radioBlur" }, host: { properties: { "class.granite-radio-button-disabled": "disabled", "class.granite-radio-button-label-before": "_positionBefore", "class.granite-radio-button-checked": "checked", "class.granite-radio-button-readonly": "readonly" }, classAttribute: "granite-radio-button" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteRadioButton"], usesOnChanges: true, ngImport: i0, template: "<label class=\"granite-radio-button-label\">\n <div class=\"granite-radio-button-outer-circle\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-radio-button-input cdk-visually-hidden\"\n type=\"radio\"\n [attr.name]=\"name\"\n [disabled]=\"_radioDisabled\"\n [checked]=\"checked\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-checked]=\"checked.toString()\"\n [value]=\"value\"\n (change)=\"_radioChange($event.target)\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-radio-button-inner-circle\"></div>\n </div>\n <span class=\"granite-radio-button-text\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle:focus-within{border:.0625rem solid var(--granite-color-focus)}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle .granite-radio-button-label:hover{cursor:pointer}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle .granite-radio-button-label:hover .granite-radio-button-outer-circle{border-color:var(--granite-color-background-active-hover)}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle .granite-radio-button-label:hover .granite-radio-button-inner-circle{background-color:var(--granite-color-background-active-hover)}:host(.granite-radio-button-label-before) .granite-radio-button-label{flex-direction:row-reverse}:host(.granite-radio-button-label-before) .granite-radio-button-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}:host(.granite-radio-button-checked) .granite-radio-button-inner-circle{visibility:visible;animation:growAnimation .1s}:host(.granite-radio-button-checked) .granite-radio-button-outer-circle{border-color:var(--granite-color-background-active)}:host(.granite-radio-button-checked).granite-radio-button-disabled .granite-radio-button-inner-circle{background-color:var(--granite-color-text)}:host(.granite-radio-button-checked).granite-radio-button-disabled .granite-radio-button-outer-circle{border:.0625rem solid var(--granite-color-text);background-color:transparent}:host(.granite-radio-button-checked).granite-radio-button-readonly .granite-radio-button-inner-circle{background-color:var(--granite-color-text)}:host(.granite-radio-button-checked).granite-radio-button-readonly .granite-radio-button-outer-circle{border:.0625rem solid var(--granite-color-text)}.granite-radio-button-text{padding-inline-start:var(--granite-spacing-s);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small)}.granite-radio-button-text:empty{display:none}.granite-radio-button-label{display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-xl);margin-block-end:var(--granite-spacing-xs)}:host(.granite-radio-button-disabled) .granite-radio-button-text{opacity:.6}:host(.granite-radio-button-disabled) .granite-radio-button-outer-circle{opacity:.3;background-color:var(--granite-color-border-soft)}.granite-radio-button-outer-circle{height:1rem;width:1rem;border-radius:50%;box-sizing:border-box;border:.0625rem solid var(--granite-color-border-hard);display:flex;justify-content:center;position:relative;align-items:center}.granite-radio-button-inner-circle{width:.625rem;height:.625rem;visibility:hidden;position:absolute;border-radius:50%;background-color:var(--granite-color-background-active);margin:auto}@keyframes growAnimation{0%{transform:scale(0)}to{transform:scale(1)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2374
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioButtonComponent, decorators: [{
2375
2375
  type: Component,
2376
2376
  args: [{ selector: 'granite-radio-button', exportAs: 'graniteRadioButton', host: {
2377
2377
  class: 'granite-radio-button',
@@ -2379,7 +2379,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2379
2379
  '[class.granite-radio-button-label-before]': '_positionBefore',
2380
2380
  '[class.granite-radio-button-checked]': 'checked',
2381
2381
  '[class.granite-radio-button-readonly]': 'readonly',
2382
- }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label class=\"granite-radio-button-label\">\n <div class=\"granite-radio-button-outer-circle\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-radio-button-input cdk-visually-hidden\"\n type=\"radio\"\n [attr.name]=\"name\"\n [disabled]=\"_radioDisabled\"\n [checked]=\"checked\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-checked]=\"checked.toString()\"\n [value]=\"value\"\n (change)=\"_radioChange($event.target)\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-radio-button-inner-circle\"></div>\n </div>\n <span class=\"granite-radio-button-text\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-label:hover{cursor:pointer}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-label:hover .granite-radio-button-outer-circle{border-color:var(--granite-color-background-active-hover)}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-label:hover .granite-radio-button-inner-circle{background-color:var(--granite-color-background-active-hover)}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle:focus-within{border:.0625rem solid var(--granite-color-focus)}:host(.granite-radio-button-label-before) .granite-radio-button-label{flex-direction:row-reverse}:host(.granite-radio-button-label-before) .granite-radio-button-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}:host(.granite-radio-button-checked) .granite-radio-button-inner-circle{visibility:visible;animation:growAnimation .1s}:host(.granite-radio-button-checked) .granite-radio-button-outer-circle{border-color:var(--granite-color-background-active)}:host(.granite-radio-button-checked).granite-radio-button-disabled .granite-radio-button-inner-circle{background-color:var(--granite-color-text)}:host(.granite-radio-button-checked).granite-radio-button-disabled .granite-radio-button-outer-circle{border:.0625rem solid var(--granite-color-text);background-color:transparent}:host(.granite-radio-button-checked).granite-radio-button-readonly .granite-radio-button-inner-circle{background-color:var(--granite-color-text)}:host(.granite-radio-button-checked).granite-radio-button-readonly .granite-radio-button-outer-circle{border:.0625rem solid var(--granite-color-text)}.granite-radio-button-text{padding-inline-start:var(--granite-spacing-s);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small)}.granite-radio-button-text:empty{display:none}.granite-radio-button-label{display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-xl);margin-block-end:var(--granite-spacing-xs)}:host(.granite-radio-button-disabled) .granite-radio-button-text{opacity:.6}:host(.granite-radio-button-disabled) .granite-radio-button-outer-circle{opacity:.3;background-color:var(--granite-color-border-soft)}.granite-radio-button-outer-circle{height:1rem;width:1rem;border-radius:50%;box-sizing:border-box;border:.0625rem solid var(--granite-color-border-hard);display:flex;justify-content:center;position:relative;align-items:center}.granite-radio-button-inner-circle{width:.625rem;height:.625rem;visibility:hidden;position:absolute;border-radius:50%;background-color:var(--granite-color-background-active);margin:auto}@keyframes growAnimation{0%{transform:scale(0)}to{transform:scale(1)}}\n"] }]
2382
+ }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label class=\"granite-radio-button-label\">\n <div class=\"granite-radio-button-outer-circle\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-radio-button-input cdk-visually-hidden\"\n type=\"radio\"\n [attr.name]=\"name\"\n [disabled]=\"_radioDisabled\"\n [checked]=\"checked\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-checked]=\"checked.toString()\"\n [value]=\"value\"\n (change)=\"_radioChange($event.target)\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-radio-button-inner-circle\"></div>\n </div>\n <span class=\"granite-radio-button-text\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle:focus-within{border:.0625rem solid var(--granite-color-focus)}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle .granite-radio-button-label:hover{cursor:pointer}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle .granite-radio-button-label:hover .granite-radio-button-outer-circle{border-color:var(--granite-color-background-active-hover)}:host(.granite-radio-button):not(.granite-radio-button-readonly):not(.granite-radio-button-disabled) .granite-radio-button-outer-circle .granite-radio-button-label:hover .granite-radio-button-inner-circle{background-color:var(--granite-color-background-active-hover)}:host(.granite-radio-button-label-before) .granite-radio-button-label{flex-direction:row-reverse}:host(.granite-radio-button-label-before) .granite-radio-button-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}:host(.granite-radio-button-checked) .granite-radio-button-inner-circle{visibility:visible;animation:growAnimation .1s}:host(.granite-radio-button-checked) .granite-radio-button-outer-circle{border-color:var(--granite-color-background-active)}:host(.granite-radio-button-checked).granite-radio-button-disabled .granite-radio-button-inner-circle{background-color:var(--granite-color-text)}:host(.granite-radio-button-checked).granite-radio-button-disabled .granite-radio-button-outer-circle{border:.0625rem solid var(--granite-color-text);background-color:transparent}:host(.granite-radio-button-checked).granite-radio-button-readonly .granite-radio-button-inner-circle{background-color:var(--granite-color-text)}:host(.granite-radio-button-checked).granite-radio-button-readonly .granite-radio-button-outer-circle{border:.0625rem solid var(--granite-color-text)}.granite-radio-button-text{padding-inline-start:var(--granite-spacing-s);color:var(--granite-color-text);font-size:var(--granite-font-size-body-small)}.granite-radio-button-text:empty{display:none}.granite-radio-button-label{display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-xl);margin-block-end:var(--granite-spacing-xs)}:host(.granite-radio-button-disabled) .granite-radio-button-text{opacity:.6}:host(.granite-radio-button-disabled) .granite-radio-button-outer-circle{opacity:.3;background-color:var(--granite-color-border-soft)}.granite-radio-button-outer-circle{height:1rem;width:1rem;border-radius:50%;box-sizing:border-box;border:.0625rem solid var(--granite-color-border-hard);display:flex;justify-content:center;position:relative;align-items:center}.granite-radio-button-inner-circle{width:.625rem;height:.625rem;visibility:hidden;position:absolute;border-radius:50%;background-color:var(--granite-color-background-active);margin:auto}@keyframes growAnimation{0%{transform:scale(0)}to{transform:scale(1)}}\n"] }]
2383
2383
  }], ctorParameters: function () { return [{ type: i1.FocusMonitor }, { type: i2.UniqueSelectionDispatcher }]; }, propDecorators: { value: [{
2384
2384
  type: Input
2385
2385
  }], id: [{
@@ -2417,9 +2417,9 @@ class GraniteRadioCheckboxBase {
2417
2417
  this.ariaLabelledby = null;
2418
2418
  }
2419
2419
  }
2420
- GraniteRadioCheckboxBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioCheckboxBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2421
- GraniteRadioCheckboxBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: GraniteRadioCheckboxBase, inputs: { layout: "layout", ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, ngImport: i0 });
2422
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioCheckboxBase, decorators: [{
2420
+ GraniteRadioCheckboxBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioCheckboxBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2421
+ GraniteRadioCheckboxBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: GraniteRadioCheckboxBase, inputs: { layout: "layout", ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, ngImport: i0 });
2422
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioCheckboxBase, decorators: [{
2423
2423
  type: Directive
2424
2424
  }], propDecorators: { layout: [{
2425
2425
  type: Input
@@ -2430,9 +2430,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2430
2430
 
2431
2431
  class GraniteRadioGroupComponent extends GraniteRadioCheckboxBase {
2432
2432
  }
2433
- GraniteRadioGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2434
- GraniteRadioGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteRadioGroupComponent, selector: "granite-radio-group", host: { properties: { "attr.role": "\"radiogroup\"", "attr.aria-labelledby": "ariaLabelledby", "class.granite-radio-checkbox-base-layout-horizontal": "layout === \"horizontal\"" }, classAttribute: "granite-radio-group" }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host(.granite-radio-checkbox-base-layout-horizontal){display:flex;align-items:flex-start}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2435
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioGroupComponent, decorators: [{
2433
+ GraniteRadioGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2434
+ GraniteRadioGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteRadioGroupComponent, selector: "granite-radio-group", host: { properties: { "attr.role": "\"radiogroup\"", "attr.aria-labelledby": "ariaLabelledby", "class.granite-radio-checkbox-base-layout-horizontal": "layout === \"horizontal\"" }, classAttribute: "granite-radio-group" }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host(.granite-radio-checkbox-base-layout-horizontal){display:flex;align-items:flex-start}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2435
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioGroupComponent, decorators: [{
2436
2436
  type: Component,
2437
2437
  args: [{ selector: 'granite-radio-group', host: {
2438
2438
  class: 'granite-radio-group',
@@ -2444,10 +2444,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2444
2444
 
2445
2445
  class GraniteRadioButtonModule {
2446
2446
  }
2447
- GraniteRadioButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2448
- GraniteRadioButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioButtonModule, declarations: [GraniteRadioButtonComponent, GraniteRadioGroupComponent], exports: [GraniteRadioButtonComponent, GraniteRadioGroupComponent] });
2449
- GraniteRadioButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioButtonModule });
2450
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteRadioButtonModule, decorators: [{
2447
+ GraniteRadioButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2448
+ GraniteRadioButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioButtonModule, declarations: [GraniteRadioButtonComponent, GraniteRadioGroupComponent], exports: [GraniteRadioButtonComponent, GraniteRadioGroupComponent] });
2449
+ GraniteRadioButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioButtonModule });
2450
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteRadioButtonModule, decorators: [{
2451
2451
  type: NgModule,
2452
2452
  args: [{
2453
2453
  declarations: [GraniteRadioButtonComponent, GraniteRadioGroupComponent],
@@ -2511,9 +2511,9 @@ class GraniteCheckboxComponent {
2511
2511
  return this._inputElement.nativeElement;
2512
2512
  }
2513
2513
  }
2514
- GraniteCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCheckboxComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component });
2515
- GraniteCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteCheckboxComponent, selector: "granite-checkbox", inputs: { id: "id", checked: "checked", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange", checkboxChange: "checkboxChange", checkboxBlur: "checkboxBlur" }, host: { properties: { "class.granite-checkbox-checked": "checked", "class.granite-checkbox-disabled": "disabled", "class.granite-checkbox-readonly": "readonly", "class.granite-checkbox-label-before": "_positionBefore" }, classAttribute: "granite-checkbox" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteCheckbox"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"id\" class=\"granite-checkbox-label\">\n <div class=\"granite-checkbox-box\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-checkbox-input cdk-visually-hidden\"\n role=\"checkbox\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_checkboxDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_checkboxClick()\"\n (change)=\"_checkboxChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-checkbox-check\"></div>\n </div>\n <span class=\"granite-checkbox-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-checkbox){color:var(--granite-color-text)}:host(.granite-checkbox):not(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-label:hover .granite-checkbox-box{border-color:var(--granite-color-background-active)}:host(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-label:hover .granite-checkbox-box{background-color:var(--granite-color-background-active-hover);border-color:var(--granite-color-background-active-hover)}:host(.granite-checkbox-checked) .granite-checkbox-box{border-color:var(--granite-color-background-active);background-color:var(--granite-color-background-active)}:host(.granite-checkbox-checked) .granite-checkbox-box:focus-within{border-color:var(--granite-color-focus)}:host(.granite-checkbox-checked) .granite-checkbox-check{display:flex}:host(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-box{animation:fadeInAnimation .2s;animation-iteration-count:1}:host(:not(.granite-checkbox-checked)) .granite-checkbox-box{animation:fadeOutAnimation .2s;animation-iteration-count:1}:host(.granite-checkbox-readonly.granite-checkbox-checked) .granite-checkbox-box{background-color:var(--granite-color-text);border-color:var(--granite-color-text)}:host(.granite-checkbox-readonly.granite-checkbox-checked) .granite-checkbox-box .granite-checkbox-check{border-color:var(--granite-color-background)}:host(.granite-checkbox-disabled) .granite-checkbox-box{opacity:.3;background-color:var(--granite-color-border-soft)}:host(.granite-checkbox-disabled) .granite-checkbox-label{opacity:.6}:host(.granite-checkbox-disabled) *{cursor:default}:host(.granite-checkbox-readonly) *{cursor:default}:host(.granite-checkbox-label-before) .granite-checkbox-label{flex-direction:row-reverse}:host(.granite-checkbox-label-before) .granite-checkbox-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}.granite-checkbox-label{display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-xl);margin-block-end:var(--granite-spacing-xs)}.granite-checkbox-box{width:1rem;height:1rem;border:solid var(--granite-color-background-inactive);border-width:.0625rem;border-radius:.25rem;display:flex;justify-content:center;position:relative}.granite-checkbox-box:focus-within{border:.0625rem solid var(--granite-color-focus)}.granite-checkbox-check{position:relative;display:none;width:.5625rem;height:.3125rem;background-color:transparent;border:solid var(--granite-color-text-static-light);transform:rotate(-45deg);margin-top:var(--granite-spacing-xs);border-width:0 0 .125rem .125rem}.granite-checkbox-text{padding-inline-start:var(--granite-spacing-s);font-size:var(--granite-font-size-body-small)}.granite-checkbox-text:empty{display:none}@keyframes fadeInAnimation{0%{opacity:0}to{opacity:1}}@keyframes fadeOutAnimation{0%{opacity:1}to{opacity:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2516
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCheckboxComponent, decorators: [{
2514
+ GraniteCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCheckboxComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component });
2515
+ GraniteCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteCheckboxComponent, selector: "granite-checkbox", inputs: { id: "id", checked: "checked", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange", checkboxChange: "checkboxChange", checkboxBlur: "checkboxBlur" }, host: { properties: { "class.granite-checkbox-checked": "checked", "class.granite-checkbox-disabled": "disabled", "class.granite-checkbox-readonly": "readonly", "class.granite-checkbox-label-before": "_positionBefore" }, classAttribute: "granite-checkbox" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteCheckbox"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"id\" class=\"granite-checkbox-label\">\n <div class=\"granite-checkbox-box\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-checkbox-input cdk-visually-hidden\"\n role=\"checkbox\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_checkboxDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_checkboxClick()\"\n (change)=\"_checkboxChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-checkbox-check\"></div>\n </div>\n <span class=\"granite-checkbox-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-checkbox){color:var(--granite-color-text)}:host(.granite-checkbox):not(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-label:hover .granite-checkbox-box{border-color:var(--granite-color-background-active)}:host(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-box{animation:fadeInAnimation .2s;animation-iteration-count:1}:host(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-label:hover .granite-checkbox-box{background-color:var(--granite-color-background-active-hover);border-color:var(--granite-color-background-active-hover)}:host(.granite-checkbox-checked) .granite-checkbox-box{border-color:var(--granite-color-background-active);background-color:var(--granite-color-background-active)}:host(.granite-checkbox-checked) .granite-checkbox-box:focus-within{border-color:var(--granite-color-focus)}:host(.granite-checkbox-checked) .granite-checkbox-check{display:flex}:host(:not(.granite-checkbox-checked)) .granite-checkbox-box{animation:fadeOutAnimation .2s;animation-iteration-count:1}:host(.granite-checkbox-readonly.granite-checkbox-checked) .granite-checkbox-box{background-color:var(--granite-color-text);border-color:var(--granite-color-text)}:host(.granite-checkbox-readonly.granite-checkbox-checked) .granite-checkbox-box .granite-checkbox-check{border-color:var(--granite-color-background)}:host(.granite-checkbox-disabled) .granite-checkbox-box{opacity:.3;background-color:var(--granite-color-border-soft)}:host(.granite-checkbox-disabled) .granite-checkbox-label{opacity:.6}:host(.granite-checkbox-disabled) *{cursor:default}:host(.granite-checkbox-readonly) *{cursor:default}:host(.granite-checkbox-label-before) .granite-checkbox-label{flex-direction:row-reverse}:host(.granite-checkbox-label-before) .granite-checkbox-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}.granite-checkbox-label{display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-xl);margin-block-end:var(--granite-spacing-xs)}.granite-checkbox-box{width:1rem;height:1rem;border:solid var(--granite-color-background-inactive);border-width:.0625rem;border-radius:.25rem;display:flex;justify-content:center;position:relative}.granite-checkbox-box:focus-within{border:.0625rem solid var(--granite-color-focus)}.granite-checkbox-check{position:relative;display:none;width:.5625rem;height:.3125rem;background-color:transparent;border:solid var(--granite-color-text-static-light);transform:rotate(-45deg);margin-top:var(--granite-spacing-xs);border-width:0 0 .125rem .125rem}.granite-checkbox-text{padding-inline-start:var(--granite-spacing-s);font-size:var(--granite-font-size-body-small)}.granite-checkbox-text:empty{display:none}@keyframes fadeInAnimation{0%{opacity:0}to{opacity:1}}@keyframes fadeOutAnimation{0%{opacity:1}to{opacity:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2516
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCheckboxComponent, decorators: [{
2517
2517
  type: Component,
2518
2518
  args: [{ selector: 'granite-checkbox', exportAs: 'graniteCheckbox', host: {
2519
2519
  class: 'granite-checkbox',
@@ -2521,7 +2521,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2521
2521
  '[class.granite-checkbox-disabled]': 'disabled',
2522
2522
  '[class.granite-checkbox-readonly]': 'readonly',
2523
2523
  '[class.granite-checkbox-label-before]': '_positionBefore',
2524
- }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label [attr.for]=\"id\" class=\"granite-checkbox-label\">\n <div class=\"granite-checkbox-box\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-checkbox-input cdk-visually-hidden\"\n role=\"checkbox\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_checkboxDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_checkboxClick()\"\n (change)=\"_checkboxChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-checkbox-check\"></div>\n </div>\n <span class=\"granite-checkbox-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-checkbox){color:var(--granite-color-text)}:host(.granite-checkbox):not(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-label:hover .granite-checkbox-box{border-color:var(--granite-color-background-active)}:host(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-label:hover .granite-checkbox-box{background-color:var(--granite-color-background-active-hover);border-color:var(--granite-color-background-active-hover)}:host(.granite-checkbox-checked) .granite-checkbox-box{border-color:var(--granite-color-background-active);background-color:var(--granite-color-background-active)}:host(.granite-checkbox-checked) .granite-checkbox-box:focus-within{border-color:var(--granite-color-focus)}:host(.granite-checkbox-checked) .granite-checkbox-check{display:flex}:host(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-box{animation:fadeInAnimation .2s;animation-iteration-count:1}:host(:not(.granite-checkbox-checked)) .granite-checkbox-box{animation:fadeOutAnimation .2s;animation-iteration-count:1}:host(.granite-checkbox-readonly.granite-checkbox-checked) .granite-checkbox-box{background-color:var(--granite-color-text);border-color:var(--granite-color-text)}:host(.granite-checkbox-readonly.granite-checkbox-checked) .granite-checkbox-box .granite-checkbox-check{border-color:var(--granite-color-background)}:host(.granite-checkbox-disabled) .granite-checkbox-box{opacity:.3;background-color:var(--granite-color-border-soft)}:host(.granite-checkbox-disabled) .granite-checkbox-label{opacity:.6}:host(.granite-checkbox-disabled) *{cursor:default}:host(.granite-checkbox-readonly) *{cursor:default}:host(.granite-checkbox-label-before) .granite-checkbox-label{flex-direction:row-reverse}:host(.granite-checkbox-label-before) .granite-checkbox-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}.granite-checkbox-label{display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-xl);margin-block-end:var(--granite-spacing-xs)}.granite-checkbox-box{width:1rem;height:1rem;border:solid var(--granite-color-background-inactive);border-width:.0625rem;border-radius:.25rem;display:flex;justify-content:center;position:relative}.granite-checkbox-box:focus-within{border:.0625rem solid var(--granite-color-focus)}.granite-checkbox-check{position:relative;display:none;width:.5625rem;height:.3125rem;background-color:transparent;border:solid var(--granite-color-text-static-light);transform:rotate(-45deg);margin-top:var(--granite-spacing-xs);border-width:0 0 .125rem .125rem}.granite-checkbox-text{padding-inline-start:var(--granite-spacing-s);font-size:var(--granite-font-size-body-small)}.granite-checkbox-text:empty{display:none}@keyframes fadeInAnimation{0%{opacity:0}to{opacity:1}}@keyframes fadeOutAnimation{0%{opacity:1}to{opacity:0}}\n"] }]
2524
+ }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label [attr.for]=\"id\" class=\"granite-checkbox-label\">\n <div class=\"granite-checkbox-box\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-checkbox-input cdk-visually-hidden\"\n role=\"checkbox\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_checkboxDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_checkboxClick()\"\n (change)=\"_checkboxChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-checkbox-check\"></div>\n </div>\n <span class=\"granite-checkbox-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-checkbox){color:var(--granite-color-text)}:host(.granite-checkbox):not(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-label:hover .granite-checkbox-box{border-color:var(--granite-color-background-active)}:host(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-box{animation:fadeInAnimation .2s;animation-iteration-count:1}:host(.granite-checkbox-checked):not(.granite-checkbox-readonly):not(.granite-checkbox-disabled) .granite-checkbox-label:hover .granite-checkbox-box{background-color:var(--granite-color-background-active-hover);border-color:var(--granite-color-background-active-hover)}:host(.granite-checkbox-checked) .granite-checkbox-box{border-color:var(--granite-color-background-active);background-color:var(--granite-color-background-active)}:host(.granite-checkbox-checked) .granite-checkbox-box:focus-within{border-color:var(--granite-color-focus)}:host(.granite-checkbox-checked) .granite-checkbox-check{display:flex}:host(:not(.granite-checkbox-checked)) .granite-checkbox-box{animation:fadeOutAnimation .2s;animation-iteration-count:1}:host(.granite-checkbox-readonly.granite-checkbox-checked) .granite-checkbox-box{background-color:var(--granite-color-text);border-color:var(--granite-color-text)}:host(.granite-checkbox-readonly.granite-checkbox-checked) .granite-checkbox-box .granite-checkbox-check{border-color:var(--granite-color-background)}:host(.granite-checkbox-disabled) .granite-checkbox-box{opacity:.3;background-color:var(--granite-color-border-soft)}:host(.granite-checkbox-disabled) .granite-checkbox-label{opacity:.6}:host(.granite-checkbox-disabled) *{cursor:default}:host(.granite-checkbox-readonly) *{cursor:default}:host(.granite-checkbox-label-before) .granite-checkbox-label{flex-direction:row-reverse}:host(.granite-checkbox-label-before) .granite-checkbox-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-s)}.granite-checkbox-label{display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-xl);margin-block-end:var(--granite-spacing-xs)}.granite-checkbox-box{width:1rem;height:1rem;border:solid var(--granite-color-background-inactive);border-width:.0625rem;border-radius:.25rem;display:flex;justify-content:center;position:relative}.granite-checkbox-box:focus-within{border:.0625rem solid var(--granite-color-focus)}.granite-checkbox-check{position:relative;display:none;width:.5625rem;height:.3125rem;background-color:transparent;border:solid var(--granite-color-text-static-light);transform:rotate(-45deg);margin-top:var(--granite-spacing-xs);border-width:0 0 .125rem .125rem}.granite-checkbox-text{padding-inline-start:var(--granite-spacing-s);font-size:var(--granite-font-size-body-small)}.granite-checkbox-text:empty{display:none}@keyframes fadeInAnimation{0%{opacity:0}to{opacity:1}}@keyframes fadeOutAnimation{0%{opacity:1}to{opacity:0}}\n"] }]
2525
2525
  }], ctorParameters: function () { return [{ type: i1.FocusMonitor }]; }, propDecorators: { id: [{
2526
2526
  type: Input
2527
2527
  }], checked: [{
@@ -2551,9 +2551,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2551
2551
 
2552
2552
  class GraniteCheckboxGroupComponent extends GraniteRadioCheckboxBase {
2553
2553
  }
2554
- GraniteCheckboxGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCheckboxGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2555
- GraniteCheckboxGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteCheckboxGroupComponent, selector: "granite-checkbox-group", host: { properties: { "attr.role": "\"group\"", "attr.aria-labelledby": "ariaLabelledby", "class.granite-radio-checkbox-base-layout-horizontal": "layout === \"horizontal\"" }, classAttribute: "granite-checkbox-group" }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host(.granite-radio-checkbox-base-layout-horizontal){display:flex;align-items:flex-start}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2556
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCheckboxGroupComponent, decorators: [{
2554
+ GraniteCheckboxGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCheckboxGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2555
+ GraniteCheckboxGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteCheckboxGroupComponent, selector: "granite-checkbox-group", host: { properties: { "attr.role": "\"group\"", "attr.aria-labelledby": "ariaLabelledby", "class.granite-radio-checkbox-base-layout-horizontal": "layout === \"horizontal\"" }, classAttribute: "granite-checkbox-group" }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host(.granite-radio-checkbox-base-layout-horizontal){display:flex;align-items:flex-start}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2556
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCheckboxGroupComponent, decorators: [{
2557
2557
  type: Component,
2558
2558
  args: [{ selector: 'granite-checkbox-group', host: {
2559
2559
  class: 'granite-checkbox-group',
@@ -2565,10 +2565,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2565
2565
 
2566
2566
  class GraniteCheckboxModule {
2567
2567
  }
2568
- GraniteCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2569
- GraniteCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCheckboxModule, declarations: [GraniteCheckboxComponent, GraniteCheckboxGroupComponent], exports: [GraniteCheckboxComponent, GraniteCheckboxGroupComponent] });
2570
- GraniteCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCheckboxModule });
2571
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCheckboxModule, decorators: [{
2568
+ GraniteCheckboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2569
+ GraniteCheckboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteCheckboxModule, declarations: [GraniteCheckboxComponent, GraniteCheckboxGroupComponent], exports: [GraniteCheckboxComponent, GraniteCheckboxGroupComponent] });
2570
+ GraniteCheckboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCheckboxModule });
2571
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCheckboxModule, decorators: [{
2572
2572
  type: NgModule,
2573
2573
  args: [{
2574
2574
  declarations: [GraniteCheckboxComponent, GraniteCheckboxGroupComponent],
@@ -2590,9 +2590,9 @@ const disabledMixin = (Base = class {
2590
2590
  }
2591
2591
  }
2592
2592
  }
2593
- Derived.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: Derived, deps: null, target: i0.ɵɵFactoryTarget.Directive });
2594
- Derived.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: Derived, inputs: { disabled: "disabled" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
2595
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: Derived, decorators: [{
2593
+ Derived.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: Derived, deps: null, target: i0.ɵɵFactoryTarget.Directive });
2594
+ Derived.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: Derived, inputs: { disabled: "disabled" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
2595
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: Derived, decorators: [{
2596
2596
  type: Directive
2597
2597
  }], propDecorators: { disabled: [{
2598
2598
  type: Input
@@ -2634,9 +2634,9 @@ class GraniteButtonComponent extends ButtonComponentMixin {
2634
2634
  return this._elementRef.nativeElement;
2635
2635
  }
2636
2636
  }
2637
- GraniteButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteButtonComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
2638
- GraniteButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteButtonComponent, selector: "button[graniteButton],\n button[granitePrimaryButton],\n button[graniteFlatButton],\n button[graniteToolbarButton]\n ", inputs: { disabled: "disabled", toggled: "toggled" }, host: { properties: { "class.granite-button-disabled": "disabled", "class.granite-button-toggled": "_buttonToggled", "attr.disabled": "disabled || null" }, classAttribute: "granite-button-base" }, exportAs: ["graniteButton"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}button:host{background-color:inherit;-webkit-appearance:none;appearance:none;outline: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{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);display:flex;justify-content:center;align-items:center;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){outline-offset:-2px;outline-width:.125rem;outline-color:var(--granite-color-focus);outline-style:solid}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled,button:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none;outline:none}}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:none;outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){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);outline:none}}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-toolbar-button{background-color:var(--granite-color-background);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-toolbar-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-toolbar-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}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);color:var(--granite-color-text-link);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled,a:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text-link);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);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;pointer-events:none;-webkit-user-select:none;user-select:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2639
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteButtonComponent, decorators: [{
2637
+ GraniteButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteButtonComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
2638
+ GraniteButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteButtonComponent, selector: "button[graniteButton],\n button[granitePrimaryButton],\n button[graniteFlatButton],\n button[graniteToolbarButton]\n ", inputs: { disabled: "disabled", toggled: "toggled" }, host: { properties: { "class.granite-button-disabled": "disabled", "class.granite-button-toggled": "_buttonToggled", "attr.disabled": "disabled || null" }, classAttribute: "granite-button-base" }, exportAs: ["graniteButton"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}: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);display:flex;justify-content:center;align-items:center;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){outline-offset:-2px;outline-width:.125rem;outline-color:var(--granite-color-focus);outline-style:solid}button:host{background-color:inherit;-webkit-appearance:none;appearance:none;outline:none;border:none;font:inherit;border-radius:inherit;height:inherit;font-weight:inherit;line-height:inherit;color:inherit;margin:inherit;cursor:pointer;padding:inherit}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled,button:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none;outline:none}}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:none;outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){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);outline:none}}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-toolbar-button{background-color:var(--granite-color-background);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-toolbar-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-toolbar-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}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{outline:none}a:host.granite-button{background-color:var(--granite-color-background);color:var(--granite-color-text-link);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled,a:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text-link);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);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;pointer-events:none;-webkit-user-select:none;user-select:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2639
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteButtonComponent, decorators: [{
2640
2640
  type: Component,
2641
2641
  args: [{ selector: `button[graniteButton],
2642
2642
  button[granitePrimaryButton],
@@ -2647,7 +2647,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2647
2647
  '[class.granite-button-disabled]': 'disabled',
2648
2648
  '[class.granite-button-toggled]': '_buttonToggled',
2649
2649
  '[attr.disabled]': 'disabled || null',
2650
- }, exportAs: 'graniteButton', template: '<ng-content></ng-content>', inputs: ['disabled'], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}button:host{background-color:inherit;-webkit-appearance:none;appearance:none;outline: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{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);display:flex;justify-content:center;align-items:center;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){outline-offset:-2px;outline-width:.125rem;outline-color:var(--granite-color-focus);outline-style:solid}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled,button:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none;outline:none}}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:none;outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){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);outline:none}}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-toolbar-button{background-color:var(--granite-color-background);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-toolbar-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-toolbar-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}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);color:var(--granite-color-text-link);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled,a:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text-link);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);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;pointer-events:none;-webkit-user-select:none;user-select:none}\n"] }]
2650
+ }, exportAs: 'graniteButton', template: '<ng-content></ng-content>', inputs: ['disabled'], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}: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);display:flex;justify-content:center;align-items:center;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){outline-offset:-2px;outline-width:.125rem;outline-color:var(--granite-color-focus);outline-style:solid}button:host{background-color:inherit;-webkit-appearance:none;appearance:none;outline:none;border:none;font:inherit;border-radius:inherit;height:inherit;font-weight:inherit;line-height:inherit;color:inherit;margin:inherit;cursor:pointer;padding:inherit}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled,button:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none;outline:none}}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:none;outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){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);outline:none}}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-toolbar-button{background-color:var(--granite-color-background);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-toolbar-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-toolbar-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}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{outline:none}a:host.granite-button{background-color:var(--granite-color-background);color:var(--granite-color-text-link);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled,a:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text-link);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);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;pointer-events:none;-webkit-user-select:none;user-select:none}\n"] }]
2651
2651
  }], ctorParameters: function () { return [{ type: i1.FocusMonitor }, { type: i0.ElementRef }]; }, propDecorators: { toggled: [{
2652
2652
  type: Input
2653
2653
  }] } });
@@ -2666,16 +2666,16 @@ class GraniteAnchorComponent extends GraniteButtonComponent {
2666
2666
  super.ngOnChanges(changes);
2667
2667
  }
2668
2668
  }
2669
- GraniteAnchorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteAnchorComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
2670
- GraniteAnchorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteAnchorComponent, selector: "a[graniteButton],\n a[graniteFlatButton]", inputs: { disabled: "disabled" }, host: { listeners: { "click": "_anchorClick($event)" }, properties: { "attr.tabindex": "disabled ? -1 : 0", "class.granite-button-disabled": "disabled" }, classAttribute: "granite-button-base" }, exportAs: ["graniteAnchor"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}button:host{background-color:inherit;-webkit-appearance:none;appearance:none;outline: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{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);display:flex;justify-content:center;align-items:center;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){outline-offset:-2px;outline-width:.125rem;outline-color:var(--granite-color-focus);outline-style:solid}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled,button:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none;outline:none}}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:none;outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){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);outline:none}}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-toolbar-button{background-color:var(--granite-color-background);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-toolbar-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-toolbar-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}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);color:var(--granite-color-text-link);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled,a:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text-link);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);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;pointer-events:none;-webkit-user-select:none;user-select:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2671
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteAnchorComponent, decorators: [{
2669
+ GraniteAnchorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteAnchorComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
2670
+ GraniteAnchorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteAnchorComponent, selector: "a[graniteButton],\n a[graniteFlatButton]", inputs: { disabled: "disabled" }, host: { listeners: { "click": "_anchorClick($event)" }, properties: { "attr.tabindex": "disabled ? -1 : 0", "class.granite-button-disabled": "disabled" }, classAttribute: "granite-button-base" }, exportAs: ["graniteAnchor"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}: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);display:flex;justify-content:center;align-items:center;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){outline-offset:-2px;outline-width:.125rem;outline-color:var(--granite-color-focus);outline-style:solid}button:host{background-color:inherit;-webkit-appearance:none;appearance:none;outline:none;border:none;font:inherit;border-radius:inherit;height:inherit;font-weight:inherit;line-height:inherit;color:inherit;margin:inherit;cursor:pointer;padding:inherit}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled,button:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none;outline:none}}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:none;outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){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);outline:none}}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-toolbar-button{background-color:var(--granite-color-background);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-toolbar-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-toolbar-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}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{outline:none}a:host.granite-button{background-color:var(--granite-color-background);color:var(--granite-color-text-link);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled,a:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text-link);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);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;pointer-events:none;-webkit-user-select:none;user-select:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2671
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteAnchorComponent, decorators: [{
2672
2672
  type: Component,
2673
2673
  args: [{ selector: `a[graniteButton],
2674
2674
  a[graniteFlatButton]`, host: {
2675
2675
  class: 'granite-button-base',
2676
2676
  '[attr.tabindex]': 'disabled ? -1 : 0',
2677
2677
  '[class.granite-button-disabled]': 'disabled',
2678
- }, exportAs: 'graniteAnchor', template: '<ng-content></ng-content>', inputs: ['disabled'], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}button:host{background-color:inherit;-webkit-appearance:none;appearance:none;outline: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{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);display:flex;justify-content:center;align-items:center;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){outline-offset:-2px;outline-width:.125rem;outline-color:var(--granite-color-focus);outline-style:solid}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled,button:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none;outline:none}}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:none;outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){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);outline:none}}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-toolbar-button{background-color:var(--granite-color-background);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-toolbar-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-toolbar-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}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);color:var(--granite-color-text-link);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled,a:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text-link);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);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;pointer-events:none;-webkit-user-select:none;user-select:none}\n"] }]
2678
+ }, exportAs: 'graniteAnchor', template: '<ng-content></ng-content>', inputs: ['disabled'], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}: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);display:flex;justify-content:center;align-items:center;width:-moz-fit-content;width:fit-content}:host:focus:not(.granite-button-disabled):not(:active){outline-offset:-2px;outline-width:.125rem;outline-color:var(--granite-color-focus);outline-style:solid}button:host{background-color:inherit;-webkit-appearance:none;appearance:none;outline:none;border:none;font:inherit;border-radius:inherit;height:inherit;font-weight:inherit;line-height:inherit;color:inherit;margin:inherit;cursor:pointer;padding:inherit}button:host.granite-button{background-color:var(--granite-color-background-variant);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled,button:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-primary-button{background-color:var(--granite-color-background-active);color:var(--granite-color-text-on-active);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-primary-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:none;outline:none}}button:host.granite-primary-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:none;outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-primary-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-primary-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:none}button:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){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);outline:none}}button:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}button:host.granite-toolbar-button{background-color:var(--granite-color-background);color:var(--granite-color-text);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){button:host.granite-toolbar-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}button:host.granite-toolbar-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled{background-color:var(--granite-color-background-selected);color:var(--granite-color-focus)}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:not(:focus),button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}button:host.granite-toolbar-button.granite-flat-button.granite-button-toggled:hover,button:host.granite-toolbar-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}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{outline:none}a:host.granite-button{background-color:var(--granite-color-background);color:var(--granite-color-text-link);outline:.0625rem solid var(--granite-color-border-soft);outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled,a:host.granite-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active)}a:host.granite-flat-button{background-color:transparent;color:var(--granite-color-text-link);outline:none;outline-offset:-1px}@media (hover: hover) and (pointer: fine){a:host.granite-flat-button:hover:not(.granite-button-disabled){background-color:var(--granite-color-background-active-hover);color:var(--granite-color-text-on-active);outline:none}}a:host.granite-flat-button:active:not(.granite-button-disabled){background-color:var(--granite-color-background-active-pressed);color:var(--granite-color-text-on-active);outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled{background-color:none;color:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:not(:focus),a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:not(:focus){outline:none}a:host.granite-flat-button.granite-flat-button.granite-button-toggled:hover,a:host.granite-flat-button.granite-toolbar-button.granite-button-toggled:hover{background-color:var(--granite-color-background-active-hover);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;pointer-events:none;-webkit-user-select:none;user-select:none}\n"] }]
2679
2679
  }], ctorParameters: function () { return [{ type: i1.FocusMonitor }, { type: i0.ElementRef }]; }, propDecorators: { _anchorClick: [{
2680
2680
  type: HostListener,
2681
2681
  args: ['click', ['$event']]
@@ -2683,10 +2683,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2683
2683
 
2684
2684
  class GraniteButtonModule {
2685
2685
  }
2686
- GraniteButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2687
- GraniteButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteButtonModule, declarations: [GraniteButtonComponent, GraniteAnchorComponent], exports: [GraniteButtonComponent, GraniteAnchorComponent] });
2688
- GraniteButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteButtonModule });
2689
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteButtonModule, decorators: [{
2686
+ GraniteButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2687
+ GraniteButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteButtonModule, declarations: [GraniteButtonComponent, GraniteAnchorComponent], exports: [GraniteButtonComponent, GraniteAnchorComponent] });
2688
+ GraniteButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteButtonModule });
2689
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteButtonModule, decorators: [{
2690
2690
  type: NgModule,
2691
2691
  args: [{
2692
2692
  declarations: [GraniteButtonComponent, GraniteAnchorComponent],
@@ -2800,9 +2800,9 @@ class GraniteInputFieldComponent {
2800
2800
  return this._textareaElement.nativeElement;
2801
2801
  }
2802
2802
  }
2803
- GraniteInputFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteInputFieldComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component });
2804
- GraniteInputFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteInputFieldComponent, selector: "granite-input-field", inputs: { id: "id", name: "name", type: "type", value: "value", required: "required", readonly: "readonly", invalid: "invalid", disabled: "disabled", placeholder: "placeholder", prefixicon: "prefixicon", maxlength: "maxlength", countcharacters: "countcharacters", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "granite-input-field" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }, { propertyName: "_textareaElement", first: true, predicate: ["textarea"], descendants: true }], exportAs: ["graniteInputField"], usesOnChanges: true, ngImport: i0, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n\n <div\n class=\"granite-input-hover-bar\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n ></div>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:hover .granite-input-hover-bar{height:.125rem}.granite-input-container .granite-input-top-row:hover .granite-input-hover-bar.granite-input-invalid.granite-input-empty{background-color:var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-disabled .granite-input-hover-bar,.granite-input-container .granite-input-top-row.granite-input-readonly .granite-input-hover-bar{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base{-webkit-appearance:none;appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-s);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-top-row .granite-input-hover-bar{height:.0625rem;background-color:var(--granite-color-border-hard);position:absolute;width:inherit;bottom:0}.granite-input-container .granite-input-top-row .granite-input-hover-bar.granite-input-invalid{background-color:var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row:focus-within .granite-input-hover-bar{background-color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-s);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{-webkit-appearance:none;appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-s);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}\n"], components: [{ type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2805
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteInputFieldComponent, decorators: [{
2803
+ GraniteInputFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteInputFieldComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component });
2804
+ GraniteInputFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteInputFieldComponent, selector: "granite-input-field", inputs: { id: "id", name: "name", type: "type", value: "value", required: "required", readonly: "readonly", invalid: "invalid", disabled: "disabled", placeholder: "placeholder", prefixicon: "prefixicon", maxlength: "maxlength", countcharacters: "countcharacters", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "granite-input-field" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }, { propertyName: "_textareaElement", first: true, predicate: ["textarea"], descendants: true }], exportAs: ["graniteInputField"], usesOnChanges: true, ngImport: i0, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n\n <div\n class=\"granite-input-hover-bar\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n ></div>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:hover .granite-input-hover-bar{height:.125rem}.granite-input-container .granite-input-top-row:hover .granite-input-hover-bar.granite-input-invalid.granite-input-empty{background-color:var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-disabled .granite-input-hover-bar,.granite-input-container .granite-input-top-row.granite-input-readonly .granite-input-hover-bar{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base{-webkit-appearance:none;appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-s);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-top-row .granite-input-hover-bar{height:.0625rem;background-color:var(--granite-color-border-hard);position:absolute;width:inherit;bottom:0}.granite-input-container .granite-input-top-row .granite-input-hover-bar.granite-input-invalid{background-color:var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row:focus-within .granite-input-hover-bar{background-color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-s);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{-webkit-appearance:none;appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-s);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2805
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteInputFieldComponent, decorators: [{
2806
2806
  type: Component,
2807
2807
  args: [{ selector: 'granite-input-field', exportAs: 'graniteInputField', host: {
2808
2808
  class: 'granite-input-field',
@@ -2849,10 +2849,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
2849
2849
 
2850
2850
  class GraniteInputFieldModule {
2851
2851
  }
2852
- GraniteInputFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteInputFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2853
- GraniteInputFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteInputFieldModule, declarations: [GraniteInputFieldComponent], imports: [CommonModule, GraniteIconModule, GraniteButtonModule], exports: [GraniteInputFieldComponent] });
2854
- GraniteInputFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteInputFieldModule, imports: [[CommonModule, GraniteIconModule, GraniteButtonModule]] });
2855
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteInputFieldModule, decorators: [{
2852
+ GraniteInputFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteInputFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2853
+ GraniteInputFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteInputFieldModule, declarations: [GraniteInputFieldComponent], imports: [CommonModule, GraniteIconModule, GraniteButtonModule], exports: [GraniteInputFieldComponent] });
2854
+ GraniteInputFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteInputFieldModule, imports: [CommonModule, GraniteIconModule, GraniteButtonModule] });
2855
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteInputFieldModule, decorators: [{
2856
2856
  type: NgModule,
2857
2857
  args: [{
2858
2858
  imports: [CommonModule, GraniteIconModule, GraniteButtonModule],
@@ -2869,47 +2869,6 @@ class GraniteChipSelectionChangeEvent {
2869
2869
  }
2870
2870
  }
2871
2871
  class GraniteChipComponent {
2872
- constructor(_elementRef, _ngZone, _changeDetectorRef, tabIndex) {
2873
- this._elementRef = _elementRef;
2874
- this._ngZone = _ngZone;
2875
- this._changeDetectorRef = _changeDetectorRef;
2876
- /** Whether the chip has focus. */
2877
- this._hasFocus = false;
2878
- /** Whether the chip list is selectable */
2879
- this._chipListSelectable = true;
2880
- /** Whether the chip list is in multi-selection mode. */
2881
- this._chipListMultiple = false;
2882
- /** Whether the chip list as a whole is disabled. */
2883
- this._chipListDisabled = false;
2884
- /** ARIA role that should be applied to the chip. */
2885
- this.role = 'option';
2886
- this._selected = false;
2887
- this._selectable = true;
2888
- this._disabled = false;
2889
- this._removable = false;
2890
- this._invalid = false;
2891
- this.ariaLabel = null;
2892
- this.ariaLabelledby = null;
2893
- /** Emitted when the chip is selected or deselected. */
2894
- this.selectionChange = new EventEmitter();
2895
- /** Emitted when a chip is to be removed. */
2896
- this.removed = new EventEmitter();
2897
- /** Emitted when the chip is destroyed. */
2898
- this.destroyed = new EventEmitter();
2899
- this.tabIndex = -1;
2900
- this.inputChip = false;
2901
- /** Emits when the chip is focused. */
2902
- this.chipFocus = new EventEmitter();
2903
- /** Emits when the chip is blurred. */
2904
- this.chipBlur = new EventEmitter();
2905
- const inputChipAttrName = 'granite-input-chip';
2906
- const element = this._elementRef.nativeElement;
2907
- if (element.hasAttribute(inputChipAttrName) ||
2908
- element.tagName.toLowerCase() === inputChipAttrName) {
2909
- this.inputChip = true;
2910
- }
2911
- this.tabIndex = tabIndex != null ? parseInt(tabIndex) || -1 : -1;
2912
- }
2913
2872
  /** Whether the chip is selected. */
2914
2873
  get selected() {
2915
2874
  return this._selected;
@@ -2965,6 +2924,47 @@ class GraniteChipComponent {
2965
2924
  set invalid(value) {
2966
2925
  this._invalid = coerceBooleanProperty(value);
2967
2926
  }
2927
+ constructor(_elementRef, _ngZone, _changeDetectorRef, tabIndex) {
2928
+ this._elementRef = _elementRef;
2929
+ this._ngZone = _ngZone;
2930
+ this._changeDetectorRef = _changeDetectorRef;
2931
+ /** Whether the chip has focus. */
2932
+ this._hasFocus = false;
2933
+ /** Whether the chip list is selectable */
2934
+ this._chipListSelectable = true;
2935
+ /** Whether the chip list is in multi-selection mode. */
2936
+ this._chipListMultiple = false;
2937
+ /** Whether the chip list as a whole is disabled. */
2938
+ this._chipListDisabled = false;
2939
+ /** ARIA role that should be applied to the chip. */
2940
+ this.role = 'option';
2941
+ this._selected = false;
2942
+ this._selectable = true;
2943
+ this._disabled = false;
2944
+ this._removable = false;
2945
+ this._invalid = false;
2946
+ this.ariaLabel = null;
2947
+ this.ariaLabelledby = null;
2948
+ /** Emitted when the chip is selected or deselected. */
2949
+ this.selectionChange = new EventEmitter();
2950
+ /** Emitted when a chip is to be removed. */
2951
+ this.removed = new EventEmitter();
2952
+ /** Emitted when the chip is destroyed. */
2953
+ this.destroyed = new EventEmitter();
2954
+ this.tabIndex = -1;
2955
+ this.inputChip = false;
2956
+ /** Emits when the chip is focused. */
2957
+ this.chipFocus = new EventEmitter();
2958
+ /** Emits when the chip is blurred. */
2959
+ this.chipBlur = new EventEmitter();
2960
+ const inputChipAttrName = 'granite-input-chip';
2961
+ const element = this._elementRef.nativeElement;
2962
+ if (element.hasAttribute(inputChipAttrName) ||
2963
+ element.tagName.toLowerCase() === inputChipAttrName) {
2964
+ this.inputChip = true;
2965
+ }
2966
+ this.tabIndex = tabIndex != null ? parseInt(tabIndex) || -1 : -1;
2967
+ }
2968
2968
  ngOnDestroy() {
2969
2969
  this.destroyed.emit({ chip: this });
2970
2970
  }
@@ -3080,9 +3080,9 @@ class GraniteChipComponent {
3080
3080
  : null;
3081
3081
  }
3082
3082
  }
3083
- GraniteChipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef, optional: true }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
3084
- GraniteChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteChipComponent, selector: "granite-chip, granite-input-chip", inputs: { tabIndex: "tabIndex", role: "role", selected: "selected", value: "value", selectable: "selectable", disabled: "disabled", removable: "removable", invalid: "invalid", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { selectionChange: "selectionChange", removed: "removed", destroyed: "destroyed", chipFocus: "chipFocus", chipBlur: "chipBlur" }, host: { listeners: { "click": "_handleClick($event)", "keydown": "_handleKeydown($event)", "blur": "_blur()", "focus": "focus()" }, properties: { "class.granite-chip-input": "inputChip", "class.granite-chip-selectable": "selectable", "class.granite-chip-selected": "selected", "class.granite-chip-disabled": "disabled", "class.granite-chip-invalid": "invalid", "class.granite-chip-removable": "!disabled && (removable || inputChip)", "attr.tabindex": "disabled ? null : tabIndex", "attr.role": "role", "attr.disabled": "disabled || null", "attr.aria-label": "ariaLabel", "attr.aria-labelledby": "ariaLabelledby", "attr.aria-disabled": "disabled.toString()", "attr.aria-selected": "ariaSelected" }, classAttribute: "granite-chip" }, exportAs: ["graniteChip"], ngImport: i0, template: "<ng-content></ng-content>\n<button\n *ngIf=\"!disabled && (removable || inputChip)\"\n class=\"granite-chip-remove\"\n (click)=\"_handleRemoveClick($event)\"\n>\n <granite-icon\n fontIcon=\"icon-close\"\n class=\"granite-chip-remove-icon\"\n [class.granite-chip-remove-icon-invalid]=\"invalid\"\n ></granite-icon>\n</button>\n", styles: [":host.granite-chip{display:-moz-inline-flex;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;-webkit-tap-highlight-color:transparent;border:none;-webkit-appearance:none;-moz-appearance:none;justify-content:center;align-items:center;padding-inline:var(--granite-spacing-m);margin-inline-start:var(--granite-spacing-xxs);margin-inline-end:var(--granite-spacing-xxs);padding-top:var(--granite-spacing-s);padding-bottom:var(--granite-spacing-s);height:inherit;color:var(--granite-color-text-weak);background-color:var(--granite-color-background);border-radius:var(--granite-radius-l);border-style:solid;border-width:var(--granite-border-width-regular);border-color:var(--granite-color-border-hard)}:host.granite-chip:hover{background-color:var(--granite-color-background-hover);cursor:pointer}:host.granite-chip.granite-chip-disabled{background-color:var(--granite-color-background);color:var(--granite-color-text-hint)}:host.granite-chip.granite-chip-disabled:hover{background-color:var(--granite-color-background);cursor:auto}:host.granite-chip:not(.granite-chip-selectable):hover{background-color:var(--granite-color-background);cursor:auto}:host.granite-chip.granite-chip-removable{padding-inline-end:var(--granite-spacing-s)}:host.granite-chip.granite-chip-invalid{background-color:var(--granite-color-background-failure);border-color:var(--granite-color-background-failure)}:host.granite-chip.granite-chip-invalid:hover{border-color:var(--granite-color-signal-failure)}:host.granite-chip.granite-chip-selected:not(.granite-chip-disabled):not(.granite-chip-input){border-color:var(--granite-color-background-active);background-color:var(--granite-color-background-info)}:host.granite-chip.granite-chip-selected:not(.granite-chip-disabled):not(.granite-chip-input):hover{background-color:var(--granite-color-background-hover)}:host.granite-chip.granite-chip-input{padding-top:var(--granite-spacing-xs);padding-bottom:var(--granite-spacing-xs);padding-inline:var(--granite-spacing-s)}:host.granite-chip.granite-chip-input:hover{background-color:var(--granite-color-background-hover)}:host.granite-chip.granite-chip-input:hover.granite-chip-invalid{background-color:var(--granite-color-background-failure)}:host.granite-chip.granite-chip-input:hover.granite-chip-invalid:hover{border-color:var(--granite-color-signal-failure)}.granite-chip-remove{display:flex;justify-content:center;align-items:center;background-color:transparent;outline:none;border:none;cursor:pointer;margin-inline-start:var(--granite-spacing-xs);margin-inline-end:0;padding:0}[dir=rtl] .granite-chip-remove{margin-inline-end:var(--granite-spacing-xs);margin-inline-start:0}.granite-chip-remove .granite-chip-remove-icon{position:relative;overflow:hidden;background-repeat:no-repeat;color:var(--granite-color-text-hint);line-height:inherit}.granite-chip-remove .granite-chip-remove-icon:hover{color:var(--granite-color-text)}.granite-chip-remove .granite-chip-remove-icon.granite-chip-remove-icon-invalid{color:var(--granite-color-signal-failure)}\n"], components: [{ type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
3085
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipComponent, decorators: [{
3083
+ GraniteChipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef, optional: true }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
3084
+ GraniteChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteChipComponent, selector: "granite-chip, granite-input-chip", inputs: { tabIndex: "tabIndex", role: "role", selected: "selected", value: "value", selectable: "selectable", disabled: "disabled", removable: "removable", invalid: "invalid", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { selectionChange: "selectionChange", removed: "removed", destroyed: "destroyed", chipFocus: "chipFocus", chipBlur: "chipBlur" }, host: { listeners: { "click": "_handleClick($event)", "keydown": "_handleKeydown($event)", "blur": "_blur()", "focus": "focus()" }, properties: { "class.granite-chip-input": "inputChip", "class.granite-chip-selectable": "selectable", "class.granite-chip-selected": "selected", "class.granite-chip-disabled": "disabled", "class.granite-chip-invalid": "invalid", "class.granite-chip-removable": "!disabled && (removable || inputChip)", "attr.tabindex": "disabled ? null : tabIndex", "attr.role": "role", "attr.disabled": "disabled || null", "attr.aria-label": "ariaLabel", "attr.aria-labelledby": "ariaLabelledby", "attr.aria-disabled": "disabled.toString()", "attr.aria-selected": "ariaSelected" }, classAttribute: "granite-chip" }, exportAs: ["graniteChip"], ngImport: i0, template: "<ng-content></ng-content>\n<button\n *ngIf=\"!disabled && (removable || inputChip)\"\n class=\"granite-chip-remove\"\n (click)=\"_handleRemoveClick($event)\"\n>\n <granite-icon\n fontIcon=\"icon-close\"\n class=\"granite-chip-remove-icon\"\n [class.granite-chip-remove-icon-invalid]=\"invalid\"\n ></granite-icon>\n</button>\n", styles: [":host.granite-chip{display:-moz-inline-flex;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none;position:relative;box-sizing:border-box;-webkit-tap-highlight-color:transparent;border:none;-webkit-appearance:none;-moz-appearance:none;justify-content:center;align-items:center;padding-inline:var(--granite-spacing-m);margin-inline-start:var(--granite-spacing-xxs);margin-inline-end:var(--granite-spacing-xxs);padding-top:var(--granite-spacing-s);padding-bottom:var(--granite-spacing-s);height:inherit;color:var(--granite-color-text-weak);background-color:var(--granite-color-background);border-radius:var(--granite-radius-l);border-style:solid;border-width:var(--granite-border-width-regular);border-color:var(--granite-color-border-hard)}:host.granite-chip:hover{background-color:var(--granite-color-background-hover);cursor:pointer}:host.granite-chip.granite-chip-disabled{background-color:var(--granite-color-background);color:var(--granite-color-text-hint)}:host.granite-chip.granite-chip-disabled:hover{background-color:var(--granite-color-background);cursor:auto}:host.granite-chip:not(.granite-chip-selectable):hover{background-color:var(--granite-color-background);cursor:auto}:host.granite-chip.granite-chip-removable{padding-inline-end:var(--granite-spacing-s)}:host.granite-chip.granite-chip-invalid{background-color:var(--granite-color-background-failure);border-color:var(--granite-color-background-failure)}:host.granite-chip.granite-chip-invalid:hover{border-color:var(--granite-color-signal-failure)}:host.granite-chip.granite-chip-selected:not(.granite-chip-disabled):not(.granite-chip-input){border-color:var(--granite-color-background-active);background-color:var(--granite-color-background-info)}:host.granite-chip.granite-chip-selected:not(.granite-chip-disabled):not(.granite-chip-input):hover{background-color:var(--granite-color-background-hover)}:host.granite-chip.granite-chip-input{padding-top:var(--granite-spacing-xs);padding-bottom:var(--granite-spacing-xs);padding-inline:var(--granite-spacing-s)}:host.granite-chip.granite-chip-input:hover{background-color:var(--granite-color-background-hover)}:host.granite-chip.granite-chip-input:hover.granite-chip-invalid{background-color:var(--granite-color-background-failure)}:host.granite-chip.granite-chip-input:hover.granite-chip-invalid:hover{border-color:var(--granite-color-signal-failure)}.granite-chip-remove{display:flex;justify-content:center;align-items:center;background-color:transparent;outline:none;border:none;cursor:pointer;margin-inline-start:var(--granite-spacing-xs);margin-inline-end:0;padding:0}[dir=rtl] .granite-chip-remove{margin-inline-end:var(--granite-spacing-xs);margin-inline-start:0}.granite-chip-remove .granite-chip-remove-icon{position:relative;overflow:hidden;background-repeat:no-repeat;color:var(--granite-color-text-hint);line-height:inherit}.granite-chip-remove .granite-chip-remove-icon:hover{color:var(--granite-color-text)}.granite-chip-remove .granite-chip-remove-icon.granite-chip-remove-icon-invalid{color:var(--granite-color-signal-failure)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }] });
3085
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipComponent, decorators: [{
3086
3086
  type: Component,
3087
3087
  args: [{ selector: `granite-chip, granite-input-chip`, inputs: ['tabIndex'], exportAs: 'graniteChip', host: {
3088
3088
  class: 'granite-chip',
@@ -3154,48 +3154,6 @@ class GraniteChipListBase {
3154
3154
  // Increasing integer for generating unique ids for chip-list components.
3155
3155
  let nextUniqueId$1 = 0;
3156
3156
  class GraniteChipListComponent extends GraniteChipListBase {
3157
- constructor(_elementRef, _changeDetectorRef, _dir, _parentForm, _parentFormGroup, ngControl) {
3158
- super(_parentForm, _parentFormGroup, ngControl);
3159
- this._elementRef = _elementRef;
3160
- this._changeDetectorRef = _changeDetectorRef;
3161
- this._dir = _dir;
3162
- this.controlType = 'granite-chip-list';
3163
- /**
3164
- * When a chip is destroyed, we store the index of the destroyed chip until the chips
3165
- * query list notifies about the update. This is necessary because we cannot determine an
3166
- * appropriate chip that should receive focus until the array of chips updated completely.
3167
- */
3168
- this._lastDestroyedChipIndex = null;
3169
- /** Subject that emits when the component has been destroyed. */
3170
- this._destroyed = new Subject();
3171
- /** Uid of the chip list */
3172
- this._uid = `granite-chip-list-${nextUniqueId$1++}`;
3173
- /** Tab index for the chip list. */
3174
- this._tabIndex = 0;
3175
- /**
3176
- * User defined tab index.
3177
- * When it is not null, use user defined tab index. Otherwise use _tabIndex
3178
- */
3179
- this._userTabIndex = null;
3180
- this._multiple = false;
3181
- this._disabled = false;
3182
- this._selectable = true;
3183
- this.ariaLabel = null;
3184
- this.ariaLabelledby = null;
3185
- this.ariaOrientation = 'horizontal';
3186
- /** Function when changed */
3187
- this._onChange = () => {
3188
- // Implemented as part of ControlValueAccessor
3189
- };
3190
- /** Function when changed */
3191
- this._onTouched = () => {
3192
- // Implemented as part of ControlValueAccessor
3193
- };
3194
- this._compareWith = (o1, o2) => o1 === o2;
3195
- if (this.ngControl) {
3196
- this.ngControl.valueAccessor = this;
3197
- }
3198
- }
3199
3157
  /** The ARIA role applied to the chip list. */
3200
3158
  get role() {
3201
3159
  if (this._explicitRole) {
@@ -3277,6 +3235,48 @@ class GraniteChipListComponent extends GraniteChipListBase {
3277
3235
  get chipRemoveChanges() {
3278
3236
  return merge(...this.chips.map((chip) => chip.destroyed));
3279
3237
  }
3238
+ constructor(_elementRef, _changeDetectorRef, _dir, _parentForm, _parentFormGroup, ngControl) {
3239
+ super(_parentForm, _parentFormGroup, ngControl);
3240
+ this._elementRef = _elementRef;
3241
+ this._changeDetectorRef = _changeDetectorRef;
3242
+ this._dir = _dir;
3243
+ this.controlType = 'granite-chip-list';
3244
+ /**
3245
+ * When a chip is destroyed, we store the index of the destroyed chip until the chips
3246
+ * query list notifies about the update. This is necessary because we cannot determine an
3247
+ * appropriate chip that should receive focus until the array of chips updated completely.
3248
+ */
3249
+ this._lastDestroyedChipIndex = null;
3250
+ /** Subject that emits when the component has been destroyed. */
3251
+ this._destroyed = new Subject();
3252
+ /** Uid of the chip list */
3253
+ this._uid = `granite-chip-list-${nextUniqueId$1++}`;
3254
+ /** Tab index for the chip list. */
3255
+ this._tabIndex = 0;
3256
+ /**
3257
+ * User defined tab index.
3258
+ * When it is not null, use user defined tab index. Otherwise use _tabIndex
3259
+ */
3260
+ this._userTabIndex = null;
3261
+ this._multiple = false;
3262
+ this._disabled = false;
3263
+ this._selectable = true;
3264
+ this.ariaLabel = null;
3265
+ this.ariaLabelledby = null;
3266
+ this.ariaOrientation = 'horizontal';
3267
+ /** Function when changed */
3268
+ this._onChange = () => {
3269
+ // Implemented as part of ControlValueAccessor
3270
+ };
3271
+ /** Function when changed */
3272
+ this._onTouched = () => {
3273
+ // Implemented as part of ControlValueAccessor
3274
+ };
3275
+ this._compareWith = (o1, o2) => o1 === o2;
3276
+ if (this.ngControl) {
3277
+ this.ngControl.valueAccessor = this;
3278
+ }
3279
+ }
3280
3280
  ngAfterContentInit() {
3281
3281
  this._keyManager = new FocusKeyManager(this.chips)
3282
3282
  .withWrap()
@@ -3642,9 +3642,9 @@ class GraniteChipListComponent extends GraniteChipListBase {
3642
3642
  }
3643
3643
  }
3644
3644
  }
3645
- GraniteChipListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipListComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i3$1.Directionality, optional: true }, { token: i2$1.NgForm, optional: true }, { token: i2$1.FormGroupDirective, optional: true }, { token: i2$1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
3646
- GraniteChipListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteChipListComponent, selector: "granite-chip-list", inputs: { role: "role", multiselect: "multiselect", disabled: "disabled", selectable: "selectable", tabindex: "tabindex", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaOrientation: ["aria-orientation", "ariaOrientation"] }, host: { listeners: { "focus": "focus()", "blur": "_blur()", "keydown": "_keydown($event)" }, properties: { "class.granite-chip-list-disabled": "disabled", "attr.tabindex": "disabled ? null : _tabIndex", "attr.role": "role", "attr.aria-label": "ariaLabel", "attr.aria-labelledby": "ariaLabelledby", "attr.aria-disabled": "disabled.toString()", "attr.aria-multiselectable": "multiselect", "attr.aria-orientation": "ariaOrientation", "id": "_uid" }, classAttribute: "granite-chip-list" }, queries: [{ propertyName: "chips", predicate: GraniteChipComponent, descendants: true }], exportAs: ["graniteChipList"], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".granite-chip-list{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:center;align-content:center;font-weight:400;font-size:var(--granite-font-size-body-small);line-height:var(--granite-line-height-regular);overflow:auto;padding:0;margin:0}input.granite-chip-input{outline:none;border:none;background-color:transparent;color:var(--granite-color-text);margin:var(--granite-spacing-xs)}granite-icon{color:var(--granite-color-text);background-color:transparent}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
3647
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipListComponent, decorators: [{
3645
+ GraniteChipListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipListComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i3.Directionality, optional: true }, { token: i2$1.NgForm, optional: true }, { token: i2$1.FormGroupDirective, optional: true }, { token: i2$1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
3646
+ GraniteChipListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteChipListComponent, selector: "granite-chip-list", inputs: { role: "role", multiselect: "multiselect", disabled: "disabled", selectable: "selectable", tabindex: "tabindex", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaOrientation: ["aria-orientation", "ariaOrientation"] }, host: { listeners: { "focus": "focus()", "blur": "_blur()", "keydown": "_keydown($event)" }, properties: { "class.granite-chip-list-disabled": "disabled", "attr.tabindex": "disabled ? null : _tabIndex", "attr.role": "role", "attr.aria-label": "ariaLabel", "attr.aria-labelledby": "ariaLabelledby", "attr.aria-disabled": "disabled.toString()", "attr.aria-multiselectable": "multiselect", "attr.aria-orientation": "ariaOrientation", "id": "_uid" }, classAttribute: "granite-chip-list" }, queries: [{ propertyName: "chips", predicate: GraniteChipComponent, descendants: true }], exportAs: ["graniteChipList"], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".granite-chip-list{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:center;align-content:center;font-weight:400;font-size:var(--granite-font-size-body-small);line-height:var(--granite-line-height-regular);overflow:auto;padding:0;margin:0}input.granite-chip-input{outline:none;border:none;background-color:transparent;color:var(--granite-color-text);margin:var(--granite-spacing-xs)}granite-icon{color:var(--granite-color-text);background-color:transparent}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
3647
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipListComponent, decorators: [{
3648
3648
  type: Component,
3649
3649
  args: [{ selector: 'granite-chip-list', template: `<ng-content></ng-content>`, exportAs: 'graniteChipList', host: {
3650
3650
  class: 'granite-chip-list',
@@ -3662,7 +3662,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
3662
3662
  '(keydown)': '_keydown($event)',
3663
3663
  }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".granite-chip-list{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:center;align-content:center;font-weight:400;font-size:var(--granite-font-size-body-small);line-height:var(--granite-line-height-regular);overflow:auto;padding:0;margin:0}input.granite-chip-input{outline:none;border:none;background-color:transparent;color:var(--granite-color-text);margin:var(--granite-spacing-xs)}granite-icon{color:var(--granite-color-text);background-color:transparent}\n"] }]
3664
3664
  }], ctorParameters: function () {
3665
- return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i3$1.Directionality, decorators: [{
3665
+ return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i3.Directionality, decorators: [{
3666
3666
  type: Optional
3667
3667
  }] }, { type: i2$1.NgForm, decorators: [{
3668
3668
  type: Optional
@@ -3703,27 +3703,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
3703
3703
 
3704
3704
  let nextUniqueId = 0;
3705
3705
  class GraniteChipInputDirective {
3706
- constructor(_elementRef) {
3707
- this._elementRef = _elementRef;
3708
- /** Unique id for the input. */
3709
- this.id = `granite-chip-list-input-${nextUniqueId++}`;
3710
- /** The input's placeholder text. */
3711
- this.placeholder = '';
3712
- /**
3713
- * The list of key codes that will trigger a chipEnd event.
3714
- *
3715
- * Defaults to `[ENTER]`.
3716
- */
3717
- this.graniteChipInputSeparatorKeyCodes = [
3718
- ENTER,
3719
- ];
3720
- this._addOnBlur = true;
3721
- this._disabled = false;
3722
- /** Emitted when a chip is to be added. */
3723
- this.graniteChipInputTokenEnd = new EventEmitter();
3724
- this.focused = false;
3725
- this.inputElement = this._elementRef.nativeElement;
3726
- }
3727
3706
  /** Register input for chip list */
3728
3707
  set graniteChipInputFor(value) {
3729
3708
  if (value) {
@@ -3756,6 +3735,27 @@ class GraniteChipInputDirective {
3756
3735
  set disabled(value) {
3757
3736
  this._disabled = coerceBooleanProperty(value);
3758
3737
  }
3738
+ constructor(_elementRef) {
3739
+ this._elementRef = _elementRef;
3740
+ /** Unique id for the input. */
3741
+ this.id = `granite-chip-list-input-${nextUniqueId++}`;
3742
+ /** The input's placeholder text. */
3743
+ this.placeholder = '';
3744
+ /**
3745
+ * The list of key codes that will trigger a chipEnd event.
3746
+ *
3747
+ * Defaults to `[ENTER]`.
3748
+ */
3749
+ this.graniteChipInputSeparatorKeyCodes = [
3750
+ ENTER,
3751
+ ];
3752
+ this._addOnBlur = true;
3753
+ this._disabled = false;
3754
+ /** Emitted when a chip is to be added. */
3755
+ this.graniteChipInputTokenEnd = new EventEmitter();
3756
+ this.focused = false;
3757
+ this.inputElement = this._elementRef.nativeElement;
3758
+ }
3759
3759
  ngOnChanges() {
3760
3760
  this._chipList.stateChanges.next();
3761
3761
  }
@@ -3853,9 +3853,9 @@ class GraniteChipInputDirective {
3853
3853
  new Set(this.graniteChipInputSeparatorKeyCodes).has(event.keyCode));
3854
3854
  }
3855
3855
  }
3856
- GraniteChipInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipInputDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
3857
- GraniteChipInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: GraniteChipInputDirective, selector: "input[graniteChipInputFor]", inputs: { id: "id", placeholder: "placeholder", graniteChipInputFor: "graniteChipInputFor", graniteChipInputSeparatorKeyCodes: "graniteChipInputSeparatorKeyCodes", graniteChipInputAddOnBlur: "graniteChipInputAddOnBlur", required: "required", disabled: "disabled" }, outputs: { graniteChipInputTokenEnd: "graniteChipInputTokenEnd" }, host: { listeners: { "keydown": "_keydown($event)", "keyup": "_keyup($event)", "blur": "_blur()", "focus": "_focus()", "input": "_onInput()" }, properties: { "id": "id", "attr.disabled": "disabled || null", "attr.placeholder": "placeholder || null", "attr.aria-required": "required || null" }, classAttribute: "granite-chip-input" }, exportAs: ["graniteChipInput", "graniteChipInputFor"], usesOnChanges: true, ngImport: i0 });
3858
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipInputDirective, decorators: [{
3856
+ GraniteChipInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipInputDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
3857
+ GraniteChipInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: GraniteChipInputDirective, selector: "input[graniteChipInputFor]", inputs: { id: "id", placeholder: "placeholder", graniteChipInputFor: "graniteChipInputFor", graniteChipInputSeparatorKeyCodes: "graniteChipInputSeparatorKeyCodes", graniteChipInputAddOnBlur: "graniteChipInputAddOnBlur", required: "required", disabled: "disabled" }, outputs: { graniteChipInputTokenEnd: "graniteChipInputTokenEnd" }, host: { listeners: { "keydown": "_keydown($event)", "keyup": "_keyup($event)", "blur": "_blur()", "focus": "_focus()", "input": "_onInput()" }, properties: { "id": "id", "attr.disabled": "disabled || null", "attr.placeholder": "placeholder || null", "attr.aria-required": "required || null" }, classAttribute: "granite-chip-input" }, exportAs: ["graniteChipInput", "graniteChipInputFor"], usesOnChanges: true, ngImport: i0 });
3858
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipInputDirective, decorators: [{
3859
3859
  type: Directive,
3860
3860
  args: [{
3861
3861
  selector: 'input[graniteChipInputFor]',
@@ -3898,14 +3898,14 @@ const CHIP_DECLARATIONS = [
3898
3898
  ];
3899
3899
  class GraniteChipsModule {
3900
3900
  }
3901
- GraniteChipsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3902
- GraniteChipsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipsModule, declarations: [GraniteChipListComponent,
3901
+ GraniteChipsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3902
+ GraniteChipsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipsModule, declarations: [GraniteChipListComponent,
3903
3903
  GraniteChipComponent,
3904
3904
  GraniteChipInputDirective], imports: [CommonModule, FormsModule, ReactiveFormsModule, GraniteIconModule], exports: [GraniteChipListComponent,
3905
3905
  GraniteChipComponent,
3906
3906
  GraniteChipInputDirective] });
3907
- GraniteChipsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipsModule, imports: [[CommonModule, FormsModule, ReactiveFormsModule, GraniteIconModule]] });
3908
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteChipsModule, decorators: [{
3907
+ GraniteChipsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipsModule, imports: [CommonModule, FormsModule, ReactiveFormsModule, GraniteIconModule] });
3908
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteChipsModule, decorators: [{
3909
3909
  type: NgModule,
3910
3910
  args: [{
3911
3911
  imports: [CommonModule, FormsModule, ReactiveFormsModule, GraniteIconModule],
@@ -3926,9 +3926,9 @@ class GraniteLabelComponent {
3926
3926
  }
3927
3927
  }
3928
3928
  }
3929
- GraniteLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3930
- GraniteLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GraniteLabelComponent, selector: "granite-label", inputs: { for: "for", form: "form", required: "required" }, host: { classAttribute: "granite-label" }, exportAs: ["graniteLabel"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"for\" [attr.form]=\"form\">\n <i *ngIf=\"required\" aria-label=\"required\">*</i>\n <ng-content></ng-content>\n</label>\n", styles: [":host{box-sizing:border-box;font:inherit;font-size:var(--granite-font-size-micro);color:var(--granite-color-text-weak)}:host *,:host *:before,:host *:after{box-sizing:inherit}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3931
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteLabelComponent, decorators: [{
3929
+ GraniteLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3930
+ GraniteLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: GraniteLabelComponent, selector: "granite-label", inputs: { for: "for", form: "form", required: "required" }, host: { classAttribute: "granite-label" }, exportAs: ["graniteLabel"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"for\" [attr.form]=\"form\">\n <i *ngIf=\"required\" aria-label=\"required\">*</i>\n <ng-content></ng-content>\n</label>\n", styles: [":host{box-sizing:border-box;font:inherit;font-size:var(--granite-font-size-micro);color:var(--granite-color-text-weak)}:host *,:host *:before,:host *:after{box-sizing:inherit}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3931
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteLabelComponent, decorators: [{
3932
3932
  type: Component,
3933
3933
  args: [{ selector: 'granite-label', exportAs: 'graniteLabel', host: {
3934
3934
  class: 'granite-label',
@@ -3943,10 +3943,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
3943
3943
 
3944
3944
  class GraniteLabelModule {
3945
3945
  }
3946
- GraniteLabelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3947
- GraniteLabelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteLabelModule, declarations: [GraniteLabelComponent], imports: [CommonModule], exports: [GraniteLabelComponent] });
3948
- GraniteLabelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteLabelModule, imports: [[CommonModule]] });
3949
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteLabelModule, decorators: [{
3946
+ GraniteLabelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3947
+ GraniteLabelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteLabelModule, declarations: [GraniteLabelComponent], imports: [CommonModule], exports: [GraniteLabelComponent] });
3948
+ GraniteLabelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteLabelModule, imports: [CommonModule] });
3949
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteLabelModule, decorators: [{
3950
3950
  type: NgModule,
3951
3951
  args: [{
3952
3952
  declarations: [GraniteLabelComponent],
@@ -3961,14 +3961,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
3961
3961
  */
3962
3962
  class ClientOutputDesktopDirective {
3963
3963
  }
3964
- ClientOutputDesktopDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClientOutputDesktopDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
3965
- ClientOutputDesktopDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: ClientOutputDesktopDirective, selector: "[graniteClientOutputDesktop]", providers: [
3964
+ ClientOutputDesktopDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ClientOutputDesktopDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
3965
+ ClientOutputDesktopDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: ClientOutputDesktopDirective, selector: "[graniteClientOutputDesktop]", providers: [
3966
3966
  {
3967
3967
  provide: GRANITE_CLIENT_OUTPUT,
3968
3968
  useValue: deviceDesktop.output,
3969
3969
  },
3970
3970
  ], ngImport: i0 });
3971
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClientOutputDesktopDirective, decorators: [{
3971
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ClientOutputDesktopDirective, decorators: [{
3972
3972
  type: Directive,
3973
3973
  args: [{
3974
3974
  selector: `[graniteClientOutputDesktop]`,
@@ -3987,14 +3987,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
3987
3987
  */
3988
3988
  class ClientOutputTouchDirective {
3989
3989
  }
3990
- ClientOutputTouchDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClientOutputTouchDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
3991
- ClientOutputTouchDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: ClientOutputTouchDirective, selector: "[graniteClientOutputTouch]", providers: [
3990
+ ClientOutputTouchDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ClientOutputTouchDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
3991
+ ClientOutputTouchDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: ClientOutputTouchDirective, selector: "[graniteClientOutputTouch]", providers: [
3992
3992
  {
3993
3993
  provide: GRANITE_CLIENT_OUTPUT,
3994
3994
  useValue: deviceTouch.output,
3995
3995
  },
3996
3996
  ], ngImport: i0 });
3997
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClientOutputTouchDirective, decorators: [{
3997
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ClientOutputTouchDirective, decorators: [{
3998
3998
  type: Directive,
3999
3999
  args: [{
4000
4000
  selector: `[graniteClientOutputTouch]`,
@@ -4013,14 +4013,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
4013
4013
  */
4014
4014
  class ClientInputDesktopDirective {
4015
4015
  }
4016
- ClientInputDesktopDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClientInputDesktopDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
4017
- ClientInputDesktopDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: ClientInputDesktopDirective, selector: "[graniteClientInputDesktop]", providers: [
4016
+ ClientInputDesktopDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ClientInputDesktopDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
4017
+ ClientInputDesktopDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: ClientInputDesktopDirective, selector: "[graniteClientInputDesktop]", providers: [
4018
4018
  {
4019
4019
  provide: GRANITE_CLIENT_INPUT,
4020
4020
  useValue: deviceDesktop.input,
4021
4021
  },
4022
4022
  ], ngImport: i0 });
4023
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClientInputDesktopDirective, decorators: [{
4023
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ClientInputDesktopDirective, decorators: [{
4024
4024
  type: Directive,
4025
4025
  args: [{
4026
4026
  selector: `[graniteClientInputDesktop]`,
@@ -4039,14 +4039,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
4039
4039
  */
4040
4040
  class ClientInputTouchDirective {
4041
4041
  }
4042
- ClientInputTouchDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClientInputTouchDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
4043
- ClientInputTouchDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: ClientInputTouchDirective, selector: "[graniteClientInputTouch]", providers: [
4042
+ ClientInputTouchDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ClientInputTouchDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
4043
+ ClientInputTouchDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: ClientInputTouchDirective, selector: "[graniteClientInputTouch]", providers: [
4044
4044
  {
4045
4045
  provide: GRANITE_CLIENT_INPUT,
4046
4046
  useValue: deviceTouch.input,
4047
4047
  },
4048
4048
  ], ngImport: i0 });
4049
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClientInputTouchDirective, decorators: [{
4049
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ClientInputTouchDirective, decorators: [{
4050
4050
  type: Directive,
4051
4051
  args: [{
4052
4052
  selector: `[graniteClientInputTouch]`,
@@ -4062,16 +4062,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
4062
4062
  // TODO: Move client devices into a separate module
4063
4063
  class GraniteCoreModule {
4064
4064
  }
4065
- GraniteCoreModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCoreModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
4066
- GraniteCoreModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCoreModule, declarations: [ClientOutputDesktopDirective,
4065
+ GraniteCoreModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCoreModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
4066
+ GraniteCoreModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteCoreModule, declarations: [ClientOutputDesktopDirective,
4067
4067
  ClientOutputTouchDirective,
4068
4068
  ClientInputDesktopDirective,
4069
4069
  ClientInputTouchDirective], exports: [ClientOutputDesktopDirective,
4070
4070
  ClientOutputTouchDirective,
4071
4071
  ClientInputDesktopDirective,
4072
4072
  ClientInputTouchDirective] });
4073
- GraniteCoreModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCoreModule });
4074
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteCoreModule, decorators: [{
4073
+ GraniteCoreModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCoreModule });
4074
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteCoreModule, decorators: [{
4075
4075
  type: NgModule,
4076
4076
  args: [{
4077
4077
  declarations: [
@@ -4099,9 +4099,9 @@ class GraniteTitlePipe {
4099
4099
  .join(' ');
4100
4100
  }
4101
4101
  }
4102
- GraniteTitlePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteTitlePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
4103
- GraniteTitlePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteTitlePipe, name: "graniteTitle" });
4104
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GraniteTitlePipe, decorators: [{
4102
+ GraniteTitlePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteTitlePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
4103
+ GraniteTitlePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: GraniteTitlePipe, name: "graniteTitle" });
4104
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: GraniteTitlePipe, decorators: [{
4105
4105
  type: Pipe,
4106
4106
  args: [{
4107
4107
  name: 'graniteTitle',
@@ -4110,10 +4110,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
4110
4110
 
4111
4111
  class PurePipesModule {
4112
4112
  }
4113
- PurePipesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PurePipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
4114
- PurePipesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PurePipesModule, declarations: [GraniteTitlePipe], exports: [GraniteTitlePipe] });
4115
- PurePipesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PurePipesModule });
4116
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PurePipesModule, decorators: [{
4113
+ PurePipesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PurePipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
4114
+ PurePipesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: PurePipesModule, declarations: [GraniteTitlePipe], exports: [GraniteTitlePipe] });
4115
+ PurePipesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PurePipesModule });
4116
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PurePipesModule, decorators: [{
4117
4117
  type: NgModule,
4118
4118
  args: [{
4119
4119
  exports: [GraniteTitlePipe],