@fluentui/react-northstar
Version:
A themable React component library.
65 lines (64 loc) • 2.97 kB
TypeScript
import { Accessibility, LoaderBehaviorProps } from '@fluentui/accessibility';
import { ShorthandConfig } from '@fluentui/react-bindings';
import * as PropTypes from 'prop-types';
import * as React from 'react';
import { UIComponentProps, SizeValue } from '../../utils';
import { ShorthandValue, FluentComponentStaticProps } from '../../types';
import { BoxProps } from '../Box/Box';
import { TextProps } from '../Text/Text';
export interface LoaderSlotClassNames {
indicator: string;
label: string;
}
export interface LoaderProps extends UIComponentProps {
/** Accessibility behavior if overridden by the user. */
accessibility?: Accessibility<LoaderBehaviorProps>;
/** Time in milliseconds after component mount before spinner is visible. */
delay?: number;
/** A loader can contain an indicator. */
indicator?: ShorthandValue<BoxProps>;
/** Loaders can appear inline with content. */
inline?: boolean;
/** A loader can contain a label. */
label?: ShorthandValue<TextProps>;
/** A label in the loader can have different positions. */
labelPosition?: 'above' | 'below' | 'start' | 'end';
/** A size of the loader. */
size?: SizeValue;
/** A loader can contain a custom svg element. */
svg?: ShorthandValue<BoxProps>;
/** A loader can be secondary */
secondary?: boolean;
}
export interface LoaderState {
visible: boolean;
labelId: string;
}
export declare const loaderClassName = "ui-loader";
export declare const loaderSlotClassNames: LoaderSlotClassNames;
export declare type LoaderStylesProps = Pick<LoaderProps, 'inline' | 'labelPosition' | 'size' | 'secondary'>;
/**
* A loader alerts a user that content is being loaded or processed and they should wait for the activity to complete.
*
* @accessibility
* Implements [ARIA progressbar](https://www.w3.org/TR/wai-aria-1.1/#progressbar) role.
*/
export declare const Loader: (<TExtendedElementType extends React.ElementType<any> = "div">(props: React.RefAttributes<HTMLDivElement> & Omit<import("@fluentui/react-bindings").PropsOfElement<TExtendedElementType>, "as" | keyof LoaderProps> & {
as?: TExtendedElementType;
} & LoaderProps) => JSX.Element) & {
propTypes?: React.WeakValidationMap<LoaderProps> & {
as: React.Requireable<string | ((props: any, context?: any) => any) | (new (props: any, context?: any) => any)>;
};
contextTypes?: PropTypes.ValidationMap<any>;
defaultProps?: Partial<LoaderProps & {
as: "div";
}>;
displayName?: string;
readonly __PRIVATE_PROPS?: React.RefAttributes<HTMLDivElement> & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
ref?: React.Ref<HTMLDivElement>;
}, "as" | keyof LoaderProps> & {
as?: "div";
} & LoaderProps;
} & FluentComponentStaticProps<LoaderProps> & {
shorthandConfig: ShorthandConfig<LoaderProps>;
};