diff --git a/.gitignore b/.gitignore index 3c3629e..de4d1f0 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ +dist node_modules diff --git a/src/components/card/Card.tsx b/src/components/card/Card.tsx index cf7de2a..82c973a 100644 --- a/src/components/card/Card.tsx +++ b/src/components/card/Card.tsx @@ -3,7 +3,7 @@ import { cn } from "../../utils/cn"; export interface CardProps extends React.HTMLAttributes {} -export const Card = React.forwardRef( +const Card = React.forwardRef( ({ className, ...props }, ref) => (
{ level?: 1 | 2 | 3 | 4 | 5 | 6; } +const HeadingComponents = { + 1: 'h1', + 2: 'h2', + 3: 'h3', + 4: 'h4', + 5: 'h5', + 6: 'h6' +} as const; + export const Title = React.forwardRef( ({ className, level = 1, children, ...props }, ref) => { - const Component = `h${level}` as keyof JSX.IntrinsicElements; + const Component = HeadingComponents[level as keyof typeof HeadingComponents]; const styles = { 1: "text-3xl font-bold tracking-tight", @@ -16,16 +25,16 @@ export const Title = React.forwardRef( 4: "text-lg font-semibold tracking-tight", 5: "text-base font-semibold tracking-tight", 6: "text-sm font-semibold tracking-tight", - }; + } as const; - return ( - - {children} - + return React.createElement( + Component, + { + ref, + className: cn(styles[level], className), + ...props + }, + children ); } );