useMatchesData() — ui Function Reference

Architecture documentation for the useMatchesData() function in utils.ts from the ui codebase.

Function typescript FrameworkTooling TemplateSync called by 1

Entity Profile

FrameworkTooling→ TemplateSync→ useMatchesData() — ui Function Reference

Dependency Diagram

graph TD
  9835dc97_69be_386a_b38a_9f4296fe8409["useMatchesData()"]
  7d2e02dc_279c_932c_e7c4_5c1f3787e593["utils.ts"]
  9835dc97_69be_386a_b38a_9f4296fe8409 -->|defined in| 7d2e02dc_279c_932c_e7c4_5c1f3787e593
  f6b47ca0_3f19_01ba_1da0_7f0d34b92db6["useOptionalUser()"]
  f6b47ca0_3f19_01ba_1da0_7f0d34b92db6 -->|calls| 9835dc97_69be_386a_b38a_9f4296fe8409
  style 9835dc97_69be_386a_b38a_9f4296fe8409 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/shadcn/test/fixtures/frameworks/remix-indie-stack/app/utils.ts lines 36–45

export function useMatchesData(
  id: string,
): Record<string, unknown> | undefined {
  const matchingRoutes = useMatches();
  const route = useMemo(
    () => matchingRoutes.find((route) => route.id === id),
    [matchingRoutes, id],
  );
  return route?.data as Record<string, unknown>;
}