diff --git a/registry/components/FooterLogoEmphasis.json b/registry/components/FooterLogoEmphasis.json new file mode 100644 index 0000000..b62e6ed --- /dev/null +++ b/registry/components/FooterLogoEmphasis.json @@ -0,0 +1,72 @@ +{ + "name": "FooterLogoEmphasis", + "description": "Footer with prominent centered logo emphasis and grid-based navigation layout with chevron icons.", + "details": "Use when logo branding is primary focus in footer. Features large centered logo at top (image or SVG text), followed by responsive grid of navigation links (1-5 columns max) with ChevronRight icons. Grid columns automatically adjust based on number of column arrays provided. No column titles - just clean link lists. Uses primary-button background with rounded-t-theme-capped styling.", + "constraints": { + "textRules": { + "logoText": { + "required": false, + "default": "Webild", + "example": "Company Name", + "minChars": 2, + "maxChars": 30 + }, + "itemLabel": { + "required": true, + "example": "Features", + "minChars": 2, + "maxChars": 30 + } + }, + "structureRules": { + "columns": { + "required": true, + "minColumns": 1, + "maxColumns": 5, + "note": "Grid automatically adjusts from 1-5 columns based on array length" + }, + "items": { + "required": true, + "minItems": 1, + "structure": { + "label": "string - Link text (required)", + "href": "string - Link destination (optional). External URLs open in new tab, internal values scroll to sections", + "onClick": "() => void - Additional click handler (optional)" + } + }, + "logo": { + "note": "Uses logoText for SVG text logo" + } + } + }, + "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" + }, + "usageExample": "", + "do": [ + "Use for feature showcases", + "Use for capability displays", + "Requires columns[]" + ], + "dont": [ + "Do not use more than 4 items" + ], + "editRules": { + "textOnly": true, + "layoutLocked": true, + "styleLocked": true + } +}