LoadingButton
ExperimentalKeep an action identifiable while an application-owned request is pending.
Example
The application controls loading. No request runs in this example.
Tab to explore focus and keyboard behavior.
example.tsx
'use client'; import 'panel-ui-kit/styles.css';import { PanelUiTheme } from 'panel-ui-kit/theme';import { LoadingButton } from 'panel-ui-kit/loading-button'; export function Example() { return ( <PanelUiTheme theme="neutral" motion={{"mode":"full","durationScale":1,"intensity":1}}> <LoadingButton isLoading={false}>Save preferences</LoadingButton> </PanelUiTheme> );}When to use
Use for a native async action. Loading blocks activation and preserves the label width. Do not use as a navigation link.
Keyboard
Tab, Enter and Space work while idle. Loading or disabled controls are skipped.
Properties
| Property | Values | Default |
|---|---|---|
isLoading | boolean | false |
disabled | boolean | false |
motion | full · reduced · off · object | Inherited |