@webilix/ngx-form-m3 0.0.53 → 0.0.54

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.
@@ -2043,7 +2043,7 @@ class InputTimeComponent {
2043
2043
  this.setValue();
2044
2044
  }
2045
2045
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: InputTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2046
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: InputTimeComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-time" } }, usesOnChanges: true, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u0633\u0627\u0639\u062A' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>&nbsp;</span>\n <mat-icon (click)=\"formControl.value ? resetTime() : setNow(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'access_time' }}\n </mat-icon>\n </span>\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <div class=\"ngx-helper-form-m3-time-input\">\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"hourMenu\"\n [disabled]=\"formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n >\n {{ hour }}\n </button>\n <mat-menu #hourMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-hour\" [xPosition]=\"'before'\">\n @for (h of hours; track $index) {\n <button mat-menu-item (click)=\"setHour(h)\" [disabled]=\"hour === h || formControl.disabled\">\n <span class=\"hour\">{{ h }}</span>\n </button>\n }\n </mat-menu>\n\n <div class=\"colon\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">:</div>\n\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"minuteMenu\"\n [disabled]=\"hour === '--' || formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"hour === '--' || formControl.disabled\"\n >\n {{ minute }}\n </button>\n <mat-menu #minuteMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-minute\" [xPosition]=\"'before'\">\n @for (m of minutes; track $index) {\n <button mat-menu-item (click)=\"setMinute(m)\" [disabled]=\"minute === m || formControl.disabled\">\n <span class=\"minute\">{{ m }}</span>\n </button>\n }\n </mat-menu>\n\n <!-- SECOND -->\n @if (input.showSeconds) {\n <div class=\"colon\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">:</div>\n\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"secondMenu\"\n [disabled]=\"hour === '--' || formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"hour === '--' || formControl.disabled\"\n >\n {{ second }}\n </button>\n <mat-menu #secondMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-second\" [xPosition]=\"'before'\">\n @for (s of seconds; track $index) {\n <button mat-menu-item (click)=\"setSecond(s)\" [disabled]=\"second === s || formControl.disabled\">\n <span class=\"second\">{{ s }}</span>\n </button>\n }\n </mat-menu>\n }\n </div>\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
2046
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: InputTimeComponent, isStandalone: true, selector: "ng-component", inputs: { values: "values", isButtonDisabled: "isButtonDisabled" }, host: { attributes: { "selector": "input-time" } }, usesOnChanges: true, ngImport: i0, template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u0633\u0627\u0639\u062A' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>&nbsp;</span>\n <mat-icon (click)=\"formControl.value ? resetTime() : setNow(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'access_time' }}\n </mat-icon>\n </span>\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <div class=\"ngx-helper-form-m3-time-input\">\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"hourMenu\"\n [disabled]=\"formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n >\n {{ hour }}\n </button>\n <mat-menu #hourMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-hour\" [xPosition]=\"'before'\">\n @for (h of hours; track $index) {\n <button\n mat-menu-item\n (click)=\"setHour(h)\"\n [class.selected]=\"h === hour\"\n [disabled]=\"h === hour || formControl.disabled\"\n >\n <span class=\"hour\">{{ h }}</span>\n </button>\n }\n </mat-menu>\n\n <div class=\"colon\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">:</div>\n\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"minuteMenu\"\n [disabled]=\"hour === '--' || formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"hour === '--' || formControl.disabled\"\n >\n {{ minute }}\n </button>\n <mat-menu #minuteMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-minute\" [xPosition]=\"'before'\">\n @for (m of minutes; track $index) {\n <button\n mat-menu-item\n (click)=\"setMinute(m)\"\n [class.selected]=\"m === minute\"\n [disabled]=\"m === minute || formControl.disabled\"\n >\n <span class=\"minute\" [style.color]=\"+m % 5 === 0 ? 'var(--secondary)' : ''\">{{ m }}</span>\n </button>\n }\n </mat-menu>\n\n <!-- SECOND -->\n @if (input.showSeconds) {\n <div class=\"colon\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">:</div>\n\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"secondMenu\"\n [disabled]=\"hour === '--' || formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"hour === '--' || formControl.disabled\"\n >\n {{ second }}\n </button>\n <mat-menu #secondMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-second\" [xPosition]=\"'before'\">\n @for (s of seconds; track $index) {\n <button\n mat-menu-item\n (click)=\"setSecond(s)\"\n [class.selected]=\"s === second\"\n [disabled]=\"s === second || formControl.disabled\"\n >\n <span class=\"second\" [style.color]=\"+s % 5 === 0 ? 'var(--secondary)' : ''\">{{ s }}</span>\n </button>\n }\n </mat-menu>\n }\n </div>\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "pipe", type: InputErrorPipe, name: "InputErrorPipe" }, { kind: "pipe", type: MultiLinePipe, name: "MultiLinePipe" }] });
2047
2047
  }
