Skip to main content
Clever Ops

Private Dining Inquiry

An events block that sells the back room in serif, capacity and minimum spend as quiet data rows, and a three-field inquiry form with visible labels. Warm, unhurried, no SaaS urgency.

Preview & code

Loading Private Dining Inquiry preview
Open in v0

Installation

pnpm dlx shadcn@latest add @cleverui/private-dining-inquiry

Requires the @cleverui registry in your components.json, a one-off, two-line setup.

Usage

tsx
import { PrivateDiningInquiry } from '@/components/blocks/private-dining-inquiry'
Exampletsx
import { PrivateDiningInquiry } from '@/components/blocks/private-dining-inquiry'

export default function PrivateDiningInquiryDemo() {
  return (
    <PrivateDiningInquiry
      heading="The back room seats twenty"
      body="A long table under low candlelight, one waiter for the evening, and a kitchen that will cook a menu only for your party. Birthdays, anniversaries, or the kind of supper that needs a closed door."
      facts={[
        { label: 'Capacity', value: '20 seated' },
        { label: 'Minimum spend', value: '$1,800' },
        { label: 'Available', value: 'Tue–Sat' },
        { label: 'Deposit', value: '50% to hold' },
      ]}
      form={{
        buttonLabel: 'Inquire about the room',
        onSubmit: () => {
          // demo, host page would open a confirmation or send the inquiry
        },
      }}
      contact={{
        label: 'or email events@laconda.com.au',
        href: 'mailto:events@laconda.com.au',
      }}
    />
  )
}

API reference

PrivateDiningInquiry accepts the following props.

PropTypeDefaultDescription
headingstring'The back room seats twenty'–
bodystring–one italic serif paragraph selling the room
facts{ label: string; value: string }[]–2–4 quiet data rows, capacity, minimum spend, availability
formPrivateDiningInquiryFormConfig–three-field inquiry form; omit to render the copy-and-facts panel alone
contact{ label: string; href: string }–quiet fallback link beneath the form

…plus everything from React.HTMLAttributes<HTMLElement>: className, event handlers, aria attributes and the rest pass straight through.

Referenced types

Typestsx
export interface PrivateDiningInquiryFormConfig {
  onSubmit?: (data: { name: string; datePreference: string; party: string }) => void
  buttonLabel?: string
}

Frequently asked questions

How do I install the Private Dining Inquiry component?

Register the @cleverui registry in your components.json ("@cleverui": "https://cleverops.com.au/r/{name}.json"), then run `npx shadcn@latest add @cleverui/private-dining-inquiry`. The shadcn CLI copies the source into your project, you own the code from that point. You can also copy the source directly from this page.

What dependencies does Private Dining Inquiry require?

Private Dining Inquiry uses motion and lucide-react on top of React and Tailwind CSS. You don't need to install them manually, the shadcn CLI resolves and installs npm dependencies automatically when you add the component.

Can I theme Private Dining Inquiry to match my brand?

Yes. The component is styled entirely with Tailwind utilities over standard design tokens (primary, background, muted, border), so it inherits your existing shadcn/ui theme automatically. Change your CSS variables and the component follows, no source edits needed for palette, radius, or fonts.

Want this built for you?

CleverUI is built by the Clever Ops web team. If you'd rather ship a hand-coded, fast, custom website than assemble one, we build them for Australian businesses every week.

Explore web development services