{"success":true,"data":{"block":{"id":"hero-minimal-centered-dark","name":"Minimal Centered Dark Hero","title":"Hero Minimal Centered Dark","category":"Hero","categorySlug":"hero","description":"A minimal dark-themed centered hero with beta badge. Clean and focused design for product launches.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290356/f3m3055iz8f576ccgei2hsyqoqxk/cleanshot-2026-02-18-at-09-08-59.png","mobile":"https://cdn.ing/assets/i/r/290355/8t7ldz8f6jzb5q95964ad7vjaqpu/cleanshot-2026-02-18-at-09-09-12.png"},"componentPath":"blocks/hero/hero-minimal-centered-dark.tsx","code":"import { HeroMinimalCenteredDark } from \"@opensite/ui/blocks/hero/hero-minimal-centered-dark\";\nimport { DynamicIcon } from \"@opensite/ui/components/dynamic-icon\";\n\nexport default function Demo() {\n  return (\n    <HeroMinimalCenteredDark\n      heading=\"Simplicity is the ultimate sophistication\"\n      description=\"Clean, focused, and purposeful. Experience the power of minimalism in design and functionality.\"\n      actions={[\n        {\n          label: \"Get Started\",\n          href: \"#\",\n          variant: \"default\",\n          iconAfter: <DynamicIcon name=\"lucide/arrow-right\" size={16} />,\n        },\n      ]}\n      badge=\"Industry Leader\"\n      background=\"dark\"\n      pattern=\"squareAltGrid\"\n      patternOpacity={0.75}\n    />\n  );\n}","propsSchema":{"badge":{"type":"object","description":"Badge/status indicator content","typeLabel":"React.ReactNode","required":false},"showStatusDot":{"type":"boolean","description":"Show animated status dot","required":false},"heading":{"type":"object","description":"Main heading content","typeLabel":"React.ReactNode","required":false},"headingHighlight":{"type":"string","description":"Highlighted text within heading (gradient styled)","required":false},"description":{"type":"object","description":"Description text below heading","typeLabel":"React.ReactNode","required":false},"actions":{"type":"array","description":"Array of action configurations for CTA buttons","items":{"type":"object","description":"","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"},"typeLabel":"ActionConfig[]","required":false},"actionsSlot":{"type":"object","description":"Custom slot for rendering actions (overrides actions array)","typeLabel":"React.ReactNode","required":false},"stats":{"type":"array","description":"Array of stat/trust indicators","items":{"type":"object","description":"","fields":{"value":{"type":"object","description":"Stat value (number or formatted string)","typeLabel":"ReactNode","required":true},"label":{"type":"object","description":"Stat label/description","typeLabel":"ReactNode","required":false},"icon":{"type":"object","description":"Optional icon","typeLabel":"ReactNode | string","required":false},"className":{"type":"string","description":"Additional CSS classes","required":false}},"typeLabel":"StatItem"},"typeLabel":"StatItem[]","required":false},"statsSlot":{"type":"object","description":"Custom slot for rendering stats (overrides stats array)","typeLabel":"React.ReactNode","required":false},"background":{"type":"string","description":"","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},"actionsClassName":{"type":"string","description":"Additional CSS classes for the actions container","required":false},"statsClassName":{"type":"string","description":"Additional CSS classes for the stats container","required":false},"sectionId":{"type":"string","description":"Optional Section ID","required":false}},"defaultProps":{},"dependencies":["@opensite/ui"],"tags":["hero","minimal","centered","dark","beta","launch","clean","focused"],"performance":{},"importantUsageNotes":"Do not exceed 60 characters for the 'heading' prop. Do not exceed 160 characters for the 'description' prop. Do not exceed 20 characters for the 'badge' prop. If you supply multiple 'actions', ensure to use a variant of 'default' for the first action, and 'outline' for the second action to ensure proper visual distinction between the two CTAs. Follow the example props closely for this block."}},"timestamp":"2026-05-13T10:44:42.118Z"}