@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 { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';
|
|
12
15
|
import * as i1$1 from '@angular/cdk/a11y';
|
|
13
16
|
import { A11yModule } from '@angular/cdk/a11y';
|
|
@@ -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: [{
|
|
@@ -120,10 +123,10 @@ class NggAccordionComponent {
|
|
|
120
123
|
}
|
|
121
124
|
}
|
|
122
125
|
NggAccordionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
123
|
-
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
|
|
126
|
+
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" });
|
|
124
127
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggAccordionComponent, decorators: [{
|
|
125
128
|
type: Component,
|
|
126
|
-
args: [{ selector:
|
|
129
|
+
args: [{ selector: 'ngg-accordion', template: "<div class=\"accordion\" data-testid=\"accordion-root\">\n <ng-content></ng-content>\n</div>\n" }]
|
|
127
130
|
}], propDecorators: { items: [{
|
|
128
131
|
type: ContentChildren,
|
|
129
132
|
args: [NggAccordionListItemComponent]
|
|
@@ -143,7 +146,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
143
146
|
args: [{
|
|
144
147
|
imports: [CommonModule],
|
|
145
148
|
exports: [NggAccordionListItemComponent, NggAccordionComponent],
|
|
146
|
-
declarations: [NggAccordionListItemComponent, NggAccordionComponent]
|
|
149
|
+
declarations: [NggAccordionListItemComponent, NggAccordionComponent],
|
|
147
150
|
}]
|
|
148
151
|
}] });
|
|
149
152
|
|
|
@@ -240,7 +243,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
240
243
|
|
|
241
244
|
class NggButtonComponent {
|
|
242
245
|
get classes() {
|
|
243
|
-
return [this.variant, this.size ? this.size : false]
|
|
246
|
+
return [this.variant, this.size ? this.size : false]
|
|
247
|
+
.filter(Boolean)
|
|
248
|
+
.join(' ');
|
|
244
249
|
}
|
|
245
250
|
}
|
|
246
251
|
NggButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
@@ -251,7 +256,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
251
256
|
// eslint-disable-next-line @angular-eslint/component-selector
|
|
252
257
|
selector: '[ngg-button]',
|
|
253
258
|
template: `<ng-content></ng-content>`,
|
|
254
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
259
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
255
260
|
}]
|
|
256
261
|
}], propDecorators: { variant: [{
|
|
257
262
|
type: Input
|
|
@@ -878,7 +883,7 @@ NggModalHeaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0"
|
|
|
878
883
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggModalHeaderDirective, decorators: [{
|
|
879
884
|
type: Directive,
|
|
880
885
|
args: [{
|
|
881
|
-
selector: '[nggModalHeader]'
|
|
886
|
+
selector: '[nggModalHeader]',
|
|
882
887
|
}]
|
|
883
888
|
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
|
|
884
889
|
|
|
@@ -892,7 +897,7 @@ NggModalFooterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0"
|
|
|
892
897
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NggModalFooterDirective, decorators: [{
|
|
893
898
|
type: Directive,
|
|
894
899
|
args: [{
|
|
895
|
-
selector: '[nggModalFooter]'
|
|
900
|
+
selector: '[nggModalFooter]',
|
|
896
901
|
}]
|
|
897
902
|
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
|
|
898
903
|
|
|
@@ -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
|
}
|
|
@@ -1724,10 +1729,10 @@ CellTableItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
1724
1729
|
<span *ngSwitchCase="'string'">{{ row || '–' }}</span>
|
|
1725
1730
|
<span *ngSwitchCase="'number'">{{ (row | number) || '–' }}</span>
|
|
1726
1731
|
<span *ngSwitchCase="'datetime'">{{
|
|
1727
|
-
(row | date
|
|
1732
|
+
(row | date: 'HH:mm:ss') || '–'
|
|
1728
1733
|
}}</span>
|
|
1729
1734
|
<span *ngSwitchCase="'date'">{{
|
|
1730
|
-
(row | date
|
|
1735
|
+
(row | date: 'YYYY-MM-dd') || '–'
|
|
1731
1736
|
}}</span>
|
|
1732
1737
|
<span
|
|
1733
1738
|
*ngSwitchCase="'custom-html'"
|
|
@@ -1753,10 +1758,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
1753
1758
|
<span *ngSwitchCase="'string'">{{ row || '–' }}</span>
|
|
1754
1759
|
<span *ngSwitchCase="'number'">{{ (row | number) || '–' }}</span>
|
|
1755
1760
|
<span *ngSwitchCase="'datetime'">{{
|
|
1756
|
-
(row | date
|
|
1761
|
+
(row | date: 'HH:mm:ss') || '–'
|
|
1757
1762
|
}}</span>
|
|
1758
1763
|
<span *ngSwitchCase="'date'">{{
|
|
1759
|
-
(row | date
|
|
1764
|
+
(row | date: 'YYYY-MM-dd') || '–'
|
|
1760
1765
|
}}</span>
|
|
1761
1766
|
<span
|
|
1762
1767
|
*ngSwitchCase="'custom-html'"
|