Initial commit

registry/components/FooterLogoEmphasisReveal.json

@@ -0,0 +1,72 @@
+{
+  "name": "FooterLogoEmphasisReveal",
+  "description": "Footer with prominent centered logo emphasis that reveals from behind content as user scrolls (sticky reveal effect).",
+  "details": "Use when logo branding is primary focus and you want a sticky reveal effect. Wraps FooterLogoEmphasis with scroll-based reveal animation - footer stays fixed at bottom and reveals as content scrolls past. Features large centered logo at top, 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": true,
+        "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": {
+    "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",
+    "wrapperClassName?": "string",
+    "containerClassName?": "string",
+    "footerClassName?": "string",
+    "footerContainerClassName?": "string",
+    "logoClassName?": "string",
+    "columnsClassName?": "string",
+    "columnClassName?": "string",
+    "itemClassName?": "string",
+    "iconClassName?": "string",
+    "buttonClassName?": "string"
+  },
+  "usageExample": "<FooterLogoEmphasisReveal columns={[{ items: [{ label: 'Features', href: 'features' }] }, { items: [{ label: 'About', href: 'about' }] }]} logoText=\"Company\" />",
+  "do": [
+    "Use for feature showcases",
+    "Use for capability displays",
+    "Use for sticky reveal footer effect",
+    "Requires columns[]"
+  ],
+  "dont": [
+    "Do not use more than 5 columns"
+  ],
+  "editRules": {
+    "textOnly": true,
+    "layoutLocked": true,
+    "styleLocked": true
+  }
+}