@hideyukimori/nene2-ui 0.17.0 → 0.17.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/data/DataTable.d.ts
CHANGED
|
@@ -29,9 +29,17 @@ export interface DataTableProps<Row> {
|
|
|
29
29
|
* `max-sm:` prefix, so a wide viewport is untouched.
|
|
30
30
|
*
|
|
31
31
|
* ⚠️ The visual header row is hidden (`sr-only`), not removed: the `<th scope="col">` stay
|
|
32
|
-
* in the document, so assistive tech still pairs a cell with its column.
|
|
33
|
-
*
|
|
34
|
-
*
|
|
32
|
+
* in the document, so assistive tech still pairs a cell with its column.
|
|
33
|
+
*
|
|
34
|
+
* 🔴 The `::before` label is drawn with the alternative-text form of `content`
|
|
35
|
+
* (`attr(data-label) / ""`) so that it stays out of the cell's accessible name. Without
|
|
36
|
+
* the `/ ""` the generated text *is* part of the name: every cell is read as "Name x"
|
|
37
|
+
* while the hidden `<th>` still supplies "Name" — the header twice (#439, vault's
|
|
38
|
+
* Playwright on production 0.9.2 at 375px). Measured in Chromium 149 for 0.17.1: plain
|
|
39
|
+
* `attr()` → cell "Name x"; with `/ ""` → cell "x", also through Tailwind's
|
|
40
|
+
* `--tw-content` indirection. Firefox does not implement the alternative-text form
|
|
41
|
+
* (2026-08), so there the label is still read twice — the same as 0.17.0, not a
|
|
42
|
+
* regression. jsdom does not compute pseudo-elements, so the test pins the class literal.
|
|
35
43
|
*/
|
|
36
44
|
collapse?: 'sm';
|
|
37
45
|
}
|
package/dist/data/DataTable.js
CHANGED
|
@@ -18,7 +18,9 @@ const CARD_TABLE = 'max-sm:block';
|
|
|
18
18
|
const CARD_THEAD = 'max-sm:sr-only';
|
|
19
19
|
const CARD_TBODY = 'max-sm:block';
|
|
20
20
|
const CARD_ROW = 'max-sm:block max-sm:border-b max-sm:border-x-slot-table-border';
|
|
21
|
-
|
|
21
|
+
// `content-[attr(data-label)_/_'']` — Tailwind's `_` is a space, so this is
|
|
22
|
+
// `content: attr(data-label) / ''`: the label is drawn but has empty alternative text (#439).
|
|
23
|
+
const CARD_CELL = "max-sm:block max-sm:border-b-0 max-sm:text-left max-sm:before:block max-sm:before:content-[attr(data-label)_/_''] max-sm:before:font-x-slot-table-header max-sm:before:text-x-slot-table-header-fg";
|
|
22
24
|
export function DataTable({ columns, rows, rowKey, caption, className, collapse, }) {
|
|
23
25
|
const cards = collapse === 'sm';
|
|
24
26
|
return (_jsxs("table", { className: cx('w-full border-collapse font-sans text-x-slot-table-fg', cards && CARD_TABLE, className), children: [_jsx("caption", { className: "sr-only", children: caption }), _jsx("thead", { className: cards ? CARD_THEAD : undefined, children: _jsx("tr", { children: columns.map((col) => (_jsx("th", { scope: "col", className: `border-b border-x-slot-table-border px-x-slot-table-cell-pad-x py-x-slot-table-cell-pad-y font-x-slot-table-header text-x-slot-table-header-fg ${col.align === 'end' ? 'text-right' : 'text-left'}`, children: col.header }, col.key))) }) }), _jsx("tbody", { className: cards ? CARD_TBODY : undefined, children: rows.map((row) => (_jsx("tr", { className: cards ? CARD_ROW : undefined, children: columns.map((col) => (_jsx("td", { ...(cards ? { 'data-label': col.header } : {}), className: cx('border-b border-x-slot-table-border px-x-slot-table-cell-pad-x py-x-slot-table-cell-pad-y', col.align === 'end' ? 'text-right' : 'text-left', cards && CARD_CELL), children: col.cell(row) }, col.key))) }, rowKey(row)))) })] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../src/data/DataTable.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../src/data/DataTable.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAgDlC;;;;;;;;;;;GAWG;AACH,yFAAyF;AACzF,kDAAkD;AAClD,MAAM,UAAU,GAAG,cAAc,CAAC;AAClC,MAAM,UAAU,GAAG,gBAAgB,CAAC;AACpC,MAAM,UAAU,GAAG,cAAc,CAAC;AAClC,MAAM,QAAQ,GAAG,gEAAgE,CAAC;AAClF,4EAA4E;AAC5E,8FAA8F;AAC9F,MAAM,SAAS,GACb,oMAAoM,CAAC;AAEvM,MAAM,UAAU,SAAS,CAAM,EAC7B,OAAO,EACP,IAAI,EACJ,MAAM,EACN,OAAO,EACP,SAAS,EACT,QAAQ,GACY;IACpB,MAAM,KAAK,GAAG,QAAQ,KAAK,IAAI,CAAC;IAChC,OAAO,CACL,iBACE,SAAS,EAAE,EAAE,CACX,uDAAuD,EACvD,KAAK,IAAI,UAAU,EACnB,SAAS,CACV,aAED,kBAAS,SAAS,EAAC,SAAS,YAAE,OAAO,GAAW,EAChD,gBAAO,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,YAC9C,uBACG,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACpB,aAEE,KAAK,EAAC,KAAK,EACX,SAAS,EAAE,kJACT,GAAG,CAAC,KAAK,KAAK,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WACvC,EAAE,YAED,GAAG,CAAC,MAAM,IANN,GAAG,CAAC,GAAG,CAOT,CACN,CAAC,GACC,GACC,EACR,gBAAO,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,YAC7C,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACjB,aAAsB,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,YAC1D,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACpB,gBAEM,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAC/C,SAAS,EAAE,EAAE,CACX,2FAA2F,EAC3F,GAAG,CAAC,KAAK,KAAK,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WAAW,EAChD,KAAK,IAAI,SAAS,CACnB,YAEA,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IART,GAAG,CAAC,GAAG,CAST,CACN,CAAC,IAbK,MAAM,CAAC,GAAG,CAAC,CAcf,CACN,CAAC,GACI,IACF,CACT,CAAC;AACJ,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hideyukimori/nene2-ui",
|
|
3
|
-
"version": "0.17.
|
|
3
|
+
"version": "0.17.1",
|
|
4
4
|
"description": "NeNe fleet shared React UI kit — token-driven primitives on Tailwind v4 @theme. Components carry no design of their own; themes do.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "MIT",
|