@namespace Connected.Components
@inherits UIComponent
@typeparam T

<li @attributes="UserAttributes" class="@Classname" style="@Style">
    <div class="@ContentClassname" @onclick="OnItemClicked" @onclick:stopPropagation="true" @ondblclick="OnItemDoubleClicked" @ondblclick:stopPropagation="true">
        @if (Content != null)
        {
            @Content
        }
        else
        {
            <TreeViewItemToggleButton Loading="Loading" Expanded="Expanded" ExpandedChanged="OnItemExpanded" Visible="@HasChild" ExpandedIcon="@ExpandedIcon" ExpandedIconColor="@ExpandedIconColor" LoadingIcon="@LoadingIcon" LoadingIconColor="LoadingIconColor"></TreeViewItemToggleButton>

            @if (TreeRoot != null && TreeRoot.MultiSelection)
            {
                <CheckBox Class="mud-treeview-item-checkbox" CheckedIcon="@CheckedIcon" UncheckedIcon="@UncheckedIcon" @bind-Checked="IsChecked" Disabled="@Disabled"></CheckBox> 
            }

            @if (!string.IsNullOrEmpty(Icon))
            {
                <div class="mud-treeview-item-icon">
                    <Icon Icon="@Icon" Color="@IconColor" />
                </div>
            }
            
            <TextContent Typo="@TextTypo" Class="@TextClassname">
                @Text
            </TextContent>  

            @if (!string.IsNullOrEmpty(EndText))
            {            
                <TextContent Typo="@EndTextTypo" Class="@EndTextClass">
                    @EndText
                </TextContent>  
            }

            @if (!string.IsNullOrEmpty(EndIcon))
            {
                <div class="mud-treeview-item-icon">
                    <Icon Icon="@EndIcon" Color="@EndIconColor" />
                </div>
            }
        }
    </div>
    @if (HasChild)
    {
        <Collapse Expanded="@Expanded">
            <CascadingValue Value="@TreeRoot" IsFixed="true">
                <CascadingValue Value="this" IsFixed="true">
                    <TreeView Items="Items" ItemTemplate="TreeRoot.ItemTemplate" Class="mud-treeview-group">
                        @ChildContent
                    </TreeView>
                </CascadingValue>
            </CascadingValue>
        </Collapse>
    }
</li>