@rarcifa/cronos-design-system/dist/components/Typography/helper.d.ts

A typescript react component library following the Cronos branding standards

import { TypographyProps } from './interface';
export declare const helper: {
    /**
     * Calculates the font size for the button based on its size prop.
     * Supports 'sm', 'md', and 'lg' sizes, defaulting to 'sm' if no size is specified.
     *
     * @param {ButtonProps} props - The props passed to the button component.
     * @returns {string} The font size in pixels.
     */
    getFontSize: (props: TypographyProps) => string;
    /**
     * Determines the font weight for the typography based on its fontWeight prop.
     * Maps fontWeight prop values to font-weight CSS values.
     *
     * @param {TypographyProps} props - The props passed to the typography component.
     * @returns {string} The CSS font-weight value.
     */
    getFontWeight: (props: TypographyProps) => string;
    /**
     * Determines the color for the typography based on its color prop.
     * Maps color prop values to actual color codes.
     *
     * @param {TypographyProps} props - The props passed to the typography component.
     * @returns {string} The color value.
     */
    getColor: (props: TypographyProps) => string;
    /**
     * Determines the gradient for the typography based on its gradient prop.
     * Maps gradient prop values to actual gradient codes.
     *
     * @param {TypographyProps} props - The props passed to the typography component.
     * @returns {string} The gradient value.
     */
    getGradientStyle: (props: TypographyProps) => string;
    /**
     * Determines the content to be displayed inside the Button component.
     * It prioritizes rendering `children` over `label`. If `children` is provided,
     * it will be used as the content of the button. Otherwise, the `label` will be used.
     *
     * @param {ButtonProps} props - The props passed to the button component.
     * @returns {React.ReactNode} The content to be rendered inside the button.
     */
    getComponentValue: (props: TypographyProps) => React.ReactNode;
    /**
     * Determines the line-height for the typography based on its customLineHeight prop.
     * Maps customLineHeight prop values to actual line-hight value.
     *
     * @param {ButtonProps} props - The props passed to the button component.
     * @returns {React.ReactNode} The content to be rendered inside the button.
     */
    getLineHeight: (props: TypographyProps) => number;
    /**
     * Determines the line-height for the typography based on its customLineHeight prop.
     * Maps customLineHeight prop values to actual line-hight value.
     *
     * @param {ButtonProps} props - The props passed to the button component.
     * @returns {React.ReactNode} The content to be rendered inside the button.
     */
    getMarginBlock: (props: TypographyProps) => string;
    /**
     * Applies truncation styles if isTruncated prop is true. Specifies max-width
     * if provided, defaults to 115px otherwise.
     *
     * @param {TypographyProps} props - The props passed to the typography component.
     * @returns {string} CSS styles for truncation or an empty string.
     */
    getTruncationStyle: (props: TypographyProps) => string;
    /**
     * Determines the text alignment for the typography based on its textAlign prop.
     * Supports 'left', 'right', and 'center' alignments.
     *
     * @param {TypographyProps} props - The props passed to the typography component.
     * @returns {string} The text alignment.
     */
    getTextAlign: (props: TypographyProps) => string;
};