ButtonClose
@stellaria/nebula-webButtonClosePropsPreview
Props
8| Prop | Type | Default |
|---|---|---|
aria-label | string | — |
color The scale the variant draws from. Name the scale and let the variant pick the steps out of it; pinning a step here is what breaks the hover and active states, which are derived from it. | ColorExtended | "gray" |
disabled Blocks the press and drops the hover and press animation with it. No need to pair it with `loading`, which already disables on its own. | boolean | — |
glass Overrides the glass step the variant's recipe asks for. It is ignored in three cases that are not errors: a variant whose recipe has no glass, a theme with `effects.glass.enabled` off, and a `color` that is not one of the theme's scales — a hex or a role path never takes glass. | GlassLevel | — |
gradient Read only by `variant="gradient"`, where it replaces the theme's pair. `deg` is 135 if you do not say otherwise, and `animate` needs this override to exist at all — it does nothing over the theme's own gradient. | { from: ColorExtended; to: ColorExtended; deg?: number; animate?: boolean; } | — |
loading Lays a spinner over the button, marks it `aria-busy` and disables it. The icon dims in place rather than being swapped out, so the button holds its square while the work runs. | boolean | — |
size The button's square, in both axes at once. It is the tap target, so anything below `md` on a touch surface has to be given room by its container instead. | Size | — |
variant The recipe the theme resolves background, border, glow and glass from, all at once. A row of icon buttons reads as one control strip only if they share it. | Variant | "ghost" |
Slot props
1Each one spreads over an inner element, so you can restyle a region without forking the component.
| Prop | Type | Default |
|---|---|---|
iconProps Wrapper for the icon. With `loading` it dims, which is how the button makes room for the spinner without changing size; the spinner itself has no slot, because it is the mechanism of the animation. | BoxSlotProps | — |
Also accepts
On top of its own props, this component forwards these groups.