[SidePanel] Support ref as prop and fix array index key

[ravisuhag]

Summary

SidePanel is a custom layout component for side-panel UI patterns. Missing ref prop support on all sub-components, incomplete type safety, and accessibility gaps.

Improvements

1. Accept ref as a prop on all sub-components

None of SidePanelRoot, SidePanelHeader, or SidePanelSection accept ref as a prop.

5. Fix array index key in actions map

actions?.map((action, index) => (<Fragment key={index}> breaks list reconciliation if actions reorder.

Moved to Cross-Cutting Issues

The following items have been moved to cross-cutting issues that address them across all components:

• Replace hardcoded CSS values with design tokens (Replace hardcoded CSS values with design tokens #672)
• Accessibility baseline (Accessibility baseline: aria attributes, roles, and semantic HTML #673)
• TypeScript strictness (TypeScript strictness: eliminate any, @ts-ignore, and export prop types #675)
• Add displayName (Add displayName to components and sub-components #676)

Files

• packages/raystack/raystack/components/side-panel/