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

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

import { type BoxProps, type PolymorphicFactory, type StylesApiProps } from '@mantine/core';
import React from 'react';
import { type NumberTickerBaseProps } from './use-number-ticker';
export type NumberTickerStylesNames = 'root';
export type NumberTickerCssVariables = {
    root: '--number-ticker-animation-duration' | '--number-ticker-animation-delay';
};
export interface NumberTickerProps extends BoxProps, NumberTickerBaseProps, StylesApiProps<NumberTickerFactory> {
    /**
     * Content to display before the number
     */
    prefix?: React.ReactNode;
    /**
     * Content to display after the number
     */
    suffix?: React.ReactNode;
}
export type NumberTickerFactory = PolymorphicFactory<{
    props: NumberTickerProps;
    defaultComponent: 'p';
    defaultRef: HTMLParagraphElement;
    stylesNames: NumberTickerStylesNames;
    vars: NumberTickerCssVariables;
}>;
/**
 * NumberTicker Component
 *
 * A component that animates a number counting up or down to a target value.
 * This implementation uses the useNumberTicker hook internally.
 *
 * The animation can be controlled using the `started` prop, which allows
 * you to start and stop the animation programmatically.
 */
export declare const NumberTicker: (<C = "p">(props: import("@mantine/core").PolymorphicComponentProps<C, NumberTickerProps>) => React.ReactElement) & Omit<React.FunctionComponent<(NumberTickerProps & {
    component?: any;
} & Omit<any, "component" | keyof NumberTickerProps> & {
    ref?: any;
    renderRoot?: (props: any) => any;
}) | (NumberTickerProps & {
    component: React.ElementType;
    renderRoot?: (props: Record<string, any>) => any;
})>, never> & import("@mantine/core").ThemeExtend<{
    props: NumberTickerProps;
    defaultComponent: "p";
    defaultRef: HTMLParagraphElement;
    stylesNames: NumberTickerStylesNames;
    vars: NumberTickerCssVariables;
}> & import("@mantine/core").ComponentClasses<{
    props: NumberTickerProps;
    defaultComponent: "p";
    defaultRef: HTMLParagraphElement;
    stylesNames: NumberTickerStylesNames;
    vars: NumberTickerCssVariables;
}> & {
    varsResolver: import("@mantine/core").VarsResolver<{
        props: NumberTickerProps;
        defaultComponent: "p";
        defaultRef: HTMLParagraphElement;
        stylesNames: NumberTickerStylesNames;
        vars: NumberTickerCssVariables;
    }>;
} & import("@mantine/core").PolymorphicComponentWithProps<{
    props: NumberTickerProps;
    defaultComponent: "p";
    defaultRef: HTMLParagraphElement;
    stylesNames: NumberTickerStylesNames;
    vars: NumberTickerCssVariables;
}> & Record<string, never>;