import { inputColors } from './consts';
const baseStyle = {
    container: {
        focusWithinRing: 3,
        color: inputColors.inputText,
    },
    input: {
        placeholderTextColor: inputColors.placeholder,
    },
};
const defaultProps = {
    size: 'lg',
    variant: 'grey',
};
const parts = ['container', 'icon', 'input', 'label'];
const sizes = {
    sm: {
        container: {
            fontSize: 'sm',
            h: 24,
        },
        icon: {
            size: 'xs',
        },
        input: {},
        label: {
            fontSize: 'sm',
        },
    },
    md: {
        container: {
            fontSize: 'sm',
            h: 32,
        },
        icon: {
            size: 'sm',
        },
        input: {},
        label: {
            fontSize: 'md',
        },
    },
    lg: {
        container: {
            fontSize: 'md',
            h: 40,
        },
        icon: {
            size: 'md',
        },
        input: {},
        label: {
            fontSize: 'md', // No a mistake, we keep the same label size as md input
        },
    },
    xl: {
        container: {
            fontSize: 'lg',
            h: 48,
        },
        icon: {
            size: 'md',
        },
        input: {},
        label: {
            fontSize: 'lg',
        },
    },
};
const variants = {
    grey: {
        container: {
            borderColor: inputColors.border,
            focusWithinRingColor: inputColors.focus,
        },
    },
    green: {
        container: {
            borderColor: inputColors.success,
            focusWithinRingColor: inputColors.success,
        },
    },
    red: {
        container: {
            borderColor: inputColors.error,
            focusWithinRingColor: inputColors.error,
        },
    },
};
export default {
    baseStyle,
    defaultProps,
    parts,
    sizes,
    variants,
};
//# sourceMappingURL=theme.js.map