FooterAccordion

Client-side accordion wrapper for footer sections on mobile.

Props

Prop	Type	Required	Default	Description
`children`	`ReactNode`	Yes	-	Footer content to wrap

Usage

1import FooterAccordion from '@/components/layout/FooterAccordion';
2
3<FooterAccordion>
4  {/* Footer sections with data-footer-toggle and data-footer-section attributes */}
5</FooterAccordion>

import FooterAccordion from '@/components/layout/FooterAccordion';

<FooterAccordion>
  {/* Footer sections with data-footer-toggle and data-footer-section attributes */}
</FooterAccordion>

Features

Accordion behavior: Toggles sections open/closed
Smooth animations: CSS transitions for height changes
Icon rotation: Rotates arrow icon when section opens
ARIA support: Updates aria-expanded attributes
Data attributes: Uses data-footer-open, data-footer-toggle, data-footer-section

Behavior

Registers click handlers on buttons with data-footer-toggle attribute
Toggles data-footer-open attribute on content sections
Rotates icons with rotate-180 class
Updates maxHeight dynamically for smooth animation

Notes

Client-side component (uses 'use client')
Supports up to 10 accordion sections (0-9)
Uses refs to manage DOM elements
Registers handlers after initial mount