TaskCard

Launchable task template card — whole card clickable, serif-letterform medallion. Lay out in <TaskGrid> (auto-fill, min 220px).

Prop	Type	Notes
`letter`	`string`	Medallion letterform — Cormorant italic, one or two characters. A mark, not an icon; never an emoji.
`title` (required)	`React.ReactNode`
`description`	`React.ReactNode`
`as`	`'button' \| 'a'`	"button" (default) or "a".
`className`	`string`

Other props pass through to the root element (React.HTMLAttributes<HTMLElement>).

Preview

Declarations

TypeScript

export interface TaskCardProps extends Omit<React.HTMLAttributes<HTMLElement>, 'title'> {
  /** Medallion letterform — Cormorant italic, one or two characters.
   *  A mark, not an icon; never an emoji. */
  letter?: string;
  title: React.ReactNode;
  description?: React.ReactNode;
  /** "button" (default) or "a". */
  as?: 'button' | 'a';
  className?: string;
}

export interface TaskGridProps extends React.HTMLAttributes<HTMLDivElement> {
  className?: string;
  children?: React.ReactNode;
}

/**
 * Launchable task template card — whole card clickable, serif-letterform
 * medallion. Lay out in <TaskGrid> (auto-fill, min 220px).
 */
export function TaskCard(props: TaskCardProps): React.JSX.Element;
export function TaskGrid(props: TaskGridProps): React.JSX.Element;