Contact Pro 2: book a demo with a calendarPRO
A month grid with arrow-key navigation, available times, and a short form, ending in a clear confirmation. Dates come from a today prop.
Installation
Once per project: add the Pro registry and your licence key.
components.json{ "registries": { "@ballmac": "https://ui.ballmac.com/r/{name}.json", "@ballmac-pro": { "url": "https://ui.ballmac.com/r/pro/{name}.json", "headers": { "Authorization": "Bearer ${BALLMAC_LICENSE_KEY}" } } } }.env.localBALLMAC_LICENSE_KEY=your-licence-keyAdd it.
$ pnpm dlx shadcn@latest add @ballmac-pro/contact-pro-2Need a licence or help with setup?
Usage
import { ContactPro2 } from "@/components/ballmac/blocks/contact-pro-2/contact-pro-2"Dependencies
- npm
- lucide-react
Use with AI
Date and time picker built on real buttons in a grid with roving focus. Weekdays, slots and unavailable dates are props; onBook may reject. With the shadcn MCP server set up (guide), ask your agent:
Add the Ballmac UI Contact Pro 2: book a demo with a calendar (@ballmac-pro/contact-pro-2) to this project with the shadcn MCP, then use it where it fits.
Use it for
- Sales demos and consultations
Not for
- Complex resource scheduling (use calendar-pro-1)
Registry JSON (needs your licence key): https://ui.ballmac.com/r/pro/contact-pro-2.json
Covered by the Ballmac UI Pro license.
More contact blocks
Contact 1: form with contact methods
A contact section with a validated form (name, email, topic, message with counter, consent), loading, error and thank-you states, beside tiles for email, chat, phone and office with a response-time pill.
Contact Pro 1: contact form with details
A message form with topic chips, validation and a character count beside email, phone, hours and offices, with a clear success state.