@lithiumjs/ngx-material-theming/index.d.ts

Dynamic and customizable Angular Material theming made easy.

import * as i0 from '@angular/core';
import { ChangeDetectorRef } from '@angular/core';
import { DirectiveStateRef } from '@lithiumjs/angular';
import { Observable } from 'rxjs';
import { OverlayContainer } from '@angular/cdk/overlay';

declare const DEFAULT_THEME_NAME = "default";
declare class ThemeContainer {
    private readonly stateRef;
    readonly theme$: Observable<string>;
    readonly active$: Observable<boolean>;
    readonly manageOverlay$: Observable<boolean>;
    private readonly onInit$;
    private readonly onDestroy$;
    theme: string;
    active: boolean;
    manageOverlay: boolean;
    constructor(overlayContainer: OverlayContainer, cdRef: ChangeDetectorRef, parentThemeContainer: ThemeContainer, stateRef: DirectiveStateRef<ThemeContainer>);
    static ɵfac: i0.ɵɵFactoryDeclaration<ThemeContainer, [null, null, { optional: true; skipSelf: true; }, null]>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<ThemeContainer, "li-theme-container", never, { "theme": { "alias": "theme"; "required": false; }; "active": { "alias": "active"; "required": false; }; "manageOverlay": { "alias": "manageOverlay"; "required": false; }; }, {}, never, never, true, never>;
}

declare class ThemeLoader {
    private static readonly THEME_NAME_PARSER;
    /**
     * @description Loads the given compiled theme in for use.
     * @param compiledThemeData The pre-compiled theme data.
     * @param labelElement [Optional] If `true`, will attach a `data-theme-name` attribute to the `<style>` element set to the theme's name.
    */
    static loadCompiled(compiledThemeData: string, labelElement?: boolean): HTMLElement;
    /**
     * @description Unloads the given compiled theme from the DOM.
     * @param name The name of the theme to unload.
    */
    static unloadCompiled(name: string): void;
    private static getHeadElement;
}

type PaletteOffset = keyof ThemeCreator.PaletteBase;
/**
 * @param name The name that will be used to reference the new theme.
 * @param templateData The CSS theme template that will be used to create the final theme data.
 * @param primaryPalette The primary color palette.
 * @param accentPalette The accent color palette.
 * @param warnPalette The warn color palette.
 */
interface TemplateThemeCreationOptions {
    name: string;
    templateData: string;
    primaryPalette: ThemeCreator.Palette;
    accentPalette: ThemeCreator.Palette;
    warnPalette: ThemeCreator.Palette;
    templateOptions?: Partial<ThemeTemplateOptions>;
}
interface ThemeTemplateOptions {
    nameMatcher: string | RegExp;
    primaryHexMatcher: string | RegExp;
    primaryRgbaMatcher: string | RegExp;
    accentHexMatcher: string | RegExp;
    accentRgbaMatcher: string | RegExp;
    warnHexMatcher: string | RegExp;
    warnRgbaMatcher: string | RegExp;
    primaryContrastHexMatcher: string | RegExp;
    primaryContrastRgbaMatcher: string | RegExp;
    accentContrastHexMatcher: string | RegExp;
    accentContrastRgbaMatcher: string | RegExp;
    warnContrastHexMatcher: string | RegExp;
    warnContrastRgbaMatcher: string | RegExp;
}
declare namespace ThemeTemplateOptions {
    const defaultValues: Readonly<ThemeTemplateOptions>;
}
declare class ThemeCreator {
    /**
     * @description Creates a new theme from the given template theme CSS and theme palettes and loads it for use with the given name.
     * @param options The options to use to create the new theme.
     * @return The compiled theme CSS.
    */
    static createFromTemplate(options: TemplateThemeCreationOptions): string;
    private static substituteThemeHex;
    private static substituteThemeRgba;
    /** @description Compute the palette offset from an associated hex color regex match. */
    private static hexOffset;
    /** @description Compute the palette offset from an associated rgba color regex match. */
    private static rgbaOffset;
    /** @description Compute the alpha channel from an associated rgba alpha regex match. */
    private static rgbaAlpha;
}
declare namespace ThemeCreator {
    interface PaletteBase {
        "50": string;
        "100": string;
        "200": string;
        "300": string;
        "400": string;
        "500": string;
        "600": string;
        "700": string;
        "800": string;
        "900": string;
        "A100": string;
        "A200": string;
        "A400": string;
        "A700": string;
    }
    interface Palette extends PaletteBase {
        contrast: PaletteBase;
    }
}

export { DEFAULT_THEME_NAME, ThemeContainer, ThemeCreator, ThemeLoader, ThemeTemplateOptions };
export type { PaletteOffset, TemplateThemeCreationOptions };