AccordionOptions

icon

Element

title

enum

visible

ActiveBarOptions

activeTab

HTMLElement

listRef

MutableRefObject<undefined>

AlertOptions

closeButtonDataTestId

string

@description add a close button with an onclick handleClose function

handleClose

() => void

isFullWidth

size

variant

AspectRatioOptions

ratio

number

AvatarOptions

color

getInitials

(name: string) => string

name

ShapeOptions

shape

ListOptions

emojis

Emoji[]

emptyList

inputSearchPlaceholder

isVisible

onChange

(value: string) => void

value

ItemOptions

isActive

separator

ButtonOptions

disabled

ButtonGroupOptions

CoverOptions

CheckboxOptions

Component

checked

TypeLiteral

hasIcon

iconPlacement

indeterminate

isClearable

(event: ChangeEvent<HTMLInputElement>) => void

transparent

CustomHeaderOptions

endYear

CustomInputOptions

DatePickerOptions

onBlur

(event: FocusEvent<HTMLDivElement, Element>) => void

(date?: Date) => void

onFocus

placeholder

startYear

useWeekdaysShort

Enables basic storage and retrieval of dates and times.

TimePickerOptions

((date?: Date) => void) & ((date?: Date) => void)

DrawerOptions

placement

DrawerBackdropOptions

backdropVisible

hideOnClickOutside

DropdownMenuOptions

add custom props from styled system on DropdownMenu inner

innerProps

WuiProps

EmojiOptions

The slack emoji, e.g: :sweat-smile: or a URL

emoji

height

Needed for SSR, it defaults to true on the server

useAppleEmoji

width

EmojiPicketOptions

onSelect

(emoji: EmojiData) => void

Whether the tab selection should be manual.

manual

EmojiTabOptions

ButtonHTMLAttributes

panels

Item[]

Moves into and selects a tab by its `id`.

select

(id: string) => void

selectedId

FieldOptions

disabledIcon

error

hint

info

label

required

success

warning

FileDropOptions

Pass a comma-separated string of file types e.g. "image/png" or "image/png,image/jpeg"

accept

Accept

forceFileType

handleAddFile

(event: DropEvent | CreateEvent) => void

handleRemoveFile

isEditable

onError

((event?: string) => void) & ((err: Error) => void)

Pass an object with optional fields title, hint, fileButtonText and/or previewButtonText (string or JSX.Element)

wordings

WordingsType

FileUploadOptions

(files: FileWithPreviewType | FileWithPreviewType[]) => void

HandleRemoveType

maxSize

(event: { preventDefault: () => void; target: Record<string, unknown>; }) => void

preview

FC<PreviewProps>

FlexOptions

align

basis

direction

grow

justify

shrink

wrap

GridOptions

area

autoColumns

autoFlow

autoRows

column

columnGap

rowGap

templateAreas

templateColumns

templateRows

HintOptions

checkableField

InputTextOptions

autoFocus

(event: FocusEvent<HTMLInputElement, Element>) => void

onKeyDown

(event: KeyboardEvent<HTMLInputElement>) => void

type

LabelOptions

htmlFor

withDisabledIcon

LinkOptions

isExternal

UniversalLinkOptions

target

LoaderOptions

Predefined size xs, sm, md, lg or custom size

MarkdownEditorOptions

actions

ReactElement<any, string | JSXElementConstructor<any>>

minHeight

(event: MouseEvent<HTMLDivElement, MouseEvent> | CreateEvent) => void

toolbar

DefaultToolbar

FooterOptions

informations

{ title: string; subtitle: string; }

HeaderOptions

subtitle

PaginationOptions

aria-label

getHref

(page: string | number) => string

leftArrow

(page: string | number) => void

page

pageCount

rangeDisplay

rightArrow

FieldGroupOptions

PickerOptions

MouseEventHandler<HTMLLabelElement>

options

PickerOption[]

PopoverOptions

onClose

UsePopoverStateOptions

triggerMethod

withCloseButton

RadioGroupOptions

{ label: string | number; value: string | number; hint?: string; }[]

renderOption

RadioTabsOptions

Name	Type(s)	Default	Required
checkableField	Boolean
variant	"error" "info" "success" "warning"

Hint

Variants #

Properties #

Packages #

Dependencies #

Peer dependencies #