@ifsworld/granite-components 15.0.0-beta.1 → 15.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.
- package/fesm2022/ifsworld-granite-components-carousel.mjs +7 -7
- package/fesm2022/ifsworld-granite-components-carousel.mjs.map +1 -1
- package/fesm2022/ifsworld-granite-components-date-picker.mjs +18 -18
- package/fesm2022/ifsworld-granite-components-date-picker.mjs.map +1 -1
- package/fesm2022/ifsworld-granite-components-file-upload.mjs +10 -10
- package/fesm2022/ifsworld-granite-components-file-upload.mjs.map +1 -1
- package/fesm2022/ifsworld-granite-components-table.mjs +25 -25
- package/fesm2022/ifsworld-granite-components-table.mjs.map +1 -1
- package/fesm2022/ifsworld-granite-components-tooltip.mjs +13 -13
- package/fesm2022/ifsworld-granite-components-tooltip.mjs.map +1 -1
- package/fesm2022/ifsworld-granite-components.mjs +292 -280
- package/fesm2022/ifsworld-granite-components.mjs.map +1 -1
- package/lib/menu/menu-base.d.ts +11 -1
- package/package.json +7 -7
|
@@ -12,7 +12,7 @@ import { TemplatePortal, PortalModule } from '@angular/cdk/portal';
|
|
|
12
12
|
import { trigger, state, transition, style, group, query, animate, sequence } from '@angular/animations';
|
|
13
13
|
import * as i1 from '@angular/cdk/a11y';
|
|
14
14
|
import { FocusKeyManager, isFakeMousedownFromScreenReader } from '@angular/cdk/a11y';
|
|
15
|
-
import { hasModifierKey, SPACE, BACKSPACE, DELETE,
|
|
15
|
+
import { hasModifierKey, ENTER, SPACE, BACKSPACE, DELETE, TAB } from '@angular/cdk/keycodes';
|
|
16
16
|
import * as i3 from '@angular/cdk/bidi';
|
|
17
17
|
import { Directionality } from '@angular/cdk/bidi';
|
|
18
18
|
import { normalizePassiveListenerOptions } from '@angular/cdk/platform';
|
|
@@ -22,6 +22,7 @@ import * as i2$1 from '@angular/forms';
|
|
|
22
22
|
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
23
23
|
import * as i3$1 from '@ifsworld/granite-components/tooltip';
|
|
24
24
|
import { GraniteTooltipModule } from '@ifsworld/granite-components/tooltip';
|
|
25
|
+
import * as i1$3 from '@angular/cdk/scrolling';
|
|
25
26
|
import { ScrollingModule } from '@angular/cdk/scrolling';
|
|
26
27
|
|
|
27
28
|
class GraniteArrangeGridItemComponent {
|
|
@@ -58,10 +59,10 @@ class GraniteArrangeGridItemComponent {
|
|
|
58
59
|
setCssProperty(variable, value) {
|
|
59
60
|
this.element.nativeElement.style.setProperty(variable, value);
|
|
60
61
|
}
|
|
61
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
62
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
62
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteArrangeGridItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
63
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteArrangeGridItemComponent, isStandalone: false, selector: "granite-arrange-grid-item", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{--column-span: $default-column-span;display:grid;grid-column:span var(--column-span, 1)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
63
64
|
}
|
|
64
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
65
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteArrangeGridItemComponent, decorators: [{
|
|
65
66
|
type: Component,
|
|
66
67
|
args: [{ selector: 'granite-arrange-grid-item', template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, styles: [":host{--column-span: $default-column-span;display:grid;grid-column:span var(--column-span, 1)}\n"] }]
|
|
67
68
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
@@ -164,10 +165,10 @@ class GraniteArrangeGridComponent {
|
|
|
164
165
|
setCssProperty(variable, value) {
|
|
165
166
|
this.element.nativeElement.style.setProperty(variable, value);
|
|
166
167
|
}
|
|
167
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
168
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
168
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteArrangeGridComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
169
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteArrangeGridComponent, isStandalone: false, 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);gap:var(--granite-spacing-8)}:host.row-orientation{grid-template-columns:auto;grid-template-rows:repeat(calc(var(--rows, 1) - 1),max-content)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
169
170
|
}
|
|
170
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
171
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteArrangeGridComponent, decorators: [{
|
|
171
172
|
type: Component,
|
|
172
173
|
args: [{ selector: 'granite-arrange-grid', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, 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);gap:var(--granite-spacing-8)}:host.row-orientation{grid-template-columns:auto;grid-template-rows:repeat(calc(var(--rows, 1) - 1),max-content)}}\n"] }]
|
|
173
174
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { orientation: [{
|
|
@@ -186,11 +187,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
186
187
|
}] } });
|
|
187
188
|
|
|
188
189
|
class GraniteArrangeGridModule {
|
|
189
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
190
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
191
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
190
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteArrangeGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
191
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteArrangeGridModule, declarations: [GraniteArrangeGridComponent, GraniteArrangeGridItemComponent], imports: [CommonModule], exports: [GraniteArrangeGridComponent, GraniteArrangeGridItemComponent] }); }
|
|
192
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteArrangeGridModule, imports: [CommonModule] }); }
|
|
192
193
|
}
|
|
193
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
194
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteArrangeGridModule, decorators: [{
|
|
194
195
|
type: NgModule,
|
|
195
196
|
args: [{
|
|
196
197
|
declarations: [GraniteArrangeGridComponent, GraniteArrangeGridItemComponent],
|
|
@@ -228,10 +229,10 @@ class GraniteGridItemComponent {
|
|
|
228
229
|
setStyle(property, value) {
|
|
229
230
|
this.renderer.setStyle(this.element.nativeElement, property, value || '');
|
|
230
231
|
}
|
|
231
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
232
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
232
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteGridItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
233
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteGridItemComponent, isStandalone: false, 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 }); }
|
|
233
234
|
}
|
|
234
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
235
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteGridItemComponent, decorators: [{
|
|
235
236
|
type: Component,
|
|
236
237
|
args: [{
|
|
237
238
|
selector: 'granite-grid-item',
|
|
@@ -313,10 +314,10 @@ class GraniteGridComponent {
|
|
|
313
314
|
updateRowStyles() {
|
|
314
315
|
this.setCssProperty('--rows', (this._rows && this._rows.toString()) || null);
|
|
315
316
|
}
|
|
316
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
317
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
317
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteGridComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
318
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteGridComponent, isStandalone: false, 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 }); }
|
|
318
319
|
}
|
|
319
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
320
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteGridComponent, decorators: [{
|
|
320
321
|
type: Component,
|
|
321
322
|
args: [{ selector: 'granite-grid', template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, 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"] }]
|
|
322
323
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { cols: [{
|
|
@@ -326,11 +327,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
326
327
|
}] } });
|
|
327
328
|
|
|
328
329
|
class GraniteGridModule {
|
|
329
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
330
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
331
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
330
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
331
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteGridModule, declarations: [GraniteGridComponent, GraniteGridItemComponent], imports: [CommonModule], exports: [GraniteGridComponent, GraniteGridItemComponent] }); }
|
|
332
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteGridModule, imports: [CommonModule] }); }
|
|
332
333
|
}
|
|
333
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
334
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteGridModule, decorators: [{
|
|
334
335
|
type: NgModule,
|
|
335
336
|
args: [{
|
|
336
337
|
declarations: [GraniteGridComponent, GraniteGridItemComponent],
|
|
@@ -417,10 +418,10 @@ class GraniteBadgeComponent {
|
|
|
417
418
|
}
|
|
418
419
|
}
|
|
419
420
|
}
|
|
420
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
421
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
421
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteBadgeComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
422
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteBadgeComponent, isStandalone: false, 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: "<div class=\"granite-badge-content\">\n <ng-content></ng-content>\n</div>\n", styles: [":host{display:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-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:var(--granite-radius-s);font-size:var(--granite-font-size-body-small);padding-inline:var(--granite-spacing-8);padding-block:var(--granite-spacing-4)}:host(.granite-badge-pill){border-radius:var(--granite-radius-l)}.granite-badge-content{overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
422
423
|
}
|
|
423
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
424
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteBadgeComponent, decorators: [{
|
|
424
425
|
type: Component,
|
|
425
426
|
args: [{ selector: 'granite-badge', exportAs: 'graniteBadge', host: {
|
|
426
427
|
class: 'granite-badge',
|
|
@@ -435,11 +436,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
435
436
|
}] } });
|
|
436
437
|
|
|
437
438
|
class GraniteBadgeModule {
|
|
438
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
439
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
440
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
439
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
440
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteBadgeModule, declarations: [GraniteBadgeComponent], imports: [CommonModule], exports: [GraniteBadgeComponent] }); }
|
|
441
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteBadgeModule, imports: [CommonModule] }); }
|
|
441
442
|
}
|
|
442
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
443
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteBadgeModule, decorators: [{
|
|
443
444
|
type: NgModule,
|
|
444
445
|
args: [{
|
|
445
446
|
declarations: [GraniteBadgeComponent],
|
|
@@ -730,10 +731,10 @@ class GraniteIconComponent {
|
|
|
730
731
|
this._previousFontIconClass = this.fontIcon;
|
|
731
732
|
}
|
|
732
733
|
}
|
|
733
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
734
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
734
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteIconComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: 'aria-hidden', attribute: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
735
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteIconComponent, isStandalone: false, 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-4) / 2);font-size:1em;line-height:1em;position:relative;top:.1em}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
735
736
|
}
|
|
736
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
737
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteIconComponent, decorators: [{
|
|
737
738
|
type: Component,
|
|
738
739
|
args: [{ selector: 'granite-icon', template: '<ng-content></ng-content>', host: {
|
|
739
740
|
role: 'img',
|
|
@@ -783,8 +784,8 @@ class GraniteMenuItemComponent {
|
|
|
783
784
|
_getHostElement() {
|
|
784
785
|
return this._elementRef.nativeElement;
|
|
785
786
|
}
|
|
786
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
787
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
787
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuItemComponent, deps: [{ token: i0.ElementRef }, { token: i1.FocusMonitor }, { token: GRANITE_MENU_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
788
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteMenuItemComponent, isStandalone: false, 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>
|
|
788
789
|
<ng-container *ngIf="_triggersSubmenu">
|
|
789
790
|
<granite-icon
|
|
790
791
|
class="caret-left"
|
|
@@ -796,7 +797,7 @@ class GraniteMenuItemComponent {
|
|
|
796
797
|
></granite-icon>
|
|
797
798
|
</ng-container>`, isInline: true, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-8);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{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;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-24)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-4)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-4)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-4)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-4)}[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-24)}: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-24)}: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-4)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-4)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-4)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-4)}[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"] }] }); }
|
|
798
799
|
}
|
|
799
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
800
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuItemComponent, decorators: [{
|
|
800
801
|
type: Component,
|
|
801
802
|
args: [{ selector: '[graniteMenuItem]', template: `<ng-content></ng-content>
|
|
802
803
|
<ng-container *ngIf="_triggersSubmenu">
|
|
@@ -870,6 +871,12 @@ class _MenuBaseComponent {
|
|
|
870
871
|
this._changeDetectorRef = _changeDetectorRef;
|
|
871
872
|
this.openOnHover = true;
|
|
872
873
|
this.scrollStrategy = 'reposition';
|
|
874
|
+
/**
|
|
875
|
+
* Styles to be applied to the menu.
|
|
876
|
+
* Added as there is no way to apply styles to the menu from the outside.
|
|
877
|
+
*/
|
|
878
|
+
this.styles = {};
|
|
879
|
+
this.touchStyles = {};
|
|
873
880
|
/**
|
|
874
881
|
* Event emitted when the menu is closed
|
|
875
882
|
*/
|
|
@@ -1144,10 +1151,10 @@ class _MenuBaseComponent {
|
|
|
1144
1151
|
this._directDescendantItems.notifyOnChanges();
|
|
1145
1152
|
});
|
|
1146
1153
|
}
|
|
1147
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1148
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
1154
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: _MenuBaseComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1155
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: _MenuBaseComponent, isStandalone: true, inputs: { xPosition: "xPosition", yPosition: "yPosition", title: "title", closeLabel: "closeLabel", openOnHover: "openOnHover", scrollStrategy: "scrollStrategy", styles: "styles", touchStyles: "touchStyles" }, outputs: { closed: "closed", opened: "opened" }, queries: [{ propertyName: "_allItems", predicate: GraniteMenuItemComponent, descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0 }); }
|
|
1149
1156
|
}
|
|
1150
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1157
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: _MenuBaseComponent, decorators: [{
|
|
1151
1158
|
type: Directive
|
|
1152
1159
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { xPosition: [{
|
|
1153
1160
|
type: Input
|
|
@@ -1161,6 +1168,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1161
1168
|
type: Input
|
|
1162
1169
|
}], scrollStrategy: [{
|
|
1163
1170
|
type: Input
|
|
1171
|
+
}], styles: [{
|
|
1172
|
+
type: Input
|
|
1173
|
+
}], touchStyles: [{
|
|
1174
|
+
type: Input
|
|
1164
1175
|
}], templateRef: [{
|
|
1165
1176
|
type: ViewChild,
|
|
1166
1177
|
args: [TemplateRef]
|
|
@@ -1174,10 +1185,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1174
1185
|
}] } });
|
|
1175
1186
|
|
|
1176
1187
|
class GraniteMenuTouchCloseComponent {
|
|
1177
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1178
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1188
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuTouchCloseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1189
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteMenuTouchCloseComponent, isStandalone: false, 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-8);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{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;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-24)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-4)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-4)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-4)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-4)}[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-24)}: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-24)}: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-4)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-4)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-4)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-4)}[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"] }); }
|
|
1179
1190
|
}
|
|
1180
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1191
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuTouchCloseComponent, decorators: [{
|
|
1181
1192
|
type: Component,
|
|
1182
1193
|
args: [{ selector: '[graniteMenuTouchCloseItem]', standalone: false, template: '<ng-content></ng-content>', exportAs: 'graniteMenuTouchCloseItem', host: {
|
|
1183
1194
|
'[class.granite-device-output-touch]': 'true',
|
|
@@ -1195,8 +1206,8 @@ class GraniteMenuTouchTitleItemComponent {
|
|
|
1195
1206
|
this._triggersBack = false;
|
|
1196
1207
|
this._triggersBack = !!_parentMenu.parentMenu;
|
|
1197
1208
|
}
|
|
1198
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1199
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1209
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuTouchTitleItemComponent, deps: [{ token: GRANITE_MENU_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1210
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteMenuTouchTitleItemComponent, isStandalone: false, 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: `
|
|
1200
1211
|
<ng-container *ngIf="_triggersBack">
|
|
1201
1212
|
<granite-icon
|
|
1202
1213
|
class="caret-left"
|
|
@@ -1210,7 +1221,7 @@ class GraniteMenuTouchTitleItemComponent {
|
|
|
1210
1221
|
<ng-content></ng-content>
|
|
1211
1222
|
`, isInline: true, styles: [":host{display:block;position:relative;line-height:2rem;padding:0 var(--granite-spacing-8);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{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;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-24)}html[dir=ltr] :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-4)}:host-context([dir=ltr]) :host.granite-menu-item-submenu-trigger granite-icon{right:var(--granite-spacing-4)}html[dir=rtl] :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-4)}:host-context([dir=rtl]) :host.granite-menu-item-submenu-trigger granite-icon{left:var(--granite-spacing-4)}[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-24)}: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-24)}: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-4)}:host-context([dir=ltr]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{left:var(--granite-spacing-4)}html[dir=rtl] :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-4)}:host-context([dir=rtl]) :host.granite-device-output-touch.granite-menu-item-back-trigger granite-icon{right:var(--granite-spacing-4)}[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"] }] }); }
|
|
1212
1223
|
}
|
|
1213
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1224
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuTouchTitleItemComponent, decorators: [{
|
|
1214
1225
|
type: Component,
|
|
1215
1226
|
args: [{ selector: '[graniteMenuTouchTitleItem]', standalone: false, template: `
|
|
1216
1227
|
<ng-container *ngIf="_triggersBack">
|
|
@@ -1237,16 +1248,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1237
1248
|
}] }] });
|
|
1238
1249
|
|
|
1239
1250
|
class GraniteMenuComponent extends _MenuBaseComponent {
|
|
1240
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1241
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1251
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1252
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteMenuComponent, isStandalone: false, selector: "granite-menu", providers: [
|
|
1242
1253
|
{ provide: GRANITE_MENU_PANEL, useExisting: GraniteMenuComponent },
|
|
1243
|
-
], 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;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-4)}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar-thumb{background-color:var(--granite-color-border-hard);border-radius:calc(var(--granite-spacing-16) * .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;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-4)}.granite-menu.granite-device-output-touch.close{margin-inline-start:var(--granite-spacing-4);margin-inline-end:var(--granite-spacing-4);margin-block-end:var(--granite-spacing-4)}.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;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-4)}.close:not(:empty).close{margin-inline-start:var(--granite-spacing-4);margin-inline-end:var(--granite-spacing-4);margin-block-end:var(--granite-spacing-4)}\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: [
|
|
1254
|
+
], 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 [style]=\"styles\"\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 [style]=\"touchStyles\"\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;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-4)}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar-thumb{background-color:var(--granite-color-border-hard);border-radius:calc(var(--granite-spacing-16) * .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;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-4)}.granite-menu.granite-device-output-touch.close{margin-inline-start:var(--granite-spacing-4);margin-inline-end:var(--granite-spacing-4);margin-block-end:var(--granite-spacing-4)}.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;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-4)}.close:not(:empty).close{margin-inline-start:var(--granite-spacing-4);margin-inline-end:var(--granite-spacing-4);margin-block-end:var(--granite-spacing-4)}\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: [
|
|
1244
1255
|
graniteMenuDesktopAnimations.transformMenuDesktop,
|
|
1245
1256
|
graniteMenuTouchAnimations.transformMenuTouch,
|
|
1246
1257
|
graniteMenuTouchAnimations.transformCloseButton,
|
|
1247
1258
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1248
1259
|
}
|
|
1249
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1260
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuComponent, decorators: [{
|
|
1250
1261
|
type: Component,
|
|
1251
1262
|
args: [{ selector: 'granite-menu', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'graniteMenu', animations: [
|
|
1252
1263
|
graniteMenuDesktopAnimations.transformMenuDesktop,
|
|
@@ -1254,7 +1265,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1254
1265
|
graniteMenuTouchAnimations.transformCloseButton,
|
|
1255
1266
|
], providers: [
|
|
1256
1267
|
{ provide: GRANITE_MENU_PANEL, useExisting: GraniteMenuComponent },
|
|
1257
|
-
], 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;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-4)}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar-thumb{background-color:var(--granite-color-border-hard);border-radius:calc(var(--granite-spacing-16) * .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;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-4)}.granite-menu.granite-device-output-touch.close{margin-inline-start:var(--granite-spacing-4);margin-inline-end:var(--granite-spacing-4);margin-block-end:var(--granite-spacing-4)}.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;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-4)}.close:not(:empty).close{margin-inline-start:var(--granite-spacing-4);margin-inline-end:var(--granite-spacing-4);margin-block-end:var(--granite-spacing-4)}\n"] }]
|
|
1268
|
+
], 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 [style]=\"styles\"\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 [style]=\"touchStyles\"\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;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-4)}.granite-menu:not(.granite-device-output-touch)::-webkit-scrollbar-thumb{background-color:var(--granite-color-border-hard);border-radius:calc(var(--granite-spacing-16) * .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;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-4)}.granite-menu.granite-device-output-touch.close{margin-inline-start:var(--granite-spacing-4);margin-inline-end:var(--granite-spacing-4);margin-block-end:var(--granite-spacing-4)}.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;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-4)}.close:not(:empty).close{margin-inline-start:var(--granite-spacing-4);margin-inline-end:var(--granite-spacing-4);margin-block-end:var(--granite-spacing-4)}\n"] }]
|
|
1258
1269
|
}] });
|
|
1259
1270
|
|
|
1260
1271
|
/**
|
|
@@ -1944,10 +1955,10 @@ class GraniteMenuTriggerForDirective {
|
|
|
1944
1955
|
}
|
|
1945
1956
|
}
|
|
1946
1957
|
}
|
|
1947
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1948
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
1958
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuTriggerForDirective, deps: [{ token: i1$2.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }, { 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 }); }
|
|
1959
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteMenuTriggerForDirective, isStandalone: false, 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": "isMenuOpened || null", "attr.aria-controls": "isMenuOpened ? menu.panelId : null" }, classAttribute: "granite-menu-trigger" }, exportAs: ["graniteMenuTriggerFor"], usesOnChanges: true, ngImport: i0 }); }
|
|
1949
1960
|
}
|
|
1950
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1961
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuTriggerForDirective, decorators: [{
|
|
1951
1962
|
type: Directive,
|
|
1952
1963
|
args: [{
|
|
1953
1964
|
selector: `[graniteMenuTriggerFor]`,
|
|
@@ -1998,10 +2009,10 @@ class GraniteDividerDirective {
|
|
|
1998
2009
|
constructor() {
|
|
1999
2010
|
this.dividerDirection = 'top';
|
|
2000
2011
|
}
|
|
2001
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2002
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
2012
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteDividerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2013
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteDividerDirective, isStandalone: false, selector: "[graniteDivider]", inputs: { dividerDirection: "dividerDirection" }, host: { properties: { "class.granite-divider-top": "dividerDirection === \"top\"", "class.granite-divider-bottom": "dividerDirection === \"bottom\"" } }, exportAs: ["graniteDivider"], ngImport: i0 }); }
|
|
2003
2014
|
}
|
|
2004
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2015
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteDividerDirective, decorators: [{
|
|
2005
2016
|
type: Directive,
|
|
2006
2017
|
args: [{
|
|
2007
2018
|
selector: '[graniteDivider]',
|
|
@@ -2017,11 +2028,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2017
2028
|
}] } });
|
|
2018
2029
|
|
|
2019
2030
|
class GraniteIconModule {
|
|
2020
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2021
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
2022
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
2031
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2032
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteIconModule, declarations: [GraniteIconComponent], exports: [GraniteIconComponent] }); }
|
|
2033
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteIconModule }); }
|
|
2023
2034
|
}
|
|
2024
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2035
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteIconModule, decorators: [{
|
|
2025
2036
|
type: NgModule,
|
|
2026
2037
|
args: [{
|
|
2027
2038
|
declarations: [GraniteIconComponent],
|
|
@@ -2030,10 +2041,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2030
2041
|
}] });
|
|
2031
2042
|
|
|
2032
2043
|
class GraniteTitleDirective {
|
|
2033
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2034
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
2044
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2045
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteTitleDirective, isStandalone: false, selector: "[graniteTitle]", host: { properties: { "class.granite-title": "true" } }, exportAs: ["graniteTitle"], ngImport: i0 }); }
|
|
2035
2046
|
}
|
|
2036
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2047
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteTitleDirective, decorators: [{
|
|
2037
2048
|
type: Directive,
|
|
2038
2049
|
args: [{
|
|
2039
2050
|
selector: '[graniteTitle]',
|
|
@@ -2046,8 +2057,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2046
2057
|
}] });
|
|
2047
2058
|
|
|
2048
2059
|
class GraniteMenuModule {
|
|
2049
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2050
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
2060
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2061
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuModule, declarations: [GraniteMenuComponent,
|
|
2051
2062
|
GraniteMenuItemComponent,
|
|
2052
2063
|
GraniteMenuTriggerForDirective,
|
|
2053
2064
|
GraniteMenuTouchCloseComponent,
|
|
@@ -2060,9 +2071,9 @@ class GraniteMenuModule {
|
|
|
2060
2071
|
GraniteMenuTouchTitleItemComponent,
|
|
2061
2072
|
GraniteDividerDirective,
|
|
2062
2073
|
GraniteTitleDirective] }); }
|
|
2063
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
2074
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuModule, imports: [CommonModule, OverlayModule, PortalModule, GraniteIconModule] }); }
|
|
2064
2075
|
}
|
|
2065
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2076
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteMenuModule, decorators: [{
|
|
2066
2077
|
type: NgModule,
|
|
2067
2078
|
args: [{
|
|
2068
2079
|
declarations: [
|
|
@@ -2251,10 +2262,10 @@ class GraniteToggleSwitchComponent {
|
|
|
2251
2262
|
_getInputElement() {
|
|
2252
2263
|
return this._inputElement.nativeElement;
|
|
2253
2264
|
}
|
|
2254
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2255
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2265
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteToggleSwitchComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2266
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteToggleSwitchComponent, isStandalone: false, 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)}.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{outline:var(--granite-spacing-2) solid var(--granite-color-focus);outline-offset:var(--granite-spacing-2);box-shadow:none}.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}: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}.granite-toggle-switch-label{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:center;width:max-content;padding-block:var(--granite-spacing-4)}: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}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2256
2267
|
}
|
|
2257
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2268
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteToggleSwitchComponent, decorators: [{
|
|
2258
2269
|
type: Component,
|
|
2259
2270
|
args: [{ selector: 'granite-toggle-switch', standalone: false, exportAs: 'graniteToggleSwitch', host: {
|
|
2260
2271
|
class: 'granite-toggle-switch',
|
|
@@ -2291,11 +2302,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2291
2302
|
}] } });
|
|
2292
2303
|
|
|
2293
2304
|
class GraniteToggleSwitchModule {
|
|
2294
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2295
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
2296
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
2305
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteToggleSwitchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2306
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteToggleSwitchModule, declarations: [GraniteToggleSwitchComponent], exports: [GraniteToggleSwitchComponent] }); }
|
|
2307
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteToggleSwitchModule }); }
|
|
2297
2308
|
}
|
|
2298
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2309
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteToggleSwitchModule, decorators: [{
|
|
2299
2310
|
type: NgModule,
|
|
2300
2311
|
args: [{
|
|
2301
2312
|
declarations: [GraniteToggleSwitchComponent],
|
|
@@ -2372,10 +2383,10 @@ class GraniteRadioButtonComponent {
|
|
|
2372
2383
|
_getInputElement() {
|
|
2373
2384
|
return this._inputElement.nativeElement;
|
|
2374
2385
|
}
|
|
2375
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2376
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2386
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioButtonComponent, deps: [{ token: i1.FocusMonitor }, { token: i2.UniqueSelectionDispatcher }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2387
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteRadioButtonComponent, isStandalone: false, 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{-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.granite-radio-button-label-before) .granite-radio-button-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}:host(.granite-radio-button-checked) .granite-radio-button-inner-circle{visibility:visible;animation:grow-animation .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-8);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:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-32);margin-block-end:var(--granite-spacing-4)}: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 grow-animation{0%{transform:scale(0)}to{transform:scale(1)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2377
2388
|
}
|
|
2378
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2389
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioButtonComponent, decorators: [{
|
|
2379
2390
|
type: Component,
|
|
2380
2391
|
args: [{ selector: 'granite-radio-button', standalone: false, exportAs: 'graniteRadioButton', host: {
|
|
2381
2392
|
class: 'granite-radio-button',
|
|
@@ -2420,10 +2431,10 @@ class GraniteRadioCheckboxBase {
|
|
|
2420
2431
|
this.layout = 'horizontal';
|
|
2421
2432
|
this.ariaLabelledby = null;
|
|
2422
2433
|
}
|
|
2423
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2424
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
2434
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioCheckboxBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2435
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteRadioCheckboxBase, isStandalone: true, inputs: { layout: "layout", ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, ngImport: i0 }); }
|
|
2425
2436
|
}
|
|
2426
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2437
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioCheckboxBase, decorators: [{
|
|
2427
2438
|
type: Directive
|
|
2428
2439
|
}], propDecorators: { layout: [{
|
|
2429
2440
|
type: Input
|
|
@@ -2433,10 +2444,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2433
2444
|
}] } });
|
|
2434
2445
|
|
|
2435
2446
|
class GraniteRadioGroupComponent extends GraniteRadioCheckboxBase {
|
|
2436
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2437
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2447
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2448
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteRadioGroupComponent, isStandalone: false, 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:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:flex-start}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2438
2449
|
}
|
|
2439
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2450
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioGroupComponent, decorators: [{
|
|
2440
2451
|
type: Component,
|
|
2441
2452
|
args: [{ selector: 'granite-radio-group', standalone: false, host: {
|
|
2442
2453
|
class: 'granite-radio-group',
|
|
@@ -2447,11 +2458,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2447
2458
|
}] });
|
|
2448
2459
|
|
|
2449
2460
|
class GraniteRadioButtonModule {
|
|
2450
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2451
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
2452
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
2461
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2462
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioButtonModule, declarations: [GraniteRadioButtonComponent, GraniteRadioGroupComponent], exports: [GraniteRadioButtonComponent, GraniteRadioGroupComponent] }); }
|
|
2463
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioButtonModule }); }
|
|
2453
2464
|
}
|
|
2454
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2465
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteRadioButtonModule, decorators: [{
|
|
2455
2466
|
type: NgModule,
|
|
2456
2467
|
args: [{
|
|
2457
2468
|
declarations: [GraniteRadioButtonComponent, GraniteRadioGroupComponent],
|
|
@@ -2514,10 +2525,10 @@ class GraniteCheckboxComponent {
|
|
|
2514
2525
|
_getInputElement() {
|
|
2515
2526
|
return this._inputElement.nativeElement;
|
|
2516
2527
|
}
|
|
2517
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2518
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2528
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCheckboxComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2529
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCheckboxComponent, isStandalone: false, 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:fade-in-animation .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:fade-out-animation .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{-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.granite-checkbox-label-before) .granite-checkbox-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}.granite-checkbox-label{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:center;width:max-content;margin-inline-end:var(--granite-spacing-32);margin-block-end:var(--granite-spacing-4)}.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-4);border-width:0 0 .125rem .125rem}.granite-checkbox-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-checkbox-text:empty{display:none}@keyframes fade-in-animation{0%{opacity:0}to{opacity:1}}@keyframes fade-out-animation{0%{opacity:1}to{opacity:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2519
2530
|
}
|
|
2520
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2531
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCheckboxComponent, decorators: [{
|
|
2521
2532
|
type: Component,
|
|
2522
2533
|
args: [{ selector: 'granite-checkbox', standalone: false, exportAs: 'graniteCheckbox', host: {
|
|
2523
2534
|
class: 'granite-checkbox',
|
|
@@ -2554,10 +2565,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2554
2565
|
}] } });
|
|
2555
2566
|
|
|
2556
2567
|
class GraniteCheckboxGroupComponent extends GraniteRadioCheckboxBase {
|
|
2557
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2558
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2568
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCheckboxGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2569
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCheckboxGroupComponent, isStandalone: false, 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:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:flex-start}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2559
2570
|
}
|
|
2560
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2571
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCheckboxGroupComponent, decorators: [{
|
|
2561
2572
|
type: Component,
|
|
2562
2573
|
args: [{ selector: 'granite-checkbox-group', standalone: false, host: {
|
|
2563
2574
|
class: 'granite-checkbox-group',
|
|
@@ -2568,11 +2579,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2568
2579
|
}] });
|
|
2569
2580
|
|
|
2570
2581
|
class GraniteCheckboxModule {
|
|
2571
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2572
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
2573
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
2582
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2583
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteCheckboxModule, declarations: [GraniteCheckboxComponent, GraniteCheckboxGroupComponent], exports: [GraniteCheckboxComponent, GraniteCheckboxGroupComponent] }); }
|
|
2584
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCheckboxModule }); }
|
|
2574
2585
|
}
|
|
2575
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2586
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCheckboxModule, decorators: [{
|
|
2576
2587
|
type: NgModule,
|
|
2577
2588
|
args: [{
|
|
2578
2589
|
declarations: [GraniteCheckboxComponent, GraniteCheckboxGroupComponent],
|
|
@@ -2593,10 +2604,10 @@ const disabledMixin = (Base = class {
|
|
|
2593
2604
|
this.disabled = coerceBooleanProperty(changes.disabled.currentValue);
|
|
2594
2605
|
}
|
|
2595
2606
|
}
|
|
2596
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2597
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
2607
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: Derived, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2608
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: Derived, isStandalone: true, inputs: { disabled: "disabled" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
|
|
2598
2609
|
}
|
|
2599
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2610
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: Derived, decorators: [{
|
|
2600
2611
|
type: Directive
|
|
2601
2612
|
}], propDecorators: { disabled: [{
|
|
2602
2613
|
type: Input
|
|
@@ -2637,10 +2648,10 @@ class GraniteButtonComponent extends ButtonComponentMixin {
|
|
|
2637
2648
|
_getHostElement() {
|
|
2638
2649
|
return this._elementRef.nativeElement;
|
|
2639
2650
|
}
|
|
2640
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2641
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2651
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteButtonComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2652
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteButtonComponent, isStandalone: false, 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-8) var(--granite-spacing-8);position:relative;line-height:var(--granite-font-size-body);display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;justify-content:center;align-items:center;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;-moz-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;text-decoration:none}a:host:hover{text-decoration:underline}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;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2642
2653
|
}
|
|
2643
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2654
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteButtonComponent, decorators: [{
|
|
2644
2655
|
type: Component,
|
|
2645
2656
|
args: [{ selector: `button[graniteButton],
|
|
2646
2657
|
button[granitePrimaryButton],
|
|
@@ -2669,10 +2680,10 @@ class GraniteAnchorComponent extends GraniteButtonComponent {
|
|
|
2669
2680
|
ngOnChanges(changes) {
|
|
2670
2681
|
super.ngOnChanges(changes);
|
|
2671
2682
|
}
|
|
2672
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2673
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2683
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteAnchorComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2684
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteAnchorComponent, isStandalone: false, 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-8) var(--granite-spacing-8);position:relative;line-height:var(--granite-font-size-body);display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;justify-content:center;align-items:center;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;-moz-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;text-decoration:none}a:host:hover{text-decoration:underline}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;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2674
2685
|
}
|
|
2675
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2686
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteAnchorComponent, decorators: [{
|
|
2676
2687
|
type: Component,
|
|
2677
2688
|
args: [{ selector: `a[graniteButton],
|
|
2678
2689
|
a[graniteFlatButton]`, host: {
|
|
@@ -2686,11 +2697,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2686
2697
|
}] } });
|
|
2687
2698
|
|
|
2688
2699
|
class GraniteButtonModule {
|
|
2689
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2690
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
2691
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
2700
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2701
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteButtonModule, declarations: [GraniteButtonComponent, GraniteAnchorComponent], exports: [GraniteButtonComponent, GraniteAnchorComponent] }); }
|
|
2702
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteButtonModule }); }
|
|
2692
2703
|
}
|
|
2693
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2704
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteButtonModule, decorators: [{
|
|
2694
2705
|
type: NgModule,
|
|
2695
2706
|
args: [{
|
|
2696
2707
|
declarations: [GraniteButtonComponent, GraniteAnchorComponent],
|
|
@@ -2810,10 +2821,10 @@ class GraniteInputFieldComponent {
|
|
|
2810
2821
|
this.valueChange.emit(value);
|
|
2811
2822
|
}
|
|
2812
2823
|
}
|
|
2813
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2814
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2824
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteInputFieldComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2825
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteInputFieldComponent, isStandalone: false, 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 [class.granite-input-invalid]=\"invalid\"\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 (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-container *ngIf=\"!_passwordField\">\n <ng-content select=\"[graniteInputSuffixButton]\"></ng-content>\n </ng-container>\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 (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\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:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-medium)}.granite-input-container .granite-input-top-row:hover:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-hard)}.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-invalid:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-8);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::placeholder{color:var(--granite-color-text-hint)}.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: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-signal-failure),inset .125rem 0 var(--granite-color-signal-failure),inset -.125rem 0 var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-prepend{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:center;padding:0 var(--granite-spacing-8);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;-moz-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-8);background-size:contain;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}:host ::ng-deep button[graniteInputSuffixButton]{-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative;margin:0;border-radius:0}\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 }); }
|
|
2815
2826
|
}
|
|
2816
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2827
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteInputFieldComponent, decorators: [{
|
|
2817
2828
|
type: Component,
|
|
2818
2829
|
args: [{ selector: 'granite-input-field', exportAs: 'graniteInputField', standalone: false, host: {
|
|
2819
2830
|
class: 'granite-input-field',
|
|
@@ -2859,11 +2870,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2859
2870
|
}] } });
|
|
2860
2871
|
|
|
2861
2872
|
class GraniteInputFieldModule {
|
|
2862
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2863
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
2864
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
2873
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteInputFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2874
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteInputFieldModule, declarations: [GraniteInputFieldComponent], imports: [CommonModule, GraniteIconModule, GraniteButtonModule], exports: [GraniteInputFieldComponent] }); }
|
|
2875
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteInputFieldModule, imports: [CommonModule, GraniteIconModule, GraniteButtonModule] }); }
|
|
2865
2876
|
}
|
|
2866
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2877
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteInputFieldModule, decorators: [{
|
|
2867
2878
|
type: NgModule,
|
|
2868
2879
|
args: [{
|
|
2869
2880
|
imports: [CommonModule, GraniteIconModule, GraniteButtonModule],
|
|
@@ -3046,6 +3057,7 @@ class GraniteChipComponent {
|
|
|
3046
3057
|
event.preventDefault();
|
|
3047
3058
|
break;
|
|
3048
3059
|
case SPACE:
|
|
3060
|
+
case ENTER:
|
|
3049
3061
|
// If we are selectable, toggle the focused chip
|
|
3050
3062
|
if (this.selectable) {
|
|
3051
3063
|
this.toggleSelected(true);
|
|
@@ -3090,10 +3102,10 @@ class GraniteChipComponent {
|
|
|
3090
3102
|
? this.selected.toString()
|
|
3091
3103
|
: null;
|
|
3092
3104
|
}
|
|
3093
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3094
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
3105
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteChipComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef, optional: true }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3106
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteChipComponent, isStandalone: false, selector: "granite-chip, granite-input-chip", inputs: { tabIndex: "tabIndex", role: "role", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], selected: "selected", value: "value", selectable: "selectable", disabled: "disabled", removable: "removable", invalid: "invalid" }, 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:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow:hidden;-ms-text-overflow:ellipsis;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;-moz-user-select:none;-ms-user-select:none;-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-16);margin-inline:var(--granite-spacing-2);padding-top:var(--granite-spacing-8);padding-bottom:var(--granite-spacing-8);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:focus{outline:var(--granite-border-width-focus) solid var(--granite-color-focus);outline-offset:calc(var(--granite-border-width-focus) * -1)}: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-8)}: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-4);padding-bottom:var(--granite-spacing-4);padding-inline:var(--granite-spacing-8)}: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:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;justify-content:center;align-items:center;background-color:transparent;outline:none;border:none;cursor:pointer;margin-inline-start:var(--granite-spacing-4);margin-inline-end:0;padding:0}[dir=rtl] .granite-chip-remove{margin-inline-end:var(--granite-spacing-4);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"] }] }); }
|
|
3095
3107
|
}
|
|
3096
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3108
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteChipComponent, decorators: [{
|
|
3097
3109
|
type: Component,
|
|
3098
3110
|
args: [{ selector: `granite-chip, granite-input-chip`, standalone: false, inputs: ['tabIndex'], exportAs: 'graniteChip', host: {
|
|
3099
3111
|
class: 'granite-chip',
|
|
@@ -3649,10 +3661,10 @@ class GraniteChipListComponent extends GraniteChipListBase {
|
|
|
3649
3661
|
});
|
|
3650
3662
|
}
|
|
3651
3663
|
}
|
|
3652
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3653
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
3664
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", 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 }); }
|
|
3665
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteChipListComponent, isStandalone: false, selector: "granite-chip-list", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaOrientation: ["aria-orientation", "ariaOrientation"], role: "role", multiselect: "multiselect", disabled: "disabled", selectable: "selectable", tabindex: "tabindex" }, 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: [":host.granite-chip-list{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;place-content:center flex-start;align-items: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}:host ::ng-deep input.granite-chip-input{outline:none;border:none;background-color:transparent;color:var(--granite-color-text);margin:var(--granite-spacing-4)}:host ::ng-deep granite-icon{color:var(--granite-color-text);background-color:transparent}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3654
3666
|
}
|
|
3655
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3667
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteChipListComponent, decorators: [{
|
|
3656
3668
|
type: Component,
|
|
3657
3669
|
args: [{ selector: 'granite-chip-list', template: `<ng-content></ng-content>`, standalone: false, exportAs: 'graniteChipList', host: {
|
|
3658
3670
|
class: 'granite-chip-list',
|
|
@@ -3858,10 +3870,10 @@ class GraniteChipInputDirective {
|
|
|
3858
3870
|
return (!hasModifierKey(event) &&
|
|
3859
3871
|
new Set(this.graniteChipInputSeparatorKeyCodes).has(event.keyCode));
|
|
3860
3872
|
}
|
|
3861
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3862
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
3873
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteChipInputDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
3874
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteChipInputDirective, isStandalone: false, 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 }); }
|
|
3863
3875
|
}
|
|
3864
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3876
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteChipInputDirective, decorators: [{
|
|
3865
3877
|
type: Directive,
|
|
3866
3878
|
args: [{
|
|
3867
3879
|
selector: 'input[graniteChipInputFor]',
|
|
@@ -3904,15 +3916,15 @@ const CHIP_DECLARATIONS = [
|
|
|
3904
3916
|
GraniteChipInputDirective,
|
|
3905
3917
|
];
|
|
3906
3918
|
class GraniteChipsModule {
|
|
3907
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3908
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
3919
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3920
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteChipsModule, declarations: [GraniteChipListComponent,
|
|
3909
3921
|
GraniteChipComponent,
|
|
3910
3922
|
GraniteChipInputDirective], imports: [CommonModule, FormsModule, ReactiveFormsModule, GraniteIconModule], exports: [GraniteChipListComponent,
|
|
3911
3923
|
GraniteChipComponent,
|
|
3912
3924
|
GraniteChipInputDirective] }); }
|
|
3913
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
3925
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteChipsModule, imports: [CommonModule, FormsModule, ReactiveFormsModule, GraniteIconModule] }); }
|
|
3914
3926
|
}
|
|
3915
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3927
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteChipsModule, decorators: [{
|
|
3916
3928
|
type: NgModule,
|
|
3917
3929
|
args: [{
|
|
3918
3930
|
imports: [CommonModule, FormsModule, ReactiveFormsModule, GraniteIconModule],
|
|
@@ -3932,10 +3944,10 @@ class GraniteLabelComponent {
|
|
|
3932
3944
|
this.required = coerceBooleanProperty(changes.required.currentValue);
|
|
3933
3945
|
}
|
|
3934
3946
|
}
|
|
3935
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3936
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
3947
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3948
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteLabelComponent, isStandalone: false, 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{font:inherit;font-size:var(--granite-font-size-micro);color:var(--granite-color-text-weak);box-sizing:border-box}: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 }); }
|
|
3937
3949
|
}
|
|
3938
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3950
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteLabelComponent, decorators: [{
|
|
3939
3951
|
type: Component,
|
|
3940
3952
|
args: [{ selector: 'granite-label', standalone: false, exportAs: 'graniteLabel', host: {
|
|
3941
3953
|
class: 'granite-label',
|
|
@@ -3949,11 +3961,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
3949
3961
|
}] } });
|
|
3950
3962
|
|
|
3951
3963
|
class GraniteLabelModule {
|
|
3952
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3953
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
3954
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
3964
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3965
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteLabelModule, declarations: [GraniteLabelComponent], imports: [CommonModule], exports: [GraniteLabelComponent] }); }
|
|
3966
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteLabelModule, imports: [CommonModule] }); }
|
|
3955
3967
|
}
|
|
3956
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3968
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteLabelModule, decorators: [{
|
|
3957
3969
|
type: NgModule,
|
|
3958
3970
|
args: [{
|
|
3959
3971
|
declarations: [GraniteLabelComponent],
|
|
@@ -3973,10 +3985,10 @@ class ContactsTriggerDataComponent {
|
|
|
3973
3985
|
*/
|
|
3974
3986
|
this.panelId = `granite-contacts-panel-${contactsPanelUid++}`;
|
|
3975
3987
|
}
|
|
3976
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3977
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
3988
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ContactsTriggerDataComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
3989
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: ContactsTriggerDataComponent, isStandalone: true, viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0 }); }
|
|
3978
3990
|
}
|
|
3979
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3991
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ContactsTriggerDataComponent, decorators: [{
|
|
3980
3992
|
type: Directive,
|
|
3981
3993
|
args: [{}]
|
|
3982
3994
|
}], propDecorators: { templateRef: [{
|
|
@@ -3988,10 +4000,10 @@ class GraniteCustomStatusDirective {
|
|
|
3988
4000
|
constructor(templateRef) {
|
|
3989
4001
|
this.templateRef = templateRef;
|
|
3990
4002
|
}
|
|
3991
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3992
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
4003
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCustomStatusDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4004
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCustomStatusDirective, isStandalone: false, selector: "[graniteCustomStatus]", inputs: { graniteCustomStatus: "graniteCustomStatus" }, ngImport: i0 }); }
|
|
3993
4005
|
}
|
|
3994
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4006
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCustomStatusDirective, decorators: [{
|
|
3995
4007
|
type: Directive,
|
|
3996
4008
|
args: [{
|
|
3997
4009
|
selector: '[graniteCustomStatus]',
|
|
@@ -4005,10 +4017,10 @@ class GraniteCustomProfileDirective {
|
|
|
4005
4017
|
constructor(templateRef) {
|
|
4006
4018
|
this.templateRef = templateRef;
|
|
4007
4019
|
}
|
|
4008
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4009
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
4020
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCustomProfileDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4021
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCustomProfileDirective, isStandalone: false, selector: "[graniteCustomProfile]", ngImport: i0 }); }
|
|
4010
4022
|
}
|
|
4011
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4023
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCustomProfileDirective, decorators: [{
|
|
4012
4024
|
type: Directive,
|
|
4013
4025
|
args: [{
|
|
4014
4026
|
selector: '[graniteCustomProfile]',
|
|
@@ -4071,10 +4083,10 @@ class GraniteCustomAvatarStatusDirective {
|
|
|
4071
4083
|
constructor(templateRef) {
|
|
4072
4084
|
this.templateRef = templateRef;
|
|
4073
4085
|
}
|
|
4074
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4075
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
4086
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCustomAvatarStatusDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4087
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCustomAvatarStatusDirective, isStandalone: false, selector: "[graniteCustomAvatarStatus]", inputs: { graniteCustomAvatarStatus: "graniteCustomAvatarStatus" }, ngImport: i0 }); }
|
|
4076
4088
|
}
|
|
4077
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4089
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCustomAvatarStatusDirective, decorators: [{
|
|
4078
4090
|
type: Directive,
|
|
4079
4091
|
args: [{
|
|
4080
4092
|
selector: '[graniteCustomAvatarStatus]',
|
|
@@ -4109,10 +4121,10 @@ class GraniteAvatarDefaultStatusComponent {
|
|
|
4109
4121
|
}
|
|
4110
4122
|
}
|
|
4111
4123
|
}
|
|
4112
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4113
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4124
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteAvatarDefaultStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4125
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteAvatarDefaultStatusComponent, isStandalone: false, selector: "granite-avatar-default-status", inputs: { status: "status" }, host: { properties: { "class": "this.statusClass" }, classAttribute: "granite-avatar-default-status" }, ngImport: i0, template: '', isInline: true, styles: [":host{display:block;width:calc(var(--granite-size-base-rem)/2);height:calc(var(--granite-size-base-rem)/2);outline:var(--granite-border-width-focus) solid var(--granite-color-background);border-radius:100%}:host.available{background:var(--granite-color-signal-ok)}:host.do-not-disturb{background:var(--granite-color-signal-failure)}:host.disabled{background:var(--granite-color-signal-neutral)}:host.away{background:var(--granite-color-signal-warning)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4114
4126
|
}
|
|
4115
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4127
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteAvatarDefaultStatusComponent, decorators: [{
|
|
4116
4128
|
type: Component,
|
|
4117
4129
|
args: [{ selector: 'granite-avatar-default-status', host: {
|
|
4118
4130
|
class: 'granite-avatar-default-status',
|
|
@@ -4128,8 +4140,8 @@ class GraniteEmptyAvatarComponent {
|
|
|
4128
4140
|
constructor() {
|
|
4129
4141
|
this.ariaLabel = null;
|
|
4130
4142
|
}
|
|
4131
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4132
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4143
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteEmptyAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4144
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteEmptyAvatarComponent, isStandalone: false, selector: "granite-empty-avatar", inputs: { initials: "initials", ariaLabel: ["aria-label", "ariaLabel"] }, host: { classAttribute: "granite-empty-avatar" }, ngImport: i0, template: `
|
|
4133
4145
|
<div class="no-profile-avatar" [attr.aria-label]="ariaLabel" role="img">
|
|
4134
4146
|
<span
|
|
4135
4147
|
data-fnd="no-profile-avatar-initials"
|
|
@@ -4139,7 +4151,7 @@ class GraniteEmptyAvatarComponent {
|
|
|
4139
4151
|
</div>
|
|
4140
4152
|
`, isInline: true, styles: [":host{width:inherit;height:inherit}:host .no-profile-avatar{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;width:inherit;height:inherit;border-radius:100%;background:var(--granite-color-background-info);justify-content:center;align-items:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4141
4153
|
}
|
|
4142
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4154
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteEmptyAvatarComponent, decorators: [{
|
|
4143
4155
|
type: Component,
|
|
4144
4156
|
args: [{ selector: 'granite-empty-avatar', host: {
|
|
4145
4157
|
class: 'granite-empty-avatar',
|
|
@@ -4193,10 +4205,10 @@ class GraniteAvatarComponent extends ContactsTriggerDataComponent {
|
|
|
4193
4205
|
};
|
|
4194
4206
|
}, {});
|
|
4195
4207
|
}
|
|
4196
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4197
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
4208
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteAvatarComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4209
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.4", type: GraniteAvatarComponent, isStandalone: false, selector: "granite-avatar", inputs: { name: "name", firstName: "firstName", lastName: "lastName", avatar: "avatar", status: "status", ariaLabel: ["aria-label", "ariaLabel"] }, host: { classAttribute: "granite-avatar" }, queries: [{ propertyName: "_customStatusesQueryList", predicate: GraniteCustomAvatarStatusDirective }], exportAs: ["graniteAvatar"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<img\n data-fnd=\"profile-avatar\"\n *ngIf=\"avatar; else noProfileAvatar\"\n [src]=\"avatar\"\n alt=\"avatar\"\n class=\"profile-avatar profile-size\"\n [attr.aria-label]=\"avatarAriaLabel\"\n/>\n\n<ng-template #noProfileAvatar>\n <granite-empty-avatar\n class=\"profile-size\"\n [initials]=\"_nameInitials\"\n [aria-label]=\"avatarAriaLabel\"\n ></granite-empty-avatar>\n</ng-template>\n\n@if (status && _customStatusDirectives[status]) {\n <ng-container *ngTemplateOutlet=\"customStatus\"></ng-container>\n} @else if (status) {\n <ng-container *ngTemplateOutlet=\"defaultStatus\"></ng-container>\n}\n\n<ng-template #defaultStatus>\n <granite-avatar-default-status\n class=\"profile-default-status\"\n [attr.data-fnd]=\"status + '-status'\"\n [status]=\"status\"\n ></granite-avatar-default-status>\n</ng-template>\n\n<ng-template #customStatus>\n <div\n [attr.data-fnd]=\"'profile-status-custom'\"\n [class]=\"'profile-status-' + status\"\n class=\"profile-custom-status\"\n >\n <ng-container\n *ngTemplateOutlet=\"_customStatusDirectives[status]\"\n ></ng-container>\n </div>\n</ng-template>\n", styles: [":host .profile-default-status,:host .profile-custom-status{position:absolute;inset-inline-end:0;bottom:0}:host{display:block;position:relative;width:1.5rem;height:1.5rem;color:var(--granite-color-signal-info);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);object-fit:contain}:host .profile{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:center;margin-bottom:var(--granite-spacing-8);gap:var(--granite-spacing-4)}:host .profile-avatar{width:inherit;height:inherit;border-radius:50%}\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: GraniteAvatarDefaultStatusComponent, selector: "granite-avatar-default-status", inputs: ["status"] }, { kind: "component", type: GraniteEmptyAvatarComponent, selector: "granite-empty-avatar", inputs: ["initials", "aria-label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4198
4210
|
}
|
|
4199
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4211
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteAvatarComponent, decorators: [{
|
|
4200
4212
|
type: Component,
|
|
4201
4213
|
args: [{ selector: 'granite-avatar', exportAs: 'graniteAvatar', host: {
|
|
4202
4214
|
class: 'granite-avatar',
|
|
@@ -4220,10 +4232,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
4220
4232
|
}] } });
|
|
4221
4233
|
|
|
4222
4234
|
class GraniteContactsProfileComponent {
|
|
4223
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4224
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4235
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4236
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteContactsProfileComponent, isStandalone: false, selector: "granite-contacts-profile", inputs: { profile: "profile", profileClass: "profileClass" }, host: { classAttribute: "granite-contacts-profile" }, ngImport: i0, template: "<div [class]=\"profileClass\" data-fnd=\"profile\" class=\"profile\">\n <granite-avatar\n data-fnd=\"profile-avatar\"\n class=\"profile-avatar\"\n [firstName]=\"profile.firstName\"\n [lastName]=\"profile.lastName\"\n [avatar]=\"profile.avatar\"\n ></granite-avatar>\n\n <ng-template #noProfileAvatar>\n <div class=\"no-profile-avatar\">\n <span\n data-fnd=\"no-profile-avatar-initials\"\n class=\"no-profile-avatar-initials\"\n >{{ profile?.initials }}</span\n >\n </div>\n </ng-template>\n\n <div class=\"profile-info\">\n <p data-fnd=\"profile-info-names\" class=\"profile-info-names\">\n {{ profile?.firstName }} {{ profile?.lastName }}\n </p>\n <p data-fnd=\"profile-info-job-title\" class=\"profile-info-job-title\">\n {{ profile?.jobTitle }}\n </p>\n </div>\n</div>\n", styles: [".profile{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;align-items:center;margin-bottom:var(--granite-spacing-8);gap:var(--granite-spacing-4)}.profile-avatar{width:3rem;height:3rem;border-radius:50%}.profile-info{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--granite-spacing-8)}.profile-info-names{color:var(--granite-color-text);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);margin:0}.profile-info-job-title{color:var(--granite-color-text-hint);font-size:var(--granite-font-size-body-small);margin:0}.no-profile-avatar{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;width:3rem;height:3rem;border-radius:360px;background:var(--granite-color-background-info);justify-content:center;align-items:center}.no-profile-avatar-initials{font-size:var(--granite-font-size-micro);color:var(--granite-color-signal-info);font-weight:var(--granite-font-weight-regular)}\n"], dependencies: [{ kind: "component", type: GraniteAvatarComponent, selector: "granite-avatar", inputs: ["name", "firstName", "lastName", "avatar", "status", "aria-label"], exportAs: ["graniteAvatar"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4225
4237
|
}
|
|
4226
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4238
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsProfileComponent, decorators: [{
|
|
4227
4239
|
type: Component,
|
|
4228
4240
|
args: [{ selector: 'granite-contacts-profile', host: {
|
|
4229
4241
|
class: 'granite-contacts-profile',
|
|
@@ -4247,10 +4259,10 @@ class ContactItemDefaultStatusComponent {
|
|
|
4247
4259
|
constructor() {
|
|
4248
4260
|
this.CONTACT_STATUS = CONTACT_DEFAULT_STATUS;
|
|
4249
4261
|
}
|
|
4250
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4251
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4262
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ContactItemDefaultStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4263
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: ContactItemDefaultStatusComponent, isStandalone: false, selector: "granite-contact-item-default-status", inputs: { status: "status" }, host: { classAttribute: "granite-contact-item-default-status" }, ngImport: i0, template: "<ng-container [ngSwitch]=\"status\">\n <ng-container *ngSwitchCase=\"CONTACT_STATUS.AVAILABLE\">\n <svg\n data-fnd=\"available\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"9\"\n height=\"10\"\n viewBox=\"0 0 9 10\"\n fill=\"none\"\n >\n <path\n d=\"M4.085 0.915009C1.83008 0.915009 0 2.74509 0 5.00001C0 7.25493 1.83008 9.08501 4.085 9.08501C6.33992 9.08501 8.17 7.25493 8.17 5.00001C8.17 2.74509 6.33992 0.915009 4.085 0.915009Z\"\n fill=\"#17A511\"\n />\n <path\n d=\"M2.45099 4.82838L3.47224 6.06418L5.51474 4.21048\"\n stroke=\"white\"\n stroke-linecap=\"round\"\n />\n </svg>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"CONTACT_STATUS.BUSY\">\n <svg\n data-fnd=\"busy\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"9\"\n height=\"9\"\n viewBox=\"0 0 9 9\"\n fill=\"none\"\n >\n <path\n d=\"M4.25504 0.169922C2.00012 0.169922 0.170044 2 0.170044 4.25492C0.170044 6.50984 2.00012 8.33992 4.25504 8.33992C6.50996 8.33992 8.34004 6.50984 8.34004 4.25492C8.34004 2 6.50996 0.169922 4.25504 0.169922Z\"\n fill=\"#D23335\"\n />\n </svg>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"CONTACT_STATUS.DO_NOT_DISTURB\">\n <svg\n data-fnd=\"doNotDisturb\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"9\"\n height=\"9\"\n viewBox=\"0 0 9 9\"\n fill=\"none\"\n >\n <path\n d=\"M4.085 0C1.83008 0 0 1.83008 0 4.085C0 6.33992 1.83008 8.17 4.085 8.17C6.33992 8.17 8.17 6.33992 8.17 4.085C8.17 1.83008 6.33992 0 4.085 0Z\"\n fill=\"#D23335\"\n />\n <path d=\"M2 4L6 4\" stroke=\"white\" stroke-linecap=\"round\" />\n </svg>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"CONTACT_STATUS.AWAY\">\n <svg\n data-fnd=\"away\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"9\"\n height=\"9\"\n viewBox=\"0 0 9 9\"\n fill=\"none\"\n >\n <path\n d=\"M4.085 0C1.83008 0 0 1.83008 0 4.085C0 6.33992 1.83008 8.17 4.085 8.17C6.33992 8.17 8.17 6.33992 8.17 4.085C8.17 1.83008 6.33992 0 4.085 0Z\"\n fill=\"#EDA000\"\n />\n <path d=\"M4 2L4 3.875L5.5 5.5\" stroke=\"white\" stroke-linecap=\"round\" />\n </svg>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"CONTACT_STATUS.OFFLINE\">\n <svg\n data-fnd=\"offline\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"9\"\n height=\"9\"\n viewBox=\"0 0 9 9\"\n fill=\"none\"\n >\n <path\n d=\"M0.5 4.085C0.5 2.10622 2.10622 0.5 4.085 0.5C6.06378 0.5 7.67 2.10622 7.67 4.085C7.67 6.06378 6.06378 7.67 4.085 7.67C2.10622 7.67 0.5 6.06378 0.5 4.085Z\"\n stroke=\"#7D7D7D\"\n />\n <path d=\"M3 3L5 5\" stroke=\"#7D7D7D\" stroke-linecap=\"round\" />\n <path d=\"M5 3L3 5\" stroke=\"#7D7D7D\" stroke-linecap=\"round\" />\n </svg>\n </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4252
4264
|
}
|
|
4253
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4265
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ContactItemDefaultStatusComponent, decorators: [{
|
|
4254
4266
|
type: Component,
|
|
4255
4267
|
args: [{ selector: 'granite-contact-item-default-status', host: {
|
|
4256
4268
|
class: 'granite-contact-item-default-status',
|
|
@@ -4260,10 +4272,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
4260
4272
|
}] } });
|
|
4261
4273
|
|
|
4262
4274
|
class GraniteContactItemTitleComponent {
|
|
4263
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4264
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4275
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactItemTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4276
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteContactItemTitleComponent, isStandalone: false, selector: "granite-contact-item-title", inputs: { contact: "contact" }, host: { classAttribute: "granite-contact-item-title" }, ngImport: i0, template: "<button\n tabindex=\"0\"\n data-fnd=\"contact-item-title\"\n [class.title-status-active]=\"!contact.disabled && !contact.options\"\n [class.title-status-disabled]=\"contact.disabled\"\n [class.title-status-parent]=\"!contact.disabled && contact.options\"\n>\n {{ contact.label }}\n</button>\n", styles: [".title-status-parent,.title-status-disabled,.title-status-active{font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular)}.title-status-active{color:var(--granite-color-text-link)}.title-status-active:hover{text-decoration:underline;cursor:pointer}.title-status-disabled{color:var(--granite-color-text-hint)}.title-status-parent{color:var(--granite-color-text)}button{all:unset}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4265
4277
|
}
|
|
4266
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4278
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactItemTitleComponent, decorators: [{
|
|
4267
4279
|
type: Component,
|
|
4268
4280
|
args: [{ selector: 'granite-contact-item-title', host: {
|
|
4269
4281
|
class: 'granite-contact-item-title',
|
|
@@ -4279,10 +4291,10 @@ class GraniteContactItemComponent {
|
|
|
4279
4291
|
emitSelectedContact(selectedContact) {
|
|
4280
4292
|
this.selectedContact.emit(selectedContact);
|
|
4281
4293
|
}
|
|
4282
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4283
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4294
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4295
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteContactItemComponent, isStandalone: false, selector: "granite-contact-item", inputs: { contact: "contact" }, outputs: { selectedContact: "selectedContact" }, host: { classAttribute: "granite-contact-item" }, ngImport: i0, template: "<div class=\"contact-item\" [attr.data-fnd]=\"contact.name\">\n <div class=\"contact-item-main\">\n <ng-container\n *ngTemplateOutlet=\"\n contactItem;\n context: {\n contact: contact,\n testName: 'contact',\n selectedContactOutput: { contact }\n }\n \"\n ></ng-container>\n </div>\n\n <ul *ngIf=\"contact.options\" class=\"contact-item-options\">\n <li\n tabindex=\"0\"\n *ngFor=\"let option of contact.options; let i = index\"\n class=\"option-item\"\n [attr.data-fnd]=\"'contact-option-' + i\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n contactItem;\n context: {\n contact: option,\n testName: 'contact-option-' + i,\n selectedContactOutput: { contact: option, parent: contact }\n }\n \"\n ></ng-container>\n </li>\n </ul>\n</div>\n\n<ng-template\n let-testName=\"testName\"\n let-contact=\"contact\"\n let-selectedContactOutput=\"selectedContactOutput\"\n #contactItem\n>\n <granite-icon\n [attr.data-fnd]=\"testName + '-icon'\"\n fontIcon=\"{{ contact.iconName }}\"\n ></granite-icon>\n\n <granite-contact-item-title\n [attr.data-fnd]=\"testName + '-title'\"\n tabindex=\"0\"\n [contact]=\"contact\"\n [class.contact-item-disabled]=\"contact.options || contact.disabled\"\n (click)=\"emitSelectedContact(selectedContactOutput)\"\n ></granite-contact-item-title>\n\n <ng-container *ngIf=\"contact.statusTemplate; else defaultStatus\">\n <ng-container *ngTemplateOutlet=\"contact.statusTemplate\"></ng-container>\n </ng-container>\n\n <ng-template #defaultStatus>\n <granite-contact-item-default-status\n [attr.data-fnd]=\"testName + '-status'\"\n [status]=\"contact.status\"\n ></granite-contact-item-default-status>\n </ng-template>\n</ng-template>\n", styles: [".contact-item{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--granite-spacing-8)}.contact-item-main{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;gap:var(--granite-spacing-8);align-self:stretch;align-items:center}.contact-item-disabled{pointer-events:none}.contact-item-options{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding-inline-start:var(--granite-spacing-24);gap:var(--granite-spacing-8);list-style:none}.contact-item-options .option-item{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;gap:var(--granite-spacing-8);align-self:stretch;align-items:center}.contact-item granite-contact-item-title,.contact-item granite-contact-item-default-status{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}granite-icon{padding:0;color:var(--granite-color-text-hint);width:var(--granite-size-base-rem);height:var(--granite-size-base-rem)}\n"], dependencies: [{ kind: "component", type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: ContactItemDefaultStatusComponent, selector: "granite-contact-item-default-status", inputs: ["status"] }, { kind: "component", type: GraniteContactItemTitleComponent, selector: "granite-contact-item-title", inputs: ["contact"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4284
4296
|
}
|
|
4285
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4297
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactItemComponent, decorators: [{
|
|
4286
4298
|
type: Component,
|
|
4287
4299
|
args: [{ selector: 'granite-contact-item', host: {
|
|
4288
4300
|
class: 'granite-contact-item',
|
|
@@ -4348,10 +4360,10 @@ class GraniteContactsComponent extends ContactsTriggerDataComponent {
|
|
|
4348
4360
|
avatar: profile.avatar,
|
|
4349
4361
|
};
|
|
4350
4362
|
}
|
|
4351
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4352
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4363
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4364
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteContactsComponent, isStandalone: false, selector: "granite-contacts", inputs: { contacts: "contacts", contactsClass: "contactsClass", profile: "profile", profileClass: "profileClass", defaultShow: "defaultShow" }, outputs: { selectedContact: "selectedContact" }, host: { classAttribute: "granite-contacts" }, queries: [{ propertyName: "customProfileDirective", first: true, predicate: GraniteCustomProfileDirective, descendants: true }, { propertyName: "_customStatuses", predicate: GraniteCustomStatusDirective }], exportAs: ["graniteContacts"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-template #contactsTemplate>\n <div data-fnd=\"contacts\" [class]=\"contactsClass\" class=\"granite-contact\">\n <ng-container *ngIf=\"customProfileDirective; else defaultProfile\">\n <ng-container\n *ngTemplateOutlet=\"customProfileDirective.templateRef\"\n ></ng-container>\n </ng-container>\n\n <ng-template #defaultProfile>\n <granite-contacts-profile\n data-fnd=\"default-profile\"\n [profileClass]=\"profileClass\"\n [profile]=\"_profile\"\n ></granite-contacts-profile>\n </ng-template>\n\n <ul class=\"contact-list\">\n <li *ngFor=\"let contact of _contactsExtended\">\n <granite-contact-item\n [contact]=\"contact\"\n (selectedContact)=\"onSelectedContact($event)\"\n ></granite-contact-item>\n </li>\n </ul>\n </div>\n</ng-template>\n\n<ng-container *ngIf=\"defaultShow\">\n <ng-container *ngTemplateOutlet=\"contactsTemplate\"></ng-container>\n</ng-container>\n", styles: [".granite-contact{display:inline-block;font-size:var(--granite-font-size-body);font-family:var(--granite-font-family-default);color:var(--granite-color-text-weak);height:fit-content;min-width:10rem;max-width:20rem;padding:var(--granite-spacing-16);box-shadow:var(--granite-shadow-popover);background:var(--granite-color-background-variant)}.granite-contact .contact-list{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;align-items:flex-start;gap:var(--granite-spacing-8);list-style-type:none;padding:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: GraniteContactsProfileComponent, selector: "granite-contacts-profile", inputs: ["profile", "profileClass"] }, { kind: "component", type: GraniteContactItemComponent, selector: "granite-contact-item", inputs: ["contact"], outputs: ["selectedContact"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4353
4365
|
}
|
|
4354
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4366
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsComponent, decorators: [{
|
|
4355
4367
|
type: Component,
|
|
4356
4368
|
args: [{ selector: 'granite-contacts', exportAs: 'graniteContacts', host: {
|
|
4357
4369
|
class: 'granite-contacts',
|
|
@@ -4562,10 +4574,10 @@ class GraniteContactsTriggerForDirective {
|
|
|
4562
4574
|
_touchPositionStrategy() {
|
|
4563
4575
|
return this._overlay.position().global();
|
|
4564
4576
|
}
|
|
4565
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4566
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
4577
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsTriggerForDirective, deps: [{ token: i1$2.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i1$2.OverlayOutsideClickDispatcher }, { token: GRANITE_CLIENT_INPUT, optional: true }, { token: GRANITE_CLIENT_OUTPUT, optional: true }, { token: i3.Directionality, optional: true }, { token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4578
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteContactsTriggerForDirective, isStandalone: false, selector: "[graniteContactsTriggerFor]", inputs: { contacts: ["graniteContactsTriggerFor", "contacts"] }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "keydown": "_handleKeydown($event)", "click": "_handleClick($event)" }, properties: { "attr.aria-expanded": "_isContactsOpen || null", "attr.aria-controls": "_isContactsOpen ? contacts.panelId : null" }, classAttribute: "granite-contacts-trigger" }, ngImport: i0 }); }
|
|
4567
4579
|
}
|
|
4568
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4580
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsTriggerForDirective, decorators: [{
|
|
4569
4581
|
type: Directive,
|
|
4570
4582
|
args: [{
|
|
4571
4583
|
selector: `[graniteContactsTriggerFor]`,
|
|
@@ -4597,17 +4609,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
4597
4609
|
}] } });
|
|
4598
4610
|
|
|
4599
4611
|
class GraniteAvatarModule {
|
|
4600
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4601
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
4612
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
4613
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteAvatarModule, declarations: [GraniteAvatarComponent,
|
|
4602
4614
|
GraniteAvatarDefaultStatusComponent,
|
|
4603
4615
|
GraniteCustomAvatarStatusDirective,
|
|
4604
4616
|
GraniteEmptyAvatarComponent], imports: [CommonModule], exports: [GraniteAvatarComponent,
|
|
4605
4617
|
GraniteAvatarDefaultStatusComponent,
|
|
4606
4618
|
GraniteCustomAvatarStatusDirective,
|
|
4607
4619
|
GraniteEmptyAvatarComponent] }); }
|
|
4608
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
4620
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteAvatarModule, imports: [CommonModule] }); }
|
|
4609
4621
|
}
|
|
4610
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4622
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteAvatarModule, decorators: [{
|
|
4611
4623
|
type: NgModule,
|
|
4612
4624
|
args: [{
|
|
4613
4625
|
imports: [CommonModule],
|
|
@@ -4627,8 +4639,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
4627
4639
|
}] });
|
|
4628
4640
|
|
|
4629
4641
|
class GraniteContactsModule {
|
|
4630
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4631
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
4642
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
4643
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsModule, declarations: [GraniteContactsComponent,
|
|
4632
4644
|
GraniteContactsProfileComponent,
|
|
4633
4645
|
GraniteContactItemComponent,
|
|
4634
4646
|
ContactItemDefaultStatusComponent,
|
|
@@ -4640,9 +4652,9 @@ class GraniteContactsModule {
|
|
|
4640
4652
|
GraniteContactItemComponent,
|
|
4641
4653
|
GraniteCustomStatusDirective,
|
|
4642
4654
|
GraniteCustomProfileDirective] }); }
|
|
4643
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
4655
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsModule, imports: [GraniteIconModule, GraniteAvatarModule, CommonModule] }); }
|
|
4644
4656
|
}
|
|
4645
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4657
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteContactsModule, decorators: [{
|
|
4646
4658
|
type: NgModule,
|
|
4647
4659
|
args: [{
|
|
4648
4660
|
imports: [GraniteIconModule, GraniteAvatarModule, CommonModule],
|
|
@@ -4734,10 +4746,10 @@ class GraniteHideOnOverflowDirective {
|
|
|
4734
4746
|
this.mutationObserver.disconnect();
|
|
4735
4747
|
}
|
|
4736
4748
|
}
|
|
4737
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4738
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
4749
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteHideOnOverflowDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4750
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteHideOnOverflowDirective, isStandalone: false, selector: "[graniteHideOnOverflow]", exportAs: ["graniteHideOnOverflow"], ngImport: i0 }); }
|
|
4739
4751
|
}
|
|
4740
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4752
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteHideOnOverflowDirective, decorators: [{
|
|
4741
4753
|
type: Directive,
|
|
4742
4754
|
args: [{
|
|
4743
4755
|
selector: '[graniteHideOnOverflow]',
|
|
@@ -4751,10 +4763,10 @@ class OverlayBaseComponent {
|
|
|
4751
4763
|
this.xPosition = 'after';
|
|
4752
4764
|
this.yPosition = 'below';
|
|
4753
4765
|
}
|
|
4754
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4755
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
4766
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: OverlayBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4767
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: OverlayBaseComponent, isStandalone: true, viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0 }); }
|
|
4756
4768
|
}
|
|
4757
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4769
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: OverlayBaseComponent, decorators: [{
|
|
4758
4770
|
type: Directive,
|
|
4759
4771
|
args: [{}]
|
|
4760
4772
|
}], propDecorators: { templateRef: [{
|
|
@@ -4769,10 +4781,10 @@ class LegendBaseComponent extends OverlayBaseComponent {
|
|
|
4769
4781
|
this.panelId = `granite-progress-bar-legend-panel-${legendPanelUid++}`;
|
|
4770
4782
|
this.xPosition = 'before';
|
|
4771
4783
|
}
|
|
4772
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4773
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
4784
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: LegendBaseComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4785
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: LegendBaseComponent, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
|
|
4774
4786
|
}
|
|
4775
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4787
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: LegendBaseComponent, decorators: [{
|
|
4776
4788
|
type: Directive
|
|
4777
4789
|
}] });
|
|
4778
4790
|
|
|
@@ -4781,10 +4793,10 @@ class GraniteProgressBarLegendComponent extends LegendBaseComponent {
|
|
|
4781
4793
|
super(...arguments);
|
|
4782
4794
|
this.legendItems = [];
|
|
4783
4795
|
}
|
|
4784
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4785
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4796
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarLegendComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
4797
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteProgressBarLegendComponent, isStandalone: false, selector: "granite-progress-bar-legend", inputs: { legendItems: "legendItems" }, usesInheritance: true, ngImport: i0, template: "<ng-template>\n <div class=\"legend\" data-fnd=\"legend\">\n <div\n *ngFor=\"let item of legendItems\"\n class=\"legend-item\"\n data-fnd=\"legend-item\"\n >\n <div class=\"legend-label-text\">{{ item.label }}</div>\n <div\n [style.background-color]=\"item.backgroundColor\"\n class=\"color-box\"\n ></div>\n </div>\n </div>\n</ng-template>\n", styles: [".legend{display:flex;flex-direction:column;align-items:flex-start;padding:var(--granite-spacing-8);gap:var(--granite-spacing-8);background-color:var(--granite-color-background-page);border:solid var(--granite-border-width-regular) var(--granite-color-border-contrast);border-radius:var(--granite-radius-s);height:fit-content}.legend-item{display:flex;align-items:center;justify-content:space-between;align-self:stretch;flex-wrap:wrap;padding:0 var(--granite-spacing-4);gap:var(--granite-spacing-8)}.legend-label-text{font-size:var(--granite-font-size-body-small);line-height:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);color:var(--granite-color-text);width:max-content}.color-box{width:8px;height:8px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4786
4798
|
}
|
|
4787
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4799
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarLegendComponent, decorators: [{
|
|
4788
4800
|
type: Component,
|
|
4789
4801
|
args: [{ selector: 'granite-progress-bar-legend', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template>\n <div class=\"legend\" data-fnd=\"legend\">\n <div\n *ngFor=\"let item of legendItems\"\n class=\"legend-item\"\n data-fnd=\"legend-item\"\n >\n <div class=\"legend-label-text\">{{ item.label }}</div>\n <div\n [style.background-color]=\"item.backgroundColor\"\n class=\"color-box\"\n ></div>\n </div>\n </div>\n</ng-template>\n", styles: [".legend{display:flex;flex-direction:column;align-items:flex-start;padding:var(--granite-spacing-8);gap:var(--granite-spacing-8);background-color:var(--granite-color-background-page);border:solid var(--granite-border-width-regular) var(--granite-color-border-contrast);border-radius:var(--granite-radius-s);height:fit-content}.legend-item{display:flex;align-items:center;justify-content:space-between;align-self:stretch;flex-wrap:wrap;padding:0 var(--granite-spacing-4);gap:var(--granite-spacing-8)}.legend-label-text{font-size:var(--granite-font-size-body-small);line-height:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);color:var(--granite-color-text);width:max-content}.color-box{width:8px;height:8px}\n"] }]
|
|
4790
4802
|
}], propDecorators: { legendItems: [{
|
|
@@ -4864,10 +4876,10 @@ class OverlayService {
|
|
|
4864
4876
|
}
|
|
4865
4877
|
});
|
|
4866
4878
|
}
|
|
4867
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4868
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
4879
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: OverlayService, deps: [{ token: i1$2.Overlay }, { token: i1.FocusMonitor }, { token: i1$2.OverlayOutsideClickDispatcher }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
4880
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: OverlayService, providedIn: 'root' }); }
|
|
4869
4881
|
}
|
|
4870
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4882
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: OverlayService, decorators: [{
|
|
4871
4883
|
type: Injectable,
|
|
4872
4884
|
args: [{
|
|
4873
4885
|
providedIn: 'root',
|
|
@@ -4973,10 +4985,10 @@ class GraniteOverlayTriggerForBaseDirective {
|
|
|
4973
4985
|
}
|
|
4974
4986
|
this._overlayService.closeOverlay(this._overlayRef, this._element);
|
|
4975
4987
|
}
|
|
4976
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4977
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
4988
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteOverlayTriggerForBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
4989
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteOverlayTriggerForBaseDirective, isStandalone: false, selector: "[graniteOverlayTriggerForBase]", ngImport: i0 }); }
|
|
4978
4990
|
}
|
|
4979
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4991
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteOverlayTriggerForBaseDirective, decorators: [{
|
|
4980
4992
|
type: Directive,
|
|
4981
4993
|
args: [{
|
|
4982
4994
|
selector: '[graniteOverlayTriggerForBase]',
|
|
@@ -5019,10 +5031,10 @@ class GraniteProgressBarLegendTriggerForDirective extends GraniteOverlayTriggerF
|
|
|
5019
5031
|
getScrollStrategy() {
|
|
5020
5032
|
return this.setScrollStrategy('reposition');
|
|
5021
5033
|
}
|
|
5022
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5023
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
5034
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarLegendTriggerForDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
5035
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteProgressBarLegendTriggerForDirective, isStandalone: false, selector: "[graniteProgressBarLegendTriggerFor]", inputs: { legend: ["graniteProgressBarLegendTriggerFor", "legend"] }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "keydown": "handleKeydown($event)", "click": "handleClick($event)" }, properties: { "attr.aria-expanded": "isLegendOpen || null", "attr.aria-controls": "isLegendOpen ? legend.panelId : null" }, classAttribute: "granite-progress-bar-legend-trigger" }, usesInheritance: true, ngImport: i0 }); }
|
|
5024
5036
|
}
|
|
5025
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5037
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarLegendTriggerForDirective, decorators: [{
|
|
5026
5038
|
type: Directive,
|
|
5027
5039
|
args: [{
|
|
5028
5040
|
selector: '[graniteProgressBarLegendTriggerFor]',
|
|
@@ -5106,10 +5118,10 @@ class GraniteProgressBarComponent {
|
|
|
5106
5118
|
this.setLegendItems();
|
|
5107
5119
|
}
|
|
5108
5120
|
}
|
|
5109
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5110
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5121
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5122
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteProgressBarComponent, isStandalone: false, selector: "granite-progress-bar", inputs: { progressBarData: "progressBarData", legendData: "legendData", showLabel: "showLabel", showLegend: "showLegend" }, host: { properties: { "class.label-present": "showLabel" } }, exportAs: ["graniteProgressBar"], usesOnChanges: true, ngImport: i0, template: "<div\n role=\"progressbar\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n class=\"progress\"\n [style.background-color]=\"getBackgroundColor()\"\n>\n <div\n *ngFor=\"let bar of progressBarData; let i = index\"\n [style.background-color]=\"getStackColor(bar.backgroundColor)\"\n [style.width]=\"getStringOfWidth(getWidth(bar.value))\"\n [style.color]=\"getFontColor(bar.foregroundColor)\"\n [graniteTooltipTriggerFor]=\"tooltip\"\n class=\"progress-bar\"\n >\n <label *ngIf=\"showLabel\" graniteHideOnOverflow>{{ bar.valueLabel }}</label>\n <granite-tooltip #tooltip> {{ bar.valueLabel }} </granite-tooltip>\n </div>\n</div>\n\n<ng-container *ngIf=\"showLegend\">\n <button\n graniteFlatButton\n [graniteProgressBarLegendTriggerFor]=\"legend\"\n class=\"legend-btn\"\n >\n <granite-icon fontIcon=\"icon-caret-down\"></granite-icon>\n </button>\n</ng-container>\n\n<granite-progress-bar-legend\n #legend\n [legendItems]=\"legendItems\"\n></granite-progress-bar-legend>\n", styles: [":host{width:100%;display:flex;align-items:center;box-sizing:border-box;height:.5rem;border-radius:var(--granite-radius-m);font-size:var(--granite-font-size-body-small);line-height:var(--granite-font-size-body-small)}:host(.label-present){height:auto!important}.progress{display:flex;width:inherit;height:inherit;overflow:hidden;border-radius:inherit;background-color:var(--granite-color-background-selected)}.progress-bar{display:flex;align-items:center;box-sizing:border-box;width:inherit;height:inherit;line-height:inherit;font-size:inherit;vertical-align:middle;text-overflow:ellipsis;white-space:nowrap;color:var(--granite-color-text);overflow:hidden;text-align:center;justify-content:center}.progress-bar label{width:100%;padding:var(--granite-spacing-4) 0}.legend-btn{width:16px;height:16px;margin-inline-start:var(--granite-spacing-16)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: GraniteHideOnOverflowDirective, selector: "[graniteHideOnOverflow]", exportAs: ["graniteHideOnOverflow"] }, { kind: "component", type: i3$1.GraniteTooltipComponent, selector: "granite-tooltip" }, { kind: "directive", type: i3$1.GraniteTooltipTriggerForDirective, selector: "[graniteTooltipTriggerFor]", inputs: ["graniteTooltipTriggerFor", "hideDelay", "showDelay", "showOnKeyboardFocus", "showOnClick"] }, { kind: "component", type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }, { kind: "component", type: GraniteButtonComponent, selector: "button[graniteButton],\n button[granitePrimaryButton],\n button[graniteFlatButton],\n button[graniteToolbarButton]\n ", inputs: ["disabled", "toggled"], exportAs: ["graniteButton"] }, { kind: "component", type: GraniteProgressBarLegendComponent, selector: "granite-progress-bar-legend", inputs: ["legendItems"] }, { kind: "directive", type: GraniteProgressBarLegendTriggerForDirective, selector: "[graniteProgressBarLegendTriggerFor]", inputs: ["graniteProgressBarLegendTriggerFor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5111
5123
|
}
|
|
5112
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarComponent, decorators: [{
|
|
5113
5125
|
type: Component,
|
|
5114
5126
|
args: [{ selector: 'granite-progress-bar', exportAs: 'graniteProgressBar', host: {
|
|
5115
5127
|
'[class.label-present]': 'showLabel',
|
|
@@ -5129,15 +5141,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5129
5141
|
* should be adapted for desktop devices like personal computers.
|
|
5130
5142
|
*/
|
|
5131
5143
|
class ClientOutputDesktopDirective {
|
|
5132
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5133
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
5144
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ClientOutputDesktopDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
5145
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: ClientOutputDesktopDirective, isStandalone: false, selector: "[graniteClientOutputDesktop]", providers: [
|
|
5134
5146
|
{
|
|
5135
5147
|
provide: GRANITE_CLIENT_OUTPUT,
|
|
5136
5148
|
useValue: deviceDesktop.output,
|
|
5137
5149
|
},
|
|
5138
5150
|
], ngImport: i0 }); }
|
|
5139
5151
|
}
|
|
5140
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5152
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ClientOutputDesktopDirective, decorators: [{
|
|
5141
5153
|
type: Directive,
|
|
5142
5154
|
args: [{
|
|
5143
5155
|
selector: `[graniteClientOutputDesktop]`,
|
|
@@ -5156,15 +5168,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5156
5168
|
* should be adapted for touch devices like mobiles and tablets.
|
|
5157
5169
|
*/
|
|
5158
5170
|
class ClientOutputTouchDirective {
|
|
5159
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5160
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
5171
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ClientOutputTouchDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
5172
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: ClientOutputTouchDirective, isStandalone: false, selector: "[graniteClientOutputTouch]", providers: [
|
|
5161
5173
|
{
|
|
5162
5174
|
provide: GRANITE_CLIENT_OUTPUT,
|
|
5163
5175
|
useValue: deviceTouch.output,
|
|
5164
5176
|
},
|
|
5165
5177
|
], ngImport: i0 }); }
|
|
5166
5178
|
}
|
|
5167
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5179
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ClientOutputTouchDirective, decorators: [{
|
|
5168
5180
|
type: Directive,
|
|
5169
5181
|
args: [{
|
|
5170
5182
|
selector: `[graniteClientOutputTouch]`,
|
|
@@ -5183,15 +5195,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5183
5195
|
* should be adapted for desktop devices, like personal computers.
|
|
5184
5196
|
*/
|
|
5185
5197
|
class ClientInputDesktopDirective {
|
|
5186
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5187
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
5198
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ClientInputDesktopDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
5199
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: ClientInputDesktopDirective, isStandalone: false, selector: "[graniteClientInputDesktop]", providers: [
|
|
5188
5200
|
{
|
|
5189
5201
|
provide: GRANITE_CLIENT_INPUT,
|
|
5190
5202
|
useValue: deviceDesktop.input,
|
|
5191
5203
|
},
|
|
5192
5204
|
], ngImport: i0 }); }
|
|
5193
5205
|
}
|
|
5194
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5206
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ClientInputDesktopDirective, decorators: [{
|
|
5195
5207
|
type: Directive,
|
|
5196
5208
|
args: [{
|
|
5197
5209
|
selector: `[graniteClientInputDesktop]`,
|
|
@@ -5210,15 +5222,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5210
5222
|
* should be adapted for touch devices, like mobiles and tablets.
|
|
5211
5223
|
*/
|
|
5212
5224
|
class ClientInputTouchDirective {
|
|
5213
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5214
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
5225
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ClientInputTouchDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
5226
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: ClientInputTouchDirective, isStandalone: false, selector: "[graniteClientInputTouch]", providers: [
|
|
5215
5227
|
{
|
|
5216
5228
|
provide: GRANITE_CLIENT_INPUT,
|
|
5217
5229
|
useValue: deviceTouch.input,
|
|
5218
5230
|
},
|
|
5219
5231
|
], ngImport: i0 }); }
|
|
5220
5232
|
}
|
|
5221
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5233
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ClientInputTouchDirective, decorators: [{
|
|
5222
5234
|
type: Directive,
|
|
5223
5235
|
args: [{
|
|
5224
5236
|
selector: `[graniteClientInputTouch]`,
|
|
@@ -5234,8 +5246,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5234
5246
|
|
|
5235
5247
|
// TODO: Move client devices into a separate module
|
|
5236
5248
|
class GraniteCoreModule {
|
|
5237
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5238
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
5249
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCoreModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5250
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteCoreModule, declarations: [ClientOutputDesktopDirective,
|
|
5239
5251
|
ClientOutputTouchDirective,
|
|
5240
5252
|
ClientInputDesktopDirective,
|
|
5241
5253
|
ClientInputTouchDirective,
|
|
@@ -5245,9 +5257,9 @@ class GraniteCoreModule {
|
|
|
5245
5257
|
ClientInputDesktopDirective,
|
|
5246
5258
|
ClientInputTouchDirective,
|
|
5247
5259
|
GraniteHideOnOverflowDirective] }); }
|
|
5248
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
5260
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCoreModule }); }
|
|
5249
5261
|
}
|
|
5250
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5262
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCoreModule, decorators: [{
|
|
5251
5263
|
type: NgModule,
|
|
5252
5264
|
args: [{
|
|
5253
5265
|
declarations: [
|
|
@@ -5269,21 +5281,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5269
5281
|
}] });
|
|
5270
5282
|
|
|
5271
5283
|
class GraniteProgressBarModule {
|
|
5272
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5273
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
5284
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5285
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarModule, declarations: [GraniteProgressBarComponent,
|
|
5274
5286
|
GraniteProgressBarLegendComponent,
|
|
5275
5287
|
GraniteProgressBarLegendTriggerForDirective], imports: [CommonModule,
|
|
5276
5288
|
GraniteCoreModule,
|
|
5277
5289
|
GraniteTooltipModule,
|
|
5278
5290
|
GraniteIconModule,
|
|
5279
5291
|
GraniteButtonModule], exports: [GraniteProgressBarComponent] }); }
|
|
5280
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
5292
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarModule, imports: [CommonModule,
|
|
5281
5293
|
GraniteCoreModule,
|
|
5282
5294
|
GraniteTooltipModule,
|
|
5283
5295
|
GraniteIconModule,
|
|
5284
5296
|
GraniteButtonModule] }); }
|
|
5285
5297
|
}
|
|
5286
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5298
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteProgressBarModule, decorators: [{
|
|
5287
5299
|
type: NgModule,
|
|
5288
5300
|
args: [{
|
|
5289
5301
|
declarations: [
|
|
@@ -5311,10 +5323,10 @@ class GraniteTitlePipe {
|
|
|
5311
5323
|
.map((word) => word.charAt(0).toLocaleUpperCase() + word.slice(1))
|
|
5312
5324
|
.join(' ');
|
|
5313
5325
|
}
|
|
5314
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5315
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.
|
|
5326
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteTitlePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
5327
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteTitlePipe, isStandalone: false, name: "graniteTitle" }); }
|
|
5316
5328
|
}
|
|
5317
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5329
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteTitlePipe, decorators: [{
|
|
5318
5330
|
type: Pipe,
|
|
5319
5331
|
args: [{
|
|
5320
5332
|
name: 'graniteTitle',
|
|
@@ -5323,11 +5335,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5323
5335
|
}] });
|
|
5324
5336
|
|
|
5325
5337
|
class PurePipesModule {
|
|
5326
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5327
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
5328
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
5338
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: PurePipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5339
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: PurePipesModule, declarations: [GraniteTitlePipe], exports: [GraniteTitlePipe] }); }
|
|
5340
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: PurePipesModule }); }
|
|
5329
5341
|
}
|
|
5330
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5342
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: PurePipesModule, decorators: [{
|
|
5331
5343
|
type: NgModule,
|
|
5332
5344
|
args: [{
|
|
5333
5345
|
exports: [GraniteTitlePipe],
|
|
@@ -5336,10 +5348,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5336
5348
|
}] });
|
|
5337
5349
|
|
|
5338
5350
|
class GraniteCardComponent {
|
|
5339
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5340
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5351
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5352
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardComponent, isStandalone: false, selector: "granite-card", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);text-align:start;border-radius:var(--granite-radius-m);border:var(--granite-border-width-regular) solid var(--granite-color-border-soft);background:var(--granite-color-background);padding:var(--granite-spacing-8)}\n"] }); }
|
|
5341
5353
|
}
|
|
5342
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5354
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardComponent, decorators: [{
|
|
5343
5355
|
type: Component,
|
|
5344
5356
|
args: [{ selector: 'granite-card', template: '<ng-content></ng-content>', standalone: false, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);text-align:start;border-radius:var(--granite-radius-m);border:var(--granite-border-width-regular) solid var(--granite-color-border-soft);background:var(--granite-color-background);padding:var(--granite-spacing-8)}\n"] }]
|
|
5345
5357
|
}] });
|
|
@@ -5351,10 +5363,10 @@ class GraniteCardListComponent {
|
|
|
5351
5363
|
this.wrap = 'nowrap';
|
|
5352
5364
|
this.gap = 'small';
|
|
5353
5365
|
}
|
|
5354
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5355
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5366
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5367
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardListComponent, isStandalone: false, selector: "granite-card-list", inputs: { orientation: "orientation", wrap: "wrap", gap: "gap" }, ngImport: i0, template: "<div\n class=\"card-list-wrapper\"\n [class.vertical]=\"orientation === 'vertical'\"\n [class.horizontal]=\"orientation === 'horizontal'\"\n [class.wrap]=\"wrap === 'wrap'\"\n [class.nowrap]=\"wrap === 'nowrap'\"\n [class.small]=\"gap === 'small'\"\n [class.medium]=\"gap === 'medium'\"\n [class.large]=\"gap === 'large'\"\n cdkScrollable\n>\n <ng-content></ng-content>\n</div>\n", styles: [":host{width:100%}.card-list-wrapper{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:row;padding:var(--granite-spacing-4)}.card-list-wrapper.horizontal.nowrap{overflow-x:auto}.card-list-wrapper.horizontal.wrap{overflow-y:auto}.card-list-wrapper.vertical{flex-direction:column}.card-list-wrapper.vertical.nowrap{overflow-y:auto}.card-list-wrapper.vertical.wrap{overflow-x:auto}.card-list-wrapper.small{gap:var(--granite-spacing-2)}.card-list-wrapper.medium{gap:var(--granite-spacing-4)}.card-list-wrapper.large{gap:var(--granite-spacing-8)}.card-list-wrapper.wrap{flex-wrap:wrap}.card-list-wrapper.nowrap{flex-wrap:nowrap}.card-list-wrapper::-webkit-scrollbar{width:calc(var(--granite-size-base-rem) * .25);height:calc(var(--granite-size-base-rem) * .25);border-radius:var(--granite-radius-s)}.card-list-wrapper::-webkit-scrollbar-thumb{background:var(--granite-color-border-hard);border-radius:var(--granite-radius-s)}.card-list-wrapper::-webkit-scrollbar-track{background:var(--granite-color-background-page)}\n"], dependencies: [{ kind: "directive", type: i1$3.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }] }); }
|
|
5356
5368
|
}
|
|
5357
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5369
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardListComponent, decorators: [{
|
|
5358
5370
|
type: Component,
|
|
5359
5371
|
args: [{ selector: 'granite-card-list', standalone: false, template: "<div\n class=\"card-list-wrapper\"\n [class.vertical]=\"orientation === 'vertical'\"\n [class.horizontal]=\"orientation === 'horizontal'\"\n [class.wrap]=\"wrap === 'wrap'\"\n [class.nowrap]=\"wrap === 'nowrap'\"\n [class.small]=\"gap === 'small'\"\n [class.medium]=\"gap === 'medium'\"\n [class.large]=\"gap === 'large'\"\n cdkScrollable\n>\n <ng-content></ng-content>\n</div>\n", styles: [":host{width:100%}.card-list-wrapper{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:row;padding:var(--granite-spacing-4)}.card-list-wrapper.horizontal.nowrap{overflow-x:auto}.card-list-wrapper.horizontal.wrap{overflow-y:auto}.card-list-wrapper.vertical{flex-direction:column}.card-list-wrapper.vertical.nowrap{overflow-y:auto}.card-list-wrapper.vertical.wrap{overflow-x:auto}.card-list-wrapper.small{gap:var(--granite-spacing-2)}.card-list-wrapper.medium{gap:var(--granite-spacing-4)}.card-list-wrapper.large{gap:var(--granite-spacing-8)}.card-list-wrapper.wrap{flex-wrap:wrap}.card-list-wrapper.nowrap{flex-wrap:nowrap}.card-list-wrapper::-webkit-scrollbar{width:calc(var(--granite-size-base-rem) * .25);height:calc(var(--granite-size-base-rem) * .25);border-radius:var(--granite-radius-s)}.card-list-wrapper::-webkit-scrollbar-thumb{background:var(--granite-color-border-hard);border-radius:var(--granite-radius-s)}.card-list-wrapper::-webkit-scrollbar-track{background:var(--granite-color-background-page)}\n"] }]
|
|
5360
5372
|
}], propDecorators: { orientation: [{
|
|
@@ -5366,80 +5378,80 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5366
5378
|
}] } });
|
|
5367
5379
|
|
|
5368
5380
|
class GraniteCardContentComponent {
|
|
5369
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5370
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5381
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5382
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardContentComponent, isStandalone: false, selector: "granite-card-content", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:column;flex-grow:3;font-family:var(--granite-font-family-default);gap:var(--granite-spacing-8)}\n"] }); }
|
|
5371
5383
|
}
|
|
5372
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5384
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardContentComponent, decorators: [{
|
|
5373
5385
|
type: Component,
|
|
5374
5386
|
args: [{ selector: 'granite-card-content', template: '<ng-content></ng-content>', standalone: false, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:column;flex-grow:3;font-family:var(--granite-font-family-default);gap:var(--granite-spacing-8)}\n"] }]
|
|
5375
5387
|
}] });
|
|
5376
5388
|
|
|
5377
5389
|
class GraniteCardHeaderComponent {
|
|
5378
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5379
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5390
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5391
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardHeaderComponent, isStandalone: false, selector: "granite-card-header", ngImport: i0, template: "<div class=\"title-container\">\n <ng-content select=\"granite-card-header-title\"></ng-content>\n <ng-content select=\"granite-card-header-sub-title\"></ng-content>\n</div>\n<div class=\"content-container\">\n <ng-content></ng-content>\n</div>\n", styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);flex-direction:row;justify-content:space-between;flex:0 auto}.title-container{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:column;gap:var(--granite-spacing-4)}.content-container{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:row;gap:var(--granite-spacing-8);align-self:center}\n"] }); }
|
|
5380
5392
|
}
|
|
5381
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5393
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardHeaderComponent, decorators: [{
|
|
5382
5394
|
type: Component,
|
|
5383
5395
|
args: [{ selector: 'granite-card-header', standalone: false, template: "<div class=\"title-container\">\n <ng-content select=\"granite-card-header-title\"></ng-content>\n <ng-content select=\"granite-card-header-sub-title\"></ng-content>\n</div>\n<div class=\"content-container\">\n <ng-content></ng-content>\n</div>\n", styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);flex-direction:row;justify-content:space-between;flex:0 auto}.title-container{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:column;gap:var(--granite-spacing-4)}.content-container{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:row;gap:var(--granite-spacing-8);align-self:center}\n"] }]
|
|
5384
5396
|
}] });
|
|
5385
5397
|
|
|
5386
5398
|
class GraniteCardActionsComponent {
|
|
5387
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5388
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5399
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5400
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardActionsComponent, isStandalone: false, selector: "granite-card-actions", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);font-weight:var(--granite-font-weight-regular);font-size:var(--granite-font-size-body-small);flex-direction:row;gap:var(--granite-spacing-4)}\n"] }); }
|
|
5389
5401
|
}
|
|
5390
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5402
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardActionsComponent, decorators: [{
|
|
5391
5403
|
type: Component,
|
|
5392
5404
|
args: [{ selector: 'granite-card-actions', template: '<ng-content></ng-content>', standalone: false, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);font-weight:var(--granite-font-weight-regular);font-size:var(--granite-font-size-body-small);flex-direction:row;gap:var(--granite-spacing-4)}\n"] }]
|
|
5393
5405
|
}] });
|
|
5394
5406
|
|
|
5395
5407
|
class GraniteCardBodyComponent {
|
|
5396
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5397
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5408
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5409
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardBodyComponent, isStandalone: false, selector: "granite-card-body", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);text-align:start;color:var(--granite-colors-background-inverse);flex-direction:column;gap:var(--granite-spacing-4);justify-content:space-between}\n"] }); }
|
|
5398
5410
|
}
|
|
5399
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5411
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardBodyComponent, decorators: [{
|
|
5400
5412
|
type: Component,
|
|
5401
5413
|
args: [{ selector: 'granite-card-body', template: '<ng-content></ng-content>', standalone: false, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);text-align:start;color:var(--granite-colors-background-inverse);flex-direction:column;gap:var(--granite-spacing-4);justify-content:space-between}\n"] }]
|
|
5402
5414
|
}] });
|
|
5403
5415
|
|
|
5404
5416
|
class GraniteCardFooterComponent {
|
|
5405
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5406
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5417
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5418
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardFooterComponent, isStandalone: false, selector: "granite-card-footer", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);text-align:start;flex-direction:row;color:var(--granite-colors-background-inverse);gap:var(--granite-spacing-4)}\n"] }); }
|
|
5407
5419
|
}
|
|
5408
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5420
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardFooterComponent, decorators: [{
|
|
5409
5421
|
type: Component,
|
|
5410
5422
|
args: [{ selector: 'granite-card-footer', template: '<ng-content></ng-content>', standalone: false, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-flowing);text-align:start;flex-direction:row;color:var(--granite-colors-background-inverse);gap:var(--granite-spacing-4)}\n"] }]
|
|
5411
5423
|
}] });
|
|
5412
5424
|
|
|
5413
5425
|
class GraniteCardAvatarComponent {
|
|
5414
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5415
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5426
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5427
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardAvatarComponent, isStandalone: false, selector: "granite-card-avatar", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{font-family:var(--granite-font-family-default);flex-grow:0;padding:var(--granite-spacing-4);width:min-content}\n"] }); }
|
|
5416
5428
|
}
|
|
5417
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5429
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardAvatarComponent, decorators: [{
|
|
5418
5430
|
type: Component,
|
|
5419
5431
|
args: [{ selector: 'granite-card-avatar', template: '<ng-content></ng-content>', standalone: false, styles: [":host{font-family:var(--granite-font-family-default);flex-grow:0;padding:var(--granite-spacing-4);width:min-content}\n"] }]
|
|
5420
5432
|
}] });
|
|
5421
5433
|
|
|
5422
5434
|
class GraniteCardHeaderTitleComponent {
|
|
5423
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5424
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5435
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardHeaderTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5436
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardHeaderTitleComponent, isStandalone: false, selector: "granite-card-header-title", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-bold);line-height:var(--granite-line-height-regular);color:var(--granite-color-text-weak)}\n"] }); }
|
|
5425
5437
|
}
|
|
5426
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5438
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardHeaderTitleComponent, decorators: [{
|
|
5427
5439
|
type: Component,
|
|
5428
5440
|
args: [{ selector: 'granite-card-header-title', template: '<ng-content></ng-content>', standalone: false, styles: [":host{font-family:var(--granite-font-family-default);font-size:var(--granite-font-size-body-small);font-weight:var(--granite-font-weight-bold);line-height:var(--granite-line-height-regular);color:var(--granite-color-text-weak)}\n"] }]
|
|
5429
5441
|
}] });
|
|
5430
5442
|
|
|
5431
5443
|
class GraniteCardHeaderSubTitleComponent {
|
|
5432
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5433
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5444
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardHeaderSubTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5445
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCardHeaderSubTitleComponent, isStandalone: false, selector: "granite-card-header-sub-title", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);color:var(--granite-color-text-hint);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular);flex-direction:column}\n"] }); }
|
|
5434
5446
|
}
|
|
5435
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5447
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardHeaderSubTitleComponent, decorators: [{
|
|
5436
5448
|
type: Component,
|
|
5437
5449
|
args: [{ selector: 'granite-card-header-sub-title', template: '<ng-content></ng-content>', standalone: false, styles: [":host{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;font-family:var(--granite-font-family-default);color:var(--granite-color-text-hint);font-size:var(--granite-font-size-micro);font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular);flex-direction:column}\n"] }]
|
|
5438
5450
|
}] });
|
|
5439
5451
|
|
|
5440
5452
|
class GraniteCardListModule {
|
|
5441
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5442
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
5453
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5454
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardListModule, declarations: [GraniteCardComponent,
|
|
5443
5455
|
GraniteCardListComponent,
|
|
5444
5456
|
GraniteCardContentComponent,
|
|
5445
5457
|
GraniteCardHeaderComponent,
|
|
@@ -5458,9 +5470,9 @@ class GraniteCardListModule {
|
|
|
5458
5470
|
GraniteCardAvatarComponent,
|
|
5459
5471
|
GraniteCardHeaderTitleComponent,
|
|
5460
5472
|
GraniteCardHeaderSubTitleComponent] }); }
|
|
5461
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
5473
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardListModule, imports: [CommonModule, ScrollingModule] }); }
|
|
5462
5474
|
}
|
|
5463
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5475
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCardListModule, decorators: [{
|
|
5464
5476
|
type: NgModule,
|
|
5465
5477
|
args: [{
|
|
5466
5478
|
declarations: [
|
|
@@ -5495,10 +5507,10 @@ class GraniteCollapsibleConditionalBodyDirective {
|
|
|
5495
5507
|
constructor() {
|
|
5496
5508
|
this.template = inject(TemplateRef);
|
|
5497
5509
|
}
|
|
5498
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5499
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
5510
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleConditionalBodyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
5511
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCollapsibleConditionalBodyDirective, isStandalone: false, selector: "[graniteCollapsibleGroupBody]", exportAs: ["graniteCollapsibleGroupBody"], ngImport: i0 }); }
|
|
5500
5512
|
}
|
|
5501
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5513
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleConditionalBodyDirective, decorators: [{
|
|
5502
5514
|
type: Directive,
|
|
5503
5515
|
args: [{
|
|
5504
5516
|
selector: '[graniteCollapsibleGroupBody]',
|
|
@@ -5511,10 +5523,10 @@ class GraniteCollapsibleConditionalHeaderDirective {
|
|
|
5511
5523
|
constructor() {
|
|
5512
5524
|
this.template = inject(TemplateRef);
|
|
5513
5525
|
}
|
|
5514
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5515
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
5526
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleConditionalHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
5527
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCollapsibleConditionalHeaderDirective, isStandalone: false, selector: "[graniteCollapsibleGroupHeader]", exportAs: ["graniteCollapsibleGroupHeader"], ngImport: i0 }); }
|
|
5516
5528
|
}
|
|
5517
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5529
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleConditionalHeaderDirective, decorators: [{
|
|
5518
5530
|
type: Directive,
|
|
5519
5531
|
args: [{
|
|
5520
5532
|
selector: '[graniteCollapsibleGroupHeader]',
|
|
@@ -5541,10 +5553,10 @@ class GraniteCollapsibleGroupComponent {
|
|
|
5541
5553
|
this.toggleCollapsibleGroup();
|
|
5542
5554
|
}
|
|
5543
5555
|
}
|
|
5544
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5545
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
5556
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5557
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: GraniteCollapsibleGroupComponent, isStandalone: false, selector: "granite-collapsible-group", inputs: { collapsed: "collapsed", id: "id", arialabel: "arialabel" }, outputs: { collapsedChanged: "collapsedChanged" }, queries: [{ propertyName: "conditionalBodyContentRef", first: true, predicate: GraniteCollapsibleConditionalBodyDirective, descendants: true }, { propertyName: "conditionalHeaderContentRef", first: true, predicate: GraniteCollapsibleConditionalHeaderDirective, descendants: true }], ngImport: i0, template: "<div class=\"collapsible-wrapper\">\n <div\n data-fnd=\"collapsible-group-header\"\n class=\"collapsible-group-header\"\n [class]=\"collapsed ? 'collapsed-header' : 'expanded-header'\"\n role=\"button\"\n (click)=\"toggleCollapsibleGroup()\"\n (keydown)=\"_toogleCollapsing($event)\"\n [attr.id]=\"id ? 'collapsible-group-header-' + id : null\"\n [attr.aria-label]=\"arialabel\"\n [attr.aria-expanded]=\"!collapsed\"\n [attr.aria-controls]=\"id ? 'collapsible-group-body-' + id : null\"\n tabindex=\"0\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n conditionalHeaderContentRef\n ? conditionalHeaderContentRef.template\n : null\n \"\n ></ng-container>\n\n <div class=\"collapse-icon\">\n <granite-icon\n [fontIcon]=\"collapsed ? 'icon-caret-down' : 'icon-caret-up'\"\n ></granite-icon>\n </div>\n </div>\n <div\n data-fnd=\"collapsible-group-body\"\n class=\"collapsible-group-body\"\n [class]=\"collapsed ? 'collapse' : 'expand'\"\n role=\"region\"\n [attr.id]=\"id ? 'collapsible-group-body-' + id : null\"\n [attr.aria-labelledby]=\"id ? 'collapsible-group-header-' + id : null\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n !collapsed && conditionalBodyContentRef\n ? conditionalBodyContentRef.template\n : null\n \"\n >\n </ng-container>\n </div>\n</div>\n", styles: [".collapsible-wrapper{background-color:var(--granite-color-background);box-shadow:var(--granite-shadow-base);border-radius:var(--granite-radius-s);width:100%;font-family:var(--granite-font-family-default)}.collapsible-wrapper .collapse-icon{align-self:center;width:var(--granite-size-base-rem);height:var(--granite-size-base-rem);font-size:var(--granite-font-size-body);color:var(--granite-color-background-inverse);display:none}.collapsible-wrapper .collapsible-group-header{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:row;justify-content:space-between;cursor:pointer;font-size:var(--granite-font-size-body-small);line-height:var(--granite-line-height-base-rem);font-weight:var(--granite-font-weight-bold);padding:var(--granite-spacing-8) var(--granite-spacing-16);transition:background-color .2s ease-out;color:var(--granite-color-text);background-color:var(--granite-color-background);align-items:center}.collapsible-wrapper .collapsible-group-header:focus{outline:var(--granite-border-width-focus) solid var(--granite-color-focus)}.collapsible-wrapper .collapsible-group-header:hover{background-color:var(--granite-color-background-hover)}.collapsible-wrapper .collapsible-group-header:hover .collapse-icon{display:block}.collapsible-wrapper .collapsible-group-header.expanded-header{border-start-start-radius:var(--granite-radius-s);border-start-end-radius:var(--granite-radius-s);border-end-start-radius:0;border-end-end-radius:0}.collapsible-wrapper .collapsible-group-header.collapsed-header{border-radius:var(--granite-radius-s)}.collapsible-wrapper .collapsible-group-body{padding:var(--granite-spacing-16);transition:all .3s ease-in-out}.collapsible-wrapper .collapsible-group-body.expand{display:block;background-color:var(--granite-color-background);border-end-start-radius:var(--granite-radius-s);border-end-end-radius:var(--granite-radius-s)}.collapsible-wrapper .collapsible-group-body.collapse{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }] }); }
|
|
5546
5558
|
}
|
|
5547
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5559
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleGroupComponent, decorators: [{
|
|
5548
5560
|
type: Component,
|
|
5549
5561
|
args: [{ selector: 'granite-collapsible-group', standalone: false, template: "<div class=\"collapsible-wrapper\">\n <div\n data-fnd=\"collapsible-group-header\"\n class=\"collapsible-group-header\"\n [class]=\"collapsed ? 'collapsed-header' : 'expanded-header'\"\n role=\"button\"\n (click)=\"toggleCollapsibleGroup()\"\n (keydown)=\"_toogleCollapsing($event)\"\n [attr.id]=\"id ? 'collapsible-group-header-' + id : null\"\n [attr.aria-label]=\"arialabel\"\n [attr.aria-expanded]=\"!collapsed\"\n [attr.aria-controls]=\"id ? 'collapsible-group-body-' + id : null\"\n tabindex=\"0\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n conditionalHeaderContentRef\n ? conditionalHeaderContentRef.template\n : null\n \"\n ></ng-container>\n\n <div class=\"collapse-icon\">\n <granite-icon\n [fontIcon]=\"collapsed ? 'icon-caret-down' : 'icon-caret-up'\"\n ></granite-icon>\n </div>\n </div>\n <div\n data-fnd=\"collapsible-group-body\"\n class=\"collapsible-group-body\"\n [class]=\"collapsed ? 'collapse' : 'expand'\"\n role=\"region\"\n [attr.id]=\"id ? 'collapsible-group-body-' + id : null\"\n [attr.aria-labelledby]=\"id ? 'collapsible-group-header-' + id : null\"\n >\n <ng-container\n [ngTemplateOutlet]=\"\n !collapsed && conditionalBodyContentRef\n ? conditionalBodyContentRef.template\n : null\n \"\n >\n </ng-container>\n </div>\n</div>\n", styles: [".collapsible-wrapper{background-color:var(--granite-color-background);box-shadow:var(--granite-shadow-base);border-radius:var(--granite-radius-s);width:100%;font-family:var(--granite-font-family-default)}.collapsible-wrapper .collapse-icon{align-self:center;width:var(--granite-size-base-rem);height:var(--granite-size-base-rem);font-size:var(--granite-font-size-body);color:var(--granite-color-background-inverse);display:none}.collapsible-wrapper .collapsible-group-header{display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-direction:row;justify-content:space-between;cursor:pointer;font-size:var(--granite-font-size-body-small);line-height:var(--granite-line-height-base-rem);font-weight:var(--granite-font-weight-bold);padding:var(--granite-spacing-8) var(--granite-spacing-16);transition:background-color .2s ease-out;color:var(--granite-color-text);background-color:var(--granite-color-background);align-items:center}.collapsible-wrapper .collapsible-group-header:focus{outline:var(--granite-border-width-focus) solid var(--granite-color-focus)}.collapsible-wrapper .collapsible-group-header:hover{background-color:var(--granite-color-background-hover)}.collapsible-wrapper .collapsible-group-header:hover .collapse-icon{display:block}.collapsible-wrapper .collapsible-group-header.expanded-header{border-start-start-radius:var(--granite-radius-s);border-start-end-radius:var(--granite-radius-s);border-end-start-radius:0;border-end-end-radius:0}.collapsible-wrapper .collapsible-group-header.collapsed-header{border-radius:var(--granite-radius-s)}.collapsible-wrapper .collapsible-group-body{padding:var(--granite-spacing-16);transition:all .3s ease-in-out}.collapsible-wrapper .collapsible-group-body.expand{display:block;background-color:var(--granite-color-background);border-end-start-radius:var(--granite-radius-s);border-end-end-radius:var(--granite-radius-s)}.collapsible-wrapper .collapsible-group-body.collapse{display:none}\n"] }]
|
|
5550
5562
|
}], propDecorators: { collapsed: [{
|
|
@@ -5564,15 +5576,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5564
5576
|
}] } });
|
|
5565
5577
|
|
|
5566
5578
|
class GraniteCollapsibleGroupModule {
|
|
5567
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
5568
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
5579
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5580
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleGroupModule, declarations: [GraniteCollapsibleGroupComponent,
|
|
5569
5581
|
GraniteCollapsibleConditionalHeaderDirective,
|
|
5570
5582
|
GraniteCollapsibleConditionalBodyDirective], imports: [CommonModule, GraniteIconModule], exports: [GraniteCollapsibleGroupComponent,
|
|
5571
5583
|
GraniteCollapsibleConditionalHeaderDirective,
|
|
5572
5584
|
GraniteCollapsibleConditionalBodyDirective] }); }
|
|
5573
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
5585
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleGroupModule, imports: [CommonModule, GraniteIconModule] }); }
|
|
5574
5586
|
}
|
|
5575
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
5587
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: GraniteCollapsibleGroupModule, decorators: [{
|
|
5576
5588
|
type: NgModule,
|
|
5577
5589
|
args: [{
|
|
5578
5590
|
imports: [CommonModule, GraniteIconModule],
|