Components
์ ์ธ์ ์ด๊ณ ํ์ ์์ ํ React ์ปดํฌ๋ํธ ๋ผ์ด๋ธ๋ฌ๋ฆฌ
ํฌํจ๋ ์ปดํฌ๋ํธ
UI ์ปดํฌ๋ํธ
- InViewTrigger - Intersection Observer ๊ธฐ๋ฐ ๋ทฐํฌํธ ๊ฐ์ง
- SuspenseBoundary - Suspense + ErrorBoundary ํตํฉ
ํน์ง
- โ ์ ์ธ์ API์ ๊ฐ๋ฒผ์ด ๋ฒ๋ค
- โ React ์ธ ์์กด์ฑ ์์ (zero-deps)
- โ Strict TypeScript ์ง์
- โ Tree-shaking ๊ฐ๋ฅํ ESM ๋ฒ๋ค
์ค์น
npm install @frontend-toolkit-js/components
# or
pnpm add @frontend-toolkit-js/components๋น ๋ฅธ ์์
import {
InViewTrigger,
SuspenseBoundary,
} from '@frontend-toolkit-js/components';
function Example() {
return (
<SuspenseBoundary
pendingFallback={<Spinner />}
errorFallback={<ErrorState />}
>
<InViewTrigger onInView={() => console.log('๋ณด์!')}>
<Article />
</InViewTrigger>
</SuspenseBoundary>
);
}