@gfazioli/mantine-text-animate/dist/types/Spinner/Spinner.d.ts

The TextAnimate component allows you to animate text with various effects.

import React from 'react';
import { type BoxProps, type MantineSize, type PolymorphicFactory, type StylesApiProps } from '@mantine/core';
export type SpinnerStylesNames = 'root' | 'char' | 'container';
export type SpinnerCssVariables = {
    root: '--text-animate-spinner-radius' | '--text-animate-spinner-speed' | '--text-animate-spinner-char-offset';
};
export interface SpinnerBaseProps {
    /**
     * The text content to animate
     */
    children: string;
    /**
     * The radius of the circle in pixels or Mantine size
     * @default "md"
     */
    radius?: MantineSize | number | string;
    /**
     * The rotation speed in seconds per full rotation
     * @default 10
     */
    speed?: number;
    /**
     * The rotation direction
     * @default "clockwise"
     */
    direction?: 'clockwise' | 'counterclockwise';
    /**
     * Whether the spinner is currently rotating
     * @default true
     */
    animate?: boolean;
    /**
     * Character offset in degrees (0-360)
     * @default 0
     */
    charOffset?: number;
    /**
     * Whether to reverse the text direction
     * @default false
     */
    reverseText?: boolean;
    /**
     * Whether to repeat the text to fill the circle
     * @default false
     */
    repeatText?: boolean;
    /**
     * Number of times to repeat the text (only used if repeatText is true)
     * @default 1
     */
    repeatCount?: number;
}
export interface SpinnerProps extends BoxProps, SpinnerBaseProps, StylesApiProps<SpinnerFactory> {
}
export type SpinnerFactory = PolymorphicFactory<{
    props: SpinnerProps;
    defaultComponent: 'div';
    defaultRef: HTMLDivElement;
    stylesNames: SpinnerStylesNames;
    vars: SpinnerCssVariables;
}>;
/**
 * Spinner Component
 *
 * A component that displays text in a circle and rotates it.
 */
export declare const Spinner: (<C = "div">(props: import("@mantine/core").PolymorphicComponentProps<C, SpinnerProps>) => React.ReactElement) & Omit<React.FunctionComponent<(SpinnerProps & {
    component?: any;
} & Omit<Omit<any, "ref">, "component" | keyof SpinnerProps> & {
    ref?: any;
    renderRoot?: (props: any) => any;
}) | (SpinnerProps & {
    component: React.ElementType;
    renderRoot?: (props: Record<string, any>) => any;
})>, never> & import("@mantine/core/lib/core/factory/factory").ThemeExtend<{
    props: SpinnerProps;
    defaultComponent: "div";
    defaultRef: HTMLDivElement;
    stylesNames: SpinnerStylesNames;
    vars: SpinnerCssVariables;
}> & import("@mantine/core/lib/core/factory/factory").ComponentClasses<{
    props: SpinnerProps;
    defaultComponent: "div";
    defaultRef: HTMLDivElement;
    stylesNames: SpinnerStylesNames;
    vars: SpinnerCssVariables;
}> & import("@mantine/core/lib/core/factory/polymorphic-factory").PolymorphicComponentWithProps<{
    props: SpinnerProps;
    defaultComponent: "div";
    defaultRef: HTMLDivElement;
    stylesNames: SpinnerStylesNames;
    vars: SpinnerCssVariables;
}>;