Tabs
Tab component for Universal Dashboard
Tabs make it easy to explore and switch between different views.
Tabs organize and allow navigation between groups of content that are related and at the same level of hierarchy.

Tabs

1
New-UDTabs -Tabs {
2
New-UDTab -Text 'Item One' -Content { New-UDTypography -Text 'Item One' -Variant 'h2' }
3
New-UDTab -Text 'Item Two' -Content { New-UDTypography -Text 'Item Two' -Variant 'h2' }
4
New-UDTab -Text 'Item Three' -Content { New-UDTypography -Text 'Item Three' -Variant 'h2' }
5
}
Copied!

Vertical Tabs

1
New-UDTabs -Tabs {
2
New-UDTab -Text 'Item One' -Content { New-UDTypography -Text 'Item One' -Variant 'h2' }
3
New-UDTab -Text 'Item Two' -Content { New-UDTypography -Text 'Item Two' -Variant 'h2' }
4
New-UDTab -Text 'Item Three' -Content { New-UDTypography -Text 'Item Three' -Variant 'h2' }
5
} -Orientation vertical
Copied!

Dynamic Tabs

Dynamic tabs will refresh their content when they are selected. You will need to include the -RenderOnActive parameter to prevent all the tabs from rendering even if they are not shown.
1
New-UDTabs -Tabs {
2
New-UDTab -Text 'Item One' -Content { Get-Date } -Dynamic
3
New-UDTab -Text 'Item Two' -Content { Get-Date } -Dynamic
4
New-UDTab -Text 'Item Three' -Content { Get-Date } -Dynamic
5
} -RenderOnActive
Copied!

API

Last modified 6mo ago