@oslokommune/punkt-elements
Version:
Komponentbiblioteket til Punkt, et designsystem laget av Oslo Origo
54 lines (53 loc) • 1.84 kB
TypeScript
import { PktElementWithSlot } from '../../base-elements/element-with-slot';
import { TPktSize } from '../../types/size';
export type TPktLoaderVariant = 'blue' | 'rainbow' | 'shapes';
export interface IPktLoader {
/**
* The `delay` prop controls how much time the loading should be given before the loader is displayed.
* This is handy for situations where the load time might be so short that loader is not necessary.
* Delay time is in milliseconds.
*/
delay?: number;
/**
* The `inline` prop decides whether the loader should be displayed inline or not.
*/
inline?: boolean;
/**
* The boolean 'isLoading' decides whether the loader or the children will be displayed.
* If set to false, the children will be displayed.
*/
isLoading?: boolean;
/**
* The message to display when the loader is loading.
*/
message?: string | null;
/**
* The size of the loader. Default is "medium".
*/
size?: TPktSize;
/**
* The variant of the loader. Default is "shapes" which is the OSLO wave loader.
* Other variants are "blue" and "rainbow" which are spinner variants.
*/
variant?: TPktLoaderVariant;
/**
* Override path to loading animations.
*/
loadingAnimationPath?: string;
}
export declare class PktLoader extends PktElementWithSlot implements IPktLoader {
delay: number;
inline: boolean;
isLoading: boolean;
message: string | null;
size: TPktSize;
variant: TPktLoaderVariant;
loadingAnimationPath: string | undefined;
private _shouldDisplayLoader;
connectedCallback(): void;
updated(changedProperties: Map<string, unknown>): void;
render(): import('lit-html').TemplateResult<1>;
private getVariant;
private setupLoader;
}
export default PktLoader;