{"success":true,"data":{"block":{"id":"contact-rsvp","name":"Contact RSVP","title":"Contact RSVP","category":"Contact","categorySlug":"contact","description":"RSVP form for event attendance confirmation with guest count and dietary preferences. Simple and elegant design for invitations.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290587/082ptd2rzt5n82n0pjf26vsfy3bx/contact-rsvp-desktop.png","mobile":"https://cdn.ing/assets/i/r/290588/02kk0b99d5r1g1v8t1odlxkfpecm/contact-rsvp-mobile.png"},"componentPath":"blocks/contact/contact-rsvp.tsx","code":"\"use client\";\n\nimport { ContactRsvp } from \"@opensite/ui/blocks/contact/contact-rsvp\";\nimport { demoFormEngineApi } from \"@/lib/form-demo-data\";\nimport type { FormFieldConfig } from \"@opensite/ui\";\n\nconst formFields: FormFieldConfig[] = [\n  {\n    name: \"first_name\",\n    type: \"text\",\n    label: \"First Name\",\n    placeholder: \"First name\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"last_name\",\n    type: \"text\",\n    label: \"Last Name\",\n    placeholder: \"Last name\",\n    required: true,\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: 12,\n  },\n  {\n    name: \"phone\",\n    type: \"tel\",\n    label: \"Phone Number\",\n    placeholder: \"+1 (555) 000-0000\",\n    required: false,\n    columnSpan: 12,\n  },\n  {\n    name: \"attendance\",\n    type: \"radio\",\n    label: \"Will You Be Attending?\",\n    required: true,\n    columnSpan: 12,\n    layout: \"grid\",\n    options: [\n      {\n        value: \"yes\",\n        label: \"Joyfully Accepts\",\n        description: \"Can't wait to celebrate with you!\",\n      },\n      {\n        value: \"no\",\n        label: \"Regretfully Declines\",\n        description: \"Sorry to miss the celebration.\",\n      },\n    ],\n  },\n  {\n    name: \"plus_one\",\n    type: \"radio\",\n    label: \"Will You Bring a Guest?\",\n    required: true,\n    columnSpan: 12,\n    layout: \"stacked\",\n    options: [\n      { value: \"yes\", label: \"Yes, bringing a guest (+1)\" },\n      { value: \"no\", label: \"No, just me\" },\n    ],\n  },\n  {\n    name: \"guest_name\",\n    type: \"text\",\n    label: \"Guest's Full Name\",\n    placeholder: \"Guest's name (if bringing +1)\",\n    required: false,\n    columnSpan: 12,\n  },\n  {\n    name: \"total_attending\",\n    type: \"select\",\n    label: \"Total Number Attending\",\n    required: true,\n    columnSpan: 12,\n    options: [\n      { value: \"0\", label: \"0 (Not attending)\" },\n      { value: \"1\", label: \"1 person\" },\n      { value: \"2\", label: \"2 people\" },\n      { value: \"3\", label: \"3 people\" },\n      { value: \"4\", label: \"4 people\" },\n    ],\n  },\n  {\n    name: \"meal_preference\",\n    type: \"radio\",\n    label: \"Meal Preference (Primary Guest)\",\n    required: false,\n    columnSpan: 12,\n    layout: \"grid\",\n    options: [\n      {\n        value: \"beef\",\n        label: \"Filet Mignon\",\n        description: \"Beef tenderloin with herb butter.\",\n      },\n      {\n        value: \"chicken\",\n        label: \"Herb-Roasted Chicken\",\n        description: \"Free-range chicken with seasonal vegetables.\",\n      },\n      {\n        value: \"fish\",\n        label: \"Pan-Seared Salmon\",\n        description: \"Atlantic salmon with lemon dill sauce.\",\n      },\n      {\n        value: \"vegetarian\",\n        label: \"Vegetarian\",\n        description: \"Seasonal vegetable Wellington.\",\n      },\n      {\n        value: \"vegan\",\n        label: \"Vegan\",\n        description: \"Plant-based entree options.\",\n      },\n    ],\n  },\n  {\n    name: \"guest_meal\",\n    type: \"radio\",\n    label: \"Meal Preference (Guest)\",\n    required: false,\n    columnSpan: 12,\n    layout: \"grid\",\n    options: [\n      {\n        value: \"beef\",\n        label: \"Filet Mignon\",\n        description: \"Beef tenderloin with herb butter.\",\n      },\n      {\n        value: \"chicken\",\n        label: \"Herb-Roasted Chicken\",\n        description: \"Free-range chicken with seasonal vegetables.\",\n      },\n      {\n        value: \"fish\",\n        label: \"Pan-Seared Salmon\",\n        description: \"Atlantic salmon with lemon dill sauce.\",\n      },\n      {\n        value: \"vegetarian\",\n        label: \"Vegetarian\",\n        description: \"Seasonal vegetable Wellington.\",\n      },\n      {\n        value: \"vegan\",\n        label: \"Vegan\",\n        description: \"Plant-based entree options.\",\n      },\n    ],\n  },\n  {\n    name: \"dietary_restrictions\",\n    type: \"textarea\",\n    label: \"Dietary Restrictions or Allergies\",\n    placeholder: \"Please list any food allergies, intolerances, or special dietary needs...\",\n    required: false,\n    rows: 2,\n    columnSpan: 12,\n  },\n  {\n    name: \"song_request\",\n    type: \"text\",\n    label: \"Song Request\",\n    placeholder: \"Request a song to dance to!\",\n    required: false,\n    columnSpan: 12,\n  },\n  {\n    name: \"content\",\n    type: \"textarea\",\n    label: \"Special Message or Notes\",\n    placeholder: \"Any special message for the hosts, accessibility needs, or other information...\",\n    required: false,\n    rows: 3,\n    columnSpan: 12,\n  },\n];\n\nexport default function Demo() {\n  return (\n    <ContactRsvp\n      heading=\"RSVP\"\n      description=\"We can't wait to celebrate with you! Please respond by March 15th, 2026.\"\n      formEngineSetup={{\n        api: demoFormEngineApi,\n        fields: formFields,\n        successMessage: \"Thank you for your RSVP! We're excited to celebrate with you. You'll receive a confirmation email shortly with additional event details.\",\n        formLayoutSettings: {\n          submitButtonSetup: {\n            submitLabel: \"Submit RSVP\",\n          },\n        },\n      }}\n      background=\"dark\"\n      pattern=\"architect\"\n      patternOpacity={0.15}\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","rsvp","event","form","invitation","attendance"],"performance":{},"importantUsageNotes":"DO NOT USE this block unless the site is for a specific event that requires RSVP responses — 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 RSVP use case — first/last name, email, phone, attendance radio (accepts/declines), plus-one radio, guest name (if applicable), and total attending select — 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:41:24.195Z"}