사내 프로젝트에서 [PrimeReact](https://primereact.org)라는 리액트 UI 컴포넌트 라이브러리를 사용하고 있다.

충분히 좋지만... 버그도 많다. 이상하게 9버전을 사용할 때 문제가 없던 타입 관련 오류들, 스타일링 관련 문제들이 10버전에서는 꽤 많이 쏟아지고 있다.

특히 PrimeReact에는 PT(PassThrough)라는 속성을 통해 컴포넌트의 스타일을 수정할 수 있도록 지원하고 있는데, 10버전에서 새롭게 Tailwind를 지원하게 되면서부터 글로벌 PT 관련 이슈들이 많이 발생하고 있다.

사용하면서 발견한 버그들을 GitHub issue를 통해 몇 가지를 제보해봤는데, 담당 컨트리뷰터의 피드백이 상당히 빠르고 적극적인 건 매우 긍정적으로 평가할 만하다.

문제는 그럼에도 불구하고 마이너나 패치 버전이 새로 나와서 업데이트를 적용할 때마다 발생한다. 코어 소스 구조를 변경하는 게 쉽지 않나보다... 라고 예상하는 바이다.

최근에는 Button 컴포넌트의 전역 pt 속성을 변경했음에도 엉뚱하게 영향을 받지 말아야 하는 SelectButton이나 다른 컴포넌트에 포함된 Button들이 영향을 받는 버그를 발견해서 이슈 리포팅을 했고, 수정 예정 이슈로 채택이 되어있다.

PrimeReact조차 Tailwind를 지원하는 걸 보면서 역시 대세는 테일윈드구나 라는 생각이 든다.

1. PrimeReact에 unstyled mode를 설정하고 Tailwind를 사용해보려고 했지만, PrimeFlex의 class와 충돌하기 때문에 앱을 처음부터 개발하지 않는 이상 쉽지 않아서 보류.

2. 아예 PrimeReact를 걷어내고 Tailwind 기반으로 마이그레이션하고 싶은 생각이 굴뚝같지만, 앱 전체적으로 DataTable를 많이 사용하고 있기 때문에 기능 지원 여부가 매우 중요한데, PrimeReact의 DataTable 컴포넌트가 기능도 많고 UI 작성이 상당히 편리하기 때문에 이 정도의 기능을 Headless UI 컴포넌트로 다시 작성하는 것이 쉽지는 않을 것 같다는 생각.

조금 더 자유로운 custom을 위해서는 Tailwind와 더불어 요즘 떠오르고 있는 Shadcn(Radix UI)이나 Daisy UI 정도를 골랐고, React Query를 부분 적용하기 시작한 만큼 DataTable은 TanStack Table이 기능도 많으면서 좀 더 익숙한 코드가 나올 것 같아서 채택하게 될 것 같다.

Mantine이나 Chakra UI도 고려해봤는데, DX는 더 나아질 수 있을 것 같지만 PrimeReact와 비슷하게 라이브러리에 많이 종속될 것 같고, 무엇보다 DataTable만큼의 기능이 지원되지 않는 일반적인 Table 컴포넌트만 지원하고 있다는 점에서 메리트가 떨어진다.

무엇이 되던 올해 안에는 PrimeReact 기반을 벗어나고 싶지만 어디까지나 개인적인 욕심이지, 회사에서 요구하는 기능 개발과 함께 해야 하므로 쉽지 않을 것 같다는 예상을 해 본다.