diff --git a/registry.json b/registry.json new file mode 100644 index 0000000..7ed2227 --- /dev/null +++ b/registry.json @@ -0,0 +1,4767 @@ +{ + "componentRegistry": { + "layout": [ + { + "import": "import CardStack from '@/components/cardStack/CardStack';", + "name": "CardStack", + "path": "@/components/cardStack/CardStack", + "propsSchema": { + "children": "React.ReactNode", + "mode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant?": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'items-top-row-full-width-bottom' | 'full-width-top-items-bottom-row' | 'one-large-left-three-stacked-right' | 'two-items-per-row' (default: 'uniform-all-items-equal')", + "uniformGridCustomHeightClasses?": "string", + "gridRowsClassName?": "string", + "itemHeightClassesOverride?": "Array", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required - controls GSAP scroll animations with stagger effect) (required)", + "supports3DAnimation?": "boolean (default: false)", + "carouselThreshold?": "number (default: 5)", + "bottomContent?": "React.ReactNode", + "title?": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description?": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground?": "boolean", + "ariaLabel?": "string (default: 'Card stack')", + "className?": "string", + "containerClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "carouselItemClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import TimelineHorizontalCardStack from '@/components/cardStack/layouts/timelines/TimelineHorizontalCardStack';", + "name": "TimelineHorizontalCardStack", + "path": "@/components/cardStack/layouts/timelines/TimelineHorizontalCardStack", + "propsSchema": { + "children": "React.ReactNode", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground?": "boolean", + "mediaItems?": "Array<{ imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }>", + "ariaLabel?": "string (default: 'Timeline section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "cardClassName?": "string", + "progressBarClassName?": "string", + "mediaContainerClassName?": "string", + "mediaClassName?": "string" + } + }, + { + "import": "import TimelineCardStack from '@/components/cardStack/layouts/timelines/TimelineCardStack';", + "name": "TimelineCardStack", + "path": "@/components/cardStack/layouts/timelines/TimelineCardStack", + "propsSchema": { + "children": "React.ReactNode", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground?": "boolean", + "ariaLabel?": "string (default: 'Timeline section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import TimelinePhoneView from '@/components/cardStack/layouts/timelines/TimelinePhoneView';", + "name": "TimelinePhoneView", + "path": "@/components/cardStack/layouts/timelines/TimelinePhoneView", + "propsSchema": { + "items": "Array<{ trigger: string, content: React.ReactNode, imageOne?: string, videoOne?: string, imageAltOne?: string, videoAriaLabelOne?: string, imageTwo?: string, videoTwo?: string, imageAltTwo?: string, videoAriaLabelTwo?: string }> - Timeline items with triggers and dual phone media (required)", + "showTextBox?": "boolean (default: true - controls whether CardStackTextBox renders)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "ariaLabel?": "string (default: 'Timeline phone view section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "desktopContainerClassName?": "string", + "mobileContainerClassName?": "string", + "desktopContentClassName?": "string", + "desktopWrapperClassName?": "string", + "mobileWrapperClassName?": "string", + "phoneFrameClassName?": "string", + "mobilePhoneFrameClassName?": "string" + } + }, + { + "import": "import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';", + "name": "TimelineProcessFlow", + "path": "@/components/cardStack/layouts/timelines/TimelineProcessFlow", + "propsSchema": { + "items": "Array<{ content: React.ReactNode, media: React.ReactNode, reverse: boolean }> - Timeline items with content and media", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "ariaLabel?": "string (default: 'Timeline process flow section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "itemClassName?": "string", + "mediaWrapperClassName?": "string", + "numberClassName?": "string", + "contentWrapperClassName?": "string", + "gapClassName?": "string" + } + }, + { + "import": "import TextBox from '@/components/Textbox';", + "name": "TextBox", + "path": "@/components/Textbox", + "propsSchema": { + "title": "string", + "description": "string", + "type?": "'entrance-slide' | 'reveal-blur' | 'background-highlight'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' (required)", + "center?": "boolean (default: false)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "duration?": "number (default: 1)", + "start?": "string (default: 'top 80%')", + "end?": "string (default: 'top 20%')", + "gradientColors?": "{ from: string, to: string }", + "children?": "React.ReactNode", + "className?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "avatars?": "Array<{ src: string, alt?: string }> - User avatar images", + "avatarText?": "string", + "avatarGroupClassName?": "string" + } + }, + { + "import": "import AvatarGroup from '@/components/shared/AvatarGroup';", + "name": "AvatarGroup", + "path": "@/components/shared/AvatarGroup", + "propsSchema": { + "avatars": "Array<{ src: string, alt?: string }> - User avatar images", + "text?": "string", + "maxVisible?": "number (default: 5)", + "className?": "string", + "avatarClassName?": "string", + "textClassName?": "string", + "ariaLabel?": "string (default: 'User avatars')" + } + }, + { + "import": "import { BentoGlobe } from '@/components/bento/BentoGlobe';", + "name": "BentoGlobe", + "path": "@/components/bento/BentoGlobe", + "propsSchema": { + "className?": "string", + "config?": "COBEOptions - Custom globe configuration (see COBE docs)" + } + } + ], + "title": [ + { + "import": "import TextAnimation from '@/components/text/TextAnimation';", + "name": "TextAnimation", + "path": "@/components/text/TextAnimation", + "propsSchema": { + "type?": "'entrance-slide' | 'reveal-blur' | 'background-highlight'", + "title": "string", + "children?": "React.ReactNode", + "variant?": "'trigger' | 'words-trigger'", + "className?": "string", + "duration?": "number", + "stagger?": "number", + "start?": "string", + "end?": "string", + "ariaLabel?": "string", + "gradientColors?": "{ from: string, to: string }" + } + }, + { + "import": "import TextNumberCount from '@/components/text/TextNumberCount';", + "name": "TextNumberCount", + "path": "@/components/text/TextNumberCount", + "propsSchema": { + "value": "number", + "startFrom?": "number", + "duration?": "number", + "format?": "Intl.NumberFormatOptions", + "locales?": "string", + "prefix?": "string", + "suffix?": "string", + "animateOnScroll?": "boolean", + "threshold?": "number", + "className?": "string" + } + } + ], + "button": [ + { + "import": "import ButtonTextUnderline from '@/components/button/ButtonTextUnderline';", + "name": "ButtonTextUnderline", + "path": "@/components/button/ButtonTextUnderline", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + }, + { + "import": "import ButtonIconArrow from '@/components/button/ButtonIconArrow';", + "name": "ButtonIconArrow", + "path": "@/components/button/ButtonIconArrow", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "textClassName?": "string", + "iconClassName?": "string", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + }, + { + "import": "import ButtonTextStagger from '@/components/button/ButtonTextStagger/ButtonTextStagger';", + "name": "ButtonTextStagger", + "path": "@/components/button/ButtonTextStagger/ButtonTextStagger", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "bgClassName?": "string", + "textClassName?": "string", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')", + "scrollToSection?": "boolean" + } + }, + { + "import": "import ButtonShiftHover from '@/components/button/ButtonShiftHover/ButtonShiftHover';", + "name": "ButtonShiftHover", + "path": "@/components/button/ButtonShiftHover/ButtonShiftHover", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "bgClassName?": "string", + "textClassName?": "string", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + }, + { + "import": "import ButtonHoverMagnetic from '@/components/button/ButtonHoverMagnetic/ButtonHoverMagnetic';", + "name": "ButtonHoverMagnetic", + "path": "@/components/button/ButtonHoverMagnetic/ButtonHoverMagnetic", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "textClassName?": "string", + "strengthFactor?": "number (default: 20)", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + }, + { + "import": "import ButtonHoverBubble from '@/components/button/ButtonHoverBubble';", + "name": "ButtonHoverBubble", + "path": "@/components/button/ButtonHoverBubble", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "bgClassName?": "string - Applied to the text container (automatically set in sections)", + "textClassName?": "string - Applied to the text span", + "iconClassName?": "string - Applied to both arrow icon containers (automatically set in sections)", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + }, + { + "import": "import ButtonExpandHover from '@/components/button/ButtonExpandHover';", + "name": "ButtonExpandHover", + "path": "@/components/button/ButtonExpandHover", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "textClassName?": "string - Applied to the text span (automatically includes base and hover colors in sections)", + "iconClassName?": "string - Applied to the arrow icon container (automatically set in sections)", + "iconBgClassName?": "string - Applied to the expanding background (automatically set in sections)", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + }, + { + "import": "import ButtonBounceEffect from '@/components/button/ButtonBounceEffect/ButtonBounceEffect';", + "name": "ButtonBounceEffect", + "path": "@/components/button/ButtonBounceEffect/ButtonBounceEffect", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "bgClassName?": "string", + "textClassName?": "string", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + }, + { + "import": "import ButtonDirectionalHover from '@/components/button/ButtonDirectionalHover/ButtonDirectionalHover';", + "name": "ButtonDirectionalHover", + "path": "@/components/button/ButtonDirectionalHover/ButtonDirectionalHover", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "bgClassName?": "string", + "textClassName?": "string", + "circleClassName?": "string - Controls the expanding circle color", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + }, + { + "import": "import ButtonElasticEffect from '@/components/button/ButtonElasticEffect/ButtonElasticEffect';", + "name": "ButtonElasticEffect", + "path": "@/components/button/ButtonElasticEffect/ButtonElasticEffect", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "textClassName?": "string", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + }, + { + "import": "import ButtonTextShift from '@/components/button/ButtonTextShift/ButtonTextShift';", + "name": "ButtonTextShift", + "path": "@/components/button/ButtonTextShift/ButtonTextShift", + "propsSchema": { + "text": "string", + "onClick?": "() => void", + "href?": "string - External URLs open in new tab, internal values scroll to section", + "className?": "string", + "bgClassName?": "string", + "textClassName?": "string", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "type?": "'button' | 'submit' | 'reset' (default: 'button')" + } + } + ], + "form": [ + { + "import": "import Input from '@/components/form/Input';", + "name": "Input", + "path": "@/components/form/Input", + "propsSchema": { + "value": "string (required)", + "onChange": "(value: string) => void (required)", + "type?": "string (default: 'text')", + "placeholder?": "string", + "required?": "boolean (default: false)", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "className?": "string" + } + }, + { + "import": "import Textarea from '@/components/form/Textarea';", + "name": "Textarea", + "path": "@/components/form/Textarea", + "propsSchema": { + "value": "string (required)", + "onChange": "(value: string) => void (required)", + "placeholder?": "string", + "rows?": "number (default: 5)", + "required?": "boolean (default: false)", + "disabled?": "boolean (default: false)", + "ariaLabel?": "string", + "className?": "string" + } + }, + { + "import": "import EmailSignupForm from '@/components/form/EmailSignupForm';", + "name": "EmailSignupForm", + "path": "@/components/form/EmailSignupForm", + "propsSchema": { + "inputPlaceholder?": "string (default: 'Enter your email')", + "buttonText?": "string (default: 'Sign Up')", + "onSubmit?": "(email: string) => void", + "className?": "string", + "inputClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import ContactForm from '@/components/form/ContactForm';", + "name": "ContactForm", + "path": "@/components/form/ContactForm", + "propsSchema": { + "title": "string (required)", + "description": "string (required)", + "tag": "string (required)", + "tagIcon?": "LucideIcon", + "inputPlaceholder?": "string (default: 'Enter your email')", + "buttonText?": "string (default: 'Sign Up')", + "termsText?": "string (default: 'By clicking Sign Up you're confirming that you agree with our Terms and Conditions.')", + "onSubmit?": "(email: string) => void", + "centered?": "boolean (default: false)", + "className?": "string", + "tagClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "formWrapperClassName?": "string", + "formClassName?": "string", + "inputClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "termsClassName?": "string" + } + } + ], + "navbar": [ + { + "import": "import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';", + "name": "NavbarStyleApple", + "path": "@/components/navbar/NavbarStyleApple/NavbarStyleApple", + "propsSchema": { + "navItems": "Array<{name: string, id: string}>", + "brandName?": "string (default: 'Webild')" + } + }, + { + "import": "import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';", + "name": "NavbarLayoutFloatingInline", + "path": "@/components/navbar/NavbarLayoutFloatingInline", + "propsSchema": { + "navItems": "Array<{name: string, id: string}>", + "logoSrc?": "string", + "logoAlt?": "string", + "brandName?": "string (default: 'Webild')", + "button": "{text: string, onClick?: () => void, href?: string}", + "animateOnLoad?": "boolean (default: true)", + "className?": "string (default: '')", + "logoClassName?": "string (default: '')", + "logoImageClassName?": "string (default: '')", + "navItemClassName?": "string (default: '')", + "buttonClassName?": "string (default: '')", + "buttonTextClassName?": "string (default: '')" + } + }, + { + "import": "import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';", + "name": "NavbarLayoutFloatingOverlay", + "path": "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay", + "propsSchema": { + "navItems": "Array<{name: string, id: string}>", + "logoSrc?": "string", + "logoAlt?": "string", + "className?": "string", + "brandName?": "string (default: 'Webild')", + "button?": "{text: string, onClick?: () => void, href?: string}", + "logoClassName?": "string (default: '')", + "logoImageClassName?": "string (default: '')", + "buttonClassName?": "string (default: '')", + "buttonTextClassName?": "string (default: '')" + } + }, + { + "import": "import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';", + "name": "NavbarStyleFullscreen", + "path": "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen", + "propsSchema": { + "navItems": "Array<{name: string, id: string}>", + "logoSrc?": "string", + "logoAlt?": "string", + "brandName?": "string (default: 'Webild')", + "bottomLeftText?": "string (default: 'Global Community')", + "bottomRightText?": "string (default: 'hello@example.com')", + "topBarClassName?": "string (default: '')", + "button?": "{text: string, onClick?: () => void, href?: string}", + "buttonClassName?": "string (default: '')", + "buttonTextClassName?": "string (default: '')", + "logoClassName?": "string (default: '')", + "logoImageClassName?": "string (default: '')" + } + }, + { + "import": "import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';", + "name": "NavbarStyleCentered", + "path": "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered", + "propsSchema": { + "navItems": "Array<{name: string, id: string}>", + "button?": "{text: string, onClick?: () => void, href?: string}", + "topBarButton?": "{text: string, onClick?: () => void, href?: string}", + "logoSrc?": "string", + "logoAlt?": "string", + "brandName?": "string (default: 'Webild')", + "className?": "string (default: '')", + "logoClassName?": "string (default: '')", + "logoImageClassName?": "string (default: '')" + } + } + ], + "background": [ + { + "import": "import PlainBackground from '@/components/background/PlainBackground';", + "name": "PlainBackground", + "path": "@/components/background/PlainBackground", + "propsSchema": { + "className?": "string" + } + }, + { + "import": "import GridBackround from '@/components/background/GridBackround';", + "name": "GridBackround", + "path": "@/components/background/GridBackround", + "propsSchema": { + "size?": "'small' | 'medium' | 'large' (default: 'medium')", + "perspectiveThreeD?": "boolean (default: false)", + "className?": "string" + } + }, + { + "import": "import DotGridBackground from '@/components/background/DotGridBackground';", + "name": "DotGridBackground", + "path": "@/components/background/DotGridBackground", + "propsSchema": { + "size?": "'small' | 'medium' | 'large' (default: 'medium')", + "perspectiveThreeD?": "boolean (default: false)", + "className?": "string" + } + }, + { + "import": "import CircleGradientBackground from '@/components/background/CircleGradientBackground';", + "name": "CircleGradientBackground", + "path": "@/components/background/CircleGradientBackground", + "propsSchema": { + "diagonal?": "'primary' | 'secondary' (default: 'primary')", + "className?": "string" + } + }, + { + "import": "import AuroraBackground from '@/components/background/AuroraBackground';", + "name": "AuroraBackground", + "path": "@/components/background/AuroraBackground", + "propsSchema": { + "className?": "string" + } + }, + { + "import": "import FloatingGradientBackground from '@/components/background/floatingGradientBackground/FloatingGradientBackground';", + "name": "FloatingGradientBackground", + "path": "@/components/background/floatingGradientBackground/FloatingGradientBackground", + "propsSchema": { + "className?": "string" + } + }, + { + "import": "import AnimatedGridBackground from '@/components/background/AnimatedGridBackground';", + "name": "AnimatedGridBackground", + "path": "@/components/background/AnimatedGridBackground", + "propsSchema": { + "squareSize?": "number (default: 100)", + "numSquares?": "number (default: 50)", + "maxOpacity?": "number (default: 0.15)", + "className?": "string" + } + }, + { + "import": "import AnimatedAuroraBackground from '@/components/background/AnimatedAuroraBackground';", + "name": "AnimatedAuroraBackground", + "path": "@/components/background/AnimatedAuroraBackground", + "propsSchema": { + "className?": "string", + "showRadialGradient?": "boolean (default: true)", + "invertColors": "boolean (REQUIRED - true for light backgrounds, false for dark backgrounds)" + } + }, + { + "import": "import FluidBackground from '@/components/background/FluidBackground';", + "name": "FluidBackground", + "path": "@/components/background/FluidBackground", + "propsSchema": { + "className?": "string" + } + }, + { + "import": "import RadialGradientBackground from '@/components/background/RadialGradientBackground';", + "name": "RadialGradientBackground", + "path": "@/components/background/RadialGradientBackground", + "propsSchema": { + "className?": "string", + "centerColor?": "string (default: 'var(--background)')", + "edgeColor?": "string (default: 'var(--color-background-accent)')", + "size?": "string (default: '130% 130%')", + "position?": "string (default: '50% 15%')" + } + }, + { + "import": "import GradientBarsBackground from '@/components/background/GradientBarsBackground';", + "name": "GradientBarsBackground", + "path": "@/components/background/GradientBarsBackground", + "propsSchema": { + "className?": "string", + "numBarsPerSide?": "number (default: 8)", + "gradientFrom?": "string (default: 'var(--color-primary-cta)')", + "gradientTo?": "string (default: 'transparent')", + "opacity?": "number (default: 0.075)", + "sideWidth?": "string (default: '35%')" + } + }, + { + "import": "import CanvasRevealEffect from '@/components/background/CanvasRevealEffect';", + "name": "CanvasRevealEffect", + "path": "@/components/background/CanvasRevealEffect", + "propsSchema": { + "animationSpeed?": "number (default: 0.4)", + "opacities?": "number[] (default: [0.3, 0.3, 0.3, 0.5, 0.5, 0.5, 0.8, 0.8, 0.8, 1])", + "colors?": "number[][] - RGB arrays (default: [[0, 255, 255]])", + "containerClassName?": "string", + "dotSize?": "number (default: 3)", + "showGradient?": "boolean (default: true)" + } + }, + { + "import": "import CanvasRevealBackground from '@/components/background/CanvasRevealBackground';", + "name": "CanvasRevealBackground", + "path": "@/components/background/CanvasRevealBackground", + "propsSchema": { + "className?": "string", + "animationSpeed?": "number (default: 5)", + "dotSize?": "number (default: 3)", + "height?": "string (default: '30%')", + "position?": "'center' | 'left' | 'right' (default: 'center')" + } + }, + { + "import": "import CellWaveBackground from '@/components/background/CellWaveBackground';", + "name": "CellWaveBackground", + "path": "@/components/background/CellWaveBackground", + "propsSchema": { + "className?": "string", + "columns?": "number (default: 5)", + "rows?": "number (default: 24)", + "cellColor?": "string (default: 'var(--color-background-accent)')", + "duration?": "number (default: 0.25)", + "delay?": "number (default: 1.25)" + } + }, + { + "import": "import GlowingOrbBackground from '@/components/background/GlowingOrbBackground';", + "name": "GlowingOrbBackground", + "path": "@/components/background/GlowingOrbBackground", + "propsSchema": { + "className?": "string", + "blurAmount?": "string (default: '57px')", + "glowColor?": "string (default: 'var(--color-primary-cta)')", + "backgroundColor?": "string (default: 'var(--background)')" + } + }, + { + "import": "import BlurBottomBackground from '@/components/background/BlurBottomBackground';", + "name": "BlurBottomBackground", + "path": "@/components/background/BlurBottomBackground", + "propsSchema": { + "className?": "string" + } + }, + { + "import": "import RotatedRaysBackground from '@/components/background/RotatedRaysBackground';", + "name": "RotatedRaysBackground", + "path": "@/components/background/RotatedRaysBackground", + "propsSchema": { + "animated": "boolean - Required. When true, rays animate with pulsing opacity. When false, rays display static opacity.", + "showGrid": "boolean - Required. When true, displays a grid overlay fading from top center. When false, no grid is shown.", + "className?": "string", + "containerClassName?": "string" + } + }, + { + "import": "import DownwardRaysBackground from '@/components/background/DownwardRaysBackground';", + "name": "DownwardRaysBackground", + "path": "@/components/background/DownwardRaysBackground", + "propsSchema": { + "animated": "boolean - Required. When true, rays animate with pulsing opacity. When false, rays display static opacity.", + "showGrid": "boolean - Required. When true, displays a grid overlay fading from top center. When false, no grid is shown.", + "className?": "string", + "containerClassName?": "string" + } + }, + { + "import": "import RotatingGradientBackground from '@/components/background/RotatingGradientBackground';", + "name": "RotatingGradientBackground", + "path": "@/components/background/RotatingGradientBackground", + "propsSchema": { + "className?": "string", + "gradientColorStart?": "string - Gradient start color. Default: 'var(--color-background-accent)'", + "gradientColorEnd?": "string - Gradient end color. Default: 'var(--color-background-accent)'", + "bigCircleSize?": "string - Size of the larger circle. Default: '28vw'", + "smallCircleSize?": "string - Size of the smaller circle. Default: '21vw'", + "blurAmount?": "string - Blur amount for gradient circles. Default: '10px'", + "opacity?": "number - Overall opacity of gradient effect. Default: 0.6", + "showSparkles?": "boolean - Show sparkle ring effect. Default: true" + } + }, + { + "import": "import { Sparkles } from '@/components/background/Sparkles';", + "name": "Sparkles", + "path": "@/components/background/Sparkles", + "propsSchema": { + "id?": "string", + "className?": "string", + "background?": "string - Default: 'transparent'", + "particleSize?": "number - Deprecated, use minSize/maxSize instead", + "minSize?": "number - Minimum particle size. Default: 0.5", + "maxSize?": "number - Maximum particle size. Default: 1", + "speed?": "number - Animation speed. Default: 4", + "particleColor?": "string - Particle color, supports CSS variables. Default: 'var(--color-primary-cta)'", + "particleDensity?": "number - Number of particles. Default: 100" + } + }, + { + "import": "import SparklesGradientBackground from '@/components/background/SparklesGradientBackground';", + "name": "SparklesGradientBackground", + "path": "@/components/background/SparklesGradientBackground", + "propsSchema": { + "className?": "string", + "gradientColor?": "string - Main gradient color. Default: 'var(--color-background-accent)'", + "accentColor?": "string - Inner accent gradient color. Default: 'var(--color-background-accent)'", + "blurAmount?": "string - Blur amount for gradients. Default: '6vw'" + } + }, + { + "import": "import HeroBackgrounds from '@/components/background/HeroBackgrounds';", + "name": "HeroBackgrounds", + "path": "@/components/background/HeroBackgrounds", + "propsSchema": { + "variant": "'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'glowing-orb' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'rotating-gradient' | 'sparkles-gradient'" + } + } + ] + }, + "sectionRegistry": { + "hero": [ + { + "import": "import HeroBillboard from '@/components/sections/hero/HeroBillboard';", + "name": "HeroBillboard", + "path": "@/components/sections/hero/HeroBillboard", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "avatars?": "Array<{src: string, alt: string}>", + "avatarText?": "string", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "mediaAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "marqueeItems?": "Array<{ type: \"image\", src: string, alt?: string } | { type: \"text\", text: string }>", + "marqueeSpeed?": "number (default: 30)", + "showMarqueeCard?": "boolean (default: true)", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "avatarGroupClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "marqueeClassName?": "string", + "marqueeItemClassName?": "string", + "marqueeCardClassName?": "string", + "marqueeImageClassName?": "string", + "marqueeTextClassName?": "string", + "marqueeIconClassName?": "string" + } + }, + { + "import": "import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';", + "name": "HeroBillboardCarousel", + "path": "@/components/sections/hero/HeroBillboardCarousel", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "mediaItems": "Array<{ imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }> - Each item requires either imageSrc or videoSrc", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string" + } + }, + { + "import": "import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';", + "name": "HeroBillboardGallery", + "path": "@/components/sections/hero/HeroBillboardGallery", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "mediaItems": "Array<{ imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }> (MINIMUM 3 ITEMS REQUIRED, max 5)", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string" + } + }, + { + "import": "import HeroSplit from '@/components/sections/hero/HeroSplit';", + "name": "HeroSplit", + "path": "@/components/sections/hero/HeroSplit", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'glowing-orb' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "avatars?": "Avatar[] - Array of avatar objects with src and alt properties", + "avatarText?": "string - Text displayed next to the avatar group", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Hero section')", + "imagePosition?": "'left' | 'right' (default: 'right')", + "fixedMediaHeight?": "boolean (default: true) - When true, media wrapper is aspect-square on mobile and md:h-[65vh] on desktop", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "avatarGroupClassName?": "string", + "marqueeItems?": "Array<{ type: 'image', src: string, alt?: string } | { type: 'text', text: string } | { type: 'text-icon', text: string, icon: LucideIcon }> - Optional marquee at bottom of hero", + "marqueeSpeed?": "number (default: 30)", + "showMarqueeCard?": "boolean (default: true) - Card styling for text/text-icon items, images never have cards", + "marqueeClassName?": "string", + "marqueeItemClassName?": "string", + "marqueeCardClassName?": "string", + "marqueeImageClassName?": "string", + "marqueeTextClassName?": "string", + "marqueeIconClassName?": "string" + } + }, + { + "import": "import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';", + "name": "HeroSplitTestimonial", + "path": "@/components/sections/hero/HeroSplitTestimonial", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'glowing-orb' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "testimonials": "Array<{ name: string, handle: string, testimonial: string, rating: number, imageSrc?: string, imageAlt?: string }>", + "testimonialRotationInterval?": "number (default: 5000)", + "useInvertedBackground?": "boolean (default: false)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "avatars?": "Array<{ src: string, alt: string }>", + "avatarText?": "string", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Hero section')", + "imagePosition?": "'left' | 'right' (default: 'right')", + "fixedMediaHeight?": "boolean (default: true)", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "avatarGroupClassName?": "string", + "testimonialCardClassName?": "string", + "testimonialContentClassName?": "string", + "testimonialTextClassName?": "string", + "testimonialRatingClassName?": "string", + "testimonialAuthorClassName?": "string", + "testimonialAuthorImageClassName?": "string", + "testimonialAuthorNameClassName?": "string", + "testimonialAuthorHandleClassName?": "string", + "marqueeItems?": "Array<{ type: 'image', src: string, alt?: string } | { type: 'text', text: string } | { type: 'text-icon', text: string, icon: LucideIcon }>", + "marqueeSpeed?": "number (default: 30)", + "showMarqueeCard?": "boolean (default: true)", + "marqueeClassName?": "string", + "marqueeItemClassName?": "string", + "marqueeCardClassName?": "string", + "marqueeImageClassName?": "string", + "marqueeTextClassName?": "string", + "marqueeIconClassName?": "string" + } + }, + { + "import": "import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';", + "name": "HeroBillboardTestimonial", + "path": "@/components/sections/hero/HeroBillboardTestimonial", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'glowing-orb' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "testimonials": "Array<{ name: string, handle: string, testimonial: string, rating: number, imageSrc?: string, imageAlt?: string }>", + "testimonialRotationInterval?": "number (default: 5000)", + "useInvertedBackground?": "boolean (default: false)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "avatars?": "Array<{ src: string, alt: string }>", + "avatarText?": "string", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "mediaAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (default: 'none')", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "avatarGroupClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "testimonialCardClassName?": "string", + "testimonialContentClassName?": "string", + "testimonialTextClassName?": "string", + "testimonialRatingClassName?": "string", + "testimonialAuthorClassName?": "string", + "testimonialAuthorImageClassName?": "string", + "testimonialAuthorNameClassName?": "string", + "testimonialAuthorHandleClassName?": "string", + "marqueeItems?": "Array<{ type: 'image', src: string, alt?: string } | { type: 'text', text: string } | { type: 'text-icon', text: string, icon: LucideIcon }>", + "marqueeSpeed?": "number (default: 30)", + "showMarqueeCard?": "boolean (default: true)", + "marqueeClassName?": "string", + "marqueeItemClassName?": "string", + "marqueeCardClassName?": "string", + "marqueeImageClassName?": "string", + "marqueeTextClassName?": "string", + "marqueeIconClassName?": "string" + } + }, + { + "import": "import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';", + "name": "HeroSplitKpi", + "path": "@/components/sections/hero/HeroSplitKpi", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'glowing-orb' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "kpis": "[{ value: string, label: string }, { value: string, label: string }, { value: string, label: string }] - Array of exactly 3 KPI items with value and label", + "enableKpiAnimation": "boolean - Enable/disable mouse-following animation on KPI boxes", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "avatars?": "Avatar[] - Array of avatar objects with src and alt properties", + "avatarText?": "string - Text displayed next to the avatar group", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Hero section')", + "imagePosition?": "'left' | 'right' (default: 'right')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "avatarGroupClassName?": "string", + "kpiClassName?": "string", + "kpiValueClassName?": "string", + "kpiLabelClassName?": "string", + "marqueeItems?": "Array<{ type: 'image', src: string, alt?: string } | { type: 'text', text: string } | { type: 'text-icon', text: string, icon: LucideIcon }> - Optional marquee at bottom of hero", + "marqueeSpeed?": "number (default: 30)", + "showMarqueeCard?": "boolean (default: true) - Card styling for text/text-icon items, images never have cards", + "marqueeClassName?": "string", + "marqueeItemClassName?": "string", + "marqueeCardClassName?": "string", + "marqueeImageClassName?": "string", + "marqueeTextClassName?": "string", + "marqueeIconClassName?": "string" + } + }, + { + "import": "import HeroOverlay from '@/components/sections/hero/HeroOverlay';", + "name": "HeroOverlay", + "path": "@/components/sections/hero/HeroOverlay", + "propsSchema": { + "title": "string", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "avatars?": "Array<{ src: string, alt: string }>", + "avatarText?": "string", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "showDimOverlay?": "boolean (default: false)", + "showBlur?": "boolean (default: true)", + "textPosition?": "'top' | 'bottom' (default: 'bottom')", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "avatarGroupClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "blurClassName?": "string", + "dimOverlayClassName?": "string" + } + }, + { + "import": "import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';", + "name": "HeroOverlayTestimonial", + "path": "@/components/sections/hero/HeroOverlayTestimonial", + "propsSchema": { + "title": "string", + "description": "string", + "testimonials": "Array<{ name: string, handle: string, testimonial: string, rating: number, imageSrc?: string, imageAlt?: string }>", + "testimonialRotationInterval?": "number (default: 5000)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "avatars?": "Array<{ src: string, alt: string }>", + "avatarText?": "string", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "showDimOverlay?": "boolean (default: false)", + "showBlur?": "boolean (default: true)", + "textPosition?": "'top' | 'bottom' (default: 'bottom')", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "avatarGroupClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "blurClassName?": "string", + "dimOverlayClassName?": "string", + "testimonialCardClassName?": "string", + "testimonialContentClassName?": "string", + "testimonialTextClassName?": "string", + "testimonialRatingClassName?": "string", + "testimonialAuthorClassName?": "string", + "testimonialAuthorImageClassName?": "string", + "testimonialAuthorNameClassName?": "string", + "testimonialAuthorHandleClassName?": "string" + } + }, + { + "import": "import HeroLogo from '@/components/sections/hero/HeroLogo';", + "name": "HeroLogo", + "path": "@/components/sections/hero/HeroLogo", + "propsSchema": { + "logoText": "string", + "description": "string", + "buttons": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "showDimOverlay?": "boolean (default: false)", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "contentContainerClassName?": "string", + "descriptionClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "logoContainerClassName?": "string", + "logoClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "blurClassName?": "string", + "dimOverlayClassName?": "string" + } + }, + { + "import": "import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';", + "name": "HeroLogoBillboard", + "path": "@/components/sections/hero/HeroLogoBillboard", + "propsSchema": { + "logoText": "string", + "description": "string", + "buttons": "Array<{ text: string, onClick?: () => void, href?: string }> - Primary and secondary buttons (required, max 2)", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'glowing-orb' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "frameStyle?": "'card' | 'browser' (default: 'card')", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "logoContainerClassName?": "string", + "logoClassName?": "string", + "descriptionClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "browserBarClassName?": "string", + "addressBarClassName?": "string" + } + }, + { + "import": "import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';", + "name": "HeroBillboardScroll", + "path": "@/components/sections/hero/HeroBillboardScroll", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Hero video')", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "cardWrapperClassName?": "string", + "cardInnerClassName?": "string", + "imageClassName?": "string" + } + }, + { + "import": "import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';", + "name": "HeroBillboardRotatedCarousel", + "path": "@/components/sections/hero/HeroBillboardRotatedCarousel", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "carouselItems": "Array<{ id: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }> - Carousel items (minimum 6 items)", + "autoPlay?": "boolean (default: true)", + "autoPlayInterval?": "number (default: 4000)", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "carouselClassName?": "string" + } + }, + { + "import": "import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';", + "name": "HeroCarouselLogo", + "path": "@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo", + "propsSchema": { + "logoText": "string", + "description": "string", + "buttons": "Array<{text: string, onClick?: () => void, href?: string}> (required)", + "slides": "Array<{ imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }> - Carousel slide items", + "autoplayDelay?": "number (default: 3000)", + "showDimOverlay?": "boolean (default: false)", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "contentContainerClassName?": "string", + "descriptionClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "logoContainerClassName?": "string", + "logoClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string", + "blurClassName?": "string", + "dimOverlayClassName?": "string", + "progressBarClassName?": "string" + } + }, + { + "import": "import HeroCentered from '@/components/sections/hero/HeroCentered';", + "name": "HeroCentered", + "path": "@/components/sections/hero/HeroCentered", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "avatars": "Array<{ src: string, alt: string }> (required)", + "avatarText?": "string", + "buttons?": "Array<{ text: string, onClick?: () => void, href?: string }>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "avatarGroupClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "marqueeItems?": "Array<{ type: 'image', src: string, alt?: string } | { type: 'text', text: string } | { type: 'text-icon', text: string, icon: LucideIcon }> - Optional marquee at bottom of hero", + "marqueeSpeed?": "number (default: 30)", + "showMarqueeCard?": "boolean (default: true) - Card styling for text/text-icon items, images never have cards", + "marqueeClassName?": "string", + "marqueeItemClassName?": "string", + "marqueeCardClassName?": "string", + "marqueeImageClassName?": "string", + "marqueeTextClassName?": "string", + "marqueeIconClassName?": "string" + } + }, + { + "import": "import HeroSignup from '@/components/sections/hero/HeroSignup';", + "name": "HeroSignup", + "path": "@/components/sections/hero/HeroSignup", + "propsSchema": { + "title": "string (required)", + "description": "string (required)", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'glowing-orb' | 'glowing-orb-sparkles' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "tag": "string (required)", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "inputPlaceholder?": "string (default: 'Enter your email')", + "buttonText?": "string (default: 'Get Started')", + "onSubmit?": "(email: string) => void", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "formWrapperClassName?": "string", + "formClassName?": "string", + "inputClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';", + "name": "HeroSplitDualMedia", + "path": "@/components/sections/hero/HeroSplitDualMedia", + "propsSchema": { + "title": "string (required)", + "description": "string (required)", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'glowing-orb' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "tag": "string (required)", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "mediaItems": "[{ imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string }, { imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string }] - Array of exactly 2 media items with imageSrc/videoSrc", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "rating": "number (required) - Number of stars to display", + "ratingText": "string (required) - Text displayed next to rating stars", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaItemClassName?": "string", + "imageClassName?": "string", + "ratingClassName?": "string", + "ratingTextClassName?": "string" + } + }, + { + "import": "import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';", + "name": "HeroBillboardDashboard", + "path": "@/components/sections/hero/HeroBillboardDashboard", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' } (default: { variant: 'plain' })", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (default: 'opacity')", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (default: 'slide-up')", + "dashboard": "{ title: string, stats: [{ title: string, titleMobile?: string, values: [number, number, number], valuePrefix?: string, valueSuffix?: string, valueFormat?: Intl.NumberFormatOptions, description: string }, { ... }, { ... }], logoIcon: LucideIcon, sidebarItems: Array<{ icon: LucideIcon, active?: boolean }>, searchPlaceholder?: string (default: 'Search'), buttons: Array<{ text: string, onClick?: () => void, href?: string }>, chartTitle?: string (default: 'Revenue Overview'), chartData?: Array<{ value: number }>, listItems: Array<{ icon: LucideIcon, title: string, status: string }>, listTitle?: string (default: 'Recent Transfers'), imageSrc: string(recommended if no videoSrc), videoSrc?: string, imageAlt?: string (default: ''), videoAriaLabel?: string (default: 'Avatar video'), className?: string, containerClassName?: string, sidebarClassName?: string, statClassName?: string, chartClassName?: string, listClassName?: string } (required)", + "ariaLabel?": "string (default: 'Hero section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "dashboardClassName?": "string" + } + }, + { + "import": "import HeroPersonalLinks from '@/components/sections/hero/HeroPersonalLinks';", + "name": "HeroPersonalLinks", + "path": "@/components/sections/hero/HeroPersonalLinks", + "propsSchema": { + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "socialLinks?": "Array<{ icon: LucideIcon, label: string, href: string }> - Social media links", + "linkCards": "Array<{ icon?: LucideIcon, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string, title: string, description: string, button: ButtonConfig }> (required)", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Personal links section')", + "className?": "string", + "containerClassName?": "string", + "textboxClassName?": "string", + "titleClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "socialLinksClassName?": "string", + "socialLinkClassName?": "string", + "linkCardsClassName?": "string", + "linkCardClassName?": "string", + "linkCardIconClassName?": "string", + "linkCardTitleClassName?": "string", + "linkCardDescriptionClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';", + "name": "HeroSplitDoubleCarousel", + "path": "@/components/sections/hero/HeroSplitDoubleCarousel", + "propsSchema": { + "title": "string", + "description": "string", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'glowing-orb' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "leftCarouselItems": "Array<{ imageSrc?: string (recommended if no videoSrc); videoSrc?: string; imageAlt?: string; videoAriaLabel?: string }>", + "rightCarouselItems": "Array<{ imageSrc?: string (recommended if no videoSrc); videoSrc?: string; imageAlt?: string; videoAriaLabel?: string }>", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "avatars?": "Avatar[] - Array of avatar objects with src and alt properties", + "avatarText?": "string - Text displayed next to the avatar group", + "carouselPosition?": "'left' | 'right' (default: 'right')", + "ariaLabel?": "string (default: 'Hero section')", + "marqueeItems?": "{ type: \"image\", src: string, alt?: string } | { type: \"text\", text: string }[] - Optional logo marquee items for bottom of section", + "marqueeSpeed?": "number (default: 30)", + "showMarqueeCard?": "boolean (default: true)", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "carouselWrapperClassName?": "string", + "carouselColumnClassName?": "string", + "carouselItemClassName?": "string", + "carouselImageClassName?": "string", + "avatarGroupClassName?": "string", + "marqueeClassName?": "string", + "marqueeItemClassName?": "string", + "marqueeCardClassName?": "string", + "marqueeImageClassName?": "string", + "marqueeTextClassName?": "string", + "marqueeIconClassName?": "string" + } + } + ], + "about": [ + { + "import": "import SplitAbout from '@/components/sections/about/SplitAbout';", + "name": "SplitAbout", + "path": "@/components/sections/about/SplitAbout", + "propsSchema": { + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "bulletPoints": "Array<{ title: string, description: string, icon?: LucideIcon }>", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'About section video')", + "mediaBadge?": "{ text: string, avatarSrc?: string, avatarAlt?: string, className?: string }", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'About section')", + "imagePosition?": "'left' | 'right' (default: 'right')", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "contentClassName?": "string", + "bulletPointClassName?": "string", + "bulletTitleClassName?": "string", + "bulletDescriptionClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string" + } + }, + { + "import": "import TextSplitAbout from '@/components/sections/about/TextSplitAbout';", + "name": "TextSplitAbout", + "path": "@/components/sections/about/TextSplitAbout", + "propsSchema": { + "title": "string", + "description": "string[]", + "buttons?": "Array<{ text: string, onClick?: () => void, href?: string, props?: Partial> }>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "showBorder?": "boolean (default: false)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'About section')", + "className?": "string", + "containerClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import TextAbout from '@/components/sections/about/TextAbout';", + "name": "TextAbout", + "path": "@/components/sections/about/TextAbout", + "propsSchema": { + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "title": "string (required, max 150 chars)", + "buttons?": "Array<{ text: string, onClick?: () => void, href?: string, props?: Partial> }>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'About section')", + "className?": "string", + "containerClassName?": "string", + "titleClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import MediaAbout from '@/components/sections/about/MediaAbout';", + "name": "MediaAbout", + "path": "@/components/sections/about/MediaAbout", + "propsSchema": { + "title": "string", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string", + "videoAriaLabel?": "string", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'About section')", + "className?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string" + } + }, + { + "import": "import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';", + "name": "TestimonialAboutCard", + "path": "@/components/sections/about/TestimonialAboutCard", + "propsSchema": { + "tag": "string (required)", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "title": "string (required)", + "description": "string (required)", + "subdescription": "string (required)", + "icon": "LucideIcon (required - displayed in the icon box)", + "imageSrc": "string (required if no videoSrc)", + "imageAlt?": "string (default: '')", + "videoSrc": "string (required if no imageSrc)", + "videoAriaLabel?": "string (default: 'Testimonial video')", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Testimonial section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "contentClassName?": "string", + "tagClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "subdescriptionClassName?": "string", + "footerClassName?": "string", + "iconBoxClassName?": "string", + "iconClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string" + } + }, + { + "import": "import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';", + "name": "InlineImageSplitTextAbout", + "path": "@/components/sections/about/InlineImageSplitTextAbout", + "propsSchema": { + "heading": "Array<{ type: 'text'; content: string } | { type: 'image'; src: string; alt?: string }>", + "buttons?": "Array<{ text: string, onClick?: () => void, href?: string, props?: Partial> }>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'About section')", + "className?": "string", + "containerClassName?": "string", + "headingClassName?": "string", + "imageWrapperClassName?": "string", + "imageClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import AboutMetric from '@/components/sections/about/AboutMetric';", + "name": "AboutMetric", + "path": "@/components/sections/about/AboutMetric", + "propsSchema": { + "title": "string", + "metrics": "Array<{ icon: LucideIcon, label: string, value: string }>", + "metricsAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'About metrics section')", + "className?": "string", + "containerClassName?": "string", + "titleClassName?": "string", + "metricsContainerClassName?": "string", + "metricCardClassName?": "string", + "metricIconClassName?": "string", + "metricLabelClassName?": "string", + "metricValueClassName?": "string" + } + }, + { + "import": "import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';", + "name": "MetricSplitMediaAbout", + "path": "@/components/sections/about/MetricSplitMediaAbout", + "propsSchema": { + "title": "string", + "description": "string", + "metrics": "Array<{ value: string, title: string }>", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string", + "videoAriaLabel?": "string (default: 'About section video')", + "mediaBadge?": "{ text: string, avatarSrc?: string, avatarAlt?: string, className?: string }", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "metricsAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'About section')", + "className?": "string", + "containerClassName?": "string", + "gridClassName?": "string", + "leftColumnClassName?": "string", + "rightColumnClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "metricsContainerClassName?": "string", + "metricCardClassName?": "string", + "metricValueClassName?": "string", + "metricTitleClassName?": "string", + "mediaWrapperClassName?": "string", + "imageClassName?": "string" + } + } + ], + "feature": [ + { + "import": "import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';", + "name": "FeatureCardOne", + "path": "@/components/sections/feature/FeatureCardOne", + "propsSchema": { + "features": "Array<{ title: string, description: string, button?: {text: string, onClick?: () => void, href?: string} } & ({ imageSrc?: string (recommended if no videoSrc), imageAlt?: string } | { videoSrc: string, videoAriaLabel?: string })>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'items-top-row-full-width-bottom' | 'full-width-top-items-bottom-row' | 'one-large-left-three-stacked-right' | 'two-items-per-row'", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "uniformGridCustomHeightClasses?": "string", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "mediaClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "useInvertedBackground": "boolean" + } + }, + { + "import": "import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';", + "name": "FeatureCardThree", + "path": "@/components/sections/feature/featureCardThree/FeatureCardThree", + "propsSchema": { + "features": "Array<{ title: string, description: string, imageSrc: string, imageAlt?: string }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'items-top-row-full-width-bottom' | 'full-width-top-items-bottom-row' | 'one-large-left-three-stacked-right' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "uniformGridCustomHeightClasses?": "string", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "itemContentClassName?": "string" + } + }, + { + "import": "import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';", + "name": "FeatureCardTwentyNine", + "path": "@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine", + "propsSchema": { + "features": "Array<{ title: string, description: string, imageSrc: string, imageAlt?: string, titleImageSrc: string, buttonText: string, buttonHref?: string }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'items-top-row-full-width-bottom' | 'full-width-top-items-bottom-row' | 'one-large-left-three-stacked-right' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect)", + "uniformGridCustomHeightClasses?": "string", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "itemContentClassName?": "string" + } + }, + { + "import": "import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';", + "name": "FeatureCardSix", + "path": "@/components/sections/feature/FeatureCardSix", + "propsSchema": { + "features": "Array<{ title: string, description: string, buttons?: ButtonConfig[] } & ({ imageSrc?: string (recommended if no videoSrc), imageAlt?: string } | { videoSrc: string, videoAriaLabel?: string })>", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "textBoxTitleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "cardContentClassName?": "string", + "stepNumberClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "imageContainerClassName?": "string", + "imageClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string" + } + }, + { + "import": "import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';", + "name": "FeatureCardSeven", + "path": "@/components/sections/feature/FeatureCardSeven", + "propsSchema": { + "features": "Array<{ title: string, description: string, buttons?: ButtonConfig[] } & ({ imageSrc?: string (recommended if no videoSrc), imageAlt?: string } | { videoSrc: string, videoAriaLabel?: string })>", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "cardContentClassName?": "string", + "stepNumberClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "imageContainerClassName?": "string", + "imageClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string" + } + }, + { + "import": "import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';", + "name": "FeatureCardEight", + "path": "@/components/sections/feature/FeatureCardEight", + "propsSchema": { + "features": "Array<{ title: string, description: string } & ({ imageSrc?: string (recommended if no videoSrc), imageAlt?: string } | { videoSrc: string, videoAriaLabel?: string })>", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "textBoxTitleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "cardClassName?": "string", + "progressBarClassName?": "string", + "cardContentClassName?": "string", + "stepNumberClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "mediaContainerClassName?": "string", + "mediaClassName?": "string" + } + }, + { + "import": "import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';", + "name": "FeatureCardNine", + "path": "@/components/sections/feature/FeatureCardNine", + "propsSchema": { + "features": "Array<{ title: string, description: string, buttons?: ButtonConfig[], phoneOne: ({ imageSrc?: string (recommended if no videoSrc), imageAlt?: string } | { videoSrc: string, videoAriaLabel?: string }), phoneTwo: ({ imageSrc?: string (recommended if no videoSrc), imageAlt?: string } | { videoSrc: string, videoAriaLabel?: string }) }>", + "showStepNumbers": "boolean (required - controls whether step number badges display)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "textboxLayout": "'default' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "textBoxTitleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "desktopContainerClassName?": "string", + "mobileContainerClassName?": "string", + "desktopContentClassName?": "string", + "desktopWrapperClassName?": "string", + "mobileWrapperClassName?": "string", + "phoneFrameClassName?": "string", + "mobilePhoneFrameClassName?": "string", + "featureContentClassName?": "string", + "stepNumberClassName?": "string", + "featureTitleClassName?": "string", + "featureDescriptionClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string" + } + }, + { + "import": "import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';", + "name": "FeatureCardTen", + "path": "@/components/sections/feature/FeatureCardTen", + "propsSchema": { + "features": "Array<{ title: string, description: string, media: ({ imageSrc?: string (recommended if no videoSrc), imageAlt?: string } | { videoSrc: string, videoAriaLabel?: string }), items: Array<{ icon: LucideIcon, text: string }>, reverse: boolean }>", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "itemClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaCardClassName?": "string", + "numberClassName?": "string", + "contentWrapperClassName?": "string", + "featureTitleClassName?": "string", + "featureDescriptionClassName?": "string", + "listItemClassName?": "string", + "iconContainerClassName?": "string", + "iconClassName?": "string", + "gapClassName?": "string" + } + }, + { + "import": "import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';", + "name": "FeatureHoverPattern", + "path": "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern", + "propsSchema": { + "features": "Array<{ icon: LucideIcon, title: string, description: string, button?: ButtonConfig }> (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string (required)", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string (required)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean (required)", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons' - for 5+ items)", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-80 2xl:min-h-90')", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "iconContainerClassName?": "string", + "iconClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "gradientClassName?": "string - Custom gradient for hover pattern (default: 'bg-gradient-to-r from-accent to-background-accent')", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string" + } + }, + { + "import": "import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';", + "name": "FeatureBorderGlow", + "path": "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow", + "propsSchema": { + "features": "Array<{ icon: LucideIcon, title: string, description: string }> (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string (required)", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string (required)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean (required)", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons' - for 5+ items)", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-75 2xl:min-h-85')", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "iconContainerClassName?": "string", + "iconClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string" + } + }, + { + "import": "import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';", + "name": "FeatureCardTwelve", + "path": "@/components/sections/feature/FeatureCardTwelve", + "propsSchema": { + "features": "Array<{ id: string, label: string, title: string, items: string[], buttons?: Array<{text: string, onClick?: () => void, href?: string}> }>", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "cardContentClassName?": "string", + "labelClassName?": "string", + "cardTitleClassName?": "string", + "itemsContainerClassName?": "string", + "itemTextClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string" + } + }, + { + "import": "import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';", + "name": "FeatureCardSixteen", + "path": "@/components/sections/feature/FeatureCardSixteen", + "propsSchema": { + "negativeCard": "{ items: string[] } (required)", + "positiveCard": "{ items: string[] } (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'inline-image' (required)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Feature comparison section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "gridClassName?": "string", + "cardClassName?": "string", + "itemsListClassName?": "string", + "itemClassName?": "string", + "itemIconClassName?": "string", + "itemTextClassName?": "string" + } + }, + { + "import": "import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';", + "name": "FeatureCardNineteen", + "path": "@/components/sections/feature/FeatureCardNineteen", + "propsSchema": { + "features": "Array<{ tag: string, title: string, subtitle: string, description: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string, buttons?: Array<{text: string, onClick?: () => void, href?: string}> }> (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "cardContentClassName?": "string", + "cardTagClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string", + "imageContainerClassName?": "string", + "imageClassName?": "string" + } + }, + { + "import": "import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';", + "name": "FeatureCardTwentyOne", + "path": "@/components/sections/feature/FeatureCardTwentyOne", + "propsSchema": { + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "accordionItems": "Array<{ id: string, title: string, content: string }>", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "imageAlt?": "string", + "videoSrc?": "string (either imageSrc or videoSrc required)", + "videoAriaLabel?": "string", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "useInvertedBackground": "boolean", + "mediaPosition?": "'left' | 'right' (default: 'left')", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string", + "contentClassName?": "string", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "accordionContainerClassName?": "string", + "accordionClassName?": "string", + "accordionTitleClassName?": "string", + "accordionContentClassName?": "string", + "accordionIconContainerClassName?": "string", + "accordionIconClassName?": "string" + } + }, + { + "import": "import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';", + "name": "FeatureCardMedia", + "path": "@/components/sections/feature/FeatureCardMedia", + "propsSchema": { + "features": "Array<{ id: string, title: string, description: string, tag: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string, buttons?: ButtonConfig[], onCardClick?: () => void }>", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image'", + "useInvertedBackground": "boolean", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }>", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{ text: string, href?: string, onClick?: () => void }>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "ariaLabel?": "string (default: 'Features section')", + "className?": "string", + "containerClassName?": "string", + "itemClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string", + "tagClassName?": "string", + "contentClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "cardButtonContainerClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import FeatureBento from '@/components/sections/feature/FeatureBento';", + "name": "FeatureBento", + "path": "@/components/sections/feature/FeatureBento", + "propsSchema": { + "features": "Array<{ title: string, description: string, button?: ButtonConfig } & ( { bentoComponent: 'globe' | 'animated-bar-chart' | 'map' | 'line-chart' } | { bentoComponent: 'reveal-icon', icon: LucideIcon } | { bentoComponent: 'chat', aiIcon: LucideIcon, userIcon: LucideIcon, exchanges: Array<{ userMessage: string, aiResponse: string }>, placeholder: string } | { bentoComponent: 'icon-info-cards', items: Array<{ icon: LucideIcon, label: string, value: string }> } | { bentoComponent: '3d-stack-cards', items: [{ icon: LucideIcon, title: string, subtitle: string, detail: string }, { icon: LucideIcon, title: string, subtitle: string, detail: string }, { icon: LucideIcon, title: string, subtitle: string, detail: string }] } | { bentoComponent: '3d-task-list', title: string, items: Array<{ icon: LucideIcon, label: string, time: string }> } | { bentoComponent: 'orbiting-icons', centerIcon: LucideIcon, items: Array<{ icon: LucideIcon, ring?: 1 | 2 | 3, duration?: number }> } | { bentoComponent: 'marquee', centerIcon: LucideIcon } & ( { variant: 'text', texts: string[] } | { variant: 'icon', icons: LucideIcon[] } ) | { bentoComponent: '3d-card-grid', items: [{ name: string, icon: LucideIcon }, { name: string, icon: LucideIcon }, { name: string, icon: LucideIcon }, { name: string, icon: LucideIcon }], centerIcon: LucideIcon } | { bentoComponent: 'phone', statusIcon: LucideIcon, alertIcon: LucideIcon, alertTitle: string, alertMessage: string, apps: Array<{ name: string, icon: LucideIcon }> (exactly 8 items) } | { bentoComponent: 'timeline', heading: string, subheading: string, items: [{ label: string, detail: string }, { label: string, detail: string }, { label: string, detail: string }], completedLabel: string } | { bentoComponent: 'media-stack', items: [{ imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string }, { imageSrc?: string, videoSrc?: string, imageAlt?: string }, { imageSrc?: string, videoSrc?: string, imageAlt?: string }] } )> - IMPORTANT: do not include id; do not nest bentoComponent inside an object.", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "animationType": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (required)", + "title": "string (required)", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string (required)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean (required)", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';", + "name": "FeatureCardTwentyThree", + "path": "@/components/sections/feature/FeatureCardTwentyThree", + "propsSchema": { + "features": "Array<{ id: string, title: string, tags: string[], imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string, onFeatureClick?: () => void }>", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "ariaLabel?": "string (default: 'Features section')", + "className?": "string", + "containerClassName?": "string", + "itemClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string", + "cardClassName?": "string", + "cardTitleClassName?": "string", + "tagsContainerClassName?": "string", + "tagClassName?": "string", + "arrowClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';", + "name": "FeatureCardTwentyFour", + "path": "@/components/sections/feature/FeatureCardTwentyFour", + "propsSchema": { + "features": "Array<{ id: string, title: string, author: string, description: string, tags: string[], imageSrc?: string (recommended if no videoSrc), imageAlt?: string, videoSrc?: string, videoAriaLabel?: string, onFeatureClick?: () => void }> - Feature card items (requires imageSrc or videoSrc)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string (required)", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string (required)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean (required)", + "ariaLabel?": "string (default: 'Features section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "cardContentClassName?": "string", + "cardTitleClassName?": "string", + "authorClassName?": "string", + "cardDescriptionClassName?": "string", + "tagsContainerClassName?": "string", + "tagClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string" + } + }, + { + "import": "import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';", + "name": "FeatureCardTwentyFive", + "path": "@/components/sections/feature/FeatureCardTwentyFive", + "propsSchema": { + "features": "Array<{ title: string, description: string, icon: LucideIcon, mediaItems: [{ imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string }, { imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string }] }> - Feature cards with dual media", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "title": "string (required)", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string (required)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean (required)", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "mediaClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "cardIconClassName?": "string", + "cardIconWrapperClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';", + "name": "FeatureCardTwentySix", + "path": "@/components/sections/feature/FeatureCardTwentySix", + "propsSchema": { + "features": "Array<{ title: string, description: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string, buttonIcon: LucideIcon, buttonHref?: string, buttonOnClick?: () => void }> (MINIMUM 4 ITEMS REQUIRED)", + "title": "string (required)", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string (required)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'inline-image' (required)", + "useInvertedBackground": "boolean (required)", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "cardButtonClassName?": "string" + } + }, + { + "import": "import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';", + "name": "FeatureCardTwentySeven", + "path": "@/components/sections/feature/FeatureCardTwentySeven", + "propsSchema": { + "features": "Array<{ id: string, title: string, descriptions: string[], imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string }>", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string (required)", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string (required)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Feature section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string" + } + }, + { + "import": "import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';", + "name": "FeatureCardTwentyEight", + "path": "@/components/sections/feature/FeatureCardTwentyEight", + "propsSchema": { + "features": "Array<{ id: string, title: string, subtitle: string, category: string, value: string, buttons?: Array<{text: string, onClick?: () => void, href?: string}> }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal'", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image'", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Features section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "cardTitleClassName?": "string", + "subtitleClassName?": "string", + "categoryClassName?": "string", + "valueClassName?": "string", + "footerClassName?": "string", + "cardButtonClassName?": "string", + "cardButtonTextClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + } + ], + "product": [ + { + "import": "import ProductCardOne from '@/components/sections/product/ProductCardOne';", + "name": "ProductCardOne", + "path": "@/components/sections/product/ProductCardOne", + "propsSchema": { + "products?": "Array<{ id: string, name: string, price: string, imageSrc: string, imageAlt?: string, onFavorite?: () => void, onProductClick?: () => void, isFavorited?: boolean }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'items-top-row-full-width-bottom' | 'full-width-top-items-bottom-row' | 'one-large-left-three-stacked-right' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-95 2xl:min-h-105')", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Product section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "imageClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "cardNameClassName?": "string", + "cardPriceClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import ProductCardTwo from '@/components/sections/product/ProductCardTwo';", + "name": "ProductCardTwo", + "path": "@/components/sections/product/ProductCardTwo", + "propsSchema": { + "products?": "Array<{ id: string, brand: string, name: string, price: string, rating: number, reviewCount: string, imageSrc: string, imageAlt?: string, onFavorite?: () => void, onProductClick?: () => void, isFavorited?: boolean }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-95 2xl:min-h-105')", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Product section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "imageClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "cardBrandClassName?": "string", + "cardNameClassName?": "string", + "cardPriceClassName?": "string", + "cardRatingClassName?": "string", + "actionButtonClassName?": "string - Styles the action button on product image", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import ProductCardThree from '@/components/sections/product/ProductCardThree';", + "name": "ProductCardThree", + "path": "@/components/sections/product/ProductCardThree", + "propsSchema": { + "products": "Array<{ id: string, name: string, price: string, imageSrc: string, imageAlt?: string, onFavorite?: () => void, onProductClick?: () => void, onQuantityChange?: (quantity: number) => void, isFavorited?: boolean, initialQuantity?: number, priceButtonProps?: Partial> }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'one-large-left-three-stacked-right' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-95 2xl:min-h-105')", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Product section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "imageClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "cardNameClassName?": "string", + "quantityControlsClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import ProductCardFour from '@/components/sections/product/ProductCardFour';", + "name": "ProductCardFour", + "path": "@/components/sections/product/ProductCardFour", + "propsSchema": { + "products?": "Array<{ id: string, name: string, price: string, variant: string, imageSrc: string, imageAlt?: string, onFavorite?: () => void, onProductClick?: () => void, isFavorited?: boolean }> - Product items", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'one-large-left-three-stacked-right' (required)", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-95 2xl:min-h-105')", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean (required)", + "ariaLabel?": "string (default: 'Product section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "imageClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "cardNameClassName?": "string", + "cardPriceClassName?": "string", + "cardVariantClassName?": "string", + "actionButtonClassName?": "string - Styles the action button on product image", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + } + ], + "pricing": [ + { + "import": "import PricingCardOne from '@/components/sections/pricing/PricingCardOne';", + "name": "PricingCardOne", + "path": "@/components/sections/pricing/PricingCardOne", + "propsSchema": { + "plans": "Array<{ id: string, badge: string, badgeIcon?: LucideIcon, price: string, subtitle: string, features: string[] }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Pricing section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "badgeClassName?": "string", + "priceClassName?": "string", + "subtitleClassName?": "string", + "featuresClassName?": "string", + "featureItemClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';", + "name": "PricingCardTwo", + "path": "@/components/sections/pricing/PricingCardTwo", + "propsSchema": { + "plans": "Array<{ id: string, badge: string, badgeIcon?: LucideIcon, price: string, subtitle: string, buttons: Array<{text: string, onClick?: () => void, href?: string}>, features: string[] }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Pricing section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "badgeClassName?": "string", + "priceClassName?": "string", + "subtitleClassName?": "string", + "planButtonContainerClassName?": "string", + "planButtonClassName?": "string", + "featuresClassName?": "string", + "featureItemClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import PricingCardThree from '@/components/sections/pricing/PricingCardThree';", + "name": "PricingCardThree", + "path": "@/components/sections/pricing/PricingCardThree", + "propsSchema": { + "plans": "Array<{ id: string, badge?: string, badgeIcon?: LucideIcon, price: string, name: string, buttons: Array<{text: string, onClick?: () => void, href?: string}>, features: string[] }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Pricing section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "badgeClassName?": "string", + "priceClassName?": "string", + "nameClassName?": "string", + "planButtonContainerClassName?": "string", + "planButtonClassName?": "string", + "featuresClassName?": "string", + "featureItemClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import PricingCardFive from '@/components/sections/pricing/PricingCardFive';", + "name": "PricingCardFive", + "path": "@/components/sections/pricing/PricingCardFive", + "propsSchema": { + "plans": "Array<{ id: string, tag: string, tagIcon?: LucideIcon, price: string, period: string, description: string, button: {text: string, onClick?: () => void, href?: string}, featuresTitle: string, features: string[] }>", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Pricing section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "cardContentClassName?": "string", + "planTagClassName?": "string", + "planPriceClassName?": "string", + "planPeriodClassName?": "string", + "planDescriptionClassName?": "string", + "planButtonClassName?": "string", + "planButtonTextClassName?": "string", + "featuresTitleClassName?": "string", + "featuresListClassName?": "string", + "featureItemClassName?": "string", + "featureIconClassName?": "string", + "featureTextClassName?": "string" + } + }, + { + "import": "import PricingCardEight from '@/components/sections/pricing/PricingCardEight';", + "name": "PricingCardEight", + "path": "@/components/sections/pricing/PricingCardEight", + "propsSchema": { + "plans": "Array<{ id: string, badge: string, badgeIcon?: LucideIcon, price: string, subtitle: string, buttons: Array<{text: string, onClick?: () => void, href?: string}>, features: string[] }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image'", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Pricing section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "badgeClassName?": "string", + "priceClassName?": "string", + "subtitleClassName?": "string", + "planButtonContainerClassName?": "string", + "planButtonClassName?": "string", + "featuresClassName?": "string", + "featureItemClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import PricingCardNine from '@/components/sections/pricing/PricingCardNine';", + "name": "PricingCardNine", + "path": "@/components/sections/pricing/PricingCardNine", + "propsSchema": { + "plans": "Array<{ id: string, title: string, price: string, period: string, features: string[], button: {text: string, onClick?: () => void, href?: string}, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }>", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Pricing section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "cardContentClassName?": "string", + "planImageWrapperClassName?": "string", + "planImageClassName?": "string", + "planTitleClassName?": "string", + "planPriceClassName?": "string", + "planButtonClassName?": "string", + "planButtonTextClassName?": "string", + "featuresListClassName?": "string", + "featureItemClassName?": "string", + "featureIconClassName?": "string", + "featureTextClassName?": "string" + } + } + ], + "metric": [ + { + "import": "import MetricCardOne from '@/components/sections/metrics/MetricCardOne';", + "name": "MetricCardOne", + "path": "@/components/sections/metrics/MetricCardOne", + "propsSchema": { + "metrics": "Array<{ id: string, value: string, title: string, description: string, icon: LucideIcon }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "uniformGridCustomHeightClasses?": "string", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Metrics section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "valueClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "iconContainerClassName?": "string", + "iconClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';", + "name": "MetricCardTwo", + "path": "@/components/sections/metrics/MetricCardTwo", + "propsSchema": { + "metrics": "Array<{ id: string, value: string, description: string }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "uniformGridCustomHeightClasses?": "string", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Metrics section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "valueClassName?": "string", + "metricDescriptionClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import MetricCardThree from '@/components/sections/metrics/MetricCardThree';", + "name": "MetricCardThree", + "path": "@/components/sections/metrics/MetricCardThree", + "propsSchema": { + "metrics": "Array<{ id: string, icon: LucideIcon, title: string, value: string }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "uniformGridCustomHeightClasses?": "string", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Metrics section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "iconContainerClassName?": "string", + "iconClassName?": "string", + "metricTitleClassName?": "string", + "valueClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';", + "name": "MetricCardSeven", + "path": "@/components/sections/metrics/MetricCardSeven", + "propsSchema": { + "metrics": "Array<{ id: string, value: string, title: string, items: string[] }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "uniformGridCustomHeightClasses?": "string", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Metrics section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "valueClassName?": "string - For styling the large metric value", + "metricTitleClassName?": "string - For styling the metric title text", + "featuresClassName?": "string - For styling the PricingFeatureList container", + "featureItemClassName?": "string - For styling individual feature items", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';", + "name": "MetricCardEleven", + "path": "@/components/sections/metrics/MetricCardEleven", + "propsSchema": { + "metrics": "Array<{ id: string, value: string, title: string, description: string } & ({ imageSrc: string, imageAlt?: string } | { videoSrc: string, videoAriaLabel?: string })> - REQUIRED: each metric MUST have EITHER imageSrc (string) OR videoSrc (string), not both, not neither", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image'", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Metrics section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "gridClassName?": "string", + "cardClassName?": "string", + "valueClassName?": "string", + "cardTitleClassName?": "string", + "cardDescriptionClassName?": "string", + "mediaCardClassName?": "string", + "mediaClassName?": "string" + } + }, + { + "import": "import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';", + "name": "MetricCardFourteen", + "path": "@/components/sections/metrics/MetricCardFourteen", + "propsSchema": { + "title": "string", + "tag": "string", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "metrics": "Array<{ id: string, value: string, description: string }>", + "metricsAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Metrics section')", + "className?": "string", + "containerClassName?": "string", + "titleClassName?": "string", + "tagClassName?": "string", + "metricsContainerClassName?": "string", + "metricClassName?": "string", + "valueClassName?": "string", + "descriptionClassName?": "string" + } + } + ], + "team": [ + { + "import": "import TeamCardOne from '@/components/sections/team/TeamCardOne';", + "name": "TeamCardOne", + "path": "@/components/sections/team/TeamCardOne", + "propsSchema": { + "members": "Array<{ id: string, name: string, role: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'items-top-row-full-width-bottom' | 'full-width-top-items-bottom-row' | 'one-large-left-three-stacked-right' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-95 2xl:min-h-105')", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Team section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "imageClassName?": "string", + "overlayClassName?": "string", + "nameClassName?": "string", + "roleClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import TeamCardTwo from '@/components/sections/team/TeamCardTwo';", + "name": "TeamCardTwo", + "path": "@/components/sections/team/TeamCardTwo", + "propsSchema": { + "members": "Array<{ id: string, name: string, role: string, description: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string, socialLinks?: Array<{ icon: LucideIcon, url: string }> }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'items-top-row-full-width-bottom' | 'full-width-top-items-bottom-row' | 'one-large-left-three-stacked-right' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-95 2xl:min-h-105')", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Team section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "imageClassName?": "string", + "overlayClassName?": "string", + "nameClassName?": "string", + "roleClassName?": "string", + "memberDescriptionClassName?": "string", + "socialLinksClassName?": "string", + "socialIconClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import TeamCardFive from '@/components/sections/team/TeamCardFive';", + "name": "TeamCardFive", + "path": "@/components/sections/team/TeamCardFive", + "propsSchema": { + "team": "Array<{ id: string, name: string, role: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }>", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Team section')", + "className?": "string", + "containerClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "gridClassName?": "string", + "cardClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string", + "nameClassName?": "string", + "roleClassName?": "string" + } + }, + { + "import": "import TeamCardSix from '@/components/sections/team/TeamCardSix';", + "name": "TeamCardSix", + "path": "@/components/sections/team/TeamCardSix", + "propsSchema": { + "members": "Array<{ id: string, name: string, role: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'one-large-right-three-stacked-left' | 'items-top-row-full-width-bottom' | 'full-width-top-items-bottom-row' | 'one-large-left-three-stacked-right' (required - determines grid layout or carousel trigger)", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-95 2xl:min-h-105')", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Team section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "imageClassName?": "string", + "overlayClassName?": "string", + "nameClassName?": "string", + "roleClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import TeamCardTen from '@/components/sections/team/TeamCardTen';", + "name": "TeamCardTen", + "path": "@/components/sections/team/TeamCardTen", + "propsSchema": { + "title": "string", + "tag": "string", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "membersAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "members": "Array<{ id: string, name: string, imageSrc?: string (recommended if no videoSrc), imageAlt?: string, videoSrc?: string, videoAriaLabel?: string }>", + "memberVariant": "'default' | 'card' (required - 'default': no card styling, 'card': each member wrapped in card with rounded corners)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Team section')", + "className?": "string", + "containerClassName?": "string", + "titleClassName?": "string", + "tagClassName?": "string", + "membersContainerClassName?": "string", + "memberClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string", + "nameClassName?": "string" + } + }, + { + "import": "import TeamCardEleven from '@/components/sections/team/TeamCardEleven';", + "name": "TeamCardEleven", + "path": "@/components/sections/team/TeamCardEleven", + "propsSchema": { + "groups": "Array<{ id: string, groupTitle: string, members: Array<{ id: string, title: string, subtitle: string, detail: string, imageSrc?: string (recommended if no videoSrc), imageAlt?: string, videoSrc?: string, videoAriaLabel?: string }> }> (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "ariaLabel?": "string (default: 'Team section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "groupTitleClassName?": "string", + "memberClassName?": "string", + "memberImageClassName?": "string", + "memberTitleClassName?": "string", + "memberSubtitleClassName?": "string", + "memberDetailClassName?": "string" + } + } + ], + "testimonial": [ + { + "import": "import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';", + "name": "TestimonialCardOne", + "path": "@/components/sections/testimonial/TestimonialCardOne", + "propsSchema": { + "testimonials": "Array<{ id: string, name: string, role: string, company: string, rating: number, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-95 2xl:min-h-105')", + "gridVariant": "'uniform-all-items-equal' | 'bento-grid' | 'bento-grid-inverted' | 'two-columns-alternating-heights' | 'asymmetric-60-wide-40-narrow' | 'three-columns-all-equal-width' | 'four-items-2x2-equal-grid' | 'one-large-right-three-stacked-left' | 'items-top-row-full-width-bottom' | 'full-width-top-items-bottom-row' | 'one-large-left-three-stacked-right' (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Testimonials section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "imageClassName?": "string", + "overlayClassName?": "string", + "ratingClassName?": "string", + "nameClassName?": "string", + "roleClassName?": "string", + "companyClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';", + "name": "TestimonialCardTwo", + "path": "@/components/sections/testimonial/TestimonialCardTwo", + "propsSchema": { + "testimonials": "Array<{ id: string, name: string, role: string, testimonial: string, imageSrc?: string, imageAlt?: string, icon?: LucideIcon }>", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-none')", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Testimonials section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "imageWrapperClassName?": "string", + "imageClassName?": "string", + "iconClassName?": "string", + "nameClassName?": "string", + "roleClassName?": "string", + "testimonialClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';", + "name": "TestimonialCardFive", + "path": "@/components/sections/testimonial/TestimonialCardFive", + "propsSchema": { + "testimonials": "Array<{ id: string, name: string, date: string, title: string, quote: string, tag: string, avatarSrc: string, avatarAlt?: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }>", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Testimonials section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "cardTagClassName?": "string", + "cardTitleClassName?": "string", + "cardQuoteClassName?": "string", + "cardAuthorClassName?": "string", + "cardAvatarWrapperClassName?": "string", + "cardAvatarClassName?": "string", + "cardNameClassName?": "string", + "cardDateClassName?": "string", + "cardImageClassName?": "string", + "carouselClassName?": "string", + "dotsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';", + "name": "TestimonialCardSix", + "path": "@/components/sections/testimonial/TestimonialCardSix", + "propsSchema": { + "testimonials": "Array<{ id: string, name: string, handle: string, testimonial: string, imageSrc?: string, imageAlt?: string, icon?: LucideIcon }>", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "speed?": "number (default: 40)", + "topMarqueeDirection?": "'left' | 'right' (default: 'left')", + "ariaLabel?": "string (default: 'Testimonials section')", + "className?": "string", + "containerClassName?": "string", + "carouselClassName?": "string", + "bottomCarouselClassName?": "string", + "cardClassName?": "string", + "testimonialClassName?": "string", + "imageWrapperClassName?": "string", + "imageClassName?": "string", + "iconClassName?": "string", + "nameClassName?": "string", + "handleClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + }, + { + "import": "import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';", + "name": "TestimonialCardTen", + "path": "@/components/sections/testimonial/TestimonialCardTen", + "propsSchema": { + "testimonials": "Array<{ id: string, title: string, quote: string, name: string, role: string, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }>", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Testimonials section')", + "className?": "string", + "containerClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "contentClassName?": "string", + "quoteCardClassName?": "string", + "testimonialTitleClassName?": "string", + "quoteClassName?": "string", + "nameClassName?": "string", + "roleClassName?": "string", + "navigationClassName?": "string", + "navigationButtonClassName?": "string", + "mediaCardClassName?": "string", + "mediaClassName?": "string" + } + }, + { + "import": "import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';", + "name": "TestimonialCardTwelve", + "path": "@/components/sections/testimonial/TestimonialCardTwelve", + "propsSchema": { + "testimonials": "Array<{ id: string, name: string, imageSrc: string, imageAlt?: string }>", + "cardTitle": "string", + "cardTag": "string", + "cardTagIcon?": "LucideIcon", + "buttons?": "Array<{ text: string, href?: string, onClick?: () => void }>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "cardAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (required)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Testimonials section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "avatarGroupClassName?": "string", + "avatarClassName?": "string", + "cardTitleClassName?": "string", + "cardTagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';", + "name": "TestimonialCardThirteen", + "path": "@/components/sections/testimonial/TestimonialCardThirteen", + "propsSchema": { + "testimonials": "Array<{ id: string, name: string, handle: string, testimonial: string, rating: number, imageSrc?: string, imageAlt?: string, icon?: LucideIcon }>", + "showRating": "boolean - true for star ratings, false for quote icon (required)", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-none')", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "ariaLabel?": "string (default: 'Testimonials section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "imageWrapperClassName?": "string", + "imageClassName?": "string", + "iconClassName?": "string", + "nameClassName?": "string", + "handleClassName?": "string", + "testimonialClassName?": "string", + "ratingClassName?": "string", + "contentWrapperClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string" + } + }, + { + "import": "import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';", + "name": "TestimonialCardFifteen", + "path": "@/components/sections/testimonial/TestimonialCardFifteen", + "propsSchema": { + "testimonial": "string", + "rating": "number (0-5)", + "author": "string", + "avatars": "Array<{ src: string, alt: string }>", + "ratingAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (required)", + "avatarsAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (required)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Testimonial section')", + "className?": "string", + "containerClassName?": "string", + "ratingClassName?": "string", + "starClassName?": "string", + "testimonialClassName?": "string", + "avatarGroupClassName?": "string", + "avatarClassName?": "string", + "avatarImageClassName?": "string" + } + }, + { + "import": "import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';", + "name": "TestimonialCardSixteen", + "path": "@/components/sections/testimonial/TestimonialCardSixteen", + "propsSchema": { + "testimonials": "Array<{ id: string, name: string, role: string, company: string, rating: number, imageSrc?: string (recommended if no videoSrc), videoSrc?: string, imageAlt?: string, videoAriaLabel?: string }>", + "kpiItems": "[{ value: string, label: string }, { value: string, label: string }, { value: string, label: string }] - Exactly 3 KPI stats (required)", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' | 'depth-3d' (required)", + "title": "string (required)", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string (required)", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required)", + "useInvertedBackground": "boolean (required)", + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-95 2xl:min-h-105')", + "ariaLabel?": "string (default: 'Testimonials section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "imageClassName?": "string", + "overlayClassName?": "string", + "ratingClassName?": "string", + "nameClassName?": "string", + "roleClassName?": "string", + "companyClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string", + "textBoxTitleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string" + } + } + ], + "faq": [ + { + "import": "import FaqBase from '@/components/sections/faq/FaqBase';", + "name": "FaqBase", + "path": "@/components/sections/faq/FaqBase", + "propsSchema": { + "faqs": "Array<{ id: string, title: string, content: string }> - FAQ items", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "faqsAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (required)", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "animationType?": "'smooth' | 'instant' (default: 'smooth')", + "showCard?": "boolean (default: true)", + "ariaLabel?": "string (default: 'FAQ section')", + "className?": "string", + "containerClassName?": "string", + "textBoxTitleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "faqsContainerClassName?": "string", + "accordionClassName?": "string", + "accordionTitleClassName?": "string", + "accordionIconContainerClassName?": "string", + "accordionIconClassName?": "string", + "accordionContentClassName?": "string", + "separatorClassName?": "string" + } + }, + { + "import": "import FaqDouble from '@/components/sections/faq/FaqDouble';", + "name": "FaqDouble", + "path": "@/components/sections/faq/FaqDouble", + "propsSchema": { + "faqs": "Array<{ id: string, title: string, content: string }> - FAQ items", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "faqsAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (required)", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "animationType?": "'smooth' | 'instant' (default: 'smooth')", + "ariaLabel?": "string (default: 'FAQ section')", + "className?": "string", + "containerClassName?": "string", + "textBoxTitleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "faqsContainerClassName?": "string", + "columnClassName?": "string", + "accordionClassName?": "string", + "accordionTitleClassName?": "string", + "accordionIconContainerClassName?": "string", + "accordionIconClassName?": "string", + "accordionContentClassName?": "string" + } + }, + { + "import": "import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';", + "name": "FaqSplitMedia", + "path": "@/components/sections/faq/FaqSplitMedia", + "propsSchema": { + "faqs": "Array<{ id: string, title: string, content: string }> - FAQ items", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'FAQ section video')", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "mediaPosition?": "'left' | 'right' (default: 'left')", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "faqsAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (required)", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "animationType?": "'smooth' | 'instant' (default: 'smooth')", + "showCard?": "boolean (default: true)", + "ariaLabel?": "string (default: 'FAQ section')", + "className?": "string", + "containerClassName?": "string", + "textBoxTitleClassName?": "string", + "titleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "titleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "contentClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string", + "faqsContainerClassName?": "string", + "accordionClassName?": "string", + "accordionTitleClassName?": "string", + "accordionIconContainerClassName?": "string", + "accordionIconClassName?": "string", + "accordionContentClassName?": "string", + "separatorClassName?": "string" + } + }, + { + "import": "import FaqSplitText from '@/components/sections/faq/FaqSplitText';", + "name": "FaqSplitText", + "path": "@/components/sections/faq/FaqSplitText", + "propsSchema": { + "faqs": "Array<{ id: string, title: string, content: string }> - FAQ items", + "sideTitle": "string", + "sideDescription?": "string", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "faqsAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (required)", + "textPosition?": "'left' | 'right' (default: 'left')", + "useInvertedBackground": "boolean", + "animationType?": "'smooth' | 'instant' (default: 'smooth')", + "showCard?": "boolean (default: true)", + "ariaLabel?": "string (default: 'FAQ section')", + "className?": "string", + "containerClassName?": "string", + "contentClassName?": "string", + "textContainerClassName?": "string", + "sideTitleClassName?": "string", + "sideDescriptionClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "faqsContainerClassName?": "string", + "accordionClassName?": "string", + "accordionTitleClassName?": "string", + "accordionIconContainerClassName?": "string", + "accordionIconClassName?": "string", + "accordionContentClassName?": "string", + "separatorClassName?": "string" + } + } + ], + "blog": [ + { + "import": "import BlogCardOne from '@/components/sections/blog/BlogCardOne';", + "name": "BlogCardOne", + "path": "@/components/sections/blog/BlogCardOne", + "propsSchema": { + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Blog section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "imageWrapperClassName?": "string", + "imageClassName?": "string", + "categoryClassName?": "string", + "cardTitleClassName?": "string", + "excerptClassName?": "string", + "authorContainerClassName?": "string", + "authorAvatarClassName?": "string", + "authorNameClassName?": "string", + "dateClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "blogs?": "Array<{ id: string, category: string, title: string, excerpt: string, imageSrc: string, imageAlt?: string, authorName: string, authorAvatar: string, date: string, onBlogClick?: () => void }> - Blog card items" + } + }, + { + "import": "import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';", + "name": "BlogCardTwo", + "path": "@/components/sections/blog/BlogCardTwo", + "propsSchema": { + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Blog section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "imageWrapperClassName?": "string", + "imageClassName?": "string", + "authorAvatarClassName?": "string", + "authorDateClassName?": "string", + "cardTitleClassName?": "string", + "excerptClassName?": "string", + "categoryClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "blogs?": "Array<{ id: string, category: string | string[], title: string, excerpt: string, imageSrc: string, imageAlt?: string, authorName: string, authorAvatar: string, date: string, onBlogClick?: () => void }> - Blog card items" + } + }, + { + "import": "import BlogCardThree from '@/components/sections/blog/BlogCardThree';", + "name": "BlogCardThree", + "path": "@/components/sections/blog/BlogCardThree", + "propsSchema": { + "carouselMode?": "'auto' | 'buttons' (default: 'buttons')", + "uniformGridCustomHeightClasses?": "string (default: 'min-h-[600px]')", + "animationType": "'none' | 'opacity' | 'slide-up' | 'scale-rotate' | 'blur-reveal' (required - controls GSAP scroll animations with stagger effect) (required)", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }> - For inline images in title", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image' (required - 'inline-image' uses titleSegments for rich text with images)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Blog section')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "cardContentClassName?": "string", + "categoryTagClassName?": "string", + "cardTitleClassName?": "string", + "excerptClassName?": "string", + "authorContainerClassName?": "string", + "authorAvatarClassName?": "string", + "authorNameClassName?": "string", + "dateClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string", + "textBoxTitleClassName?": "string", + "textBoxTitleImageWrapperClassName?": "string - For styling image wrapper in inline-image layout", + "textBoxTitleImageClassName?": "string - For styling images in inline-image layout", + "textBoxDescriptionClassName?": "string", + "gridClassName?": "string", + "carouselClassName?": "string", + "controlsClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "blogs?": "Array<{ id: string, category: string, title: string, excerpt: string, imageSrc: string, imageAlt?: string, authorName: string, authorAvatar: string, date: string, onBlogClick?: () => void }> - Blog card items" + } + } + ], + "contact": [ + { + "import": "import ContactCenter from '@/components/sections/contact/ContactCenter';", + "name": "ContactCenter", + "path": "@/components/sections/contact/ContactCenter", + "propsSchema": { + "tag": "string", + "title": "string", + "description": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "useInvertedBackground": "boolean", + "inputPlaceholder?": "string (default: 'Enter your email')", + "buttonText?": "string (default: 'Sign Up')", + "termsText?": "string (default: 'By clicking Sign Up you're confirming that you agree with our Terms and Conditions.')", + "onSubmit?": "(email: string) => void", + "ariaLabel?": "string (default: 'Contact section')", + "className?": "string", + "containerClassName?": "string", + "contentClassName?": "string", + "tagClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "formWrapperClassName?": "string", + "formClassName?": "string", + "inputClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "termsClassName?": "string" + } + }, + { + "import": "import ContactSplit from '@/components/sections/contact/ContactSplit';", + "name": "ContactSplit", + "path": "@/components/sections/contact/ContactSplit", + "propsSchema": { + "tag": "string", + "title": "string", + "description": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "useInvertedBackground": "boolean", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Contact section video')", + "mediaAnimation": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "mediaPosition?": "'left' | 'right' (default: 'right')", + "inputPlaceholder?": "string (default: 'Enter your email')", + "buttonText?": "string (default: 'Sign Up')", + "termsText?": "string (default: 'By clicking Sign Up you're confirming that you agree with our Terms and Conditions.')", + "onSubmit?": "(email: string) => void", + "ariaLabel?": "string (default: 'Contact section')", + "className?": "string", + "containerClassName?": "string", + "contentClassName?": "string", + "contactFormClassName?": "string", + "tagClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "formWrapperClassName?": "string", + "formClassName?": "string", + "inputClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "termsClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string" + } + }, + { + "import": "import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';", + "name": "ContactSplitForm", + "path": "@/components/sections/contact/ContactSplitForm", + "propsSchema": { + "title": "string", + "description": "string", + "inputs": "Array<{ name: string, type: string, placeholder: string, required?: boolean, className?: string }> - Form input fields (min 2 required)", + "multiSelect?": "{ name: string, label: string, options: string[] } - Optional multi-select dropdown field", + "textarea?": "{ name: string, placeholder: string, rows?: number, required?: boolean, className?: string } - Optional textarea field", + "useInvertedBackground": "boolean", + "imageSrc?": "string (RECOMMENDED — always provide an image for best visual result)", + "videoSrc?": "string", + "imageAlt?": "string (default: '')", + "videoAriaLabel?": "string (default: 'Contact section video')", + "mediaAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal' (default: 'none')", + "mediaPosition?": "'left' | 'right' (default: 'right')", + "buttonText?": "string (default: 'Submit')", + "onSubmit?": "(data: Record) => void", + "ariaLabel?": "string (default: 'Contact section')", + "className?": "string", + "containerClassName?": "string", + "contentClassName?": "string", + "formCardClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string" + } + }, + { + "import": "import ContactText from '@/components/sections/contact/ContactText';", + "name": "ContactText", + "path": "@/components/sections/contact/ContactText", + "propsSchema": { + "text": "string", + "animationType?": "'entrance-slide' | 'reveal-blur' | 'background-highlight' (default: 'entrance-slide')", + "buttons?": "Array<{text: string, onClick?: () => void, href?: string}>", + "background": "{ variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' } (required)", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Contact section')", + "className?": "string", + "containerClassName?": "string - Outer wrapper styling", + "contentClassName?": "string - Card content wrapper styling", + "textClassName?": "string - TextAnimation heading styling", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + }, + { + "import": "import ContactCTA from '@/components/sections/contact/ContactCTA';", + "name": "ContactCTA", + "path": "@/components/sections/contact/ContactCTA", + "propsSchema": { + "tag": "string (required)", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "title": "string (required)", + "description": "string (required)", + "buttons": "Array<{text: string, onClick?: () => void, href?: string}> (required)", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "background": "{ variant: \"plain\" | \"glowing-orb\" | \"sparkles-gradient\" | \"radial-gradient\" } = { variant: 'plain' | 'animated-grid' | 'canvas-reveal' | 'cell-wave' | 'downward-rays-animated' | 'downward-rays-animated-grid' | 'downward-rays-static' | 'downward-rays-static-grid' | 'gradient-bars' | 'radial-gradient' | 'rotated-rays-animated' | 'rotated-rays-animated-grid' | 'rotated-rays-static' | 'rotated-rays-static-grid' | 'sparkles-gradient' }", + "useInvertedBackground": "boolean", + "ariaLabel?": "string (default: 'Contact section')", + "className?": "string", + "containerClassName?": "string", + "contentClassName?": "string - Card content wrapper styling", + "textBoxClassName?": "string", + "titleClassName?": "string", + "descriptionClassName?": "string", + "tagClassName?": "string", + "buttonContainerClassName?": "string", + "buttonClassName?": "string", + "buttonTextClassName?": "string" + } + } + ], + "footer": [ + { + "import": "import FooterBase from '@/components/sections/footer/FooterBase';", + "name": "FooterBase", + "path": "@/components/sections/footer/FooterBase", + "propsSchema": { + "columns": "Array<{ title: string, items: Array<{ label: string, href: string }> }> - Footer navigation columns (required)", + "logoSrc?": "string", + "logoAlt?": "string", + "logoText": "string (required)", + "copyrightText?": "string (default: '© 2025 | Webild')", + "onPrivacyClick?": "() => void", + "ariaLabel?": "string (default: 'Site footer')", + "className?": "string", + "containerClassName?": "string", + "logoClassName?": "string", + "logoImageClassName?": "string", + "logoTextClassName?": "string", + "columnsClassName?": "string", + "columnClassName?": "string", + "columnTitleClassName?": "string", + "columnItemClassName?": "string", + "copyrightContainerClassName?": "string", + "copyrightTextClassName?": "string", + "privacyButtonClassName?": "string" + } + }, + { + "import": "import FooterMedia from '@/components/sections/footer/FooterMedia';", + "name": "FooterMedia", + "path": "@/components/sections/footer/FooterMedia", + "propsSchema": { + "imageSrc": "string (required if no videoSrc)", + "imageAlt?": "string (default: '')", + "videoSrc": "string (required if no imageSrc)", + "videoAriaLabel?": "string (default: 'Footer video')", + "logoSrc?": "string", + "logoAlt?": "string", + "logoText": "string (required)", + "columns": "Array<{ title: string, items: Array<{ label: string, href: string }> }> - Footer navigation columns (required)", + "copyrightText?": "string (default: '© 2025 | Webild')", + "onPrivacyClick?": "() => void", + "ariaLabel?": "string (default: 'Site footer')", + "className?": "string", + "containerClassName?": "string", + "mediaWrapperClassName?": "string", + "mediaClassName?": "string", + "logoClassName?": "string", + "logoImageClassName?": "string", + "logoTextClassName?": "string", + "columnsClassName?": "string", + "columnClassName?": "string", + "columnTitleClassName?": "string", + "columnItemClassName?": "string", + "copyrightContainerClassName?": "string", + "copyrightTextClassName?": "string", + "privacyButtonClassName?": "string" + } + }, + { + "import": "import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';", + "name": "FooterBaseReveal", + "path": "@/components/sections/footer/FooterBaseReveal", + "propsSchema": { + "logoSrc?": "string", + "logoAlt?": "string", + "logoText": "string (required)", + "columns": "Array<{ title: string, items: Array<{ label: string, href: string }> }> - Footer navigation columns (required)", + "copyrightText?": "string", + "onPrivacyClick?": "() => void", + "ariaLabel?": "string", + "className?": "string", + "wrapperClassName?": "string", + "containerClassName?": "string", + "footerClassName?": "string", + "footerContainerClassName?": "string", + "logoClassName?": "string", + "logoImageClassName?": "string", + "logoTextClassName?": "string", + "columnsClassName?": "string", + "columnClassName?": "string", + "columnTitleClassName?": "string", + "columnItemClassName?": "string", + "copyrightContainerClassName?": "string", + "copyrightTextClassName?": "string", + "privacyButtonClassName?": "string" + } + }, + { + "import": "import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';", + "name": "FooterLogoEmphasis", + "path": "@/components/sections/footer/FooterLogoEmphasis", + "propsSchema": { + "logoSrc?": "string", + "logoAlt?": "string", + "columns": "Array<{ items: Array<{ label: string, href?: string, onClick?: () => void }> }> - Footer navigation columns (required, max 5)", + "logoText": "string (required)", + "ariaLabel?": "string (default: 'Site footer')", + "className?": "string", + "containerClassName?": "string", + "logoClassName?": "string", + "logoImageClassName?": "string", + "columnsClassName?": "string", + "columnClassName?": "string", + "itemClassName?": "string", + "iconClassName?": "string", + "buttonClassName?": "string" + } + }, + { + "import": "import FooterCard from '@/components/sections/footer/FooterCard';", + "name": "FooterCard", + "path": "@/components/sections/footer/FooterCard", + "propsSchema": { + "logoSrc?": "string", + "logoAlt?": "string", + "logoText": "string (required)", + "copyrightText?": "string (default: '© 2025 | Webild')", + "socialLinks?": "Array<{ icon: LucideIcon, href: string, ariaLabel: string }> - Social media links", + "ariaLabel?": "string (default: 'Site footer')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "logoClassName?": "string", + "logoImageClassName?": "string", + "dividerClassName?": "string", + "copyrightContainerClassName?": "string", + "copyrightTextClassName?": "string", + "socialContainerClassName?": "string", + "socialIconClassName?": "string" + } + }, + { + "import": "import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';", + "name": "FooterBaseCard", + "path": "@/components/sections/footer/FooterBaseCard", + "propsSchema": { + "logoSrc?": "string", + "logoAlt?": "string", + "logoText": "string (required)", + "columns": "Array<{ title: string, items: Array<{ label: string, href: string }> }> - Footer navigation columns (required)", + "copyrightText?": "string (default: '© 2025 | Webild')", + "onPrivacyClick?": "() => void", + "ariaLabel?": "string (default: 'Site footer')", + "className?": "string", + "containerClassName?": "string", + "cardClassName?": "string", + "logoClassName?": "string", + "logoImageClassName?": "string", + "logoTextClassName?": "string", + "columnsClassName?": "string", + "columnClassName?": "string", + "columnTitleClassName?": "string", + "columnItemClassName?": "string", + "copyrightContainerClassName?": "string", + "copyrightTextClassName?": "string", + "privacyButtonClassName?": "string" + } + }, + { + "import": "import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';", + "name": "FooterLogoReveal", + "path": "@/components/sections/footer/FooterLogoReveal", + "propsSchema": { + "logoSrc?": "string", + "logoAlt?": "string", + "logoText": "string (required)", + "leftLink": "{ text: string, onClick?: () => void, href?: string } (required)", + "rightLink": "{ text: string, onClick?: () => void, href?: string } (required)", + "ariaLabel?": "string (default: 'Site footer')", + "className?": "string", + "wrapperClassName?": "string", + "containerClassName?": "string", + "logoClassName?": "string", + "logoImageClassName?": "string", + "linkClassName?": "string" + } + }, + { + "import": "import FooterSimple from '@/components/sections/footer/FooterSimple';", + "name": "FooterSimple", + "path": "@/components/sections/footer/FooterSimple", + "propsSchema": { + "columns": "Array<{ title: string, items: Array<{ label: string, href?: string, onClick?: () => void }> }>", + "bottomLeftText": "string", + "bottomRightText": "string", + "ariaLabel?": "string (default: 'Site footer')", + "className?": "string", + "containerClassName?": "string", + "columnsClassName?": "string", + "columnClassName?": "string", + "columnTitleClassName?": "string", + "columnItemClassName?": "string", + "dividerClassName?": "string", + "bottomContainerClassName?": "string", + "bottomLeftTextClassName?": "string", + "bottomRightTextClassName?": "string" + } + } + ], + "ecommerce": [ + { + "import": "import ProductDetailCard from '@/components/ecommerce/productDetail/ProductDetailCard';", + "name": "ProductDetailCard", + "path": "@/components/ecommerce/productDetail/ProductDetailCard", + "propsSchema": { + "layout": "'page' | 'section'", + "name": "string", + "price": "string", + "showRating?": "boolean (default: true)", + "rating?": "number (default: 0)", + "ratingIcon?": "LucideIcon (default: Star)", + "description?": "string", + "images": "Array<{ src: string; alt: string }>", + "variants?": "Array<{ label: string; options: string[]; selected: string; onChange: (value: string) => void }>", + "quantity?": "{ label: string; options: string[]; selected: string; onChange: (value: string) => void }", + "buttons": "Array<{ text: string, href?: string, onClick?: () => void }>", + "className?": "string", + "imageContainerClassName?": "string", + "infoContainerClassName?": "string", + "nameClassName?": "string", + "priceClassName?": "string", + "descriptionClassName?": "string", + "variantSelectClassName?": "string", + "variantLabelClassName?": "string", + "buttonClassName?": "string" + } + }, + { + "import": "import ProductCart from '@/components/ecommerce/cart/ProductCart';", + "name": "ProductCart", + "path": "@/components/ecommerce/cart/ProductCart", + "propsSchema": { + "isOpen": "boolean", + "onClose": "() => void", + "items": "Array<{ id: string, name: string, variants?: string[], price: string, quantity: number, imageSrc: string, imageAlt?: string }>", + "onQuantityChange?": "(id: string, quantity: number) => void", + "onRemove?": "(id: string) => void", + "total": "string", + "buttons": "Array<{ text: string, href?: string, onClick?: () => void }>", + "title?": "string (default: 'Cart')", + "totalLabel?": "string (default: 'Total')", + "emptyMessage?": "string (default: 'Your cart is empty')", + "className?": "string", + "panelClassName?": "string", + "itemClassName?": "string", + "buttonClassName?": "string" + } + }, + { + "import": "import ProductCartItem from '@/components/ecommerce/cart/ProductCartItem';", + "name": "ProductCartItem", + "path": "@/components/ecommerce/cart/ProductCartItem", + "propsSchema": { + "item": "{ id: string, name: string, variants?: string[], price: string, quantity: number, imageSrc: string } - { id: string; name: string; variants?: string[]; price: string; quantity: number; imageSrc: string; imageAlt?: string }", + "onQuantityChange?": "(id: string, quantity: number) => void", + "onRemove?": "(id: string) => void", + "className?": "string" + } + }, + { + "import": "import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';", + "name": "ProductCatalog", + "path": "@/components/ecommerce/productCatalog/ProductCatalog", + "propsSchema": { + "layout": "'page' | 'section'", + "products": "Array<{ id: string, category?: string, name: string, price: string, rating: number, reviewCount?: string, imageSrc: string, imageAlt?: string, onProductClick?: () => void, onFavorite?: () => void }>", + "searchValue?": "string (default: '')", + "onSearchChange?": "(value: string) => void", + "searchPlaceholder?": "string (default: 'Search products...')", + "filters?": "Array<{ label: string; options: string[]; selected: string; onChange: (value: string) => void }>", + "emptyMessage?": "string (default: 'No products found')", + "className?": "string", + "gridClassName?": "string", + "cardClassName?": "string", + "imageClassName?": "string", + "searchClassName?": "string", + "filterClassName?": "string", + "toolbarClassName?": "string" + } + }, + { + "import": "import ProductCatalogItem from '@/components/ecommerce/productCatalog/ProductCatalogItem';", + "name": "ProductCatalogItem", + "path": "@/components/ecommerce/productCatalog/ProductCatalogItem", + "propsSchema": { + "product": "CatalogProduct - { id: string; category?: string; name: string; price: string; rating: number; reviewCount?: string; imageSrc: string; imageAlt?: string; onProductClick?: () => void; onFavorite?: () => void; isFavorited?: boolean }", + "className?": "string", + "imageClassName?": "string", + "categoryClassName?": "string", + "nameClassName?": "string", + "priceClassName?": "string", + "ratingClassName?": "string" + } + } + ], + "legal": [ + { + "import": "import LegalSection from '@/components/legal/LegalSection';", + "name": "LegalSection", + "path": "@/components/legal/LegalSection", + "propsSchema": { + "layout": "'page' | 'section'", + "title": "string", + "subtitle?": "string", + "sections": "LegalContentSection[] - { heading: string; content: { type: \"paragraph\", text: string } | { type: \"list\", items: string[] } | { type: \"numbered-list\", items: string[] }[] } where { type: \"paragraph\", text: string } | { type: \"list\", items: string[] } | { type: \"numbered-list\", items: string[] } = { type: 'paragraph'; text: string } | { type: 'list'; items: string[] } | { type: 'numbered-list'; items: string[] }", + "className?": "string", + "titleClassName?": "string", + "subtitleClassName?": "string", + "sectionClassName?": "string", + "headingClassName?": "string", + "contentClassName?": "string", + "listClassName?": "string" + } + } + ], + "socialProof": [ + { + "import": "import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';", + "name": "SocialProofOne", + "path": "@/components/sections/socialProof/SocialProofOne", + "propsSchema": { + "names": "string[] (required) - Array of company/partner names to display as text", + "title": "string", + "titleSegments?": "Array<{ type: 'text', content: string } | { type: 'image', src: string, alt?: string }>", + "description": "string", + "tag?": "string", + "tagIcon?": "LucideIcon", + "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "buttons?": "Array<{ text: string, href?: string, onClick?: () => void }>", + "buttonAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", + "textboxLayout": "'default' | 'split' | 'split-actions' | 'split-description' | 'inline-image'", + "useInvertedBackground": "boolean", + "speed?": "number (default: 40)", + "showCard?": "boolean (default: true) - Whether to show card styling around items", + "ariaLabel?": "string (default: 'Social proof section')", + "className?": "string", + "containerClassName?": "string", + "textBoxTitleClassName?": "string", + "titleImageWrapperClassName?": "string", + "titleImageClassName?": "string", + "textBoxDescriptionClassName?": "string", + "textBoxClassName?": "string", + "textBoxTagClassName?": "string", + "textBoxButtonContainerClassName?": "string", + "textBoxButtonClassName?": "string", + "textBoxButtonTextClassName?": "string", + "contentClassName?": "string", + "logoItemClassName?": "string", + "logoCardClassName?": "string", + "logoTextClassName?": "string" + } + } + ] + } +}