@sebgroup/green-angular 1.8.5 → 1.10.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/esm2020/lib/modal/index.mjs +3 -1
- package/esm2020/lib/modal/modal-footer.directive.mjs +16 -0
- package/esm2020/lib/modal/modal-header.directive.mjs +16 -0
- package/esm2020/lib/modal/modal.component.mjs +16 -4
- package/esm2020/lib/modal/modal.module.mjs +13 -3
- package/esm2020/lib/slider/slider.component.mjs +6 -4
- package/fesm2015/sebgroup-green-angular.mjs +56 -8
- package/fesm2015/sebgroup-green-angular.mjs.map +1 -1
- package/fesm2020/sebgroup-green-angular.mjs +56 -8
- package/fesm2020/sebgroup-green-angular.mjs.map +1 -1
- package/lib/modal/index.d.ts +2 -0
- package/lib/modal/modal-footer.directive.d.ts +8 -0
- package/lib/modal/modal-header.directive.d.ts +8 -0
- package/lib/modal/modal.component.d.ts +7 -1
- package/lib/modal/modal.module.d.ts +5 -3
- package/lib/slider/slider.component.d.ts +2 -1
- package/package.json +3 -3
|
@@ -947,6 +947,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
947
947
|
}]
|
|
948
948
|
}] });
|
|
949
949
|
|
|
950
|
+
class NggModalHeaderDirective {
|
|
951
|
+
constructor(viewContainerRef) {
|
|
952
|
+
this.viewContainerRef = viewContainerRef;
|
|
953
|
+
}
|
|
954
|
+
}
|
|
955
|
+
NggModalHeaderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggModalHeaderDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
956
|
+
NggModalHeaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: NggModalHeaderDirective, selector: "[nggModalHeader]", ngImport: i0 });
|
|
957
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggModalHeaderDirective, decorators: [{
|
|
958
|
+
type: Directive,
|
|
959
|
+
args: [{
|
|
960
|
+
selector: '[nggModalHeader]'
|
|
961
|
+
}]
|
|
962
|
+
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
|
|
963
|
+
|
|
964
|
+
class NggModalFooterDirective {
|
|
965
|
+
constructor(viewContainerRef) {
|
|
966
|
+
this.viewContainerRef = viewContainerRef;
|
|
967
|
+
}
|
|
968
|
+
}
|
|
969
|
+
NggModalFooterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggModalFooterDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
970
|
+
NggModalFooterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: NggModalFooterDirective, selector: "[nggModalFooter]", ngImport: i0 });
|
|
971
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggModalFooterDirective, decorators: [{
|
|
972
|
+
type: Directive,
|
|
973
|
+
args: [{
|
|
974
|
+
selector: '[nggModalFooter]'
|
|
975
|
+
}]
|
|
976
|
+
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
|
|
977
|
+
|
|
950
978
|
class NggModalComponent {
|
|
951
979
|
constructor(ref, configurableFocusTrapFactory) {
|
|
952
980
|
this.ref = ref;
|
|
@@ -1038,10 +1066,10 @@ class NggModalComponent {
|
|
|
1038
1066
|
}
|
|
1039
1067
|
}
|
|
1040
1068
|
NggModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggModalComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.ConfigurableFocusTrapFactory }], target: i0.ɵɵFactoryTarget.Component });
|
|
1041
|
-
NggModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: NggModalComponent, selector: "ngg-modal", inputs: { modalType: "modalType", header: "header", confirmLabel: "confirmLabel", dismissLabel: "dismissLabel", size: "size", trapFocus: "trapFocus", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange", closed: "closed", confirm: "confirm", dismiss: "dismiss" }, host: { properties: { "class.open": "this.open" } }, viewQueries: [{ propertyName: "backdropRef", first: true, predicate: ["backdrop"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"isOpen\" [ngSwitch]=\"modalType\">\n <aside data-testid=\"modal\" *ngSwitchCase=\"'slideout'\" role=\"dialog\" aria-modal=\"true\" [class.small]=\"size === 'sm'\" [class.medium]=\"size === 'md'\" [class.large]=\"size === 'lg'\">\n <
|
|
1069
|
+
NggModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", 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 <aside data-testid=\"modal\" *ngSwitchCase=\"'slideout'\" role=\"dialog\" aria-modal=\"true\" [class.small]=\"size === 'sm'\" [class.medium]=\"size === 'md'\" [class.large]=\"size === 'lg'\">\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </aside>\n <main data-testid=\"modal\" *ngSwitchCase=\"'takeover'\" role=\"dialog\" aria-modal=\"true\">\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </main>\n <section data-testid=\"modal\" *ngSwitchDefault role=\"dialog\" aria-modal=\"true\" [class.small]=\"size === 'sm'\" [class.medium]=\"size === 'md'\" [class.large]=\"size === 'lg'\">\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </section>\n <ng-template #contentTemplate>\n <ng-container *ngIf=\"!hideHeader\">\n <header *ngIf=\"!modalHeaderContent; else headerContentTemplate\" ngg-modal-header data-testid=\"modal-header\" [header]=\"header\" (closed)=\"this.handleCloseClick($event)\"></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 *ngIf=\"!modalFooterContent; else footerContentTemplate\" ngg-modal-footer data-testid=\"modal-footer\" [dismissLabel]=\"dismissLabel\" [confirmLabel]=\"confirmLabel\" (dismiss)=\"this.handleDismiss($event)\" (confirm)=\"this.handleConfirm($event)\"></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 #backdrop data-testid=\"modal-backdrop\" class=\"backdrop\" (click)=\"this.handleBackdropClick($event)\" [attr.aria-hidden]=\"true\"></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-backdrop)}: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 });
|
|
1042
1070
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggModalComponent, decorators: [{
|
|
1043
1071
|
type: Component,
|
|
1044
|
-
args: [{ selector: 'ngg-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"isOpen\" [ngSwitch]=\"modalType\">\n <aside data-testid=\"modal\" *ngSwitchCase=\"'slideout'\" role=\"dialog\" aria-modal=\"true\" [class.small]=\"size === 'sm'\" [class.medium]=\"size === 'md'\" [class.large]=\"size === 'lg'\">\n <
|
|
1072
|
+
args: [{ selector: 'ngg-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"isOpen\" [ngSwitch]=\"modalType\">\n <aside data-testid=\"modal\" *ngSwitchCase=\"'slideout'\" role=\"dialog\" aria-modal=\"true\" [class.small]=\"size === 'sm'\" [class.medium]=\"size === 'md'\" [class.large]=\"size === 'lg'\">\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </aside>\n <main data-testid=\"modal\" *ngSwitchCase=\"'takeover'\" role=\"dialog\" aria-modal=\"true\">\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </main>\n <section data-testid=\"modal\" *ngSwitchDefault role=\"dialog\" aria-modal=\"true\" [class.small]=\"size === 'sm'\" [class.medium]=\"size === 'md'\" [class.large]=\"size === 'lg'\">\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n </section>\n <ng-template #contentTemplate>\n <ng-container *ngIf=\"!hideHeader\">\n <header *ngIf=\"!modalHeaderContent; else headerContentTemplate\" ngg-modal-header data-testid=\"modal-header\" [header]=\"header\" (closed)=\"this.handleCloseClick($event)\"></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 *ngIf=\"!modalFooterContent; else footerContentTemplate\" ngg-modal-footer data-testid=\"modal-footer\" [dismissLabel]=\"dismissLabel\" [confirmLabel]=\"confirmLabel\" (dismiss)=\"this.handleDismiss($event)\" (confirm)=\"this.handleConfirm($event)\"></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 #backdrop data-testid=\"modal-backdrop\" class=\"backdrop\" (click)=\"this.handleBackdropClick($event)\" [attr.aria-hidden]=\"true\"></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-backdrop)}: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"] }]
|
|
1045
1073
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$1.ConfigurableFocusTrapFactory }]; }, propDecorators: { modalType: [{
|
|
1046
1074
|
type: Input
|
|
1047
1075
|
}], header: [{
|
|
@@ -1052,6 +1080,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1052
1080
|
type: Input
|
|
1053
1081
|
}], size: [{
|
|
1054
1082
|
type: Input
|
|
1083
|
+
}], hideHeader: [{
|
|
1084
|
+
type: Input
|
|
1085
|
+
}], hideFooter: [{
|
|
1086
|
+
type: Input
|
|
1055
1087
|
}], trapFocus: [{
|
|
1056
1088
|
type: Input
|
|
1057
1089
|
}], isOpen: [{
|
|
@@ -1070,6 +1102,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1070
1102
|
}], backdropRef: [{
|
|
1071
1103
|
type: ViewChild,
|
|
1072
1104
|
args: ['backdrop']
|
|
1105
|
+
}], modalHeaderContent: [{
|
|
1106
|
+
type: ContentChild,
|
|
1107
|
+
args: [NggModalHeaderDirective]
|
|
1108
|
+
}], modalFooterContent: [{
|
|
1109
|
+
type: ContentChild,
|
|
1110
|
+
args: [NggModalFooterDirective]
|
|
1073
1111
|
}] } });
|
|
1074
1112
|
class NggModalHeaderComponent {
|
|
1075
1113
|
constructor() {
|
|
@@ -1146,10 +1184,14 @@ const DECLARATIONS = [
|
|
|
1146
1184
|
NggModalComponent,
|
|
1147
1185
|
NggModalHeaderComponent,
|
|
1148
1186
|
NggModalBodyComponent,
|
|
1149
|
-
NggModalFooterComponent
|
|
1187
|
+
NggModalFooterComponent,
|
|
1188
|
+
NggModalHeaderDirective,
|
|
1189
|
+
NggModalFooterDirective
|
|
1150
1190
|
];
|
|
1151
1191
|
const EXPORTS = [
|
|
1152
1192
|
NggModalComponent,
|
|
1193
|
+
NggModalHeaderDirective,
|
|
1194
|
+
NggModalFooterDirective
|
|
1153
1195
|
];
|
|
1154
1196
|
class NggModalModule {
|
|
1155
1197
|
}
|
|
@@ -1157,7 +1199,11 @@ NggModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version:
|
|
|
1157
1199
|
NggModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: NggModalModule, declarations: [NggModalComponent,
|
|
1158
1200
|
NggModalHeaderComponent,
|
|
1159
1201
|
NggModalBodyComponent,
|
|
1160
|
-
NggModalFooterComponent
|
|
1202
|
+
NggModalFooterComponent,
|
|
1203
|
+
NggModalHeaderDirective,
|
|
1204
|
+
NggModalFooterDirective], imports: [A11yModule, CommonModule], exports: [NggModalComponent,
|
|
1205
|
+
NggModalHeaderDirective,
|
|
1206
|
+
NggModalFooterDirective] });
|
|
1161
1207
|
NggModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggModalModule, imports: [A11yModule, CommonModule] });
|
|
1162
1208
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggModalModule, decorators: [{
|
|
1163
1209
|
type: NgModule,
|
|
@@ -1337,13 +1383,13 @@ class NggSliderComponent {
|
|
|
1337
1383
|
}
|
|
1338
1384
|
}
|
|
1339
1385
|
NggSliderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1340
|
-
NggSliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: NggSliderComponent, selector: "ngg-slider", inputs: { name: "name", min: "min", max: "max", step: "step", label: "label", instruction: "instruction", placeholder: "placeholder", errorMessage: "errorMessage", hasTextbox: "hasTextbox", unitLabel: "unitLabel", disabled: "disabled", value: "value" }, outputs: { sliderChange: "sliderChange", sliderTouch: "sliderTouch" }, providers: [
|
|
1386
|
+
NggSliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: NggSliderComponent, selector: "ngg-slider", inputs: { name: "name", min: "min", max: "max", step: "step", label: "label", instruction: "instruction", placeholder: "placeholder", errorMessage: "errorMessage", hasTextbox: "hasTextbox", unitLabel: "unitLabel", disabled: "disabled", value: "value", enterkeyhint: "enterkeyhint" }, outputs: { sliderChange: "sliderChange", sliderTouch: "sliderTouch" }, providers: [
|
|
1341
1387
|
{
|
|
1342
1388
|
provide: NG_VALUE_ACCESSOR,
|
|
1343
1389
|
useExisting: NggSliderComponent,
|
|
1344
1390
|
multi: true,
|
|
1345
1391
|
},
|
|
1346
|
-
], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!!label\" class=\"gds-slider-label-container\">\n <div>\n <label [attr.for]=\"name\" [attr.id]=\"name + '-label'\">{{ label }}</label>\n <p *ngIf=\"!!instruction\">{{ instruction }}</p>\n </div>\n <ng-container *ngIf=\"hasTextbox\">\n <ng-container *ngIf=\"!!unitLabel\">\n <div class=\"group group-border\">\n <ng-container *ngTemplateOutlet=\"inputField\"></ng-container>\n <span class=\"form-text\">{{ unitLabel }}</span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"!unitLabel\">\n <ng-container *ngTemplateOutlet=\"inputField\"></ng-container>\n </ng-container>\n </ng-container>\n</div>\n\n<input\n type=\"range\"\n [attr.id]=\"name\"\n [attr.name]=\"name\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.step]=\"step\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"value\"\n [ngStyle]=\"style\"\n (blur)=\"onBlur()\"\n (input)=\"handleChange()\"\n/>\n\n<p *ngIf=\"!!errorMessage\" class=\"gds-slider-error-info\">\n {{ errorMessage }}\n</p>\n\n<ng-template #inputField>\n <input\n type=\"
|
|
1392
|
+
], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!!label\" class=\"gds-slider-label-container\">\n <div>\n <label [attr.for]=\"name\" [attr.id]=\"name + '-label'\">{{ label }}</label>\n <p *ngIf=\"!!instruction\">{{ instruction }}</p>\n </div>\n <ng-container *ngIf=\"hasTextbox\">\n <ng-container *ngIf=\"!!unitLabel\">\n <div class=\"group group-border\">\n <ng-container *ngTemplateOutlet=\"inputField\"></ng-container>\n <span class=\"form-text\">{{ unitLabel }}</span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"!unitLabel\">\n <ng-container *ngTemplateOutlet=\"inputField\"></ng-container>\n </ng-container>\n </ng-container>\n</div>\n\n<input\n type=\"range\"\n [attr.id]=\"name\"\n [attr.name]=\"name\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.step]=\"step\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"value\"\n [ngStyle]=\"style\"\n (blur)=\"onBlur()\"\n (input)=\"handleChange()\"\n/>\n\n<p *ngIf=\"!!errorMessage\" class=\"gds-slider-error-info\">\n {{ errorMessage }}\n</p>\n\n<ng-template #inputField>\n <input\n type=\"text\"\n inputmode=\"numeric\"\n pattern=\"[0-9]*\"\n [(ngModel)]=\"value\"\n [class.is-invalid]=\"!!errorMessage\"\n [attr.name]=\"name\"\n [attr.id]=\"name + '-textbox'\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-labelledby]=\"name + '-label'\"\n [attr.enterkeyhint]=\"enterkeyhint\"\n [disabled]=\"disabled\"\n (blur)=\"onBlur()\"\n (input)=\"handleChange()\"\n />\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1347
1393
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NggSliderComponent, decorators: [{
|
|
1348
1394
|
type: Component,
|
|
1349
1395
|
args: [{ selector: 'ngg-slider', providers: [
|
|
@@ -1352,7 +1398,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1352
1398
|
useExisting: NggSliderComponent,
|
|
1353
1399
|
multi: true,
|
|
1354
1400
|
},
|
|
1355
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"!!label\" class=\"gds-slider-label-container\">\n <div>\n <label [attr.for]=\"name\" [attr.id]=\"name + '-label'\">{{ label }}</label>\n <p *ngIf=\"!!instruction\">{{ instruction }}</p>\n </div>\n <ng-container *ngIf=\"hasTextbox\">\n <ng-container *ngIf=\"!!unitLabel\">\n <div class=\"group group-border\">\n <ng-container *ngTemplateOutlet=\"inputField\"></ng-container>\n <span class=\"form-text\">{{ unitLabel }}</span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"!unitLabel\">\n <ng-container *ngTemplateOutlet=\"inputField\"></ng-container>\n </ng-container>\n </ng-container>\n</div>\n\n<input\n type=\"range\"\n [attr.id]=\"name\"\n [attr.name]=\"name\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.step]=\"step\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"value\"\n [ngStyle]=\"style\"\n (blur)=\"onBlur()\"\n (input)=\"handleChange()\"\n/>\n\n<p *ngIf=\"!!errorMessage\" class=\"gds-slider-error-info\">\n {{ errorMessage }}\n</p>\n\n<ng-template #inputField>\n <input\n type=\"
|
|
1401
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"!!label\" class=\"gds-slider-label-container\">\n <div>\n <label [attr.for]=\"name\" [attr.id]=\"name + '-label'\">{{ label }}</label>\n <p *ngIf=\"!!instruction\">{{ instruction }}</p>\n </div>\n <ng-container *ngIf=\"hasTextbox\">\n <ng-container *ngIf=\"!!unitLabel\">\n <div class=\"group group-border\">\n <ng-container *ngTemplateOutlet=\"inputField\"></ng-container>\n <span class=\"form-text\">{{ unitLabel }}</span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"!unitLabel\">\n <ng-container *ngTemplateOutlet=\"inputField\"></ng-container>\n </ng-container>\n </ng-container>\n</div>\n\n<input\n type=\"range\"\n [attr.id]=\"name\"\n [attr.name]=\"name\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.step]=\"step\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"value\"\n [ngStyle]=\"style\"\n (blur)=\"onBlur()\"\n (input)=\"handleChange()\"\n/>\n\n<p *ngIf=\"!!errorMessage\" class=\"gds-slider-error-info\">\n {{ errorMessage }}\n</p>\n\n<ng-template #inputField>\n <input\n type=\"text\"\n inputmode=\"numeric\"\n pattern=\"[0-9]*\"\n [(ngModel)]=\"value\"\n [class.is-invalid]=\"!!errorMessage\"\n [attr.name]=\"name\"\n [attr.id]=\"name + '-textbox'\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-labelledby]=\"name + '-label'\"\n [attr.enterkeyhint]=\"enterkeyhint\"\n [disabled]=\"disabled\"\n (blur)=\"onBlur()\"\n (input)=\"handleChange()\"\n />\n</ng-template>\n" }]
|
|
1356
1402
|
}], propDecorators: { name: [{
|
|
1357
1403
|
type: Input
|
|
1358
1404
|
}], min: [{
|
|
@@ -1377,6 +1423,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1377
1423
|
type: Input
|
|
1378
1424
|
}], value: [{
|
|
1379
1425
|
type: Input
|
|
1426
|
+
}], enterkeyhint: [{
|
|
1427
|
+
type: Input
|
|
1380
1428
|
}], sliderChange: [{
|
|
1381
1429
|
type: Output
|
|
1382
1430
|
}], sliderTouch: [{
|
|
@@ -1635,5 +1683,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1635
1683
|
* Generated bundle index. Do not edit.
|
|
1636
1684
|
*/
|
|
1637
1685
|
|
|
1638
|
-
export { NggAccordionComponent, NggAccordionListItemComponent, NggAccordionModule, NggBadgeComponent, NggBadgeModule, NggButtonComponent, NggButtonModule, NggContextMenuComponent, NggContextMenuModule, NggDatepickerComponent, NggDatepickerModule, NggDropdownButtonDirective, NggDropdownComponent, NggDropdownModule, NggDropdownOptionDirective, NggInPageWizardModule, NggInPageWizardStepCardComponent, NggModalBodyComponent, NggModalComponent, NggModalFooterComponent, NggModalHeaderComponent, NggModalModule, NggModule, NggOnScrollDirective, NggPaginationComponent, NggPaginationModule, NggProgressCircleComponent, NggProgressCircleModule, NggSegmentedControlComponent, NggSegmentedControlModule, NggSharedModule, NggSliderComponent, NggSliderModule, ON_SCROLL_TOKEN, dateValidator };
|
|
1686
|
+
export { NggAccordionComponent, NggAccordionListItemComponent, NggAccordionModule, NggBadgeComponent, NggBadgeModule, NggButtonComponent, NggButtonModule, NggContextMenuComponent, NggContextMenuModule, NggDatepickerComponent, NggDatepickerModule, NggDropdownButtonDirective, NggDropdownComponent, NggDropdownModule, NggDropdownOptionDirective, NggInPageWizardModule, NggInPageWizardStepCardComponent, NggModalBodyComponent, NggModalComponent, NggModalFooterComponent, NggModalFooterDirective, NggModalHeaderComponent, NggModalHeaderDirective, NggModalModule, NggModule, NggOnScrollDirective, NggPaginationComponent, NggPaginationModule, NggProgressCircleComponent, NggProgressCircleModule, NggSegmentedControlComponent, NggSegmentedControlModule, NggSharedModule, NggSliderComponent, NggSliderModule, ON_SCROLL_TOKEN, dateValidator };
|
|
1639
1687
|
//# sourceMappingURL=sebgroup-green-angular.mjs.map
|