Inputs@knitui/components
UnstyledButton
UnstyledButton is an accessible pressable base with no visual styling beyond a reset (transparent background, no border) plus interaction affordances (role="button", pointer cursor, focusVisible outline, a disabled variant). It is the building block for custom controls — use it whenever you need a semantic button without pre-applied styles.
import { UnstyledButton } from "@knitui/components";Playground
Loading playground…
<UnstyledButton
disabled={false}
>
Press me
</UnstyledButton>Examples
Shadows
The shadow elevation prop, inherited from Box, across all token levels.
Loading example…
Disabled
Disabled state — opacity is reduced and pointer events are turned off.
Loading example…
Custom Styled
Custom styled content — UnstyledButton intentionally carries no visual style so you bring your own.
Loading example…
With Icon
With an icon — since UnstyledButton is a Box, layout children freely.
Loading example…
Grouped
Multiple unstyled buttons in a row, demonstrating composition as a toolbar.
Loading example…
Press Counter
Controlled press counter — demonstrates that onPress fires and state updates correctly.
Loading example…
Props
| Prop | Type | Default | Description |
|---|---|---|---|
disabled system | boolean | undefined | false | Reduces opacity and disables pointer events. |
shadow system | "xs" | "sm" | "md" | "lg" | "xl" | "xxs" | "xxl" | undefined | — | |
theme system | ThemeName | null | undefined | — | Applies a theme to this element |
Accessibility & DOM props (2)
| Prop | Type |
|---|---|
key | Key | null | undefined |
ref | Ref<TamaguiElement> | undefined |
Plus 498 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.