63 lines
1.9 KiB
JSON
63 lines
1.9 KiB
JSON
{
|
|
"name": "TestimonialCardFifteen",
|
|
"description": "Centered testimonial with star rating, animated text, author, and avatar group.",
|
|
"constraints": {
|
|
"textRules": {
|
|
"testimonial": {
|
|
"required": true,
|
|
"example": "This product has completely transformed how we work. The results speak for themselves.",
|
|
"minChars": 20,
|
|
"maxChars": 300
|
|
},
|
|
"author": {
|
|
"required": true,
|
|
"example": "James Carter, Journalist",
|
|
"minChars": 2,
|
|
"maxChars": 60
|
|
}
|
|
},
|
|
"ratingRules": {
|
|
"rating": {
|
|
"required": true,
|
|
"min": 0,
|
|
"max": 5,
|
|
"example": 5,
|
|
"note": "Number of filled stars (0-5)"
|
|
}
|
|
},
|
|
"avatarRules": {
|
|
"avatars": {
|
|
"required": true,
|
|
"minItems": 1,
|
|
"example": "[{ src: '/avatars/user1.jpg', alt: 'User 1' }]",
|
|
"note": "Array of avatar objects with src and alt. Shows 3 on mobile, 6 on desktop."
|
|
}
|
|
}
|
|
},
|
|
"propsSchema": {
|
|
"testimonial": "string",
|
|
"rating": "number (0-5)",
|
|
"author": "string",
|
|
"avatars": "Array<{ src: string, alt: string }>",
|
|
"useInvertedBackground": "'noInvert' | 'invertDefault'",
|
|
"ariaLabel?": "string (default: 'Testimonial section')",
|
|
"className?": "string"
|
|
},
|
|
"usageExample": "<TestimonialCardFifteen testimonial=\"This product has completely transformed how we work.\" rating={5} author=\"James Carter, Journalist\" avatars={[{ src: '/avatars/user1.jpg', alt: 'User 1' }, { src: '/avatars/user2.jpg', alt: 'User 2' }]} useInvertedBackground=\"noInvert\" />",
|
|
"do": [
|
|
"Use for landing pages",
|
|
"Use for feature showcases",
|
|
"Use for capability displays",
|
|
"Use for social proof",
|
|
"Use for customer reviews",
|
|
"Requires avatars[]"
|
|
],
|
|
"dont": [
|
|
"Do not use multiple items"
|
|
],
|
|
"editRules": {
|
|
"textOnly": true,
|
|
"layoutLocked": true,
|
|
"styleLocked": true
|
|
}
|
|
} |