import clsx from 'clsx';
const styleMap = {
    'subtitle-1': ['text-sm', 'font-semibold'],
    'subtitle-2': ['text-xs', 'font-semibold'],
    'body-1': ['text-sm', 'font-normal'],
    'body-2': ['text-xs', 'font-normal'],
    chips: ['text-xs', 'font-bold'],
};
/**
 * Paragraph component for rendering text with different styles based on size.
 *
 * @component
 * @example
 * // Example usage of Paragraph component
 * <Paragraph size="body-1">This is a paragraph</Paragraph>
 *
 * @param {Object} props - The properties of the Paragraph component.
 * @param {'subtitle-1' | 'subtitle-2' | 'body-1' | 'body-2' | 'chips'} [props.size='body-1'] - The size of the paragraph text.
 * @param {ReactNode} props.children - The content to be displayed inside the paragraph.
 * @param {HTMLAttributes<HTMLParagraphElement>} restProps - Additional properties for the paragraph element.
 *
 * @returns {ReactNode} The rendered Paragraph component.
 */
export function Paragraph({ size = 'body-1', children, ...restProps }) {
    const className = clsx(styleMap[size], restProps.className);
    return (<p {...restProps} className={className}>
      {children}
    </p>);
}
//# sourceMappingURL=Paragraph.jsx.map