Multiline Textbox

PowerShell Universal
1 
Product: PowerShell Universal
Version: 1.5.14

Hi gang!

I’d like to create a pretty large Textbox in order for a user to be able to enter a big chunk of text (3-4 lines). How can I do that?
I looked at the New-UDTextBox for a multiline parameter with no luck.

Thanks for your help.
Arnaud

2

Hey @apetitjean

New-UDTextbox has multiple.

$Pages += New-UDPage -Name 'Test' -Content {
    New-UDTextbox -Multiline
}

You can just press enter in the textbox to add a new line.

image

You can also use -Rows to specify the number of starting rows.

$Pages += New-UDPage -Name 'Test' -Content {
    New-UDTextbox -Multiline -Rows 5
}
3

Wow nice! Thanks @adam for your lighting fast reply!
I haven’t seen that in the doc.

Do you know if I could use another component that could resemble to a text editor?
Do you have any in stock ;-)?

4

If you want something a bit more full-featured, definitely check out the Code Editor component: Code Editor - PowerShell Universal

5

That’s awesome!

It’s like Apple, there’s always a component for that in PSU :star_struck:

6

I understood Code Editor component is the one of VSCode which is just awesome. :smiley:

Do you think it could be possible to do this with PSU?
Here my scenario :

  1. A user enters a multiline markdown string or multi markdown strings in Code Editor
  2. The user can see the render of his input just like in VSCode either by clicking a button or in realtime (like in VSCode when editing Markdown)

Thanks

7

Totally. Here’s an example.

New-UDDashboard -Title 'Title' -Content {
    New-UDRow -Columns {
        New-UDColumn -LargeSize 6 -Content {
            New-UDCodeEditor -Language markdown -Id 'code' -Height 400
            New-UDButton -Text 'Render' -OnClick {
                Sync-UDElement -Id 'output'
            }
        }
        New-UDColumn -LargeSize 6 -Content {
            New-UDDynamic -Id 'output' -Content {
                $Code = (Get-UDElement -Id 'code').code                
                New-UDHtml ($Code | ConvertFrom-Markdown).Html
            }           
        }
    }
}

image
image1202×531 9.6 KB

8

Many thanks Adam. This is exactly what I looked for!

9

Would it be possible to have a simple multiline textarea like in the screenshot below? See “Votre message” section.

Capture d’écran 2021-04-13 à 23.14.12
Capture d’écran 2021-04-13 à 23.14.12674×627 18.8 KB

10

We support the Material UI multiline text box: Text Field React component - Material-UI

https://docs.powershelluniversal.com/dashboard/components/inputs/textbox#multiline

It doesn’t quite have the formatting your are looking for but if you set the -Rows parameter it should look a little more like that. It does seem like we could add a variant parameter so you could get the outlined effect.

11

If you could add something that modifies slightly the presentation by boxing the components that could be nice.
See the screenshot below.Capture d’écran 2021-04-14 à 00.02.19

12

Cool. I’ve implemented this. You’ll be able to do this in 1.5.16 to achieve this effect.

New-UDTextbox -label "Label" -Multiline -Rows 5 -Variant outlined
13

Awesome, thanks Adam!