1.1.29 • Published 9 months ago
@highlight-ui/sandbox-loading-state v1.1.29
@highlight-ui/sandbox-loading-state
Installation
yarn add @highlight-ui/sandbox-loading-state
Usage
In your TypeScript file:
import {
LoadingState,
LoadingStateProps,
} from '@highlight-ui/sandbox-loading-state';
In your (S)CSS file:
@import url('@highlight-ui/sandbox-loading-state');
Skeleton
In your TypeScript file:
import { LoadingState, LoadingStateProps } from '@highlight-ui/loading-state';
import { Skeleton } from '@highlight-ui/skeleton';
if (status === 'idle') {
return <LoadingState state="idle" />;
}
if (status === 'loading') {
return (
<LoadingState
state="loading"
indicator={<Skeleton repeat={3} />}
message="Loading some arbitrary data. Please wait."
/>
);
}
return (
<LoadingState
state="completed"
message="Arbitrary data has been loaded. This data is ready to use."
/>
);
Spinner
In your TypeScript file:
import { LoadingState, LoadingStateProps } from '@highlight-ui/loading-state';
import { Spinner } from '@highlight-ui/spinner';
if (status === 'idle') {
return <LoadingState state="idle" />;
}
if (status === 'loading') {
return (
<LoadingState
state="loading"
indicator={<Spinner />}
message="Loading some arbitrary data. Please wait."
/>
);
}
return (
<LoadingState
state="completed"
message="Arbitrary data has been loaded. This data is ready to use."
/>
);
Documentation
Please visit personio.design
1.1.29
9 months ago
1.1.28
9 months ago
1.1.19
10 months ago
1.1.18
10 months ago
1.1.17
10 months ago
1.1.23
10 months ago
1.1.22
10 months ago
1.1.21
10 months ago
1.1.20
10 months ago
1.1.27
9 months ago
1.1.26
10 months ago
1.1.25
10 months ago
1.1.24
10 months ago
1.1.16
11 months ago
1.1.15
1 year ago
1.1.14
1 year ago
1.1.12
1 year ago
1.1.11
1 year ago
1.1.10
1 year ago
1.1.13
1 year ago
1.1.9
1 year ago
1.1.8
1 year ago
1.1.7
1 year ago
1.1.6
1 year ago
1.1.5
1 year ago
1.1.4
1 year ago
1.1.3
1 year ago
1.1.2
1 year ago
1.1.1
1 year ago
1.1.0
1 year ago