Make a UDcard grow to fit a UDTable inside it

As shown here, the UDTable is longer than the UDCard and the list line is cut off (you can just barely see the top of the words below “MemberOf”). How do I make the UDCard grow to fit the size of whatever is in the table?

Here’s the code:

New-UDRow -Columns {
    New-UDColumn -Size 12 -Content {
        New-UDCard -Size large -Content {
            New-UDRow -Columns {
                New-UDColumn -Size 1 -Content { 
                    New-UDElement -Tag "div" -Attributes @{ style = @{ height = "30px"}}
                    New-ADIcon -ObjectClass $Object.ObjectClass -Size 4x 
                }
                New-UDColumn -Size 11 -Content {
                    New-UDTable -Title ($Object.GivenName + " " + $Object.SurName) -Headers @("Name", "Value") -Endpoint {
                        $SkippedProperties = @("PropertyNames", "AddedProperties", "ModifiedProperties", "RemovedProperties", "PropertyCount","SID","ObjectClass","ObjectGUID")
                        $Object.psobject.Properties | ForEach-Object {
                            if ($SkippedProperties.Contains( $_.Name))
                            {
                                return
                            }

                            $Value = $Null
                            if ($_.Value -eq $null)
                            {
                                $Value = ' '
                            }
                            elseif ($_.Value -is [Microsoft.ActiveDirectory.Management.ADPropertyValueCollection])
                            {
                                $Value = ($_.Value | ForEach-Object {
                                        $_.ToString()
                                        New-UDElement -Tag "br"
                                    })
                            }
                            else
                            {
                                $Value = $_.Value.ToString()
                            }

                            [PSCustomObject]@{
                                Name  = $_.Name
                                Value = $Value
                            } | Out-UDTableData -Property @("Name", "Value")
                        }
                    }
                }
            }
        }
    }     
}

It would be great to hear if anyone knows how to do this. :slight_smile:

Give a better screen shot I personally cannot see the problem from the picture you posted. Thanks

Is it because you have a fixed size UDCard enclosing everything?

gav

I don’t know if it’s fixed, does the code I posted above do that? If so, would be awesome to hear how to make it not fixed and I’m happy to try it out.

Just tested. If you remove the “-size large” the card can grow as required.

gav

1 Like

I’m facing the same situation, when user belong to a lot of groups, then line Member of spread out of window.

How to make something like word wrap for UDTable?

Hello @catinuk there is a good solution mentioned by @BoSen29 here:-

You could just apply this CSS to UDTable to overcome the issue in my opinion this should work.

Thank you, It worked and some how, it break line with some group name with dash (-)

1 Like

Just a guess, but isnt this because its treating your string all as one joined string, when it wraps the text, it has to split it to wrap onto the next line, therfore adding a - to indicate its part of the same string. Can you separate your groups with spaces, so that there is a natural break at which point it should wrap the text? not sure if this will work for you, but just an idea that i’d test if I had the same issue.

so instead of:
groupname1,groupname2,groupname3
you have:
groupname1, groupname2, groupname3

Awesome, you are genius, 1 space solved the issue.