import type { HTMLAttributes, ReactNode } from 'react' export type TesseraComponentState = 'default' | 'loading' | 'empty' | 'error' export type AgentWorkspaceHeroProps = Omit, 'children'> & { /** Replaces the component's default content while preserving its outer container. */ children?: ReactNode /** Transforms the default content without copying the component's internal markup. */ renderContent?: (defaultContent: ReactNode) => ReactNode /** Renders immediately before the main content. */ before?: ReactNode /** Renders immediately after the main content. */ after?: ReactNode /** Selects an application state. The default state preserves the original component UI. */ state?: TesseraComponentState loadingContent?: ReactNode emptyContent?: ReactNode errorContent?: ReactNode } /** * Copy-and-own Tailwind component. Add application-specific state and event handlers where needed. */ export function AgentWorkspaceHero({ className, children, renderContent, before, after, state = 'default', loadingContent, emptyContent, errorContent, ...props }: AgentWorkspaceHeroProps) { const defaultContent = ( <>

Built by an agent with Tessera UI

The UI library agents don't have to guess with.

Agent Workspace shows what happens when the UI library is the source of truth: clear building blocks, predictable composition, and pages assembled from real components instead of one-off markup.

Browse marketing components View example sites

Source of truth: Registry-first
Composition model: Copy-and-own
Primary benefit: Predictable UI

Agent workspace

Component plan for a product landing page

Valid

Selected sections

Hero rebuilt-section
Trust strip rebuilt-section
Workflow rebuilt-section
Pricing rebuilt-section
Closing CTA rebuilt-section

Agent guardrail

No bespoke sections

Every visible block comes from Tessera UI.

Design outcome

Better hierarchy

Clearer sections, cleaner pacing, less noise.

Trusted by teams shipping fast

Northlane Vaultform Ridgeline Circuiton Fernwell Basecove

) const content = children ?? (state === 'loading' ? (loadingContent ?? Loading…) : state === 'empty' ? (emptyContent ?? No content available.) : state === 'error' ? (errorContent ?? Something went wrong.) : renderContent ? renderContent(defaultContent) : defaultContent) return (

{before} {content} {after}

) }

Rebuilt Sections

Agent Workspace hero

Agent Workspace trust strip

Agent Workspace workflow

Agent Workspace pricing

Agent Workspace closing CTA

Navigation

Authentication layout

Pricing

Related components

CTAs

Footers

Header

Rebuilt Motion