{"success":true,"data":{"block":{"id":"contact-event","name":"Contact Event Registration","title":"Contact Event Registration","category":"Contact","categorySlug":"contact","description":"Event registration form with attendee information and event-specific fields. Perfect for conferences, workshops, and community events.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290569/l9kpnostypmjjwt7wwoxsel93asd/contact-event-desktop.png","mobile":"https://cdn.ing/assets/i/r/290570/4nqc4d08u9pb5ovosd9bhrz1p9ox/contact-event-mobile.png"},"componentPath":"blocks/contact/contact-event.tsx","code":"\"use client\";\n\nimport { ContactEvent } from \"@opensite/ui/blocks/contact/contact-event\";\nimport { demoFormEngineApi } from \"@/lib/form-demo-data\";\nimport type { FormFieldConfig } from \"@opensite/ui\";\n\nconst formFields: FormFieldConfig[] = [\n  {\n    name: \"name\",\n    type: \"text\",\n    label: \"Full Name\",\n    placeholder: \"Full Name\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"organization\",\n    type: \"text\",\n    label: \"Organization (Optional)\",\n    placeholder: \"Company or organization name\",\n    required: false,\n    columnSpan: 6,\n  },\n  {\n    name: \"email\",\n    type: \"email\",\n    label: \"Email Address\",\n    placeholder: \"your@email.com\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"phone\",\n    type: \"tel\",\n    label: \"Phone Number\",\n    placeholder: \"+1 (555) 000-0000\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"event_name\",\n    type: \"text\",\n    label: \"Event Name\",\n    placeholder: \"What's the name of your event?\",\n    required: true,\n    columnSpan: 12,\n  },\n  {\n    name: \"event_type\",\n    type: \"select\",\n    label: \"Event Type\",\n    required: true,\n    columnSpan: 6,\n    options: [\n      {\n        value: \"conference\",\n        label: \"Conference\",\n      },\n      {\n        value: \"workshop\",\n        label: \"Workshop\",\n      },\n      {\n        value: \"seminar\",\n        label: \"Seminar\",\n      },\n      {\n        value: \"networking\",\n        label: \"Networking Event\",\n      },\n      {\n        value: \"fundraiser\",\n        label: \"Fundraiser\",\n      },\n      {\n        value: \"celebration\",\n        label: \"Celebration\",\n      },\n      {\n        value: \"other\",\n        label: \"Other\",\n      },\n    ],\n  },\n  {\n    name: \"attendee_count\",\n    type: \"select\",\n    label: \"Expected Attendees\",\n    required: true,\n    columnSpan: 6,\n    options: [\n      {\n        value: \"1-25\",\n        label: \"1-25 people\",\n      },\n      {\n        value: \"26-50\",\n        label: \"26-50 people\",\n      },\n      {\n        value: \"51-100\",\n        label: \"51-100 people\",\n      },\n      {\n        value: \"101-250\",\n        label: \"101-250 people\",\n      },\n      {\n        value: \"250+\",\n        label: \"250+ people\",\n      },\n    ],\n  },\n  {\n    name: \"event_date\",\n    type: \"date-picker\",\n    label: \"Event Date\",\n    placeholder: \"Select date\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"venue\",\n    type: \"text\",\n    label: \"Venue/Location\",\n    placeholder: \"Venue name or address\",\n    required: false,\n    columnSpan: 6,\n  },\n  {\n    name: \"services_needed\",\n    type: \"checkbox-group\",\n    label: \"Services Needed\",\n    placeholder: \"Select services\",\n    required: true,\n    columnSpan: 12,\n    layout: \"grid\",\n    options: [\n      {\n        value: \"venue\",\n        label: \"Venue\",\n        description: \"Space rental.\",\n      },\n      {\n        value: \"catering\",\n        label: \"Catering\",\n        description: \"Food and beverage.\",\n      },\n      {\n        value: \"av\",\n        label: \"A/V Equipment\",\n        description: \"Audio/visual setup.\",\n      },\n      {\n        value: \"decor\",\n        label: \"Decoration\",\n        description: \"Event decoration.\",\n      },\n      {\n        value: \"entertainment\",\n        label: \"Entertainment\",\n        description: \"Music, performers, etc.\",\n      },\n      {\n        value: \"staff\",\n        label: \"Staff\",\n        description: \"Event staff and coordination.\",\n      },\n    ],\n  },\n  {\n    name: \"budget\",\n    type: \"select\",\n    label: \"Estimated Budget\",\n    required: false,\n    columnSpan: 12,\n    options: [\n      {\n        value: \"under-5k\",\n        label: \"Under $5,000\",\n      },\n      {\n        value: \"5k-10k\",\n        label: \"$5,000 - $10,000\",\n      },\n      {\n        value: \"10k-25k\",\n        label: \"$10,000 - $25,000\",\n      },\n      {\n        value: \"25k-50k\",\n        label: \"$25,000 - $50,000\",\n      },\n      {\n        value: \"50k+\",\n        label: \"$50,000+\",\n      },\n    ],\n  },\n  {\n    name: \"content\",\n    type: \"textarea\",\n    label: \"Event Details\",\n    placeholder: \"Tell us more about your event vision, special requirements, theme, etc...\",\n    required: true,\n    rows: 6,\n    columnSpan: 12,\n  },\n];\n\nexport default function Demo() {\n  return (\n    <ContactEvent\n      heading=\"Plan Your Event With Us\"\n      description=\"Let us help you create an unforgettable event. Fill out the form below and our event planning team will contact you within 48 hours with ideas and a quote.\"\n      formEngineSetup={{\n        api: demoFormEngineApi,\n        fields: formFields,\n        successMessage: \"Thank you for your event inquiry! Our planning team will review your details and reach out within 48 hours.\",\n        formLayoutSettings: {\n          submitButtonSetup: {\n            submitLabel: \"Submit Event Inquiry\",\n          },\n        },\n      }}\n      background=\"gray\"\n      pattern=\"dots\"\n      patternOpacity={0.35}\n    />\n  );\n}","propsSchema":{"heading":{"type":"object","description":"Main heading text","typeLabel":"React.ReactNode","required":false},"description":{"type":"object","description":"Description text below heading","typeLabel":"React.ReactNode","required":false},"className":{"type":"string","description":"Additional CSS classes for the section","required":false},"containerClassName":{"type":"string","description":"Additional CSS classes for the container","required":false},"headerClassName":{"type":"string","description":"Additional CSS classes for the header","required":false},"headingClassName":{"type":"string","description":"Additional CSS classes for the heading","required":false},"descriptionClassName":{"type":"string","description":"Additional CSS classes for the description","required":false},"cardClassName":{"type":"string","description":"Additional CSS classes for the card","required":false},"cardContentClassName":{"type":"string","description":"Additional CSS classes for the card content","required":false},"background":{"type":"string","description":"Background style for the section","typeLabel":"SectionBackground","required":false},"spacing":{"type":"object","description":"Vertical spacing for the section","fields":{},"typeLabel":"SectionSpacing","required":false},"pattern":{"type":"object","description":"Optional background pattern name or URL","fields":{},"typeLabel":"PatternName","required":false},"patternOpacity":{"type":"number","description":"Pattern overlay opacity (0-1)","required":false},"formEngineSetup":{"type":"object","description":"Full form engine setup and props","typeLabel":"FormEngineProps","required":false},"sectionId":{"type":"string","description":"Optional Section ID","required":false}},"defaultProps":{},"dependencies":["@opensite/ui","@page-speed/forms"],"tags":["contact","event","registration","form","rsvp","attendee"],"performance":{},"importantUsageNotes":"DO NOT USE this block unless the site is for an event organizer or event management service — this is a highly contextual block. Ensure to follow the form implementation requirements properly (correct field types, labels, validation, and submit handling). The form fields shown in the demo are calibrated for an event inquiry use case — full name, organization, email, phone, event name, event type select, expected attendees select, and details — do not change the field set unless the site has clearly different requirements. Ensure to only supply a valid set of contact data points (email, phone, address, etc), DO NOT make up any contact data. Follow the example props closely for this block."}},"timestamp":"2026-05-13T10:40:40.713Z"}