textile/src/tiling/ at main · eagraf.dev/textile · Tangled

eagraf.dev / textile

0

A local-first note taking app

0

textile / src / tiling /

at main 3 files

Ethan Graf Tabs per tile (phase 5b): drag-and-drop tabs + drop-zone splits 3w ago

Tabs per tile (phase 5b): drag-and-drop tabs + drop-zone splits Drag tab chips to reorder, move between tiles, or split. - tabsModel.moveTab: reorder within / move across tiles (pure + tested); creates the destination tile if absent and reports sourceEmptied. - tabDnd: shared drag payload + computeDropZone (5 zones; pure + tested). - model.splitLeaf gains `before` so a drop on a left/top edge puts the new tile first. - tiling.tsx: TilingTile shows a translucent zone overlay (raised via a capture overlay so the editor can't swallow drag events); dropping on an edge splits the tile and moves the tab; center moves it in. - TileTabStrip: draggable chips with an insertion marker, cleared on dragleave/dragend; an independent off-screen clone is used as the drag image so the clipped live chip can't corrupt it. Thin, non-overlay tab scrollbar (TileTabStrip.css). Fixes found while testing: - White-screen crash: read currentTarget synchronously, not inside a setState updater (React nulls it after the handler). - Tiles overlapped: split panes now flex-grow to share the space the fixed splitter leaves, so panes + divider sum to 100% with no hardcoded splitter width. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

3 weeks ago

Tabs per tile (phase 5b): drag-and-drop tabs + drop-zone splits Drag tab chips to reorder, move between tiles, or split. - tabsModel.moveTab: reorder within / move across tiles (pure + tested); creates the destination tile if absent and reports sourceEmptied. - tabDnd: shared drag payload + computeDropZone (5 zones; pure + tested). - model.splitLeaf gains `before` so a drop on a left/top edge puts the new tile first. - tiling.tsx: TilingTile shows a translucent zone overlay (raised via a capture overlay so the editor can't swallow drag events); dropping on an edge splits the tile and moves the tab; center moves it in. - TileTabStrip: draggable chips with an insertion marker, cleared on dragleave/dragend; an independent off-screen clone is used as the drag image so the clipped live chip can't corrupt it. Thin, non-overlay tab scrollbar (TileTabStrip.css). Fixes found while testing: - White-screen crash: read currentTarget synchronously, not inside a setState updater (React nulls it after the handler). - Tiles overlapped: split panes now flex-grow to share the space the fixed splitter leaves, so panes + divider sum to 100% with no hardcoded splitter width. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

3 weeks ago

useResizeObserver.ts

Add basic tiling framework

2 months ago