表格 Table

<div class="xxd-table-wrap" style="max-width:560px">
<table class="xxd-table" data-interactive>
  <thead><tr>
    <th class="xxd-table__check"><input type="checkbox" class="xxd-check" data-select-all aria-label="全选"></th>
    <th aria-sort="ascending" data-key="name" data-sticky="start"><button class="xxd-th-sort">插件</button><span class="xxd-th-resize"></span></th>
    <th>版本</th>
    <th aria-sort="none" data-key="users" data-align="end"><button class="xxd-th-sort">用户</button></th>
    <th class="xxd-table__actions"><span class="xxd-sr-only">操作</span></th>
  </tr></thead>
  <tbody>
    <tr><td class="xxd-table__check"><input type="checkbox" class="xxd-check" data-select-row aria-label="选择 长文发布"></td><td data-sticky="start">长文发布</td><td>1.8.2</td><td data-align="end">2,410</td><td class="xxd-table__actions"><button class="xxd-btn xxd-reveal" data-variant="ghost" data-size="xs">编辑</button></td></tr>
    <tr><td class="xxd-table__check"><input type="checkbox" class="xxd-check" data-select-row checked aria-label="选择 排序链接"></td><td data-sticky="start">排序链接</td><td>0.9.0</td><td data-align="end">830</td><td class="xxd-table__actions"><button class="xxd-btn xxd-reveal" data-variant="ghost" data-size="xs">编辑</button></td></tr>
    <tr><td class="xxd-table__check"><input type="checkbox" class="xxd-check" data-select-row aria-label="选择 批量存图"></td><td data-sticky="start">批量存图</td><td>2.1.0</td><td data-align="end">5,102</td><td class="xxd-table__actions"><button class="xxd-btn xxd-reveal" data-variant="ghost" data-size="xs">编辑</button></td></tr>
  </tbody>
  <tfoot><tr><td></td><td colspan="2">3 个插件</td><td data-align="end">8,342</td><td></td></tr></tfoot>
</table></div>

export function TableDemo() {
  return (
    <Table>
      <Table.Header>
        <Table.Row>
          <Table.Head>插件</Table.Head>
          <Table.Head>用户</Table.Head>
        </Table.Row>
      </Table.Header>
      <Table.Body>
        <Table.Row>
          <Table.Cell>长文发布</Table.Cell>
          <Table.Cell>2,410</Table.Cell>
        </Table.Row>
        <Table.Row>
          <Table.Cell>批量存图</Table.Cell>
          <Table.Cell>5,102</Table.Cell>
        </Table.Row>
      </Table.Body>
    </Table>
  );
}