2048
2048
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: InputTimeComponent, decorators: [{
2049
2049
  type: Component,
@@ -2058,7 +2058,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
2058
2058
  MatSelectModule,
2059
2059
  InputErrorPipe,
2060
2060
  MultiLinePipe,
2061
- ], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u0633\u0627\u0639\u062A' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>&nbsp;</span>\n <mat-icon (click)=\"formControl.value ? resetTime() : setNow(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'access_time' }}\n </mat-icon>\n </span>\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <div class=\"ngx-helper-form-m3-time-input\">\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"hourMenu\"\n [disabled]=\"formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n >\n {{ hour }}\n </button>\n <mat-menu #hourMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-hour\" [xPosition]=\"'before'\">\n @for (h of hours; track $index) {\n <button mat-menu-item (click)=\"setHour(h)\" [disabled]=\"hour === h || formControl.disabled\">\n <span class=\"hour\">{{ h }}</span>\n </button>\n }\n </mat-menu>\n\n <div class=\"colon\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">:</div>\n\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"minuteMenu\"\n [disabled]=\"hour === '--' || formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"hour === '--' || formControl.disabled\"\n >\n {{ minute }}\n </button>\n <mat-menu #minuteMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-minute\" [xPosition]=\"'before'\">\n @for (m of minutes; track $index) {\n <button mat-menu-item (click)=\"setMinute(m)\" [disabled]=\"minute === m || formControl.disabled\">\n <span class=\"minute\">{{ m }}</span>\n </button>\n }\n </mat-menu>\n\n <!-- SECOND -->\n @if (input.showSeconds) {\n <div class=\"colon\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">:</div>\n\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"secondMenu\"\n [disabled]=\"hour === '--' || formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"hour === '--' || formControl.disabled\"\n >\n {{ second }}\n </button>\n <mat-menu #secondMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-second\" [xPosition]=\"'before'\">\n @for (s of seconds; track $index) {\n <button mat-menu-item (click)=\"setSecond(s)\" [disabled]=\"second === s || formControl.disabled\">\n <span class=\"second\">{{ s }}</span>\n </button>\n }\n </mat-menu>\n }\n </div>\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n" }]
2061
+ ], template: "<mat-form-field [appearance]=\"input.appearance || config.appearance\" [floatLabel]=\"formControl.value ? 'always' : 'auto'\">\n <mat-label>{{ input.title || '\u0633\u0627\u0639\u062A' }}</mat-label>\n @if (formControl.invalid) { <mat-error>{{ formControl.errors | InputErrorPipe : input.type }}</mat-error> }\n\n <!-- HINT -->\n @if (input.hint) { <mat-hint>{{ input.hint }}</mat-hint> }\n\n <!-- SUFFIX -->\n <span matTextSuffix class=\"ngx-form-m3-input-suffix click\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">\n <span>&nbsp;</span>\n <mat-icon (click)=\"formControl.value ? resetTime() : setNow(); formControl.markAsTouched()\">\n {{ formControl.value ? 'close' : 'access_time' }}\n </mat-icon>\n </span>\n\n <!-- BUTTON -->\n @if (input.button) {\n <span matIconSuffix>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"isButtonDisabled\"\n (click)=\"input.button.onClick(values)\"\n [tabIndex]=\"-1\"\n >\n <mat-icon [style.color]=\"isButtonDisabled ? undefined : input.button.color\">\n {{ input.button.icon }}\n </mat-icon>\n </button>\n </span>\n }\n\n <!-- INPUT -->\n <input matInput type=\"text\" [name]=\"input.name\" [formControl]=\"formControl\" [style.display]=\"'none !important'\" />\n <div class=\"ngx-helper-form-m3-time-input\">\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"hourMenu\"\n [disabled]=\"formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n >\n {{ hour }}\n </button>\n <mat-menu #hourMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-hour\" [xPosition]=\"'before'\">\n @for (h of hours; track $index) {\n <button\n mat-menu-item\n (click)=\"setHour(h)\"\n [class.selected]=\"h === hour\"\n [disabled]=\"h === hour || formControl.disabled\"\n >\n <span class=\"hour\">{{ h }}</span>\n </button>\n }\n </mat-menu>\n\n <div class=\"colon\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">:</div>\n\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"minuteMenu\"\n [disabled]=\"hour === '--' || formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"hour === '--' || formControl.disabled\"\n >\n {{ minute }}\n </button>\n <mat-menu #minuteMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-minute\" [xPosition]=\"'before'\">\n @for (m of minutes; track $index) {\n <button\n mat-menu-item\n (click)=\"setMinute(m)\"\n [class.selected]=\"m === minute\"\n [disabled]=\"m === minute || formControl.disabled\"\n >\n <span class=\"minute\" [style.color]=\"+m % 5 === 0 ? 'var(--secondary)' : ''\">{{ m }}</span>\n </button>\n }\n </mat-menu>\n\n <!-- SECOND -->\n @if (input.showSeconds) {\n <div class=\"colon\" [class.ngx-form-m3-disabled-input]=\"formControl.disabled\">:</div>\n\n <button\n mat-button\n type=\"button\"\n [matMenuTriggerFor]=\"secondMenu\"\n [disabled]=\"hour === '--' || formControl.disabled\"\n [class.ngx-form-m3-disabled-input]=\"hour === '--' || formControl.disabled\"\n >\n {{ second }}\n </button>\n <mat-menu #secondMenu=\"matMenu\" class=\"ngx-helper-form-m3-time-input-second\" [xPosition]=\"'before'\">\n @for (s of seconds; track $index) {\n <button\n mat-menu-item\n (click)=\"setSecond(s)\"\n [class.selected]=\"s === second\"\n [disabled]=\"s === second || formControl.disabled\"\n >\n <span class=\"second\" [style.color]=\"+s % 5 === 0 ? 'var(--secondary)' : ''\">{{ s }}</span>\n </button>\n }\n </mat-menu>\n }\n </div>\n\n <!-- DESCRIPTION -->\n @if (input.description) {\n <div\n class=\"ngx-form-m3-input-description\"\n [class.ngx-form-m3-disabled-input]=\"formControl.disabled\"\n [innerHTML]=\"input.description | MultiLinePipe\"\n ></div>\n }\n</mat-form-field>\n" }]
2062
2062
  }], propDecorators: { values: [{
2063
2063
  type: Input,
2064
2064
  args: [{ required: true }]