Skip to content
XMachines

Type Alias: InferComponentProps<TCatalog, TKey>

Documentation / @xmachines/play-catalog / InferComponentProps

type InferComponentProps<TCatalog, TKey> = z.infer<TCatalog[TKey]>;

Defined in: types.ts:84

Infer component prop types from catalog entry

Utility type that extracts the TypeScript type of a component’s props from its Zod schema definition in the catalog. Enables type-safe component implementations that match the catalog schema.

Type Parameters

Type ParameterDescription
TCatalog extends Record<string, z.ZodType>Catalog record mapping component names to Zod schemas
TKey extends keyof TCatalogSpecific component key to extract props for

Returns

TypeScript type inferred from the Zod schema

Example

Extracting prop types for components

import { z } from "zod";
import { defineCatalog } from "@xmachines/play-catalog";
import type { InferComponentProps } from "@xmachines/play-catalog";


const catalog = defineCatalog({
  Dashboard: z.object({
    userId: z.string(),
    stats: z.object({
      views: z.number(),
      clicks: z.number()
    })
  })
});


type DashboardProps = InferComponentProps<typeof catalog, 'Dashboard'>;
// Inferred as: {
//   userId: string;
//   stats: {
//     views: number;
//     clicks: number;
//   };
// }


// Use in React component
function Dashboard({ userId, stats }: DashboardProps) {
  return <div>{userId}: {stats.views} views</div>;
}

See