@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
46 lines (45 loc) • 1.69 kB
TypeScript
/**
* Web Skeleton Component
*/
import React from 'react';
import type { SpacingProps } from '../../shared/types';
export type SkeletonShow = boolean;
export type SkeletonFigure = string | (() => React.ReactNode) | React.ReactNode;
export type SkeletonChildren = string | (() => React.ReactNode) | React.ReactNode;
export type SkeletonProps = {
/**
* Use `true` to enable/show the skeleton for the component used inside. Defaults to `false`.
*/
show?: boolean;
/**
* Use `true` to disable the animation.
*/
noAnimation?: boolean;
/**
* Define a figure to use, like `article`. The wrapped content will be hidden while the skeleton figure is shown.
*/
figure?: SkeletonFigure;
/**
* Is used for screen reader text translation, defined in the translation files. You can set a custom text if needed.
*/
ariaBusy?: string;
/**
* Is used for screen reader text translation, defined in the translation files. You can set a custom text if needed.
*/
ariaReady?: string;
/**
* Set any HTML element type you have to use. A couple of aria attributes will be set on this element while active. Defaults to `div`.
*/
element?: React.ReactNode;
/**
* If set to `true`, a loading skeleton will be shown.
*/
skeleton?: boolean;
className?: string;
children?: SkeletonChildren;
} & Omit<React.HTMLProps<HTMLElement>, 'ref' | 'children'> & SpacingProps;
declare function Skeleton(props: SkeletonProps): import("react/jsx-runtime").JSX.Element;
declare namespace Skeleton {
var Exclude: (props: any) => import("react/jsx-runtime").JSX.Element;
}
export default Skeleton;