Component Template

1// src/components/MyComponent/MyComponent.tsx
2import { forwardRef } from 'react';
3import type { MyComponentProps } from './MyComponent.types';
4import { useMyComponent } from './useMyComponent';
5import styles from './MyComponent.module.css';
6
7export const MyComponent = forwardRef<HTMLDivElement, MyComponentProps>(
8  ({ children, variant = 'default', className, ...props }, ref) => {
9    const { rootProps } = useMyComponent({ variant, ...props });
10
11    return (
12      <div
13        ref={ref}
14        className={`${styles.root} ${styles[variant]} ${className ?? ''}`}
15        {...rootProps}
16      >
17        {children}
18      </div>
19    );
20  }
21);
22
23MyComponent.displayName = 'MyComponent';
24
25// src/components/MyComponent/index.ts
26export { MyComponent } from './MyComponent';
27export type { MyComponentProps } from './MyComponent.types';