finpro/dist/components/fp-skeleton/fp-skeleton.d.ts

Design System

import { CSSResultGroup, TemplateResult } from 'lit';
import FinproElement from '../../internals/finpro-element';
/**
 * @tag fp-skeleton
 * @summary Finpro Skeleton component
 */
export declare type SkeletonRadius = 'xs' | 's' | 'm' | 'l' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | 'xxl' | '2xxl' | '3xxl' | '4xxl';
export declare type SpinnerVariant = 'primary' | 'secondary' | 'success' | 'danger';
export default class FpSkeleton extends FinproElement {
    static get styles(): CSSResultGroup;
    private wrapper;
    /**
    * Sets the button variant
    */
    variant: SpinnerVariant;
    /**
    * Sets the skeleton circle
    * If Skeleton is a circle, it's width and border-radius will be equal to height
    */
    circle: boolean;
    /**
    * Sets the skeleton radius
    */
    radius: SkeletonRadius;
    /**
    * Sets the skeleton animation
    * Whether to show the animation effect
    */
    animation?: boolean | undefined;
    /**
    * Sets the width
    */
    get width(): string | number;
    set width(width: string | number);
    /**
    * Sets the height
    */
    get height(): string | number;
    set height(height: string | number);
    private _width;
    private _height;
    updateCssVariable(): Promise<void>;
    render(): TemplateResult;
}
declare global {
    interface HTMLElementTagNameMap {
        'fp-skeleton': FpSkeleton;
    }
}
//# sourceMappingURL=fp-skeleton.d.ts.map