TreeItemDisplay

The default content for a <TreeItem>

Code

<script lang="ts">
    import { TreeItemDisplay } from '@geoffcox/sterling-svelte';
  </script>
  
  <TreeItemDisplay hasChildren text="sterling-svelte" value="item">sterling-svelte</TreeItemDisplay>

Members

Property Name	Type	Default	Comment
depth	number	0	The depth of the item in the tree.
disabled	boolean	false	When true, the item is disabled.
expanded	boolean	false	When true, the item is expanded.
hasChildren	boolean	false	When true, the item has children.
selected	boolean	false	When true, the item is selected.
value	string		The value uniquely identifying this item within the tree.
variant	string	''	Additional class names to apply

Considerations

Includes HTMLDivElement props, event, and methods

Anatomy

<div class="sterling-tree-item-display">
  <TreeChevron {expanded} {hasChildren} {variant} />
  <slot {depth} {disabled} {expanded} {hasChildren} {selected} {value} {variant} />
</div>