Product: PowerShell Universal
Version: 3.3.2
I am trying to implement a drawer that will highlight the clicked li.
I have pages as follows:
$Pages += New-UDPage -Name 'Dashboard' '/' -Content {
...content
} -NavigationLayout permanent -LoadNavigation $Navigation
$Pages += New-UDPage -Name 'Dashboard' '/vc/:Name' -Content {
...content
} -NavigationLayout permanent -LoadNavigation $Navigation
$Pages += New-UDPage -Name 'Dashboard' '/vmhost/:Name' -Content {
...content
} -NavigationLayout permanent -LoadNavigation $Navigation
My Navigation
$Navigation = {
New-UDListItem -Label "Home" -OnClick {
#onclick redirect to Home content
} -AvatarType Icon -Icon (New-UDIcon -Icon home -size '1x')
New-UDListItem -Label 'VCenter' -Children {
#colapislable list of the vc with onclick redirect to vc page
} -AvatarType Icon -Icon (New-UDIcon -Icon Globe -size '1x')
New-UDElement -Tag 'hr'
if ($Session:VCenter) {
#show a list of the vmhosts for the selected vc with onclick redirect to the vmhost page
}
}
The way I am highlighting the li is with a style
if ($Session:Selected -eq $Session:VCenter) {
New-UDStyle -Content {
New-UDListItem -Label $Session:VCenter -OnClick {
$Session:Selected = $Session:VCenter
Invoke-UDRedirect "/vc/$Session:VCenter"
} -AvatarType Icon -Icon (New-UDIcon -Icon GlobeAmericas -size '1x')
} -Style '
background-color: #1976d2;
color: #fff;
border-radius: 4px;
'
} else {
#with no style
}
Is there a chance that ListItemButton API will be implemented that includes the selected property?
My code is highlighting the selected list item, but I feel it would be better if React handled the highlighting.
Also I was not able to use $SecondaryAction.
New to Javascript, but looking at the code on git I think the if statement should reference props.secondaryAction?
var secondaryItem = null;
if (props.secondaryItem)
{
secondaryItem = <ListItemSecondaryAction>{props.render(item.secondaryAction)}</ListItemSecondaryAction>
}