{"success":true,"data":{"block":{"id":"hero-coming-soon-countdown","name":"Coming Soon Countdown Hero","title":"Hero Coming Soon Countdown","category":"Hero","categorySlug":"hero","description":"A dark-themed hero with countdown timer for launches. Features email signup and social links.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290455/rhiz034g76v22c6dpkjs9phmnpqs/cleanshot-2026-02-19-at-03-56-15-2x.png","mobile":"https://cdn.ing/assets/i/r/290454/s2jsui75kg5ow71edyg5qtdfaxyl/cleanshot-2026-02-19-at-03-56-47-2x.png"},"componentPath":"blocks/hero/hero-coming-soon-countdown.tsx","code":"\"use client\";\n\nimport { HeroComingSoonCountdown } from \"@opensite/ui/blocks/hero/hero-coming-soon-countdown\";\nimport moment from \"moment\";\nimport { demoFormConfig } from \"@/lib/form-demo-data\";\nimport type { FormFieldConfig } from \"@opensite/ui\";\n\nconst formFields: FormFieldConfig[] = [\n  {\n    name: \"email\",\n    type: \"email\",\n    placeholder: \"Enter your email\",\n    required: true,\n    columnSpan: 12,\n  },\n];\n\nexport default function Demo() {\n  return (\n    <HeroComingSoonCountdown\n      badgeIcon=\"lucide/rocket\"\n      badgeText=\"Launching Soon\"\n      heading=\"Something amazing is on the way\"\n      description=\"Be the first to know when we launch. Sign up now for exclusive early access and special launch pricing.\"\n      countdownDate={moment().add(3, \"weeks\").toDate()}\n      formFields={formFields}\n      formConfig={{\n        ...demoFormConfig,\n      }}\n      buttonAction={{\n        label: \"Notify Me\",\n        variant: \"default\",\n      }}\n      successMessage=\"Thank you! We'll notify you as soon as we launch.\"\n      helperText=\"We respect your privacy. Unsubscribe anytime.\"\n      socialLinks={[\n        { href: \"https://twitter.com\" },\n        { href: \"https://facebook.com\" },\n        { href: \"https://instagram.com\" },\n        { href: \"https://linkedin.com\" },\n      ]}\n      background=\"gray\"\n    />\n  );\n}","propsSchema":{"badgeIcon":{"type":"string","description":"Badge icon name (DynamicIcon format)","required":false},"badgeText":{"type":"object","description":"Badge text content","typeLabel":"React.ReactNode","required":false,"maxLength":20},"heading":{"type":"object","description":"Main heading content","typeLabel":"React.ReactNode","required":true,"maxLength":40},"description":{"type":"object","description":"Description text below heading","typeLabel":"React.ReactNode","required":false,"maxLength":130},"countdownDate":{"type":"object","description":"Target date for the countdown. If in the past or not provided, countdown is hidden.","typeLabel":"Date","required":true},"countdownSlot":{"type":"object","description":"Custom slot for countdown (overrides countdownDate)","typeLabel":"React.ReactNode","required":false},"formFields":{"type":"array","description":"Form field configuration","items":{"type":"object","description":"","typeLabel":"FormFieldConfig"},"typeLabel":"FormFieldConfig[]","required":false},"formConfig":{"type":"object","description":"Form configuration for submission","typeLabel":"PageSpeedFormConfig","required":false},"onSubmit":{"type":"object","description":"Custom submit handler","typeLabel":"(values: Record<string, any>) => void | Promise<void>","required":false},"onSuccess":{"type":"object","description":"Success callback","typeLabel":"(data: unknown) => void","required":false},"onError":{"type":"object","description":"Error callback","typeLabel":"(error: Error) => void","required":false},"successMessage":{"type":"object","description":"Success message to display","typeLabel":"React.ReactNode","required":false},"buttonAction":{"type":"object","description":"Submit button configuration","fields":{"variant":{"type":"string","description":"","typeLabel":"\"default\" | \"destructive\" | \"outline\" | \"secondary\" | \"ghost\" | \"link\"","required":false},"size":{"type":"string","description":"","typeLabel":"\"default\" | \"sm\" | \"md\" | \"lg\" | \"icon\" | \"icon-sm\" | \"icon-lg\"","required":false},"label":{"type":"object","description":"Button/link label text or ReactNode","typeLabel":"ReactNode","required":false},"icon":{"type":"object","description":"Icon to display (typically before label)","typeLabel":"ReactNode","required":false},"iconAfter":{"type":"object","description":"Icon to display after the label","typeLabel":"ReactNode","required":false},"href":{"type":"string","description":"URL for link behavior","required":false},"onClick":{"type":"object","description":"Click handler for button behavior","typeLabel":"MouseEventHandler","required":false},"className":{"type":"string","description":"Additional CSS classes for the action","required":false},"children":{"type":"object","description":"Custom children (overrides label + icon rendering)","typeLabel":"ReactNode","required":false},"aria-label":{"type":"string","description":"ARIA label for accessibility","required":false},"asButton":{"type":"boolean","description":"Render as a button element instead of an anchor/link","required":false}},"typeLabel":"ActionConfig","required":false},"helperText":{"type":"object","description":"Helper text below form","typeLabel":"React.ReactNode","required":false},"formSlot":{"type":"object","description":"Custom slot for the form (overrides form props)","typeLabel":"React.ReactNode","required":false},"socialLinks":{"type":"array","description":"Social link items","items":{"type":"object","description":"","typeLabel":"SocialLinkItem & { iconName?: string; }"},"typeLabel":"SocialLinkItem & { iconName?: string; }[]","required":false},"socialLinksSlot":{"type":"object","description":"Custom slot for social links (overrides socialLinks array)","typeLabel":"React.ReactNode","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","fields":{},"typeLabel":"PatternName","required":false},"patternOpacity":{"type":"number","description":"Pattern overlay opacity (0-1)","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},"badgeClassName":{"type":"string","description":"Additional CSS classes for the badge","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},"countdownClassName":{"type":"string","description":"Additional CSS classes for the countdown container","required":false},"formClassName":{"type":"string","description":"Additional CSS classes for the form container","required":false},"socialLinksClassName":{"type":"string","description":"Additional CSS classes for the social links container","required":false},"patternClassName":{"type":"string","description":"Additional CSS classes for the pattern overlay","required":false},"logo":{"type":"object","description":"Brand logo configuration. LOGO MEDIA ONLY — do not use photos or hero images.","fields":{"url":{"type":"string","description":"URL to navigate to when logo is clicked","required":false},"src":{"type":"string","description":"Image source for the logo","required":false},"alt":{"type":"string","description":"Alt text for the logo image","required":false},"title":{"type":"object","description":"Text title to display (alternative to image)","typeLabel":"React.ReactNode","required":false},"className":{"type":"string","description":"Additional CSS classes for the logo","required":false}},"typeLabel":"LogoConfig","required":false},"logoSlot":{"type":"object","description":"Custom slot for logo (overrides logo prop)","typeLabel":"React.ReactNode","required":false},"logoClassName":{"type":"string","description":"Additional CSS classes for the logo container","required":false},"sectionId":{"type":"string","description":"Optional Section ID","required":false}},"exampleProps":{"logo":{"src":"https://cdn.ing/assets/i/r/287635/1tmeh86afyxszfz7hbmvcc0oct8w/logo-dark.png","alt":"Brand Logo"},"badgeIcon":"lucide/rocket","badgeText":"Launching Soon","heading":"Something amazing is on the way","description":"Be the first to know when we launch.","buttonAction":{"label":"Notify Me","variant":"default"},"successMessage":"Thank you! We'll notify you as soon as we launch.","helperText":"We respect your privacy. Unsubscribe anytime.","background":"gray"},"dependencies":["@opensite/ui"],"tags":["hero","coming-soon","countdown","launch","timer","dark","teaser","anticipation"],"performance":{},"importantUsageNotes":"Only use if you have a valid real date for 'countdownDate'. Only supply 'socialLinks' that are valid — DO NOT MAKE UP, USE PLACEHOLDERS OR GUESS ANY SOCIAL LINKS. Do not exceed 20 characters for 'badgeText'. Do not exceed 40 characters for 'heading'. Do not exceed 130 characters for 'description'. Ensure 'formConfig' and 'formFields' are wired up for email capture.","usageRequirements":{"requiredProps":["heading","countdownDate"],"propConstraints":{"badgeText":{"maxLength":20},"heading":{"required":true,"maxLength":40},"description":{"maxLength":130},"countdownDate":{"required":true,"note":"Must be a real, future date. Do not fabricate."},"socialLinks":{"note":"Only include real, verified social links. Do not guess or use placeholders."}},"mediaSlots":{}}}},"timestamp":"2026-06-27T20:15:47.597Z"}