Widgets
Skeleton
Placeholder widget for loading states (text/rect/circle variants).
Placeholder widget for loading states (text/rect/circle variants).
Usage
import { ui } from "@rezi-ui/core";
ui.skeleton(20);
ui.skeleton(10, { height: 3, variant: "rect" });Props
| Prop | Type | Default | Description |
|---|---|---|---|
width | number | required | Width in cells |
height | number | 1 | Height in rows |
variant | "text" | "rect" | "circle" | "text" | Visual variant |
style | TextStyle | - | Optional style override |
key | string | - | Reconciliation key |
Examples
1) List skeleton
import { ui } from "@rezi-ui/core";
ui.column({ gap: 1 }, [ui.skeleton(24), ui.skeleton(18), ui.skeleton(20)]);2) Card skeleton
import { ui } from "@rezi-ui/core";
ui.box({ border: "rounded", p: 1 }, [
ui.skeleton(18, { variant: "text" }),
ui.skeleton(18, { height: 3, variant: "rect" }),
]);