From 12927d31bd70437d5d29c5ebeba00cac38d09244 Mon Sep 17 00:00:00 2001 From: bender Date: Fri, 17 Apr 2026 21:18:53 +0000 Subject: [PATCH] Switch to version 2: added registry/components/TestimonialAboutCard.json --- registry/components/TestimonialAboutCard.json | 91 +++++++++++++++++++ 1 file changed, 91 insertions(+) create mode 100644 registry/components/TestimonialAboutCard.json diff --git a/registry/components/TestimonialAboutCard.json b/registry/components/TestimonialAboutCard.json new file mode 100644 index 0000000..75c3cb5 --- /dev/null +++ b/registry/components/TestimonialAboutCard.json @@ -0,0 +1,91 @@ +{ + "name": "TestimonialAboutCard", + "description": "Card-based about section with tag, title, description footer, icon box, and required media.", + "details": "Use for testimonial-style about sections, quotes, or featured content with media. Layout: Two-card grid (3:2 ratio on desktop). Left card: Tag → Title (large heading) → Description and subdescription footer. Features a primary-button icon box positioned half outside the card on the top-left corner. Right card: Required image or video. Best for testimonials, quotes, featured content, or any about section needing prominent media.", + "constraints": { + "textRules": { + "tag": { + "required": true, + "example": "Testimonial", + "minChars": 2, + "maxChars": 30 + }, + "title": { + "required": true, + "example": "They took social media off our plate completely and our audience has never been more engaged.", + "minChars": 10, + "maxChars": 300 + }, + "description": { + "required": true, + "example": "Elena Chen", + "minChars": 2, + "maxChars": 50 + }, + "subdescription": { + "required": true, + "example": "Bloom Skincare", + "minChars": 2, + "maxChars": 50 + } + }, + "mediaRules": { + "note": "Either imageSrc or videoSrc is required (discriminated union)", + "imageSrc": { + "required": "conditional - required if no videoSrc", + "example": "https://images.unsplash.com/photo-1616394584738-fc6e612e71b9?w=800", + "note": "Either imageSrc or videoSrc should be provided. Image is recommended if no videoSrc." + }, + "videoSrc": { + "required": "conditional - required if no imageSrc", + "example": "/videos/testimonial.mp4" + } + } + }, + "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" + }, + "usageExample": "", + "do": [ + "Use for feature showcases", + "Use for capability displays", + "Use for social proof", + "Use for customer reviews", + "Use for about pages", + "Use for company information" + ], + "dont": [ + "Do not use more than 4 items" + ], + "editRules": { + "textOnly": true, + "layoutLocked": true, + "styleLocked": true + } +}