AccordionOptions

icon

Element

open

enum

title

@deprecated will be replace by open on ariakit (reakit v2)

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

state

DialogOptions

DrawerBackdropOptions

backdropVisible

hideOnClickOutside

RoleOptions & Pick<Partial<DisclosureStateReturn>, "baseId" | "visible" | "animated" | "animating" | "stopAnimation"> & Pick<...> & HTMLAttributes<...> & RefAttributes<...> & { ...; }

DropdownMenuOptions

add custom props from styled system on DropdownMenu inner

innerProps

WuiProps

Omit<PopoverOptions, "hideOnEsc"> & Pick<MenuStateReturn, "placement"> & RoleOptions & { disabled?: boolean; focusable?: boolean; } & ... 4 more ... & { ...; }

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

EmojiTabOptions

ButtonHTMLAttributes

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

baseId

getHref

(page: string | number) => string

leftArrow

(page: string | number) => void

page

pageCount

rangeDisplay

rightArrow

FieldGroupOptions

PickerOptions

MouseEventHandler<HTMLLabelElement>

options

PickerOption[]

PopoverOptions

onClose

UsePopoverStateReturn

RadioGroupOptions

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

renderOption

RadioTabsOptions

(event: MouseEvent<HTMLLabelElement, MouseEvent>) => void

onClick

SearchOptions

groupsEnabled

Name	Type(s)	Default	Required
src	string
shape	"circle" "square"

Card

Basic #

Other examples #

Properties #

Card #

Card.Cover #

Packages #

Dependencies #

Peer dependencies #