コンポーネント
Table
レスポンシブなテーブルコンポーネントです。
| Invoice | Status | Method | Amount |
|---|---|---|---|
| INV001 | Paid | Credit Card | $250.00 |
| INV002 | Pending | PayPal | $150.00 |
| INV003 | Unpaid | Bank Transfer | $350.00 |
使い方
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@murasakijs/ui";<Table>
<TableHeader>
<TableRow>
<TableHead>Name</TableHead>
</TableRow>
</TableHeader>
<TableBody>
<TableRow>
<TableCell>Row 1</TableCell>
</TableRow>
</TableBody>
</Table>API リファレンス
サブコンポーネント
| コンポーネント | レンダリング内容 |
|---|---|
Table | <table>（横スクロール用に overflow-auto の <div> でラップ）です。 |
TableHeader | <thead> |
TableBody | <tbody> |
TableFooter | <tfoot> |
TableRow | <tr> |
TableHead | <th> |
TableCell | <td> |
TableCaption | <caption> |
各サブコンポーネントは、対応するネイティブの HTML テーブル要素の属性を拡張しています。