{"success":true,"data":{"block":{"id":"article-hero-prose","name":"Article Hero Prose","title":"Article Hero Prose","category":"Article","categorySlug":"article","description":"A full-width content layout featuring a prominent hero media, author information with avatar, and rich prose content including alerts, tables, blockquotes, and lists. Ideal for long-form content that needs visual hierarchy with a strong opening media and detailed content sections.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/293094/4ksu0y47tgsk03h18uq3dknyy3e3/cleanshot-2026-03-03-at-13-41-31.png","mobile":"https://cdn.ing/assets/i/r/293093/t099stgoambmukt6v1wq0xxvwjwj/cleanshot-2026-03-03-at-13-41-52.png"},"componentPath":"blocks/article/article-hero-prose.tsx","code":"import { ArticleHeroProse } from \"@opensite/ui/blocks/article/article-hero-prose\";\nimport { imagePlaceholders, LONG_FORM_MARKDOWN_STRING } from \"@/lib/media\";\n\nexport default function Demo() {\n  return (\n    <ArticleHeroProse\n      background=\"dark\"\n      pattern=\"gridFadeTopRight\"\n      patternOpacity={0.15}\n      post={{\n        title: \"The Evolution of Modern JavaScript: From ES6 to ES2026\",\n        description:\n          \"Explore how JavaScript has transformed over the past decade, introducing powerful features that have reshaped web development as we know it.\",\n        authorName: \"Alex Rodriguez\",\n        authorImage: imagePlaceholders[77],\n        authorHref: \"#\",\n        image: imagePlaceholders[62],\n        pubDate: new Date(\"2026-01-20\"),\n      }}\n      dateFormat=\"MMMM d, yyyy\"\n      markdownString={LONG_FORM_MARKDOWN_STRING}\n    />\n  );\n}","propsSchema":{"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 section","required":false},"titleClassName":{"type":"string","description":"Additional CSS classes for the title","required":false},"descriptionClassName":{"type":"string","description":"Additional CSS classes for the description","required":false},"authorClassName":{"type":"string","description":"Additional CSS classes for the author information","required":false},"heroImageClassName":{"type":"string","description":"Additional CSS classes for the hero media","required":false},"proseClassName":{"type":"string","description":"Additional CSS classes for the prose content","required":false},"post":{"type":"object","description":"Content metadata (title, author, media, etc.)","fields":{"title":{"type":"string","description":"","required":false},"authorName":{"type":"string","description":"","required":false},"authorHref":{"type":"string","description":"","required":false},"image":{"type":"string","description":"","required":false},"pubDate":{"type":"object","description":"","typeLabel":"Date","required":false},"description":{"type":"string","description":"","required":false},"authorImage":{"type":"string","description":"","required":false}},"typeLabel":"ArticleHeroProsePost","required":false},"heroMediaSlot":{"type":"object","description":"Custom slot for hero media (overrides post.image)","typeLabel":"React.ReactNode","required":false},"authorSlot":{"type":"object","description":"Custom slot for author information (overrides post author fields)","typeLabel":"React.ReactNode","required":false},"markdownString":{"type":"string","description":"Markdown string to render","required":false},"markdownStyles":{"type":"object","description":"Custom className mappings for markdown elements","typeLabel":"MarkdownStylesMap","required":false},"dateFormat":{"type":"string","description":"Date format string (date-fns format)","required":false},"optixFlowConfig":{"type":"object","description":"OptixFlow image optimization configuration","fields":{"apiKey":{"type":"string","description":"API key for OptixFlow service","required":true},"compression":{"type":"number","description":"Compression level (0-100)","required":false}},"typeLabel":"OptixFlowConfig","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":"Background pattern","fields":{},"typeLabel":"PatternName","required":false},"patternOpacity":{"type":"number","description":"Pattern opacity (0-1)","required":false},"sectionId":{"type":"string","description":"Optional Section ID","required":false}},"defaultProps":{},"dependencies":["@opensite/ui"],"tags":["article","blog-post","hero","prose","long-form","author","avatar","tables","alerts","blockquotes"],"performance":{},"importantUsageNotes":"ONLY use a valid markdown string for the content, supplied to the `markdownString` prop. Ensure to only use the post.authorName, post.authorImage, post.authorHref, and post.authorImage fields if you have actual data to populate those fields, using empty/fake data is not acceptable!"}},"timestamp":"2026-05-13T10:41:01.855Z"}