{"success":true,"data":{"block":{"id":"contact-help-center","name":"Help Center Contact Cards","title":"Help Center Contact Cards","category":"Contact","categorySlug":"contact","description":"A split layout with support copy on the left and a stacked set of contact action cards on the right. Ideal for help centers, service hubs, or onboarding touchpoints that need multiple contact paths.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290834/b580zf517cjkkdzbtvuwkra2ygel/cleanshot-2026-02-25-at-04-40-23.png","mobile":"https://cdn.ing/assets/i/r/290835/bs6wlzfzeqy2le0bludrob6831xv/cleanshot-2026-02-25-at-04-40-42.png"},"componentPath":"blocks/contact/contact-help-center.tsx","code":"\"use client\";\n\nimport { ContactHelpCenter } from \"@opensite/ui/blocks/contact/contact-help-center\";\n\nexport default function Demo() {\n  return (\n    <ContactHelpCenter\n      heading=\"How Can We Help?\"\n      description=\"Can't find the answer you're looking for? Our support team is here to help.\"\n      background=\"gradient\"\n      pattern=\"dashedGridBasic\"\n      patternOpacity={0.15}\n      cardTitle=\"Quick Actions\"\n      contactItems={[\n        {\n          icon: \"lucide/book-open\",\n          title: \"Documentation\",\n          subtitle: \"Browse our comprehensive guides and tutorials.\",\n          href: \"#\",\n        },\n        {\n          icon: \"lucide/youtube\",\n          title: \"Video Tutorials\",\n          subtitle: \"Watch step-by-step video walkthroughs.\",\n          href: \"#\",\n        },\n        {\n          icon: \"lucide/message-circle\",\n          title: \"Community Forum\",\n          subtitle: \"Connect with other users and share tips.\",\n          href: \"#\",\n        },\n        {\n          icon: \"lucide/zap\",\n          title: \"Status Page\",\n          subtitle: \"Check system status and uptime.\",\n          href: \"#\",\n        },\n        {\n          icon: \"lucide/headphones\",\n          title: \"Live Chat\",\n          subtitle: \"Available Mon-Fri, 9am-6pm EST\",\n          href: \"#\",\n        },\n        {\n          icon: \"lucide/phone\",\n          title: \"Phone Support\",\n          subtitle: \"+1 (555) 123-4567\",\n          href: \"tel:+15551234567\",\n        },\n      ]}\n    />\n  );\n}","propsSchema":{"eyebrow":{"type":"object","description":"Eyebrow label above the heading","typeLabel":"React.ReactNode","required":false},"heading":{"type":"object","description":"Heading text for the left column","typeLabel":"React.ReactNode","required":false},"description":{"type":"object","description":"Description text for the left column","typeLabel":"React.ReactNode","required":false},"background":{"type":"string","description":"Title for the contact card list Background style variant for the section","typeLabel":"SectionBackground","required":false},"spacing":{"type":"object","description":"Vertical spacing/margin variant","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},"cardTitle":{"type":"object","description":"Additional CSS classes for the heading","typeLabel":"React.ReactNode","required":false},"contactItems":{"type":"array","description":"Contact items to display","items":{"type":"object","description":"","fields":{"title":{"type":"string","description":"Card title","required":true},"subtitle":{"type":"string","description":"Supporting description text","required":false},"icon":{"type":"string","description":"","required":true},"href":{"type":"string","description":"Optional link destination","required":false}},"typeLabel":"ContactHelpCenterItem"},"typeLabel":"ContactHelpCenterItem[]","required":false},"contactItemsSlot":{"type":"object","description":"Custom slot for rendering contact items (overrides contactItems array)","typeLabel":"React.ReactNode","required":false},"className":{"type":"string","description":"Additional CSS classes for the section wrapper","required":false},"containerClassName":{"type":"string","description":"Additional CSS classes for the container","required":false},"contentClassName":{"type":"string","description":"Additional CSS classes for the content wrapper","required":false},"leftColumnClassName":{"type":"string","description":"Additional CSS classes for the left column","required":false},"eyebrowClassName":{"type":"string","description":"Additional CSS classes for the eyebrow text","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},"cardPanelClassName":{"type":"string","description":"Additional CSS classes for the card panel","required":false},"cardTitleClassName":{"type":"string","description":"Additional CSS classes for the card title","required":false},"contactItemsClassName":{"type":"string","description":"Additional CSS classes for the contact items container","required":false},"sectionId":{"type":"string","description":"Optional Section ID","required":false}},"defaultProps":{},"dependencies":["@opensite/ui","@page-speed/forms"],"tags":["contact","help","support","cards","split","service-center","cta","links","support-hub"],"performance":{},"importantUsageNotes":"This is a contact block that doesn't have a form element, only use this to render contact information. Ensure to only supply a valid set of contact data points (email, phone, address, etc), DO NOT make up any contact data, if the brand/location hasn't supplied the contact data points, don't generate/guess, just skip over that data point(s) and only use ones stored in the system."}},"timestamp":"2026-05-13T10:41:23.165Z"}