Frontmatter
| id | 9410 |
| title | TreeGrid Documentation & Examples |
| state | Closed |
| labels | documentationenhancementgood first issueai |
| assignees | tobiu |
| createdAt | Mar 9, 2026, 12:01 PM |
| updatedAt | Mar 9, 2026, 8:48 PM |
| githubUrl | https://github.com/neomjs/neo/issues/9410 |
| author | tobiu |
| commentsCount | 1 |
| parentIssue | 9404 |
| subIssues | [] |
| subIssuesCompleted | 0 |
| subIssuesTotal | 0 |
| blockedBy | [] |
| blocking | [] |
| closedAt | Mar 9, 2026, 8:48 PM |
TreeGrid Documentation & Examples
tobiu added parent issue #9404 on Mar 9, 2026, 12:01 PM
tobiu assigned to @tobiu on Mar 9, 2026, 12:02 PM

tobiu
Mar 9, 2026, 8:48 PM
Input from Gemini 3.1 Pro:
✦ I have committed the first working TreeGrid example!
This static "File Explorer" style demo validates several core architectural pieces:
- The
Neo.data.TreeStoresuccessfully parses nested JSON data and projects the initial flattened view.- The new
Neo.grid.column.Treecorrectly renders the cell components.- The
baseCls: ['neo-grid-tree-cell']fix ensures the App Worker injects the proper layout styles (fixing the zero-height divs).- The
examples/grid/tree/MainModel.mjsprevents theRecordFactoryfrom stripping custom fields during hydration.- The
isTreeGridflag ensures the correct ARIA attributes are generated for accessibility.Important Note regarding the DOM: You will notice the
Treecell renders outside the standard<div id="...__cell-0">pool in the DOM. This is entirely by design. TheTreecell component extendsNeo.grid.column.Component, meaning it operates as a "Permanent Cell" (hideMode: 'display'). This protects the Component instance's lifecycle during horizontal scrolling, while visual order is maintained correctly via absolute CSS positioning (left: Xpx).Closing this issue as the foundational example is now complete and functional.
tobiu closed this issue on Mar 9, 2026, 8:48 PM
Goal
Create comprehensive documentation and interactive examples demonstrating the new Tree Grid capabilities.
Details
examples/grid/treeGrid/.singleExpandandmultiExpandmodes.learn/tree.jsonor a mocked file system).learn/guides/datahandling/Grids.md(or create a specific TreeGrid guide).TreeStoreconcept, the "flattened view" architecture, and how to configurecolumn.Tree.