@syncfusion/react-popups
Version:
A package of Pure React popup components such as Tooltip that is used to display information or messages in separate pop-ups.
103 lines (102 loc) • 2.79 kB
TypeScript
import * as React from 'react';
/**
* Defines the available design systems for spinner appearance.
* Each option represents a different visual style based on popular UI frameworks.
*/
export declare enum SpinnerType {
/**
* Material Design 3 spinner style with circular animation following
* Google's Material Design guidelines.
*/
Material3 = "Material3",
/**
* Bootstrap 5 spinner style following the Bootstrap framework's
* visual design patterns.
*/
Bootstrap5 = "Bootstrap5",
/**
* Fluent Design 2 spinner style following Microsoft's Fluent design
* system guidelines.
*/
Fluent2 = "Fluent2",
/**
* Tailwind CSS 3 spinner style following the Tailwind design
* aesthetic and principles.
*/
Tailwind3 = "Tailwind3"
}
/**
* Interface for the Spinner component props
*
* @public
*/
export interface SpinnerProps {
/**
* Defines the type/style of the Spinner
*
* @default SpinnerType.Material3
*/
type?: SpinnerType;
/**
* Text to be displayed below the Spinner
*
* @default -
*/
label?: string;
/**
* Width of the Spinner in pixels or as string with units
*
* @default Based on the type selected (DEFT_WIDTHS mapping)
*/
width?: string | number;
/**
* Controls the visibility state of the component.
*
* When true, the component will be rendered and displayed.
* When false, the component will be hidden but may remain in the DOM based on implementation.
* If not specified, the component will follow its default visibility behavior.
*
* @default false
*/
visible?: boolean;
/**
* Custom HTML template for the Spinner
*
* @default -
*/
template?: string;
/**
* Target element where the Spinner should be rendered
*
* @default -
*/
target?: HTMLElement | string;
}
/**
* Interface for Spinner component with additional method.
*/
export interface ISpinner extends SpinnerProps {
/**
* This is spinner component element.
*
* @private
* @default null
*/
element?: HTMLElement | null;
}
type ISpinnerProps = SpinnerProps & Omit<React.InputHTMLAttributes<HTMLDivElement>, keyof SpinnerProps>;
/**
* A versatile Spinner component that provides visual feedback for loading states.
*
* The Spinner supports multiple design systems through the SpinnerType enum
* and can be customized with various properties for size, color, and behavior.
*
* ```typescript
* <Spinner
* type={SpinnerType.Material3}
* visible={true}
* />
* ```
*/
export declare const Spinner: React.ForwardRefExoticComponent<ISpinnerProps & React.RefAttributes<ISpinner>>;
export default Spinner;