{"success":true,"data":{"block":{"id":"feature-carousel-progress","name":"Feature Carousel Progress","title":"Feature Carousel Progress","category":"Features","categorySlug":"features","description":"Carousel-based feature display with progress indicator. Each slide shows a feature with image, title, and description. Includes navigation arrows and progress bar for visual feedback.","thumbnail":{"desktop":"https://cdn.ing/assets/i/r/290521/x31bb9r4ufra33peu6ujjz8dhwsu/feature-carousel-progress-desktop.png","mobile":"https://cdn.ing/assets/i/r/290520/8f856nuofnq4z17qtinacz1qcrq9/feature-carousel-progress-mobile.png"},"componentPath":"blocks/features/feature-carousel-progress.tsx","code":"import { FeatureCarouselProgress } from \"@opensite/ui/blocks/features/feature-carousel-progress\";\n\nexport default function Demo() {\n  return (\n    <FeatureCarouselProgress\n      badge=\"Platform Features\"\n      title=\"Everything You Need in One Place\"\n      description=\"Our platform offers a comprehensive suite of features designed to help you build, deploy, and scale modern applications with ease and confidence.\"\n      carouselLabel=\"Explore Our Features\"\n      slides={[\n        {\n          iconName: \"lucide/code\",\n          title: \"Modern Development\",\n          description:\n            \"Built with the latest frameworks and tools, updated regularly for features and security. TypeScript, React, and Tailwind CSS come preconfigured for optimal developer experience.\",\n        },\n        {\n          iconName: \"lucide/rocket\",\n          title: \"Instant Deployment\",\n          description:\n            \"Push to production in seconds with automatic builds, tests, and deployments. No configuration needed - it just works.\",\n        },\n        {\n          iconName: \"lucide/shield-check\",\n          title: \"Enterprise Security\",\n          description:\n            \"SOC 2 Type II certified with automatic SSL, DDoS protection, and regular security audits. Your data is always protected.\",\n        },\n        {\n          iconName: \"lucide/bar-chart-3\",\n          title: \"Advanced Analytics\",\n          description:\n            \"Real-time insights into performance, user behavior, and business metrics. Make data-driven decisions with confidence.\",\n        },\n        {\n          iconName: \"lucide/users\",\n          title: \"Team Collaboration\",\n          description:\n            \"Built-in tools for code review, project management, and team communication. Keep everyone aligned and productive.\",\n        },\n      ]}\n      background=\"dark\"\n    />\n  );\n}","propsSchema":{"badge":{"type":"object","description":"Badge content displayed above the heading","typeLabel":"React.ReactNode","required":false},"title":{"type":"object","description":"Main heading content","typeLabel":"React.ReactNode","required":false},"description":{"type":"object","description":"Supporting description content","typeLabel":"React.ReactNode","required":false},"carouselLabel":{"type":"object","description":"Label for the carousel section","typeLabel":"React.ReactNode","required":false},"slides":{"type":"array","description":"Array of feature slides","items":{"type":"object","description":"","fields":{"icon":{"type":"object","description":"Icon element (overrides iconName)","typeLabel":"React.ReactNode","required":false},"iconName":{"type":"string","description":"Icon name in format: prefix/name (e.g., \"lucide/code\")","required":false},"title":{"type":"object","description":"Feature title content","typeLabel":"React.ReactNode","required":false},"description":{"type":"object","description":"Feature description content","typeLabel":"React.ReactNode","required":false},"className":{"type":"string","description":"Additional CSS classes for the slide","required":false},"iconClassName":{"type":"string","description":"Additional CSS classes for the icon wrapper","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},"href":{"type":"string","description":"Optional href for the item","required":false}},"typeLabel":"FeatureCarouselProgressItem"},"typeLabel":"FeatureCarouselProgressItem[]","required":false},"slidesSlot":{"type":"object","description":"Custom slot for rendering slides (overrides slides array)","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},"badgeClassName":{"type":"string","description":"Additional CSS classes for the badge","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},"carouselClassName":{"type":"string","description":"Additional CSS classes for the carousel","required":false},"controlsClassName":{"type":"string","description":"Additional CSS classes for the carousel controls","required":false},"progressClassName":{"type":"string","description":"Additional CSS classes for the progress bar","required":false},"cardClassName":{"type":"string","description":"Additional CSS classes for each slide card","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},"patternClassName":{"type":"string","description":"Additional CSS classes for the pattern overlay","required":false},"sectionId":{"type":"string","description":"Optional Section ID","required":false}},"defaultProps":{},"dependencies":["@opensite/ui"],"tags":["features","carousel","slider","progress","interactive","showcase","product"],"performance":{},"importantUsageNotes":"Ensure to supply 4–8 items in the 'slides' array for a well-paced carousel experience. Each slide needs an 'iconName', 'title', and 'description'. Follow the example props closely for this block."}},"timestamp":"2026-05-13T10:37:55.937Z"}