Skip to content
Frauthy Brand
Frauthy index

Go anywhere.

0 resultsOpen full search →

    No exact contract found. Try a component family, product name, prop, or keyboard key.

    ↑↓ move↵ openesc close

    08 · Data & navigation

    alpha

    TreeGrid

    A hierarchical data grid combining row expansion, cell focus, typeahead, selection, RTL navigation, and form reset.

    Since
    1.0.0-next.0
    Owner
    Brand Core
    Export
    PRIVATE_BETA_PACKAGE_COORDINATE_REDACTED/TreeGrid
    Release
    Documentation version
    Deterministic fixture · default state

    Component studio

    light · comfortable · LTR
    Recent decisions3 events
    1. allow user:ada → portal:docs
    2. deny user:lin → key:prod
    3. allow service:sync → schema:main
    §01

    Contract

    Semantics first

    Anatomy

    Uses a labelled treegrid with row hierarchy metadata and gridcell descendants; focus, expansion, and selection remain separate states.

    Consumer classes, styles, and data attributes may extend the surface, but required roles, IDs, relationships, and handlers remain owned by the component.

    Keyboard

    • Tab enters at one visible cell.
    • Arrow Up/Down move rows and horizontal arrows move cells according to direction.
    • On the first cell, forward expands and backward collapses or moves to the parent.
    • Home/End and Ctrl+Home/End move to row or grid boundaries.
    • Typing moves to a matching row; Enter/Space select the row.
    §02

    Public surface

    API & styling

    Props

    id
    Explicit IDs override stable generated IDs.
    class / style
    Consumer additions compose with required styles.
    ref
    Element or callback where focus control is expected.
    children
    Typed content; raw HTML strings are never rendered.

    Slots & events

    children
    Primary content slot.
    onChange
    Typed value plus a small reason object when state changes.
    native events
    Composed without overwriting required handlers.

    State attributes

    • data-fui-tree-grid-wrap
    • data-fui-tree-grid
    • data-fui-key
    • data-fui-cell
    • data-fui-expanded
    • data-fui-selected
    • data-fui-disabled

    CSS tokens

    • --fui-tree-grid-*
    • --fui-tree-level
    • --fui-table-*
    • --fui-focus-color
    §03

    Consumption

    Solid, Vite & Astro

    Solid / VitePRIVATE_BETA_PACKAGE_COORDINATE_REDACTED/TreeGrid
    import TreeGrid from 'PRIVATE_BETA_PACKAGE_COORDINATE_REDACTED/TreeGrid';

<TreeGrid>Frauthy content</TreeGrid>
    Astroisland
    ---
import TreeGrid from 'PRIVATE_BETA_PACKAGE_COORDINATE_REDACTED/TreeGrid';
---

<TreeGrid client:visible>Frauthy content</TreeGrid>
    §04

    Verification

    Evidence record

    Scheduled

    Automated

    Batch D treegrid tests cover hierarchy metadata, controlled state, two-axis/RTL keys, expansion/parent movement, typeahead, disabled rows, reset, and submission.

    Target
    Brand 1.0.0-next.0 matrix
    Last verified
    Pending integrated G2 run
    Required

    Assistive technology

    Pending VoiceOver/Safari and NVDA/Firefox hierarchical grid navigation and announcement verification; manual evidence blocks beta.

    Desktop
    VoiceOver/Safari · NVDA/Firefox
    Touch
    Not required for beta
    Open

    Known issues

    • Cell editing, range selection, multi-selection, column operations, drag/drop, and virtualization are deferred.
    • TreeGrid carries a high interaction cost and requires task-specific usability review.
    §05

    Editorial guidance

    Do / don’t

    Do

    Use only when users must compare multiple columns inside a collapsible hierarchy.

    Don’t

    Do not use TreeGrid when a Tree plus a details panel or a static nested Table is simpler.

    Release activity

    TreeGrid · Brand Core

    1 recorded change · 26 weeks
    1. 1.0.0-next.3

      Baseline public component contract.

    Version & provenance

    New in the v2 architecture

    There is no stable predecessor for this explicit compiled subpath. The v1 compatibility layer remains tested separately; visual and API diffs begin with the next prerelease.

    Current
    1.0.0-next.0
    Previous
    compatibility surface
    Deprecation
    none
    Replacement
    not applicable
    Next in Data & navigationTimeline