@cahyo-dimas/freeday 1.48.0 → 1.49.0

package/CHANGELOG.md

@@ -3,6 +3,44 @@
 Semua perubahan penting dicatat di sini. Format longgar mengikuti
 [Keep a Changelog](https://keepachangelog.com/); tiap versi = git tag.
 
+## [1.49.0] — 2026-08-20
+### Added
+- **`FdyTableColumn.labelHidden`** (#026). A column of row CONTROLS — an edit button, a row menu —
+  could be named or quiet, not both: `label` renders as bare text in the `<th>`, so a designer who
+  does not want a word above a column of icons was left with an empty header, which assistive tech
+  announces as nothing. With `labelHidden: true` the label renders inside `.fdy-visually-hidden`:
+  the cell looks empty and the column is still named. The label keeps naming the column's filter
+  popover and sort button, so it stays meaningful either way.
+  Contract and ALL THREE typed adapters — Vue, React and Blazor. Each renders its own header, so
+  each spends the flag itself; Blazor takes `LabelHidden` on `FdyTableColumn<TRow>`.
+### Added — guards
+- **The column contract now has to reach all three adapters** (#026). Vue and React consume
+  `table-model.d.ts` and TypeScript keeps them honest, but Blazor RE-DECLARES the column in C# — a
+  hand copy, and the surface that can fall behind silently. A test asserts every contract property
+  exists on Blazor's `FdyTableColumn<TRow>`; coverage, not equality, so it needs no exemption list.
+- **A hidden label is clipped, not dropped** — asserted in a real browser for both JS adapters
+  (`browser/adapter.mjs`), because the claim is about computed geometry: a span carrying the class
+  with no CSS behind it passes any string match and still prints the word.
+
+## [1.48.1] — 2026-08-20
+### Fixed
+- **A date column sorted correctly and filtered nothing** (#025). `FdyTable`'s client-mode date
+  filter read a cell with `dateOnly`, which **sliced** the string, while its date SORT reads the same
+  cell with `toTime`, which **parses**. A date column normally renders a formatted date — that is
+  what `value` is for — so `"18 Mar 2024"` sliced to `"18 Mar 202"` and compared as text against an
+  ISO bound: every row failed, silently. The working sort is what made the broken filter look
+  trustworthy.
+- **A `Date` cell was read as its UTC day, not the reader's** (#025). `toISOString()` east of
+  Greenwich turns local midnight into the previous day, so at UTC+7 filtering from the 18th dropped
+  a row dated the 18th.
+- Text that is not a date now yields `''` and is EXCLUDED by an active date filter, rather than
+  slicing to something that compares as less than every bound and matching everything.
+### Added — guards
+- Three tests in `test/table-model.test.mjs`, each verified to fail against the old body: a
+  formatted `value`, a `Date` cell at a positive UTC offset, and unparseable text. The existing date
+  test only ever filtered a column with no accessor holding an already-ISO string, which is the one
+  shape neither bug can affect.
+
 ## [1.48.0] — 2026-08-20
 ### Reverted
 - **1.47.0's readonly focus ring (#024) is withdrawn.** The report was measured wrong. The control in

package/adapters/blazor/FdyTable.razor

@@ -26,11 +26,11 @@
                         <th scope="col" style="@AlignStyle(col)" aria-sort="@AriaSortOf(col)">
                             @if (col.Sortable)
                             {
-                                <button type="button" class="fdy-table__sortbtn" @onclick="() => OnSortClick(col)">@col.Label</button>
+                                <button type="button" class="fdy-table__sortbtn" @onclick="() => OnSortClick(col)"><span class="@(col.LabelHidden ? "fdy-visually-hidden" : null)">@col.Label</span></button>
                             }
                             else
                             {
-                                @col.Label
+                                <span class="@(col.LabelHidden ? "fdy-visually-hidden" : null)">@col.Label</span>
                             }
                             @if (col.Filter is { } ft)
                             {

package/adapters/blazor/TableTypes.cs

@@ -47,6 +47,13 @@ public sealed class FdyTableColumn<TRow>
     /// <summary>Header label.</summary>
     public required string Label { get; init; }
 
+    /// <summary>Render the label for assistive tech only — the header cell looks empty.
+    /// For a column of row CONTROLS (an edit button, a row menu), where a visible heading is noise
+    /// above a column of icons but the column still has to be named: a <c>th</c> with no text is
+    /// announced as nothing, and a reader tabbing the header row cannot tell what it is. The label
+    /// still names the column's filter popover and its sort button, so it must stay meaningful.</summary>
+    public bool LabelHidden { get; init; }
+
     /// <summary>Show a sort toggle in the header.</summary>
     public bool Sortable { get; init; }
 

package/adapters/core/table-model.d.ts

@@ -24,6 +24,16 @@ export interface FdyTableColumn<T> {
   key: string;
   /** Header label. */
   label: string;
+  /**
+   * Render the label for assistive tech only — the header cell looks empty.
+   *
+   * For a column of row CONTROLS (an edit button, a row menu), where a visible
+   * heading is noise above a column of icons but the column still has to be
+   * named: a `<th>` with no text is announced as nothing, and a reader tabbing
+   * the header row cannot tell what it is. The label still names the column's
+   * filter popover and its sort button, so it must stay meaningful.
+   */
+  labelHidden?: boolean;
   /** Show a sort toggle in the header. */
   sortable?: boolean;
   /** Offer a column filter of this type. */

package/adapters/core/table-model.js

@@ -23,10 +23,37 @@ function toTime(v) {
   return Number.isNaN(t) ? 0 : t;
 }
 
-/** @param {unknown} v @returns {string} ISO calendar day (yyyy-mm-dd) — lexicographically comparable */
+/** Already an ISO calendar day, so it needs no parsing. */
+const ISO_DAY = /^\d{4}-\d{2}-\d{2}/;
+
+/** @param {Date} d @returns {string} the LOCAL calendar day, never UTC's */
+function localDay(d) {
+  const month = d.getMonth() + 1;
+  const day = d.getDate();
+  return `${d.getFullYear()}-${month < 10 ? '0' : ''}${month}-${day < 10 ? '0' : ''}${day}`;
+}
+
+/**
+ * @param {unknown} v @returns {string} ISO calendar day (yyyy-mm-dd) — lexicographically comparable
+ *
+ * Two bugs lived here, both of which let a column SORT by date correctly and
+ * FILTER by date wrongly — the worst pairing, because a working sort is what
+ * persuades you the header understands dates.
+ *
+ * 1. It sliced instead of parsing, while `toTime` (which the date SORT uses)
+ *    parses. A column whose `value` returns a formatted date — the normal way
+ *    to render one — gave `"18 Mar 2024"`, sliced to `"18 Mar 202"`, and
+ *    compared as text against `"2024-03-18"`: every row failed, silently.
+ * 2. A `Date` went through `toISOString`, which is UTC. At UTC+7 a date picked
+ *    as the 18th is `2024-03-17T17:00Z`, so filtering from the 18th dropped it.
+ *    The calendar day a person means is their own, not Greenwich's.
+ */
 function dateOnly(v) {
-  if (v instanceof Date) return Number.isNaN(v.getTime()) ? '' : v.toISOString().slice(0, 10);
-  return String(v == null ? '' : v).slice(0, 10);
+  if (v instanceof Date) return Number.isNaN(v.getTime()) ? '' : localDay(v);
+  const s = String(v == null ? '' : v);
+  if (ISO_DAY.test(s)) return s.slice(0, 10);
+  const t = Date.parse(s);
+  return Number.isNaN(t) ? '' : localDay(new Date(t));
 }
 
 /** Raw cell value for a column: the column accessor if present, else row[key]. */

package/adapters/react/components/FdyTable.tsx

@@ -271,9 +271,11 @@ export function FdyTable<Row extends object>(props: FdyTableProps<Row>): JSX.Ele
               {props.columns.map((col: FdyTableColumn<Row>): JSX.Element => (
                 <th key={col.key} scope="col" style={alignStyle(col)} aria-sort={ariaSortOf(col)}>
                   {col.sortable ? (
-                    <button type="button" className="fdy-table__sortbtn" onClick={(): void => onSort(col)}>{col.label}</button>
+                    <button type="button" className="fdy-table__sortbtn" onClick={(): void => onSort(col)}>
+                      <span className={col.labelHidden ? 'fdy-visually-hidden' : undefined}>{col.label}</span>
+                    </button>
                   ) : (
-                    col.label
+                    <span className={col.labelHidden ? 'fdy-visually-hidden' : undefined}>{col.label}</span>
                   )}
                   {col.filter && (
                     <FdyTableFilter

package/adapters/vue/components/FdyTable.vue

@@ -280,8 +280,8 @@ function isExpanded(row: Row): boolean {
                 type="button"
                 class="fdy-table__sortbtn"
                 @click="onSort(col)"
-              >{{ col.label }}</button>
-              <template v-else>{{ col.label }}</template>
+              ><span :class="col.labelHidden ? 'fdy-visually-hidden' : undefined">{{ col.label }}</span></button>
+              <span v-else :class="col.labelHidden ? 'fdy-visually-hidden' : undefined">{{ col.label }}</span>
               <FdyTableFilter
                 v-if="col.filter"
                 :label="col.label"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cahyo-dimas/freeday",
-  "version": "1.48.0",
+  "version": "1.49.0",
   "description": "Freeday — token-driven, framework-agnostic UI KIT (design source-of-truth).",
   "type": "module",
   "license": "MIT",