Data Display@knitui/components
TreeSelect
TreeSelect renders a hierarchical tree of nodes inside a Combobox dropdown. Clicking a leaf selects it and closes the dropdown; clicking a branch toggles expansion. Supports uncontrolled and controlled modes, optional search filtering, and a clear button.
import { TreeSelect } from "@knitui/components";Playground
Loading playground…
<TreeSelect
data={[{ value: "fruit", label: "Fruit", children: [{ value: "apple", label: "Apple" }, { value: "banana", label: "Banana" }, { value: "citrus", label: "Citrus", children: [{ value: "lemon", label: "Lemon" }, { value: "orange", label: "Orange" }] }] }, { value: "vegetables", label: "Vegetables", children: [{ value: "carrot", label: "Carrot" }, { value: "broccoli", label: "Broccoli" }] }, { value: "dairy", label: "Dairy" }]}
placeholder="Pick a food…"
size="sm"
clearable={false}
searchable={false}
disabled={false}
allowDeselect
expandOnClick
withScrollArea
maxDropdownHeight={250}
/>Examples
Sizes
All seven sizes rendered side by side for quick visual comparison.
Loading example…
Shadows
The shadow elevation prop, inherited from Box, across all token levels.
Loading example…
Theme
Accent follows the Tamagui theme prop, not a Mantine-style color prop.
Loading example…
Disabled
Disabled state — the input is inert and the dropdown cannot be opened.
Loading example…
Read Only
Read-only — the selected value is visible but locked; the dropdown does not open.
Loading example…
Default Value
Pre-selected value supplied via defaultValue (uncontrolled).
Loading example…
Searchable
Typing in the input filters the tree to matching nodes only.
Loading example…
Clearable
Shows a clear button next to the chevron when a value is selected.
Loading example…
Deep Tree
A deep tree — three levels of nesting — shows nested expand/collapse.
Loading example…
Controlled
Fully controlled selection — selection state is owned by the parent.
Loading example…
No Deselect
allowDeselect={false} — pressing an already-selected node does not clear it.
Loading example…
Styles
Per-slot styles targets individual parts — here the trigger and chevron.
Loading example…
Props
| Prop | Type | Default | Description |
|---|---|---|---|
data required | TreeNodeData[] | — | Hierarchical data rendered in the dropdown. |
allowDeselect | boolean | undefined | true | Allow deselecting by pressing the already-selected node again. |
autoCapitalize | "none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters" | undefined | — | |
autoComplete | string | undefined | — | |
autoCorrect | string | boolean | undefined | — | |
autoFocus | boolean | undefined | — | |
autosize | boolean | undefined | false | Grows with content on web (scrollHeight-based); tracks onContentSizeChange on native. |
children | ReactNode | — | Rendered inside the host element. Only meaningful for the `button` host (e.g. FileInput's trigger displays the picked file name); ignored for the native `input`/`textarea`/`select` hosts. |
clearable | boolean | undefined | false | Show a clear button when a value is selected. |
clearButtonProps | Partial<ComboboxClearButtonProps> | undefined | — | Props forwarded to the internal clear `Combobox.ClearButton`. |
clearSectionMode | "default" | "clear" | "rightSection" | "both" | undefined | 'both' | How the clear button and right section coexist. |
comboboxProps | Partial<ComboboxProps> | undefined | — | Props forwarded to the underlying `Combobox`. |
component | InputHostTag | undefined | — | Override the host element tag (defaults to `input`/`textarea`). |
cursorColor | "unset" | ColorTokens | undefined | — | |
defaultDropdownOpened | boolean | undefined | — | Uncontrolled initial dropdown opened state. |
defaultSearchValue | string | undefined | — | Uncontrolled initial search value. |
defaultValue | string | null | undefined | — | Uncontrolled initial value. |
description | ReactNode | — | |
descriptionProps | GetFinalProps<RNTamaguiTextNonStyleProps, TextStylePropsBase, { span?: boolean | undefined; size?: string | number | undefined; inherit?: boolean | undefined; lineClamp?: number | undefined; truncate?: boolean | "end" | "start" | undefined;… | — | |
disabled system | boolean | undefined | false | |
dropdownOpened | boolean | undefined | — | Controlled dropdown opened state. |
enterKeyHint | "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined | — | |
error | ReactNode | — | |
errorProps | GetFinalProps<RNTamaguiTextNonStyleProps, TextStylePropsBase, { span?: boolean | undefined; size?: string | number | undefined; inherit?: boolean | undefined; lineClamp?: number | undefined; truncate?: boolean | "end" | "start" | undefined;… | — | |
expandOnClick | boolean | undefined | true | Expand a node with children when its row is pressed. |
id | string | undefined | — | Same as the web id property for setting a uid on an element |
inputContainer | ((children: ReactNode) => ReactNode) | undefined | — | |
inputSize | string | undefined | — | Host size attribute for the input element |
inputWrapperOrder | InputWrapperOrderItem[] | undefined | — | |
label | ReactNode | — | |
labelElement | "div" | "label" | undefined | — | |
labelProps | InputLabelProps | undefined | — | |
leftSection | ReactNode | — | Content section displayed on the left side of the input |
leftSectionPointerEvents | InputSectionPointerEvents | undefined | "none" | Sets pointer-events styles on the left section element |
leftSectionProps | Partial<GetFinalProps<RNTamaguiViewNonStyleProps, StackStyleBase, { shadow?: "xs" | "sm" | "md" | "lg" | "xl" | "xxs" | "xxl" | undefined; sectionPointerEvents?: "none" | "all" | undefined; }>> | undefined | — | Props passed down to the left section element |
leftSectionWidth | number | Animated.AnimatedNode | GetThemeValueForKey<"width"> | null | undefined | — | Left section width, by default equals to the input height |
loading | boolean | undefined | — | Displays loading indicator in the left or right section |
loadingPosition | "left" | "right" | undefined | "right" | Position of the loading indicator |
max | string | number | undefined | — | |
maxDropdownHeight | number | undefined | 250 | Max dropdown height in px before scrolling. |
maxLength | number | undefined | — | |
maxRows | number | undefined | — | Maximum number of rows before scrolling (web). Caps height on native when autosize is on. |
min | string | number | undefined | — | |
minLength | number | undefined | — | |
minRows | number | undefined | — | Minimum number of rows. Sets initial/minimum height on web; maps to numberOfLines on native. |
multiline | boolean | undefined | — | Adjusts padding and sizing calculations for multiline inputs |
multiple | boolean | undefined | — | |
name | string | undefined | — | |
nothingFoundMessage | ReactNode | — | Message shown when no node matches the search. |
onChange | ((value: string | null, node: TreeNodeData | null) => void) | undefined | — | Called with the next value and its node (or `null`). |
onChangeText | ((text: string) => void) | undefined | — | Fires on every change with just the string value. |
onClear | (() => void) | undefined | — | Called when the clear button is pressed. |
onDropdownClose | (() => void) | undefined | — | Called when the dropdown closes. |
onDropdownOpen | (() => void) | undefined | — | Called when the dropdown opens. |
onSearchChange | ((value: string) => void) | undefined | — | Called when the search value changes. |
onSelectionChange | ((event: InputSelectionChangePayload) => void) | undefined | — | Fires when the text selection changes. |
onSubmitEditing | ((event: InputTextEventPayload) => void) | undefined | — | Fires when Enter/Return is pressed. |
pattern | string | undefined | — | |
placeholder | string | undefined | Pick a food… | |
placeholderTextColor | "unset" | ColorTokens | undefined | — | |
pointer | boolean | undefined | — | Determines whether the input should have cursor: pointer style |
radius system | string | number | undefined | — | Key of theme radius or a valid CSS value to set border-radius |
readOnly | boolean | undefined | — | |
required | boolean | undefined | — | |
rightSection | ReactNode | — | Content section displayed on the right side of the input |
rightSectionPointerEvents | InputSectionPointerEvents | undefined | "none" | Sets pointer-events styles on the right section element |
rightSectionProps | Partial<GetFinalProps<RNTamaguiViewNonStyleProps, StackStyleBase, { shadow?: "xs" | "sm" | "md" | "lg" | "xl" | "xxs" | "xxl" | undefined; sectionPointerEvents?: "none" | "all" | undefined; }>> | undefined | — | Props passed down to the right section element |
rightSectionWidth | number | Animated.AnimatedNode | GetThemeValueForKey<"width"> | null | undefined | — | Right section width, by default equals to the input height |
rootRef | Ref<TamaguiElement> | undefined | — | Root element ref |
rows | number | undefined | — | Rows for textarea (when render="textarea") |
searchable | boolean | undefined | false | Allow filtering nodes by typing. |
searchValue | string | undefined | — | Controlled search value. |
selection | { start: number; end?: number; } | undefined | — | Selection range |
selectionColor | "unset" | ColorTokens | undefined | — | |
selectionHandleColor | "unset" | ColorTokens | undefined | — | |
shadow system | "xs" | "sm" | "md" | "lg" | "xl" | "xxs" | "xxl" | undefined | — | |
size system | "xs" | "sm" | "md" | "lg" | "xl" | "xxs" | "xxl" | undefinedxxs · xs · sm · md · lg · xl · xxl | 'md' | Control size — matches InputBase / Combobox size tokens. |
spellCheck | boolean | undefined | — | Controls spell checking. |
step | string | number | undefined | — | |
styles system | SlotStyles<TreeSelectStyles> | undefined | — | Per-slot style sugar — props spread onto the matching part. |
textContentType | InputTextContentType | undefined | — | Text content type for iOS autofill. Use `autoComplete` where available. |
theme system | ThemeName | null | undefined | — | Applies a theme to this element |
tree | TreeController | undefined | — | External tree controller from `useTree`; created internally when omitted. |
type | string | undefined | — | |
underlineColorAndroid | "unset" | ColorTokens | undefined | — | |
value | string | null | undefined | — | Controlled selected node value. |
variant system | InputVariant | undefined | "default" | Visual variant |
withAria | boolean | undefined | true | Determines whether accessibility attributes should be added |
withAsterisk | boolean | undefined | — | |
withScrollArea | boolean | undefined | true | Wrap the dropdown tree in a `ScrollArea.Autosize`. |
wrapperProps | ({ readonly br?: number | "$xs" | "$sm" | "$md" | "$lg" | "$xl" | "unset" | "$0" | "$true" | "$xxs" | "$xxl" | Variable<any> | `${number}rem` | UnionableNumber | "inherit" | `var(${string})` | Animated.AnimatedNode | null | undefined; label… | — | Props passed down to the root element (`Input.Wrapper` component) |
Style slots
Every part of TreeSelect can be styled through the styles prop. Explicit props on the component always win over slot styles.
| Slot | Usage |
|---|---|
chevron | styles={{ chevron: { … } }} |
clearButton | styles={{ clearButton: { … } }} |
dropdown | styles={{ dropdown: { … } }} |
empty | styles={{ empty: { … } }} |
node | styles={{ node: { … } }} |
nodeChevron | styles={{ nodeChevron: { … } }} |
nodeLabel | styles={{ nodeLabel: { … } }} |
root | styles={{ root: { … } }} |
tree | styles={{ tree: { … } }} |
trigger | styles={{ trigger: { … } }} |
Accessibility & DOM props (218)
| Prop | Type |
|---|---|
about | string | undefined |
accept | string | undefined |
accessKey | string | undefined |
alt | string | undefined |
aria-activedescendant | string | undefined |
aria-atomic | (boolean | "true" | "false") | undefined |
aria-autocomplete | "none" | "inline" | "list" | "both" | undefined |
aria-braillelabel | string | undefined |
aria-brailleroledescription | string | undefined |
aria-colcount | number | undefined |
aria-colindex | number | undefined |
aria-colindextext | string | undefined |
aria-colspan | number | undefined |
aria-controls | string | undefined |
aria-current | boolean | "time" | "true" | "false" | "page" | "step" | "location" | "date" | undefined |
aria-describedby | string | undefined |
aria-description | string | undefined |
aria-details | string | undefined |
aria-dropeffect | "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined |
aria-errormessage | string | undefined |
aria-flowto | string | undefined |
aria-grabbed | (boolean | "true" | "false") | undefined |
aria-haspopup | boolean | "dialog" | "menu" | "true" | "false" | "grid" | "tree" | "listbox" | undefined |
aria-invalid | boolean | "true" | "false" | "grammar" | "spelling" | undefined |
aria-keyshortcuts | string | undefined |
aria-level | number | undefined |
aria-multiline | (boolean | "true" | "false") | undefined |
aria-multiselectable | (boolean | "true" | "false") | undefined |
aria-orientation | "horizontal" | "vertical" | undefined |
aria-owns | string | undefined |
aria-placeholder | string | undefined |
aria-posinset | number | undefined |
aria-pressed | boolean | "true" | "false" | "mixed" | undefined |
aria-readonly | (boolean | "true" | "false") | undefined |
aria-relevant | "all" | "text" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined |
aria-required | (boolean | "true" | "false") | undefined |
aria-roledescription | string | undefined |
aria-rowcount | number | undefined |
aria-rowindex | number | undefined |
aria-rowindextext | string | undefined |
aria-rowspan | number | undefined |
aria-setsize | number | undefined |
aria-sort | "none" | "ascending" | "descending" | "other" | undefined |
autoSave | string | undefined |
capture | boolean | "user" | "environment" | undefined |
checked | boolean | undefined |
contentEditable | "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined |
contextMenu | string | undefined |
datatype | string | undefined |
defaultChecked | boolean | undefined |
dir | string | undefined |
draggable | (boolean | "true" | "false") | undefined |
exportparts | string | undefined |
form | string | undefined |
formAction | string | ((formData: FormData) => void | Promise<void>) | undefined |
formEncType | string | undefined |
formMethod | string | undefined |
formNoValidate | boolean | undefined |
formTarget | string | undefined |
hidden | boolean | undefined |
inert | boolean | undefined |
inlist | any |
inputMode | "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined |
is | string | undefined |
itemID | string | undefined |
itemProp | string | undefined |
itemRef | string | undefined |
itemScope | boolean | undefined |
itemType | string | undefined |
key | Key | null | undefined |
lang | string | undefined |
list | string | undefined |
nonce | string | undefined |
onAbort | ReactEventHandler<HTMLInputElement> | undefined |
onAbortCapture | ReactEventHandler<HTMLInputElement> | undefined |
onAnimationEnd | AnimationEventHandler<HTMLInputElement> | undefined |
onAnimationEndCapture | AnimationEventHandler<HTMLInputElement> | undefined |
onAnimationIteration | AnimationEventHandler<HTMLInputElement> | undefined |
onAnimationIterationCapture | AnimationEventHandler<HTMLInputElement> | undefined |
onAnimationStart | AnimationEventHandler<HTMLInputElement> | undefined |
onAnimationStartCapture | AnimationEventHandler<HTMLInputElement> | undefined |
onAuxClick | MouseEventHandler<HTMLInputElement> | undefined |
onAuxClickCapture | MouseEventHandler<HTMLInputElement> | undefined |
onBeforeInputCapture | InputEventHandler<HTMLInputElement> | undefined |
onBeforeToggle | ToggleEventHandler<HTMLInputElement> | undefined |
onBlurCapture | FocusEventHandler<HTMLInputElement> | undefined |
onCanPlay | ReactEventHandler<HTMLInputElement> | undefined |
onCanPlayCapture | ReactEventHandler<HTMLInputElement> | undefined |
onCanPlayThrough | ReactEventHandler<HTMLInputElement> | undefined |
onCanPlayThroughCapture | ReactEventHandler<HTMLInputElement> | undefined |
onChangeCapture | ChangeEventHandler<HTMLInputElement, Element> | undefined |
onClickCapture | MouseEventHandler<HTMLInputElement> | undefined |
onCompositionEnd | CompositionEventHandler<HTMLInputElement> | undefined |
onCompositionEndCapture | CompositionEventHandler<HTMLInputElement> | undefined |
onCompositionStart | CompositionEventHandler<HTMLInputElement> | undefined |
onCompositionStartCapture | CompositionEventHandler<HTMLInputElement> | undefined |
onCompositionUpdate | CompositionEventHandler<HTMLInputElement> | undefined |
onCompositionUpdateCapture | CompositionEventHandler<HTMLInputElement> | undefined |
onContextMenuCapture | MouseEventHandler<HTMLInputElement> | undefined |
onCopyCapture | ClipboardEventHandler<HTMLInputElement> | undefined |
onCutCapture | ClipboardEventHandler<HTMLInputElement> | undefined |
onDoubleClickCapture | MouseEventHandler<HTMLInputElement> | undefined |
onDragCapture | DragEventHandler<HTMLInputElement> | undefined |
onDragEndCapture | DragEventHandler<HTMLInputElement> | undefined |
onDragEnterCapture | DragEventHandler<HTMLInputElement> | undefined |
onDragExit | DragEventHandler<HTMLInputElement> | undefined |
onDragExitCapture | DragEventHandler<HTMLInputElement> | undefined |
onDragLeaveCapture | DragEventHandler<HTMLInputElement> | undefined |
onDragOverCapture | DragEventHandler<HTMLInputElement> | undefined |
onDragStartCapture | DragEventHandler<HTMLInputElement> | undefined |
onDropCapture | DragEventHandler<HTMLInputElement> | undefined |
onDurationChange | ReactEventHandler<HTMLInputElement> | undefined |
onDurationChangeCapture | ReactEventHandler<HTMLInputElement> | undefined |
onEmptied | ReactEventHandler<HTMLInputElement> | undefined |
onEmptiedCapture | ReactEventHandler<HTMLInputElement> | undefined |
onEncrypted | ReactEventHandler<HTMLInputElement> | undefined |
onEncryptedCapture | ReactEventHandler<HTMLInputElement> | undefined |
onEnded | ReactEventHandler<HTMLInputElement> | undefined |
onEndedCapture | ReactEventHandler<HTMLInputElement> | undefined |
onError | ReactEventHandler<HTMLInputElement> | undefined |
onErrorCapture | ReactEventHandler<HTMLInputElement> | undefined |
onFocusCapture | FocusEventHandler<HTMLInputElement> | undefined |
onGotPointerCapture | PointerEventHandler<HTMLInputElement> | undefined |
onGotPointerCaptureCapture | PointerEventHandler<HTMLInputElement> | undefined |
onInputCapture | InputEventHandler<HTMLInputElement> | undefined |
onInvalid | ReactEventHandler<HTMLInputElement> | undefined |
onInvalidCapture | ReactEventHandler<HTMLInputElement> | undefined |
onKeyDownCapture | KeyboardEventHandler<HTMLInputElement> | undefined |
onKeyPress | KeyboardEventHandler<HTMLInputElement> | undefined |
onKeyPressCapture | KeyboardEventHandler<HTMLInputElement> | undefined |
onKeyUpCapture | KeyboardEventHandler<HTMLInputElement> | undefined |
onLoad | ReactEventHandler<HTMLInputElement> | undefined |
onLoadCapture | ReactEventHandler<HTMLInputElement> | undefined |
onLoadedData | ReactEventHandler<HTMLInputElement> | undefined |
onLoadedDataCapture | ReactEventHandler<HTMLInputElement> | undefined |
onLoadedMetadata | ReactEventHandler<HTMLInputElement> | undefined |
onLoadedMetadataCapture | ReactEventHandler<HTMLInputElement> | undefined |
onLoadStart | ReactEventHandler<HTMLInputElement> | undefined |
onLoadStartCapture | ReactEventHandler<HTMLInputElement> | undefined |
onLostPointerCapture | PointerEventHandler<HTMLInputElement> | undefined |
onLostPointerCaptureCapture | PointerEventHandler<HTMLInputElement> | undefined |
onMouseDownCapture | MouseEventHandler<HTMLInputElement> | undefined |
onMouseMoveCapture | MouseEventHandler<HTMLInputElement> | undefined |
onMouseOutCapture | MouseEventHandler<HTMLInputElement> | undefined |
onMouseOverCapture | MouseEventHandler<HTMLInputElement> | undefined |
onMouseUpCapture | MouseEventHandler<HTMLInputElement> | undefined |
onPasteCapture | ClipboardEventHandler<HTMLInputElement> | undefined |
onPause | ReactEventHandler<HTMLInputElement> | undefined |
onPauseCapture | ReactEventHandler<HTMLInputElement> | undefined |
onPlay | ReactEventHandler<HTMLInputElement> | undefined |
onPlayCapture | ReactEventHandler<HTMLInputElement> | undefined |
onPlaying | ReactEventHandler<HTMLInputElement> | undefined |
onPlayingCapture | ReactEventHandler<HTMLInputElement> | undefined |
onPointerOut | PointerEventHandler<HTMLInputElement> | undefined |
onPointerOutCapture | PointerEventHandler<HTMLInputElement> | undefined |
onPointerOver | PointerEventHandler<HTMLInputElement> | undefined |
onPointerOverCapture | PointerEventHandler<HTMLInputElement> | undefined |
onProgress | ReactEventHandler<HTMLInputElement> | undefined |
onProgressCapture | ReactEventHandler<HTMLInputElement> | undefined |
onRateChange | ReactEventHandler<HTMLInputElement> | undefined |
onRateChangeCapture | ReactEventHandler<HTMLInputElement> | undefined |
onReset | ReactEventHandler<HTMLInputElement> | undefined |
onResetCapture | ReactEventHandler<HTMLInputElement> | undefined |
onScrollCapture | UIEventHandler<HTMLInputElement> | undefined |
onScrollEnd | UIEventHandler<HTMLInputElement> | undefined |
onScrollEndCapture | UIEventHandler<HTMLInputElement> | undefined |
onSeeked | ReactEventHandler<HTMLInputElement> | undefined |
onSeekedCapture | ReactEventHandler<HTMLInputElement> | undefined |
onSeeking | ReactEventHandler<HTMLInputElement> | undefined |
onSeekingCapture | ReactEventHandler<HTMLInputElement> | undefined |
onSelect | ReactEventHandler<HTMLInputElement> | undefined |
onSelectCapture | ReactEventHandler<HTMLInputElement> | undefined |
onStalled | ReactEventHandler<HTMLInputElement> | undefined |
onStalledCapture | ReactEventHandler<HTMLInputElement> | undefined |
onSubmit | SubmitEventHandler<HTMLInputElement> | undefined |
onSubmitCapture | SubmitEventHandler<HTMLInputElement> | undefined |
onSuspend | ReactEventHandler<HTMLInputElement> | undefined |
onSuspendCapture | ReactEventHandler<HTMLInputElement> | undefined |
onTimeUpdate | ReactEventHandler<HTMLInputElement> | undefined |
onTimeUpdateCapture | ReactEventHandler<HTMLInputElement> | undefined |
onToggle | ToggleEventHandler<HTMLInputElement> | undefined |
onTouchCancelCapture | TouchEventHandler<HTMLInputElement> | undefined |
onTouchMoveCapture | TouchEventHandler<HTMLInputElement> | undefined |
onTouchStartCapture | TouchEventHandler<HTMLInputElement> | undefined |
onTransitionCancel | TransitionEventHandler<HTMLInputElement> | undefined |
onTransitionCancelCapture | TransitionEventHandler<HTMLInputElement> | undefined |
onTransitionEnd | TransitionEventHandler<HTMLInputElement> | undefined |
onTransitionEndCapture | TransitionEventHandler<HTMLInputElement> | undefined |
onTransitionRun | TransitionEventHandler<HTMLInputElement> | undefined |
onTransitionRunCapture | TransitionEventHandler<HTMLInputElement> | undefined |
onTransitionStart | TransitionEventHandler<HTMLInputElement> | undefined |
onTransitionStartCapture | TransitionEventHandler<HTMLInputElement> | undefined |
onVolumeChange | ReactEventHandler<HTMLInputElement> | undefined |
onVolumeChangeCapture | ReactEventHandler<HTMLInputElement> | undefined |
onWaiting | ReactEventHandler<HTMLInputElement> | undefined |
onWaitingCapture | ReactEventHandler<HTMLInputElement> | undefined |
onWheelCapture | WheelEventHandler<HTMLInputElement> | undefined |
part | string | undefined |
popover | "" | "auto" | "manual" | "hint" | undefined |
popoverTarget | string | undefined |
popoverTargetAction | "hide" | "show" | "toggle" | undefined |
prefix | string | undefined |
property | string | undefined |
radioGroup | string | undefined |
ref | Ref<TamaguiElement> | undefined |
resource | string | undefined |
results | number | undefined |
rev | string | undefined |
security | string | undefined |
slot | string | undefined |
src | string | undefined |
suppressContentEditableWarning | boolean | undefined |
suppressHydrationWarning | boolean | undefined |
title | string | undefined |
translate | "yes" | "no" | undefined |
typeof | string | undefined |
unselectable | "off" | "on" | undefined |
vocab | string | undefined |
Plus 522 inherited style props from Box — the full Tamagui/React Native style surface, including token shorthands like p, mx, bg and c. See Tokens for the scales they accept, or the full list.