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

A typescript react component library following the Cronos branding standards

import { ButtonProps } from './interface';
export declare const helper: {
    /**
     * Determines the appropriate background color for the button based on its props.
     * Considers the button's state and style props to apply the correct color.
     *
     * @param {ButtonProps} props - The props passed to the button component.
     * @returns {string} The calculated background color.
     */
    getBackgroundColor: (props: ButtonProps) => string;
    /**
     * Determines the appropriate border color for the button based on its props.
     * The function considers various states like primary, secondary, dark, and active
     * to apply the corresponding border color.
     *
     * @param {ButtonProps} props - The props passed to the button component.
     * @returns {string} The calculated border color.
     */
    getBorderColor: (props: ButtonProps) => string;
    /**
     * 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: ButtonProps) => string;
    /**
     * Determines the padding for the button based on its size prop.
     * Provides custom padding for 'sm', 'md', and 'lg' sizes,
     * defaulting to the padding for 'sm' if no size is specified.
     *
     * @param {ButtonProps} props - The props passed to the button component.
     * @returns {string} The padding value in the format "vertical horizontal".
     */
    getPadding: (props: ButtonProps) => string;
    /**
     * Calculates the appropriate border-radius for the button based on the 'rounded' prop.
     * If 'rounded' is true, a larger border-radius is applied for a pill-shaped button.
     * Otherwise, a standard border-radius is used.
     *
     * @param {ButtonProps} props - The props passed to the button component.
     * @returns {string} The border-radius value in pixels.
     */
    getBorderRadius: (props: ButtonProps) => string;
    /**
     * Determines the text color of the button based on its variant.
     * Uses the Variant enum to set specific text colors for different button variants.
     * Defaults to a standard color if no matching variant is found.
     *
     * @param {ButtonProps} props - The props passed to the button component.
     * @returns {string} The calculated text color.
     */
    getColor: (props: ButtonProps) => 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: ButtonProps) => 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: ButtonProps) => React.ReactNode;
};