@sebgroup/green-angular 3.6.1 → 3.6.2
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/esm2020/lib/accordion/accordion-list-item.component.mjs +8 -8
- package/esm2020/lib/accordion/accordion.component.mjs +4 -4
- package/esm2020/lib/accordion/accordion.module.mjs +2 -2
- package/esm2020/lib/button/button.component.mjs +6 -4
- package/esm2020/lib/cell-table/cell-table-item.component.mjs +5 -5
- package/esm2020/lib/cell-table/cell-table.component.mjs +1 -1
- package/esm2020/lib/cell-table/cell-table.types.mjs +1 -1
- package/esm2020/lib/cell-table/cell-underline.directive.mjs +1 -1
- package/esm2020/lib/context-menu/context-menu.component.mjs +2 -2
- package/esm2020/lib/context-menu/index.mjs +1 -1
- package/esm2020/lib/datepicker/datepicker.component.mjs +2 -1
- package/esm2020/lib/dropdown/dropdown.component.mjs +2 -1
- package/esm2020/lib/modal/index.mjs +1 -1
- package/esm2020/lib/modal/modal-footer.directive.mjs +2 -2
- package/esm2020/lib/modal/modal-header.directive.mjs +2 -2
- package/esm2020/lib/modal/modal.component.mjs +3 -3
- package/esm2020/lib/modal/modal.module.mjs +4 -4
- package/esm2020/lib/shared/core-element/core-element.directive.mjs +2 -2
- package/esm2020/lib/shared/on-scroll.directive.mjs +1 -1
- package/esm2020/lib/slider/slider.component.mjs +1 -1
- package/esm2020/lib/sortable-list/sortable-list.component.mjs +1 -1
- package/fesm2015/sebgroup-green-angular.mjs +28 -23
- package/fesm2015/sebgroup-green-angular.mjs.map +1 -1
- package/fesm2020/sebgroup-green-angular.mjs +28 -23
- package/fesm2020/sebgroup-green-angular.mjs.map +1 -1
- package/lib/context-menu/context-menu.component.d.ts +1 -1
- package/lib/datepicker/datepicker.component.d.ts +1 -0
- package/lib/dropdown/dropdown.component.d.ts +2 -1
- package/package.json +3 -3
|
@@ -3,11 +3,14 @@ import { CommonModule, DOCUMENT } from '@angular/common';
|
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
4
|
import { EventEmitter, Component, Input, Output, ContentChildren, NgModule, ChangeDetectionStrategy, HostBinding, inject, Renderer2, ViewContainerRef, ChangeDetectorRef, TemplateRef, Directive, ViewChild, CUSTOM_ELEMENTS_SCHEMA, Injector, Inject, ContentChild, InjectionToken, QueryList, ViewChildren } from '@angular/core';
|
|
5
5
|
import { randomId, calculateDegrees, sliderColors, getSliderTrackBackground, PaginationI18n } from '@sebgroup/extract';
|
|
6
|
-
import
|
|
6
|
+
import '@sebgroup/green-core/components/context-menu';
|
|
7
7
|
import { registerTransitionalStyles } from '@sebgroup/green-core/transitional-styles';
|
|
8
|
+
import { getScopedTagName } from '@sebgroup/green-core/scoping';
|
|
8
9
|
import * as i2 from '@angular/forms';
|
|
9
10
|
import { NG_VALUE_ACCESSOR, NgControl, FormsModule } from '@angular/forms';
|
|
10
11
|
import { startOfDay, endOfDay } from 'date-fns';
|
|
12
|
+
import '@sebgroup/green-core/components/datepicker';
|
|
13
|
+
import '@sebgroup/green-core/components/dropdown';
|
|
11
14
|
import * as i1$1 from '@angular/cdk/a11y';
|
|
12
15
|
import { A11yModule } from '@angular/cdk/a11y';
|
|
13
16
|
import { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';
|
|
@@ -25,33 +28,33 @@ class NggAccordionListItemComponent {
|
|
|
25
28
|
this.listItemHeader = '';
|
|
26
29
|
this.listItemSubHeader = '';
|
|
27
30
|
this.expandedChange = new EventEmitter();
|
|
28
|
-
this.contentHeight =
|
|
31
|
+
this.contentHeight = '0px';
|
|
29
32
|
this.isExpanded = false;
|
|
30
33
|
}
|
|
31
34
|
shrink() {
|
|
32
35
|
this.isExpanded = false;
|
|
33
|
-
this.contentHeight =
|
|
36
|
+
this.contentHeight = '0px';
|
|
34
37
|
}
|
|
35
38
|
expand() {
|
|
36
39
|
this.isExpanded = true;
|
|
37
|
-
this.contentHeight =
|
|
40
|
+
this.contentHeight = 'auto';
|
|
38
41
|
}
|
|
39
42
|
toggleExpanded() {
|
|
40
43
|
this.isExpanded = !this.isExpanded;
|
|
41
44
|
if (this.isExpanded) {
|
|
42
|
-
this.contentHeight =
|
|
45
|
+
this.contentHeight = 'auto';
|
|
43
46
|
}
|
|
44
47
|
else {
|
|
45
|
-
this.contentHeight =
|
|
48
|
+
this.contentHeight = '0px';
|
|
46
49
|
}
|
|
47
50
|
this.expandedChange.emit(this);
|
|
48
51
|
}
|
|
49
52
|
}
|
|
50
53
|
NggAccordionListItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggAccordionListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
51
|
-
NggAccordionListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NggAccordionListItemComponent, selector: "div[ngg-accordion-list-item]", inputs: { id: "id", listItemHeader: "listItemHeader", listItemSubHeader: "listItemSubHeader" }, outputs: { expandedChange: "expandedChange" }, ngImport: i0, template: "<ng-container data-testid=\"accordion-list-item-root\">\n
|
|
54
|
+
NggAccordionListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NggAccordionListItemComponent, selector: "div[ngg-accordion-list-item]", inputs: { id: "id", listItemHeader: "listItemHeader", listItemSubHeader: "listItemSubHeader" }, outputs: { expandedChange: "expandedChange" }, ngImport: i0, template: "<ng-container data-testid=\"accordion-list-item-root\">\n <div role=\"heading\" aria-level=\"2\" [attr.id]=\"id\">\n <button\n data-testid=\"accordion-list-item-expander-button\"\n [attr.id]=\"id + '_header'\"\n (click)=\"toggleExpanded()\"\n tabindex=\"0\"\n [attr.aria-expanded]=\"this.isExpanded\"\n [attr.aria-controls]=\"id + '_section'\"\n >\n <span data-testid=\"accordion-list-item-header\">{{ listItemHeader }}</span>\n <span data-testid=\"accordion-list-item-subheader\">{{\n listItemSubHeader\n }}</span>\n <svg\n width=\"1em\"\n height=\"1em\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.8095 9.22817L18.1907 8.60942C18.0438 8.46255 17.8063 8.46255 17.6595 8.60942L12.0001 14.2563L6.34072 8.60942C6.19385 8.46255 5.95635 8.46255 5.80947 8.60942L5.19072 9.22817C5.04385 9.37505 5.04385 9.61255 5.19072 9.75942L11.7345 16.3032C11.8813 16.45 12.1188 16.45 12.2657 16.3032L18.8095 9.75942C18.9563 9.61255 18.9563 9.37505 18.8095 9.22817Z\"\n fill=\"#333333\"\n />\n </svg>\n </button>\n <div\n role=\"region\"\n [hidden]=\"!this.isExpanded\"\n [ngStyle]=\"{ height: this.contentHeight }\"\n [id]=\"id + '_section'\"\n [attr.aria-labelledby]=\"id + '_header'\"\n data-testid=\"accordion-list-item-content\"\n >\n <div>\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
52
55
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggAccordionListItemComponent, decorators: [{
|
|
53
56
|
type: Component,
|
|
54
|
-
args: [{ selector: 'div[ngg-accordion-list-item]', template: "<ng-container data-testid=\"accordion-list-item-root\">\n
|
|
57
|
+
args: [{ selector: 'div[ngg-accordion-list-item]', template: "<ng-container data-testid=\"accordion-list-item-root\">\n <div role=\"heading\" aria-level=\"2\" [attr.id]=\"id\">\n <button\n data-testid=\"accordion-list-item-expander-button\"\n [attr.id]=\"id + '_header'\"\n (click)=\"toggleExpanded()\"\n tabindex=\"0\"\n [attr.aria-expanded]=\"this.isExpanded\"\n [attr.aria-controls]=\"id + '_section'\"\n >\n <span data-testid=\"accordion-list-item-header\">{{ listItemHeader }}</span>\n <span data-testid=\"accordion-list-item-subheader\">{{\n listItemSubHeader\n }}</span>\n <svg\n width=\"1em\"\n height=\"1em\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M18.8095 9.22817L18.1907 8.60942C18.0438 8.46255 17.8063 8.46255 17.6595 8.60942L12.0001 14.2563L6.34072 8.60942C6.19385 8.46255 5.95635 8.46255 5.80947 8.60942L5.19072 9.22817C5.04385 9.37505 5.04385 9.61255 5.19072 9.75942L11.7345 16.3032C11.8813 16.45 12.1188 16.45 12.2657 16.3032L18.8095 9.75942C18.9563 9.61255 18.9563 9.37505 18.8095 9.22817Z\"\n fill=\"#333333\"\n />\n </svg>\n </button>\n <div\n role=\"region\"\n [hidden]=\"!this.isExpanded\"\n [ngStyle]=\"{ height: this.contentHeight }\"\n [id]=\"id + '_section'\"\n [attr.aria-labelledby]=\"id + '_header'\"\n data-testid=\"accordion-list-item-content\"\n >\n <div>\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</ng-container>\n" }]
|
|
55
58
|
}], propDecorators: { id: [{
|
|
56
59
|
type: Input
|
|
57
60
|
}], listItemHeader: [{
|
|
@@ -118,10 +121,10 @@ class NggAccordionComponent {
|
|
|
118
121
|
}
|
|
119
122
|
}
|
|
120
123
|
NggAccordionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
121
|
-
NggAccordionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NggAccordionComponent, selector: "ngg-accordion", inputs: { closeOthers: "closeOthers", expandAll: "expandAll" }, queries: [{ propertyName: "items", predicate: NggAccordionListItemComponent }], ngImport: i0, template: "<div class=\"accordion\" data-testid=\"accordion-root\">\n
|
|
124
|
+
NggAccordionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NggAccordionComponent, selector: "ngg-accordion", inputs: { closeOthers: "closeOthers", expandAll: "expandAll" }, queries: [{ propertyName: "items", predicate: NggAccordionListItemComponent }], ngImport: i0, template: "<div class=\"accordion\" data-testid=\"accordion-root\">\n <ng-content></ng-content>\n</div>\n" });
|
|
122
125
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggAccordionComponent, decorators: [{
|
|
123
126
|
type: Component,
|
|
124
|
-
args: [{ selector:
|
|
127
|
+
args: [{ selector: 'ngg-accordion', template: "<div class=\"accordion\" data-testid=\"accordion-root\">\n <ng-content></ng-content>\n</div>\n" }]
|
|
125
128
|
}], propDecorators: { items: [{
|
|
126
129
|
type: ContentChildren,
|
|
127
130
|
args: [NggAccordionListItemComponent]
|
|
@@ -141,7 +144,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
141
144
|
args: [{
|
|
142
145
|
imports: [CommonModule],
|
|
143
146
|
exports: [NggAccordionListItemComponent, NggAccordionComponent],
|
|
144
|
-
declarations: [NggAccordionListItemComponent, NggAccordionComponent]
|
|
147
|
+
declarations: [NggAccordionListItemComponent, NggAccordionComponent],
|
|
145
148
|
}]
|
|
146
149
|
}] });
|
|
147
150
|
|
|
@@ -238,7 +241,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
238
241
|
|
|
239
242
|
class NggButtonComponent {
|
|
240
243
|
get classes() {
|
|
241
|
-
return [this.variant, this.size ? this.size : false]
|
|
244
|
+
return [this.variant, this.size ? this.size : false]
|
|
245
|
+
.filter(Boolean)
|
|
246
|
+
.join(' ');
|
|
242
247
|
}
|
|
243
248
|
}
|
|
244
249
|
NggButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
@@ -249,7 +254,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
249
254
|
// eslint-disable-next-line @angular-eslint/component-selector
|
|
250
255
|
selector: '[ngg-button]',
|
|
251
256
|
template: `<ng-content></ng-content>`,
|
|
252
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
257
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
253
258
|
}]
|
|
254
259
|
}], propDecorators: { variant: [{
|
|
255
260
|
type: Input
|
|
@@ -880,7 +885,7 @@ NggModalHeaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0"
|
|
|
880
885
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggModalHeaderDirective, decorators: [{
|
|
881
886
|
type: Directive,
|
|
882
887
|
args: [{
|
|
883
|
-
selector: '[nggModalHeader]'
|
|
888
|
+
selector: '[nggModalHeader]',
|
|
884
889
|
}]
|
|
885
890
|
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
|
|
886
891
|
|
|
@@ -894,7 +899,7 @@ NggModalFooterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0"
|
|
|
894
899
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggModalFooterDirective, decorators: [{
|
|
895
900
|
type: Directive,
|
|
896
901
|
args: [{
|
|
897
|
-
selector: '[nggModalFooter]'
|
|
902
|
+
selector: '[nggModalFooter]',
|
|
898
903
|
}]
|
|
899
904
|
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
|
|
900
905
|
|
|
@@ -991,10 +996,10 @@ class NggModalComponent {
|
|
|
991
996
|
}
|
|
992
997
|
}
|
|
993
998
|
NggModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggModalComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.ConfigurableFocusTrapFactory }], target: i0.ɵɵFactoryTarget.Component });
|
|
994
|
-
NggModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NggModalComponent, selector: "ngg-modal", inputs: { modalType: "modalType", header: "header", confirmLabel: "confirmLabel", dismissLabel: "dismissLabel", size: "size", hideHeader: "hideHeader", hideFooter: "hideFooter", trapFocus: "trapFocus", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange", closed: "closed", confirm: "confirm", dismiss: "dismiss" }, host: { properties: { "class.open": "this.open" } }, queries: [{ propertyName: "modalHeaderContent", first: true, predicate: NggModalHeaderDirective, descendants: true }, { propertyName: "modalFooterContent", first: true, predicate: NggModalFooterDirective, descendants: true }], viewQueries: [{ propertyName: "backdropRef", first: true, predicate: ["backdrop"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"isOpen\" [ngSwitch]=\"modalType\">\n <div class=\"gds-dialog-wrapper\">\n <aside\n data-testid=\"modal\"\n *ngSwitchCase=\"'slideout'\"\n role=\"dialog\"\n aria-modal=\"true\"\n [class.small]=\"size === 'sm'\"\n [class.
|
|
999
|
+
NggModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NggModalComponent, selector: "ngg-modal", inputs: { modalType: "modalType", header: "header", confirmLabel: "confirmLabel", dismissLabel: "dismissLabel", size: "size", hideHeader: "hideHeader", hideFooter: "hideFooter", trapFocus: "trapFocus", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange", closed: "closed", confirm: "confirm", dismiss: "dismiss" }, host: { properties: { "class.open": "this.open" } }, queries: [{ propertyName: "modalHeaderContent", first: true, predicate: NggModalHeaderDirective, descendants: true }, { propertyName: "modalFooterContent", first: true, predicate: NggModalFooterDirective, descendants: true }], viewQueries: [{ propertyName: "backdropRef", first: true, predicate: ["backdrop"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"isOpen\" [ngSwitch]=\"modalType\">\n <div class=\"gds-dialog-wrapper\">\n <aside\n data-testid=\"modal\"\n *ngSwitchCase=\"'slideout'\"\n role=\"dialog\"\n aria-modal=\"true\"\n [class.small]=\"size === 'sm'\"\n [class.medium]=\"size === 'md'\"\n [class.large]=\"size === 'lg'\"\n [class.entered]=\"isOpen\"\n >\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </aside>\n <main\n data-testid=\"modal\"\n *ngSwitchCase=\"'takeover'\"\n role=\"dialog\"\n aria-modal=\"true\"\n [class.entered]=\"isOpen\"\n >\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </main>\n <section\n data-testid=\"modal\"\n *ngSwitchDefault\n role=\"dialog\"\n aria-modal=\"true\"\n [class.small]=\"size === 'sm'\"\n [class.medium]=\"size === 'md'\"\n [class.large]=\"size === 'lg'\"\n [class.entered]=\"isOpen\"\n >\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </section>\n <ng-template #contentTemplate>\n <ng-container *ngIf=\"!hideHeader\">\n <header\n *ngIf=\"!modalHeaderContent; else headerContentTemplate\"\n ngg-modal-header\n data-testid=\"modal-header\"\n [header]=\"header\"\n (closed)=\"this.handleCloseClick($event)\"\n ></header>\n </ng-container>\n <div ngg-modal-body data-testid=\"modal-body\" class=\"body\">\n <ng-container *ngTemplateOutlet=\"bodyContentTemplate\"></ng-container>\n </div>\n <ng-container *ngIf=\"!hideFooter && (dismissLabel || confirmLabel)\">\n <footer\n *ngIf=\"!modalFooterContent; else footerContentTemplate\"\n ngg-modal-footer\n data-testid=\"modal-footer\"\n [dismissLabel]=\"dismissLabel\"\n [confirmLabel]=\"confirmLabel\"\n (dismiss)=\"this.handleDismiss($event)\"\n (confirm)=\"this.handleConfirm($event)\"\n ></footer>\n </ng-container>\n </ng-template>\n <ng-template #headerContentTemplate>\n <header data-testid=\"modal-header\">\n <ng-content select=\"[nggModalHeader]\"></ng-content>\n </header>\n </ng-template>\n <ng-template #bodyContentTemplate>\n <ng-content></ng-content>\n </ng-template>\n <ng-template #footerContentTemplate>\n <footer data-testid=\"modal-footer\">\n <ng-content select=\"[nggModalFooter]\"></ng-content>\n </footer>\n </ng-template>\n <div\n #backdrop\n data-testid=\"modal-backdrop\"\n class=\"backdrop entered\"\n (click)=\"this.handleBackdropClick($event)\"\n [attr.aria-hidden]=\"true\"\n ></div>\n </div>\n</ng-container>\n", styles: [":host.open{height:100vh;left:0;overflow:hidden;position:fixed;top:0;width:100%;z-index:var(--sg-z-index-modal)}:host.open>section[role=dialog]{left:50%;top:50%;transform:translate(-50%,-50%)}.body::-webkit-scrollbar{background-color:#f8f8f8;height:10px;width:10px}.body::-webkit-scrollbar-thumb{background-color:#cecece}.body::-webkit-scrollbar-track{background-color:#f8f8f8;box-shadow:inset 0 0 10px #00000040}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i1.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgTemplateOutlet; }), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgSwitch; }), selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgSwitchCase; }), selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgSwitchDefault; }), selector: "[ngSwitchDefault]" }, { kind: "component", type: i0.forwardRef(function () { return NggModalHeaderComponent; }), selector: "[ngg-modal-header]", inputs: ["header"], outputs: ["closed"] }, { kind: "component", type: i0.forwardRef(function () { return NggModalBodyComponent; }), selector: "[ngg-modal-body]" }, { kind: "component", type: i0.forwardRef(function () { return NggModalFooterComponent; }), selector: "[ngg-modal-footer]", inputs: ["dismissLabel", "confirmLabel"], outputs: ["dismiss", "confirm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
995
1000
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggModalComponent, decorators: [{
|
|
996
1001
|
type: Component,
|
|
997
|
-
args: [{ selector: 'ngg-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"isOpen\" [ngSwitch]=\"modalType\">\n <div class=\"gds-dialog-wrapper\">\n <aside\n data-testid=\"modal\"\n *ngSwitchCase=\"'slideout'\"\n role=\"dialog\"\n aria-modal=\"true\"\n [class.small]=\"size === 'sm'\"\n [class.
|
|
1002
|
+
args: [{ selector: 'ngg-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"isOpen\" [ngSwitch]=\"modalType\">\n <div class=\"gds-dialog-wrapper\">\n <aside\n data-testid=\"modal\"\n *ngSwitchCase=\"'slideout'\"\n role=\"dialog\"\n aria-modal=\"true\"\n [class.small]=\"size === 'sm'\"\n [class.medium]=\"size === 'md'\"\n [class.large]=\"size === 'lg'\"\n [class.entered]=\"isOpen\"\n >\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </aside>\n <main\n data-testid=\"modal\"\n *ngSwitchCase=\"'takeover'\"\n role=\"dialog\"\n aria-modal=\"true\"\n [class.entered]=\"isOpen\"\n >\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </main>\n <section\n data-testid=\"modal\"\n *ngSwitchDefault\n role=\"dialog\"\n aria-modal=\"true\"\n [class.small]=\"size === 'sm'\"\n [class.medium]=\"size === 'md'\"\n [class.large]=\"size === 'lg'\"\n [class.entered]=\"isOpen\"\n >\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </section>\n <ng-template #contentTemplate>\n <ng-container *ngIf=\"!hideHeader\">\n <header\n *ngIf=\"!modalHeaderContent; else headerContentTemplate\"\n ngg-modal-header\n data-testid=\"modal-header\"\n [header]=\"header\"\n (closed)=\"this.handleCloseClick($event)\"\n ></header>\n </ng-container>\n <div ngg-modal-body data-testid=\"modal-body\" class=\"body\">\n <ng-container *ngTemplateOutlet=\"bodyContentTemplate\"></ng-container>\n </div>\n <ng-container *ngIf=\"!hideFooter && (dismissLabel || confirmLabel)\">\n <footer\n *ngIf=\"!modalFooterContent; else footerContentTemplate\"\n ngg-modal-footer\n data-testid=\"modal-footer\"\n [dismissLabel]=\"dismissLabel\"\n [confirmLabel]=\"confirmLabel\"\n (dismiss)=\"this.handleDismiss($event)\"\n (confirm)=\"this.handleConfirm($event)\"\n ></footer>\n </ng-container>\n </ng-template>\n <ng-template #headerContentTemplate>\n <header data-testid=\"modal-header\">\n <ng-content select=\"[nggModalHeader]\"></ng-content>\n </header>\n </ng-template>\n <ng-template #bodyContentTemplate>\n <ng-content></ng-content>\n </ng-template>\n <ng-template #footerContentTemplate>\n <footer data-testid=\"modal-footer\">\n <ng-content select=\"[nggModalFooter]\"></ng-content>\n </footer>\n </ng-template>\n <div\n #backdrop\n data-testid=\"modal-backdrop\"\n class=\"backdrop entered\"\n (click)=\"this.handleBackdropClick($event)\"\n [attr.aria-hidden]=\"true\"\n ></div>\n </div>\n</ng-container>\n", styles: [":host.open{height:100vh;left:0;overflow:hidden;position:fixed;top:0;width:100%;z-index:var(--sg-z-index-modal)}:host.open>section[role=dialog]{left:50%;top:50%;transform:translate(-50%,-50%)}.body::-webkit-scrollbar{background-color:#f8f8f8;height:10px;width:10px}.body::-webkit-scrollbar-thumb{background-color:#cecece}.body::-webkit-scrollbar-track{background-color:#f8f8f8;box-shadow:inset 0 0 10px #00000040}\n"] }]
|
|
998
1003
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$1.ConfigurableFocusTrapFactory }]; }, propDecorators: { modalType: [{
|
|
999
1004
|
type: Input
|
|
1000
1005
|
}], header: [{
|
|
@@ -1147,12 +1152,12 @@ const DECLARATIONS = [
|
|
|
1147
1152
|
NggModalBodyComponent,
|
|
1148
1153
|
NggModalFooterComponent,
|
|
1149
1154
|
NggModalHeaderDirective,
|
|
1150
|
-
NggModalFooterDirective
|
|
1155
|
+
NggModalFooterDirective,
|
|
1151
1156
|
];
|
|
1152
1157
|
const EXPORTS = [
|
|
1153
1158
|
NggModalComponent,
|
|
1154
1159
|
NggModalHeaderDirective,
|
|
1155
|
-
NggModalFooterDirective
|
|
1160
|
+
NggModalFooterDirective,
|
|
1156
1161
|
];
|
|
1157
1162
|
class NggModalModule {
|
|
1158
1163
|
}
|
|
@@ -1720,10 +1725,10 @@ CellTableItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
1720
1725
|
<span *ngSwitchCase="'string'">{{ row || '–' }}</span>
|
|
1721
1726
|
<span *ngSwitchCase="'number'">{{ (row | number) || '–' }}</span>
|
|
1722
1727
|
<span *ngSwitchCase="'datetime'">{{
|
|
1723
|
-
(row | date
|
|
1728
|
+
(row | date: 'HH:mm:ss') || '–'
|
|
1724
1729
|
}}</span>
|
|
1725
1730
|
<span *ngSwitchCase="'date'">{{
|
|
1726
|
-
(row | date
|
|
1731
|
+
(row | date: 'YYYY-MM-dd') || '–'
|
|
1727
1732
|
}}</span>
|
|
1728
1733
|
<span
|
|
1729
1734
|
*ngSwitchCase="'custom-html'"
|
|
@@ -1749,10 +1754,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
1749
1754
|
<span *ngSwitchCase="'string'">{{ row || '–' }}</span>
|
|
1750
1755
|
<span *ngSwitchCase="'number'">{{ (row | number) || '–' }}</span>
|
|
1751
1756
|
<span *ngSwitchCase="'datetime'">{{
|
|
1752
|
-
(row | date
|
|
1757
|
+
(row | date: 'HH:mm:ss') || '–'
|
|
1753
1758
|
}}</span>
|
|
1754
1759
|
<span *ngSwitchCase="'date'">{{
|
|
1755
|
-
(row | date
|
|
1760
|
+
(row | date: 'YYYY-MM-dd') || '–'
|
|
1756
1761
|
}}</span>
|
|
1757
1762
|
<span
|
|
1758
1763
|
*ngSwitchCase="'custom-html'"
|