@alyle/ui/src/minimal/renderer-style.d.ts

Minimal Design, a set of components for Angular

import { ElementRef, Renderer2 } from '@angular/core';
import { LyTheme2, ThemeRef } from '../theme/theme2.service';
import { StyleTemplate } from '../parse';
import { LyStyles, LyClasses, SelectorsFn } from '../theme/style';
import { MediaQueryArray } from '../style-utils';
import * as i0 from "@angular/core";
export declare class StyleRenderer {
    private _theme;
    private _renderer;
    private readonly _set;
    private _nEl;
    constructor(_theme: LyTheme2, _el: ElementRef, _renderer: Renderer2);
    /**
     * Build multiple styles and render them in the DOM.
     * @param styles Styles
     * @param applyRootClass If `applyToRoot` is `true` and the root property is defined,
     * it will automatically be added to the component.
     *
     * e.g.
     *
     * ```ts
     * const STYLES = () => ({
     *   root: lyl `{...}`, // this class will be added to the root component
     *   item: lyl `{...}`
     * })
     * ```
     *
     * Also accepts the name of a class.
     *
     * e.g.
     *
     * ```ts
     * renderSheet(STYLES, 'item')
     * ```
     */
    renderSheet<T>(styles: T & LyStyles, applyRootClass?: boolean | keyof LyClasses<T>): LyClasses<T>;
    add(style: (theme: any, ref: ThemeRef) => StyleTemplate): string;
    add(style: (theme: any, ref: ThemeRef) => StyleTemplate, priority: number): string;
    add(style: (theme: any, ref: ThemeRef) => StyleTemplate, oldClass: string): string;
    add(id: string, style: (theme: any, ref: ThemeRef) => StyleTemplate): string;
    add(style: (theme: any, ref: ThemeRef) => StyleTemplate, priority: number, oldClass: string | null): string;
    add(id: string, style: (theme: any, ref: ThemeRef) => StyleTemplate, priority: number): string;
    add(id: string, style: (theme: any, ref: ThemeRef) => StyleTemplate, oldClass: string | null): string;
    add(id: string, style: (theme: any, ref: ThemeRef) => StyleTemplate, priority: number, oldClass: string | null): string;
    render(style: (theme: any, ref: ThemeRef) => StyleTemplate): string;
    render(style: (theme: any, ref: ThemeRef) => StyleTemplate, priority: number): string;
    render(id: string, style: (theme: any, ref: ThemeRef) => StyleTemplate): string;
    render(id: string, style: (theme: any, ref: ThemeRef) => StyleTemplate, priority: number): string;
    addClass(className: string): void;
    removeClass(className?: string | null): void;
    removeClasses(rawClassVal?: string[] | null | undefined): void;
    toggleClass(className: string, enabled: boolean): void;
    updateClass(newClassName: string, oldClassName: string | null | undefined): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<StyleRenderer, [null, { optional: true; }, { optional: true; }]>;
    static ɵprov: i0.ɵɵInjectableDeclaration<StyleRenderer>;
}
export type InputStyle<INPUT, C = any> = (val: Exclude<NonNullable<INPUT>, MediaQueryArray>, media: string | null, comp: C) => (((theme: any, ref: ThemeRef | SelectorsFn) => StyleTemplate) | null);
/**
 * Parameter decorator to be used for create Dynamic style together with `@Input`
 * @param style style
 * @param formatWith A function to format the value
 * @decorator
 */
export declare function Style2<INPUT = any, C = any>(style: InputStyle<INPUT, C>, formatWith?: ((value: INPUT) => any) | null, priority?: number): (target: WithStyles, propertyKey: string, descriptor?: TypedPropertyDescriptor<INPUT> | undefined) => void;
/**
 * Parameter decorator to be used for create Dynamic style together with `@Input`
 * @param style style
 * @decorator
 */
export declare function Style<INPUT = any, C = any>(style: InputStyle<INPUT, C>): (target: WithStyles, propertyKey: string, descriptor?: TypedPropertyDescriptor<INPUT> | undefined) => void;
/**
 * Parameter decorator to be used for create Dynamic style together with `@Input`
 * @param style style
 * @decorator
 */
export declare function Style<INPUT = any, C = any>(style: InputStyle<INPUT, C>, priority: number): (target: WithStyles, propertyKey: string, descriptor?: TypedPropertyDescriptor<INPUT> | undefined) => void;
/**
 * Parameter decorator to be used for create Dynamic style together with `@Input`
 * @param style style
 * @decorator
 */
export declare function Style<INPUT = any, C = any>(style: InputStyle<INPUT, C>, priority: number, formatWith?: ((value: INPUT) => any) | null): (target: WithStyles, propertyKey: string, descriptor?: TypedPropertyDescriptor<INPUT> | undefined) => void;
/**
 * Parameter decorator to be used for create Dynamic style together with `@Input`
 * @param style style
 * @decorator
 */
export declare function Style<INPUT = any, C = any>(style: InputStyle<INPUT, C>, formatWith: ((value: INPUT) => any) | null, priority?: number): (target: WithStyles, propertyKey: string, descriptor?: TypedPropertyDescriptor<INPUT> | undefined) => void;
/**
 * Create a responsive style for component with a key
 * @param c The component
 * @param propertyKeyConfig Style key
 * @param value value
 * @param style style template
 * @param priority priority of style
 */
export declare function createStyle<INPUT, C>(c: WithStyles, propertyKeyConfig: string | StylePropertyKey, value: INPUT, style: InputStyle<INPUT, C>, priority?: number): void;
export declare function _renderStyle<INPUT, C>(c: WithStyles, propertyKeyConfig: string | StylePropertyKey, val: string | number, media: string | null, style: InputStyle<INPUT, C>, priority?: number): void;
export interface StylePropertyKey {
    и: string;
    key: string;
}
export interface WithStyles {
    /** Style Priority, default: 0 */
    readonly $priority?: number;
    readonly sRenderer: StyleRenderer;
}