Skip to content

feat: add layout switching and vertical links layout#34

Open
jojo58fr wants to merge 1 commit intoyoanbernabeu:mainfrom
jojo58fr:feat/changing-layout
Open

feat: add layout switching and vertical links layout#34
jojo58fr wants to merge 1 commit intoyoanbernabeu:mainfrom
jojo58fr:feat/changing-layout

Conversation

@jojo58fr
Copy link

@jojo58fr jojo58fr commented Mar 8, 2026

Description

This PR adds a full layout switching system to the builder with support for a new Vertical Links Layout alongside the existing Bento layout.

It includes:

  • a layout switcher in the top toolbar next to the preview mode controls
  • a layout selection modal with a warning that switching layout resets the arrangement
  • persisted layout selection through pageLayout
  • support for the selected layout in the builder, preview page, and export templates
  • a dedicated Vertical Links Layout with stacked blocks and profile header editing parity
  • vertical drag and drop reordering, including long-press drag support
  • a new vertical-only Collection block with:
    • title
    • expanded/collapsed by default setting
    • animated open/close behavior
    • drag/drop support to move blocks into and out of collections
  • cleanup of vertical-only blocks when switching back from Vertical Links Layout to Bento
  • documentation for the full layout switching implementation

This PR also fixes type-check issues that were blocking validation and updates related typing for analytics and social platform icons.

Related Issue

Type of Change

  • 🐛 Bug fix (non-breaking change which fixes an issue)
  • ✨ New feature (non-breaking change which adds functionality)
  • 💥 Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • 📚 Documentation update
  • 🎨 Style/UI improvement
  • ♻️ Code refactoring (no functional changes)
  • ⚡ Performance improvement
  • 🔧 Configuration/build changes

Checklist

  • My code follows the project's code style
  • I have run npm run lint and fixed any issues
  • I have run npm run format to format my code
  • I have run npm run type-check with no errors
  • I have tested my changes locally with npm run dev
  • I have added/updated documentation if needed
  • My changes generate no new warnings

Screenshots (if applicable)

verticalLayout

Additional Notes

Documentation was added in docs/usage/layout-switching.md.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant