{ "name": "TextAbout", "description": "Centered about section with large animated text and optional buttons below.", "constraints": { "textRules": { "title": { "required": true, "example": "We build products that empower teams to create exceptional digital experiences", "minChars": 10, "maxChars": 200 } }, "buttonRules": { "maxButtons": 2, "structure": { "text": "string - Button label", "href": "string - Link destination (optional)", "onClick": "() => void - Click handler (optional)", "props": "Partial - Additional button props (optional)" }, "note": "Button variant controlled by ThemeProvider's defaultButtonVariant. Border radius controlled by ThemeProvider's borderRadius. All sections should be wrapped in a single ThemeProvider at the app/page level." } }, "propsSchema": { "tag?": "string", "tagIcon?": "LucideIcon", "tagAnimation?": "'none' | 'opacity' | 'slide-up' | 'blur-reveal'", "title": "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" }, "usageExample": "// Wrap in ThemeProvider\n\n \n", "do": [ "Use for feature showcases", "Use for capability displays", "Use for about pages", "Use for company information", "Requires buttons?[]" ], "dont": [], "editRules": { "textOnly": true, "layoutLocked": true, "styleLocked": true } }