[Feature]: @toss/use-funnel 의 NextJS 13 app directory 지원

[CodePsy-2001]

Package Scope

• Add to an existing package

Package name: @toss/use-funnel

Overview

내부적으로 next/router에 의존하고 있어, next/navigation으로 마이그레이션이 필요한 App Directory 버전에서는 @toss/use-funnl 의 기능을 사용할 수 없습니다.

참고자료1 : https://stackoverflow.com/questions/74421327/nextrouter-was-not-mounted-next-js
참고자료2: https://nextjs.org/docs/messages/next-router-not-mounted

Describe the solution you'd like

appdirectory 경로에서 App Directory 호환 버전을 불러올 수 있도록 합니다.

[CodePsy-2001]

app directory를 지원하는 라이브러리를 만들었습니다.

npm i next-use-funnel

소스코드: https://github.com/CodePsy-2001/next-use-funnel
예제: https://next-use-funnel.vercel.app

• 기존 @toss/use-funnel과 모든 인터페이스가 호환됩니다. (test coverage 100%)
• 미구현된 store 추상화를 SWRProvider를 통해 각 funnel key에 따라 원하는 store를 injection할 수 있는 구조로 바꾸었습니다.
• 미구현된 withState 함수 분리를 HOC로 분리했습니다. HOC는 외부에서 router를 매개변수로 받을 수 있어, Next.js 라우터 외에도 다른 라우터를 적용할 수 있습니다.
• Example 코드는 toss UI를 흉내내는 ui kit을 포함하고 있습니다. Scaffold와 btn-cta를 직접 사용해 보세요.

[CodePsy-2001]

업데이트:
next-use-funnel 대신, @use-funnel/browser 를 사용해보세요.
API가 훨씬 단순해졌고, 최신 overlay-kit와 호환되며, 추가적인 peerDependency를 요구하지 않습니다.

소식:
svelte-use-funnel 을 작업중입니다.
새 라이브러리 배포를 기대해주세요!