toss

Render-prop components for Jotai atoms: Atom ([value, setValue] like useAtom), AtomValue (read-only like useAtomValue), SetAtom (write-only like useSetAtom) from @suspensive/jotai. Load when reading or writing jotai atoms declaratively in JSX, when async atoms need Suspense boundaries, or when using jotai extensions (jotai-tanstack-query atomWithSuspenseQuery, jotai-cache) with Suspense.

Composition seam between @suspensive/react-query-4 and @suspensive/react: replacing removed QueryErrorBoundary with ErrorBoundary + useQueryErrorResetBoundary, resetting query errors so retries actually refetch, shouldCatch with API error classes around SuspenseQuery, Delay inside Suspense fallbacks. Load when wiring retry buttons for query errors or layering error boundaries around suspense queries.

SuspenseQuery, SuspenseQueries, SuspenseInfiniteQuery render-prop components for fetching in JSX without hook wrapper components. Load when placing queries at the same depth as Suspense/ErrorBoundary, running parallel queries, using select, integrating queryOptions/infiniteQueryOptions, or replacing useSuspenseQuery wrapper components.

Mutation render-prop component and mutationOptions for TanStack Query v4. Load when adding mutations inside list rows, loops, or conditionals where useMutation cannot be called, removing per-row wrapper components, or reusing mutation configs with mutationOptions.

Fire prefetches during render before Suspense boundaries with usePrefetchQuery/usePrefetchInfiniteQuery hooks and PrefetchQuery/PrefetchInfiniteQuery components. Load when avoiding request waterfalls, warming the cache for useSuspenseQuery/SuspenseQuery, or prefetching inside list rows where hooks cannot be called.

Root skill for @suspensive/react-query-4: render-prop components for TanStack Query v4 Suspense — SuspenseQuery, SuspenseQueries, SuspenseInfiniteQuery, Mutation, PrefetchQuery, PrefetchInfiniteQuery, QueriesHydration, createGetQueryClient, QueryClientConsumer. Load when fetching data with Suspense in JSX on TanStack Query v4, choosing between @suspensive/react-query-4/5, deciding which APIs come from @tanstack/react-query vs Suspensive, or routing to declarative-queries, mutations, prefetching, ssr-hydration, suspensive-react.

Server rendering and hydration for TanStack Query v4 in RSC frameworks: request-scoped QueryClient with createGetQueryClient, server prefetch + dehydrate + hydrate with QueriesHydration, skipSsrOnError, timeout, per-boundary HTML streaming, QueryClientConsumer. Load when setting up QueryClient in Next.js App Router, prefetching queries in Server Components, or debugging cross-request cache leaks and hydration issues.

Composition seam between @suspensive/react-query-5 and @suspensive/react: replacing removed QueryErrorBoundary with ErrorBoundary + useQueryErrorResetBoundary, resetting query errors so retries actually refetch, shouldCatch with API error classes around SuspenseQuery, Delay inside Suspense fallbacks. Load when wiring retry buttons for query errors or layering error boundaries around suspense queries.

Design React APIs and abstractions in a React-like way. Covers declarative interfaces, lifecycle-safe abstractions, minimal surfaces, zero-dependency bias, type safety, and documentation.

Review React hooks against design philosophy. Checks return values, SSR safety, state design, effect usage, TypeScript patterns, and performance.

Write React hooks following design philosophy. Covers naming, return values, SSR safety, state design, effect patterns, TypeScript, and performance.

Create branches following repo conventions. Use when creating branches, starting new features.

PR/code review. 100% coverage, SSR safety, JSDoc validation. Use when reviewing code, checking PRs.

Create commits following repo conventions. Use when committing changes, creating commit messages.

Complete workflow from new Hook/Component/Util development to deployment. Use when starting new feature development.

JSDoc writing rules for AI-powered documentation generation. Use when writing JSDoc, documenting functions, or adding code comments.

Classify and summarize a PR for efficient review

Create a new es-toolkit release (version bump, changelog, tag)

es-toolkit usage guide covering installation, import patterns, and setup for Node.js, Bun, Deno, and browsers. Use when the user asks how to install, import, or set up es-toolkit in their project.

Guide migrating lodash code to es-toolkit. Use when the user wants to migrate from lodash, replace lodash imports, reduce bundle size by switching to es-toolkit, or understand the difference between es-toolkit and es-toolkit/compat.

Analyze code or requirements and recommend the best es-toolkit functions. Use when the user asks which es-toolkit function to use, needs help finding a utility, or wants alternatives to manual implementations.

Verify compat PR claims by running lodash vs es-toolkit/compat at runtime

Suggest and apply GitHub labels to unlabeled issues

Review recent issues with labeling, context analysis, and duplicate detection

Use when 한 기능 수정 시 여러 디렉토리를 건드리거나, 같은 숫자/상수가 여러 파일에 흩어져 있거나, import 경로가 `../../..`처럼 길어질 때

Use when props가 3개 이상 컴포넌트 계층을 통과하거나, 하나의 Hook이 5개 이상 값을 반환하거나, A 수정 시 관련 없는 B가 깨질 때

Use when `getX()`나 `fetchX()`에 숨은 부수 효과가 있거나, 같은 종류의 함수들이 서로 다른 반환 타입을 가지거나, 함수 이름과 실제 동작이 다를 때

Use when 삼항 연산자가 중첩되거나, 복잡한 조건식 `a && !b || c`가 이름 없이 사용되거나, 동시에 실행되지 않는 코드가 한 컴포넌트에 섞여 있을 때

Validates apps-in-toss project configuration and structure for both web and React Native apps. Use when checking if granite.config.ts is properly configured, verifying required files exist, validating package.json has framework dependencies, ensuring project structure follows apps-in-toss conventions, or debugging project setup issues.

Search and retrieve Toss / Apps-in-Toss documentation using the ax CLI via run-ax.sh. Supports docs, TDS React Native, and TDS Web sources. Use bash to execute run-ax.sh in this skill's directory.