{"success":true,"data":{"block":{"id":"contact-schedule","name":"Contact Schedule Meeting","title":"Contact Schedule Meeting","category":"Contact","categorySlug":"contact","description":"Meeting scheduling form with calendar integration and time slot selection. Streamlined booking for consultations and appointments.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290591/vc78la2z54i13wkzqe4gam1wr3rd/contact-schedule-desktop.png","mobile":"https://cdn.ing/assets/i/r/290592/1zq9cc1ix3htamr00fnrg7zfq2un/contact-schedule-mobile.png"},"componentPath":"blocks/contact/contact-schedule.tsx","code":"\"use client\";\n\nimport { ContactSchedule } from \"@opensite/ui/blocks/contact/contact-schedule\";\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: 12,\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: \"appointment_type\",\n    type: \"radio\",\n    label: \"Type of Appointment\",\n    required: true,\n    columnSpan: 12,\n    layout: \"grid\",\n    options: [\n      {\n        value: \"consultation\",\n        label: \"Initial Consultation\",\n        description: \"30-minute discovery call to discuss your needs.\",\n      },\n      {\n        value: \"demo\",\n        label: \"Product Demo\",\n        description: \"60-minute walkthrough of our platform.\",\n      },\n      {\n        value: \"followup\",\n        label: \"Follow-up Meeting\",\n        description: \"Continue the conversation from a previous call.\",\n      },\n      {\n        value: \"training\",\n        label: \"Training Session\",\n        description: \"Hands-on training for you and your team.\",\n      },\n    ],\n  },\n  {\n    name: \"preferred_date\",\n    type: \"date-picker\",\n    label: \"Preferred Date\",\n    placeholder: \"Select a date\",\n    required: true,\n    columnSpan: 6,\n  },\n  {\n    name: \"preferred_time\",\n    type: \"select\",\n    label: \"Preferred Time\",\n    required: true,\n    columnSpan: 6,\n    options: [\n      { value: \"morning\", label: \"Morning (9am - 12pm)\" },\n      { value: \"afternoon\", label: \"Afternoon (12pm - 5pm)\" },\n      { value: \"evening\", label: \"Evening (5pm - 7pm)\" },\n    ],\n  },\n  {\n    name: \"timezone\",\n    type: \"select\",\n    label: \"Timezone\",\n    required: true,\n    columnSpan: 12,\n    options: [\n      { value: \"EST\", label: \"Eastern Time (EST)\" },\n      { value: \"CST\", label: \"Central Time (CST)\" },\n      { value: \"MST\", label: \"Mountain Time (MST)\" },\n      { value: \"PST\", label: \"Pacific Time (PST)\" },\n      { value: \"GMT\", label: \"Greenwich Mean Time (GMT)\" },\n      { value: \"CET\", label: \"Central European Time (CET)\" },\n    ],\n  },\n  {\n    name: \"content\",\n    type: \"textarea\",\n    label: \"What would you like to discuss?\",\n    placeholder: \"Tell us what you'd like to cover during the meeting...\",\n    required: true,\n    rows: 4,\n    columnSpan: 12,\n  },\n];\n\nexport default function Demo() {\n  return (\n    <ContactSchedule\n      heading=\"Schedule a Meeting\"\n      description=\"Book time with our team to discuss your needs. Choose a date and time that works best for you, and we'll send you a calendar invitation with all the details.\"\n      formEngineSetup={{\n        api: demoFormEngineApi,\n        fields: formFields,\n        successMessage: \"Your appointment request has been received! We'll send you a calendar invitation shortly with meeting details and a video conferencing link.\",\n        formLayoutSettings: {\n          submitButtonSetup: {\n            submitLabel: \"Schedule Appointment\",\n          },\n        },\n      }}\n      background=\"gradient\"\n      pattern=\"architect\"\n      patternOpacity={0.2}\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}},"exampleProps":{"heading":"Schedule an Appointment","description":"Pick a date and time and we'll confirm your appointment by email.","formEngineSetup":{"formConfig":{"endpoint":"/api/schedule","format":"json"}}},"dependencies":["@opensite/ui","@page-speed/forms"],"tags":["contact","schedule","meeting","form","booking","calendar"],"performance":{},"importantUsageNotes":"formEngineSetup is required to enable form submission.","usageRequirements":{"requiredProps":[],"requiresSiteCapabilities":["contact_form","contact_info"],"mediaSlots":{},"propConstraints":{"formEngineSetup":{"note":"Must include a valid formConfig.endpoint"}}}}},"timestamp":"2026-06-28T21:56:24.920Z"}