Tree

• Implementations
  • Vuetify
  • Shoelace
• API

Implementations

<x-tree
  :root-node="{
    id: 'root',
    label: 'Root',
    children: [
      {
        id: 'node1',
        label: 'Node 1',
        children: [{ id: 'node11', label: 'Node 1.1' }],
      },
      {
        id: 'node2',
        label: 'Node 2',
        url: 'https://cristal.xwiki.org/',
        children: [{ id: 'node21', label: 'Node 2.1' }],
      },
      { id: 'node3', label: 'Node 3' },
      {
        id: 'node4',
        label: 'Node 4',
        children: [{ id: 'node41', label: 'Node 4.1' }],
      },
    ],
  }"
  activated="node2"
  :opened="['node1', 'node2']"
>
</x-tree>

Vuetify

Shoelace

API

The API is documented in XS documentation.