New-UDChip

Sinopsis

Los chips son elementos compactos que representan una entrada, un atributo o una acción.

Sintaxis

New-UDChip [-Id <String>] [[-Label] <String>] [[-OnDelete] <Endpoint>] [[-OnClick] <Endpoint>] [[-Icon] <Object>] [[-Style] <Hashtable>] [[-Variant] <String>] [[-Size] <String>] [-ClassName <String>] [-Color <String>] [<CommonParameters>]

New-UDChip [-Id <String>] [[-Label] <String>] [[-OnDelete] <Endpoint>] [[-OnClick] <Endpoint>] [[-Style] <Hashtable>] [[-Variant] <String>] [[-Avatar] <String>] [[-AvatarType] <String>] [[-Size] <String>] [-ClassName <String>] [-Color <String>] [<CommonParameters>]

Descripción

Los chips son elementos compactos que representan una entrada, un atributo o una acción.

Parámetros

-Id

El ID del componente. De forma predeterminada, es un GUID aleatorio.

Required?                    false
Position?                    named
Default value                ([Guid]::NewGuid()).ToString()
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Label

La etiqueta del chip.

Required?                    false
Position?                    1
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-OnDelete

Un bloque de script que se llama cuando se elimina el chip.

Required?                    false
Position?                    9
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-OnClick

Un bloque de script que se llama cuando se hace clic en el chip.

Required?                    false
Position?                    8
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Icon

Un icono que se muestra dentro del chip.

Required?                    false
Position?                    2
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Style

Estilos CSS que se aplican al chip.

Required?                    false
Position?                    3
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Variant

La variante de tema que se aplica al chip.

Required?                    false
Position?                    4
Default value                default
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Avatar

Un avatar que se muestra dentro del chip.

Required?                    false
Position?                    5
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-AvatarType

El tipo de avatar que se muestra en el chip.

Required?                    false
Position?                    6
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Size

El tamaño del chip. Los valores válidos son: "small", "medium"

Required?                    false
Position?                    10
Default value                medium
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-ClassName

Una clase CSS que se aplica al chip.

Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

-Color

El color del chip. De forma predeterminada, es 'default'. Valores válidos: "default", "primary", "secondary"

Required?                    false
Position?                    named
Default value                default
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false

Parámetros comunes

Este cmdlet admite los parámetros comunes: Verbose, Debug, ErrorAction, ErrorVariable, WarningAction, WarningVariable, OutBuffer, PipelineVariable y OutVariable. Para obtener más información, consulte about_CommonParameters.

Salidas

Ejemplos

Ejemplo 1: chip básico

New-UDChip -Label 'Basic' -Icon (New-UDIcon -Icon 'user') -Id 'chip1'

Un chip básico con un icono.

Ejemplo 2: chip con contorno

New-UDChip -Variant outlined -Label 'Outlined' -Icon (New-UDIcon -Icon 'user') -Id 'chip2'

Un chip con contorno y un icono.

Ejemplo 3: chip en el que se puede hacer clic

New-UDChip -Label 'Clickable' -Icon (New-UDIcon -Icon 'user') -OnClick {
   Show-UDToast -Message 'Hello!'
} -Id 'chip3'

Un chip con un icono en el que se puede hacer clic.

Ejemplo 4: chip que se puede eliminar

New-UDChip -Label 'Deletable' -Icon (New-UDIcon -Icon 'user') -OnDelete {
   Show-UDToast -Message 'Deleted!'
} -Id 'chip4'

Un chip con un icono que se puede eliminar.

Ejemplo 5: chip en el que se puede hacer clic y que se puede eliminar

New-UDChip -Label 'Clickable and deletable' -Icon (New-UDIcon -Icon 'user') -OnClick {
   Show-UDToast -Message 'Hello!'
} -OnDelete {
   Show-UDToast -Message 'Deleted!'
} -Id 'chip5'

Un chip con un icono en el que se puede hacer clic y que se puede eliminar.

Ejemplo 6: chip con avatar

New-UDChip -Avatar "A" -AvatarType letter -Label 'Avatar' -Id 'chip6'

Un chip con un avatar.

Ejemplo 7: chip con imagen

New-UDChip -Avatar "https://picsum.photos/200/300" -AvatarType image -Label 'Avatar' -Id 'chip7'

Un chip con una imagen de avatar.

Ejemplo 8: chip pequeño

New-UDChip -Label 'Small' -Icon (New-UDIcon -Icon 'user') -Size small -Id 'chip8'

Un chip pequeño con un icono.

Ejemplo 9

New-UDChip -Style @{background = 'red'; color = 'white'} -Label 'Styled' -Icon (New-UDIcon -Icon 'user') -Id 'chip9'