OOKNET                             [ /  search the index  ]  
──────────────────────────────────────────────────────────────────────────────────────
[ KB ]    [ GIT ]    [ PROJECTS ]    [ ABOUT ]                                      EN
══════════════════════════════════════════════════════════════════════════════════════
OOKNET   [ /  search  ]  
────────────────────────────────────────────────
[ KB ] [ GIT ] [ PROJECTS ] [ ABOUT ]
════════════════════════════════════════════════
 
 
master @ 20 LINES
 
[ HISTORY ]  [ UP ]
 

---
// Data-driven ASCII table: the frames are presentation, the sr-only
// table carries the semantics.
import Frame from "../Frame/Frame.astro";
import { buildAsciiTable, type Cell } from "../../lib/ascii-table";
import type { Props } from "./Table";

const { head, rows, align = [] } = Astro.props as Props;
const cell = (text: string, i: number): Cell => ({ text, align: align[i] ?? "end" 
});
const cells: Cell[][] = [
  ...(head ? [head.map(cell)] : []),
  ...rows.map((r) => r.map(cell)),
];
---
<div aria-hidden="true"><Frame class="table-frame" build={(w) => buildAsciiTable(c
ells, head ? 1 : 0, w)} /></div>
<table class="sr-only">
  {head && <thead><tr>{head.map((h) => <th>{h}</th>)}</tr></thead>}
  <tbody>{rows.map((r) => <tr>{r.map((c) => <td>{c}</td>)}</tr>)}</tbody>
</table>


---
// Data-driven ASCII table: the frames are p
resentation, the sr-only
// table carries the semantics.
import Frame from "../Frame/Frame.astro";
import { buildAsciiTable, type Cell } from "
../../lib/ascii-table";
import type { Props } from "./Table";

const { head, rows, align = [] } = Astro.pro
ps as Props;
const cell = (text: string, i: number): Cell
 => ({ text, align: align[i] ?? "end" });
const cells: Cell[][] = [
  ...(head ? [head.map(cell)] : []),
  ...rows.map((r) => r.map(cell)),
];
---
<div aria-hidden="true"><Frame class="table-
frame" build={(w) => buildAsciiTable(cells, 
head ? 1 : 0, w)} /></div>
<table class="sr-only">
  {head && <thead><tr>{head.map((h) => <th>{
h}</th>)}</tr></thead>}
  <tbody>{rows.map((r) => <tr>{r.map((c) => 
<td>{c}</td>)}</tr>)}</tbody>
</table>

 
──────────────────────────────────────────────────────────────────────────────────────
OOKNET
────────────────────────────────────────────────
OOKNET