@sixbell-telco/sdk/directives/typography/src/typography.directive.d.ts

A collection of reusable components designed for use in Sixbell Telco Angular projects

import * as i0 from "@angular/core";
/** Available typography heading and body variants */
export type TypographyVariantProps = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'body' | 'body-sm' | 'body-xs' | 'body-xxs' | 'inherit' | null | undefined;
/** Text color variants for typography */
export type TypographyColorProps = 'base' | 'base-placeholder' | 'inherit' | null | undefined;
/** Font weight options for typography */
export type TypographyFontWeightProps = 'bold' | 'semibold' | 'medium' | 'normal' | 'inherit' | null | undefined;
/** Text overflow handling methods */
export type TypographyTextOverflowProps = 'clip' | 'ellipsis' | 'truncate' | null | undefined;
/** Configuration object for typography styles */
export type TypographyProps = {
    variant?: TypographyVariantProps;
    color?: TypographyColorProps;
    fontWeight?: TypographyFontWeightProps;
    textOverflow?: TypographyTextOverflowProps;
};
/**
 * A directive for applying consistent typography styles using Tailwind CSS
 *
 * @remarks
 * Applies text styling based on variant, color, weight, and overflow properties.
 * Uses Angular's signal-based inputs for reactive style updates.
 *
 * @example
 * ```html
 * <h1 typography tyVariant="h2" tyColor="base" tyFontWeight="bold">
 *   Heading with custom typography
 * </h1>
 *
 * <p typography tyVariant="body-sm" tyTextOverflow="ellipsis">
 *   Small body text with ellipsis overflow
 * </p>
 * ```
 */
export declare class TypographyDirective {
    /**
     * Typography variant style (heading level or body type)
     * @alias tyVariant
     * @defaultValue 'body'
     */
    variant: import("@angular/core").InputSignal<TypographyVariantProps>;
    /**
     * Text color variant
     * @alias tyColor
     * @defaultValue 'inherit'
     */
    color: import("@angular/core").InputSignal<TypographyColorProps>;
    /**
     * Font weight variant
     * @alias tyFontWeight
     * @defaultValue 'normal'
     */
    fontWeight: import("@angular/core").InputSignal<TypographyFontWeightProps>;
    /**
     * Text overflow handling method
     * @alias tyTextOverflow
     * @defaultValue 'clip'
     */
    textOverflow: import("@angular/core").InputSignal<TypographyTextOverflowProps>;
    /** @internal Reference to host element */
    private element;
    /** @internal Angular renderer instance */
    private renderer;
    /** @internal Effect to update classes when inputs change */
    classListEffect: import("@angular/core").EffectRef;
    static ɵfac: i0.ɵɵFactoryDeclaration<TypographyDirective, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<TypographyDirective, "[typography]", never, { "variant": { "alias": "tyVariant"; "required": false; "isSignal": true; }; "color": { "alias": "tyColor"; "required": false; "isSignal": true; }; "fontWeight": { "alias": "tyFontWeight"; "required": false; "isSignal": true; }; "textOverflow": { "alias": "tyTextOverflow"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}