@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
293 lines • 14.9 kB
TypeScript
import { OnDestroy } from '@angular/core';
import { ControlValueAccessor, FormBuilder } from '@angular/forms';
import { FilesService, ThemeSwitcherService } from '@c8y/ngx-components';
import { BrandingOptionsJson, BrandingShadesService } from '@c8y/ngx-components/branding/shared/data';
import { Observable } from 'rxjs';
import { ActivatedRoute } from '@angular/router';
import * as i0 from "@angular/core";
export declare class BrandingThemeFormComponent implements ControlValueAccessor, OnDestroy {
private activatedRoute;
private formBuilder;
private filesService;
private brandingShades;
private themeSwitcher;
readonly formStructure: {
readonly brandColors: {
readonly label: "Brand colors";
readonly brandColors: {
readonly label: "Brand colors";
readonly colors: [{
readonly label: "Brand primary";
readonly formControlName: "brand-primary";
}, {
readonly label: "Brand light";
readonly formControlName: "brand-light";
}, {
readonly label: "Brand dark";
readonly formControlName: "brand-dark";
}];
};
readonly shades: {
readonly label: "Shades";
readonly colorColumn: [[{
readonly label: "c8y-brand-10";
readonly formControlName: "c8y-brand-10";
}, {
readonly label: "c8y-brand-20";
readonly formControlName: "c8y-brand-20";
}, {
readonly label: "c8y-brand-30";
readonly formControlName: "c8y-brand-30";
}, {
readonly label: "c8y-brand-40";
readonly formControlName: "c8y-brand-40";
}], [{
readonly label: "c8y-brand-50";
readonly formControlName: "c8y-brand-50";
}, {
readonly label: "c8y-brand-60";
readonly formControlName: "c8y-brand-60";
}, {
readonly label: "c8y-brand-70";
readonly formControlName: "c8y-brand-70";
}, {
readonly label: "c8y-brand-80";
readonly formControlName: "c8y-brand-80";
}]];
};
};
readonly statusColors: {
readonly label: "Status colors";
readonly subCategories: readonly [{
readonly label: "Info colors";
readonly colors: [{
readonly label: "Info";
readonly formControlName: "palette-status-info";
}, {
readonly label: "Info light";
readonly formControlName: "palette-status-info-light";
}, {
readonly label: "Info dark";
readonly formControlName: "palette-status-info-dark";
}];
}, {
readonly label: "Warning colors";
readonly colors: [{
readonly label: "Warning";
readonly formControlName: "palette-status-warning";
}, {
readonly label: "Warning light";
readonly formControlName: "palette-status-warning-light";
}, {
readonly label: "Warning dark";
readonly formControlName: "palette-status-warning-dark";
}];
}, {
readonly label: "Danger colors";
readonly colors: [{
readonly label: "Danger";
readonly formControlName: "palette-status-danger";
}, {
readonly label: "Danger light";
readonly formControlName: "palette-status-danger-light";
}, {
readonly label: "Danger dark";
readonly formControlName: "palette-status-danger-dark";
}];
}, {
readonly label: "Success colors";
readonly colors: [{
readonly label: "Success";
readonly formControlName: "palette-status-success";
}, {
readonly label: "Success light";
readonly formControlName: "palette-status-success-light";
}, {
readonly label: "Success dark";
readonly formControlName: "palette-status-success-dark";
}];
}];
};
readonly actionBar: {
readonly label: "Action bar";
readonly colorColumns: readonly [{
readonly label: "Action bar";
readonly colorColumns: [[{
readonly label: "Background color";
readonly formControlName: "action-bar-background-default";
}, {
readonly label: "Text color";
readonly formControlName: "action-bar-color-default";
}, {
readonly label: "Icon color";
readonly formControlName: "action-bar-icon-color";
}], [{
readonly label: "Button color";
readonly formControlName: "action-bar-color-actions";
}, {
readonly label: "Button hover color";
readonly formControlName: "action-bar-color-actions-hover";
}]];
}];
};
readonly mainHeader: {
readonly label: "Main header";
readonly colorColumns: readonly [{
readonly label: "Main header";
readonly colorColumns: [[{
readonly label: "Background color";
readonly formControlName: "header-color";
}, {
readonly label: "Text color";
readonly formControlName: "header-text-color";
}], [{
readonly label: "Button hover color";
readonly formControlName: "header-hover-color";
}]];
}];
};
readonly navigator: {
readonly label: "Navigator";
readonly colorColumns: readonly [{
readonly label: "Navigation";
readonly colors: [{
readonly label: "Background color";
readonly formControlName: "navigator-bg-color";
}, {
readonly label: "Text color";
readonly formControlName: "navigator-text-color";
}, {
readonly label: "Separator color";
readonly formControlName: "navigator-separator-color";
}];
}, {
readonly label: "Header";
readonly colors: [{
readonly label: "Header background color";
readonly formControlName: "navigator-header-bg";
}, {
readonly label: "Title color";
readonly formControlName: "navigator-title-color";
}];
}, {
readonly label: "Active node";
readonly colors: [{
readonly label: "Active background color";
readonly formControlName: "navigator-active-bg";
}, {
readonly label: "Active border color";
readonly formControlName: "navigator-border-active";
}, {
readonly label: "Active text color";
readonly formControlName: "navigator-color-active";
}];
}];
};
readonly rightDrawer: {
readonly label: "Right drawer";
readonly colorColumns: readonly [{
readonly label: "Panel";
readonly colors: [{
readonly label: "Background color";
readonly formControlName: "right-drawer-background-default";
}, {
readonly label: "Text color";
readonly formControlName: "right-drawer-text-color-default";
}, {
readonly label: "Text muted color";
readonly formControlName: "right-drawer-text-muted";
}, {
readonly label: "Separator color";
readonly formControlName: "right-drawer-separator-color";
}];
}, {
readonly label: "Interactive";
readonly colors: [{
readonly label: "Link color";
readonly formControlName: "right-drawer-link-color";
}, {
readonly label: "Link hover color";
readonly formControlName: "right-drawer-link-color-hover";
}];
}];
};
};
formGroup: ReturnType<BrandingThemeFormComponent['initForm']>;
imageFileExtensions: string[];
resetShadesButtonEnabled$: Observable<boolean>;
private onTouched;
private externalValue;
private formGroupValueChanges$;
private addDarkThemePrefix;
private readonly varsToConvertToHeight;
constructor(activatedRoute: ActivatedRoute, formBuilder: FormBuilder, filesService: FilesService, brandingShades: BrandingShadesService, themeSwitcher: ThemeSwitcherService);
ngOnDestroy(): void;
regenerateShadesBasedOnPrimaryColor(color?: string): void;
writeValue(obj: string): void;
registerOnChange(fn: (value: string) => void): void;
registerOnTouched(fn: () => void): void;
onBlur(): void;
initForm(): import("@angular/forms").FormGroup<{
"navigator-platform-logo-height": import("@angular/forms").FormControl<string | number>;
"brand-logo-img-height": import("@angular/forms").FormControl<number>;
"btn-border-radius-base": import("@angular/forms").FormControl<number>;
"brand-logo-img": import("@angular/forms").FormControl<string>;
"navigator-platform-logo": import("@angular/forms").FormControl<string>;
"brand-dark": import("@angular/forms").FormControl<string>;
"brand-light": import("@angular/forms").FormControl<string>;
"brand-primary": import("@angular/forms").FormControl<string>;
"c8y-brand-10": import("@angular/forms").FormControl<string>;
"c8y-brand-20": import("@angular/forms").FormControl<string>;
"c8y-brand-30": import("@angular/forms").FormControl<string>;
"c8y-brand-40": import("@angular/forms").FormControl<string>;
"c8y-brand-50": import("@angular/forms").FormControl<string>;
"c8y-brand-60": import("@angular/forms").FormControl<string>;
"c8y-brand-70": import("@angular/forms").FormControl<string>;
"c8y-brand-80": import("@angular/forms").FormControl<string>;
"palette-status-info": import("@angular/forms").FormControl<string>;
"palette-status-warning": import("@angular/forms").FormControl<string>;
"palette-status-success": import("@angular/forms").FormControl<string>;
"palette-status-danger": import("@angular/forms").FormControl<string>;
"palette-status-info-light": import("@angular/forms").FormControl<string>;
"palette-status-warning-light": import("@angular/forms").FormControl<string>;
"palette-status-success-light": import("@angular/forms").FormControl<string>;
"palette-status-danger-light": import("@angular/forms").FormControl<string>;
"palette-status-info-dark": import("@angular/forms").FormControl<string>;
"palette-status-warning-dark": import("@angular/forms").FormControl<string>;
"palette-status-success-dark": import("@angular/forms").FormControl<string>;
"palette-status-danger-dark": import("@angular/forms").FormControl<string>;
"body-background-color": import("@angular/forms").FormControl<string>;
"text-color": import("@angular/forms").FormControl<string>;
"text-muted": import("@angular/forms").FormControl<string>;
"link-color": import("@angular/forms").FormControl<string>;
"link-hover-color": import("@angular/forms").FormControl<string>;
"action-bar-background-default": import("@angular/forms").FormControl<string>;
"action-bar-color-actions-hover": import("@angular/forms").FormControl<string>;
"action-bar-color-actions": import("@angular/forms").FormControl<string>;
"action-bar-color-default": import("@angular/forms").FormControl<string>;
"action-bar-icon-color": import("@angular/forms").FormControl<string>;
"header-color": import("@angular/forms").FormControl<string>;
"header-text-color": import("@angular/forms").FormControl<string>;
"header-hover-color": import("@angular/forms").FormControl<string>;
"navigator-bg-color": import("@angular/forms").FormControl<string>;
"navigator-active-bg": import("@angular/forms").FormControl<string>;
"navigator-border-active": import("@angular/forms").FormControl<string>;
"navigator-header-bg": import("@angular/forms").FormControl<string>;
"navigator-title-color": import("@angular/forms").FormControl<string>;
"navigator-separator-color": import("@angular/forms").FormControl<string>;
"navigator-text-color": import("@angular/forms").FormControl<string>;
"navigator-color-active": import("@angular/forms").FormControl<string>;
"right-drawer-background-default": import("@angular/forms").FormControl<string>;
"right-drawer-text-color-default": import("@angular/forms").FormControl<string>;
"right-drawer-separator-color": import("@angular/forms").FormControl<string>;
"right-drawer-link-color": import("@angular/forms").FormControl<string>;
"right-drawer-link-color-hover": import("@angular/forms").FormControl<string>;
"right-drawer-text-muted": import("@angular/forms").FormControl<string>;
}>;
applyStateToForm(branding: BrandingOptionsJson): void;
convertFormToState(value: BrandingThemeFormComponent['formGroup']['value']): string;
private getPrefix;
static ɵfac: i0.ɵɵFactoryDeclaration<BrandingThemeFormComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<BrandingThemeFormComponent, "c8y-branding-theme-form", never, {}, {}, never, never, true, never>;
}
//# sourceMappingURL=branding-theme-form.component.d.ts.map