What's New SwiftUI Screen

A custom Layout packs 1×1, 2×1 and 2×2 tiles into square cells, scanning left to right so wide and large tiles settle around small ones. Tiles depress with a spring and a soft haptic on press; release opens a detail surface that morphs out of the tile with matchedGeometryEffect, dims the grid, and can be dragged down to dismiss (flicks commit via predictedEndTranslation). Reveal is scroll-linked through scrollTransition. Tiles sit on themed surfaces with a single accent for symbols.

Notes

• The screen owns its ScrollView so the detail surface can cover all of it. Give it the screen (or a tall frame) and use header for the section title.
• Tile ids drive the morph; keep them stable.
• Reduce Motion keeps the opacity reveal and crossfades the expand instead of scaling.
• BentoGridBlockExample at the end of BentoGridBlock.swift is the screen shown in the preview; copy it as a starting point.

Theming

• Reads SPTheme from @Environment(\.spTheme), so install the design-system item with it.
• tint defaults to color.accent and colors the symbol badges.
• The grid sits on color.bg. Tiles use spSurface(.e1) and the detail surface uses spSurface(.e4), both with radius.lg, so the morph keeps its corners.
• Titles use type.headline, type.title2 and type.title1; badge corners are capped at radius.md, so tighter themes square them up.