@kalyx/react 1.0.0-rc.3 → 1.0.0-rc.5
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/CHANGELOG.md +86 -0
- package/README.md +2 -2
- package/dist/index.cjs +355 -143
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +23 -2
- package/dist/index.d.ts +23 -2
- package/dist/index.js +355 -143
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,91 @@
|
|
|
1
1
|
# @kalyx/react
|
|
2
2
|
|
|
3
|
+
## 1.0.0-rc.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 9f3cf9b: WAI-ARIA grid keyboard navigation for the four 3×4 picker grids
|
|
8
|
+
(`DatePicker.MonthGrid`, `DatePicker.YearGrid`, `MonthPicker.Grid`,
|
|
9
|
+
`YearPicker.Grid`).
|
|
10
|
+
|
|
11
|
+
Before, these grids declared `role="grid"` but had no key handler — keyboard
|
|
12
|
+
users could not select a month or year, in violation of CLAUDE.md §7.
|
|
13
|
+
|
|
14
|
+
Now each grid implements:
|
|
15
|
+
- **Arrow keys** — ±1 column / ±3 rows, clamped to grid bounds.
|
|
16
|
+
- **Home / End** — first / last cell of the current row.
|
|
17
|
+
- **PageUp / PageDown** — previous / next year (or decade for year grids).
|
|
18
|
+
- **Enter / Space** — commit the focused cell (drilldown grids switch view via
|
|
19
|
+
`onSelect`; commit grids close the popover via `ctx.selectDate`).
|
|
20
|
+
- **Roving tabIndex** — only the focused cell has `tabIndex=0`; the
|
|
21
|
+
`data-focused` attribute follows.
|
|
22
|
+
- **Auto-refocus** — DOM focus moves with `focusedIndex` so PageUp/Down lands
|
|
23
|
+
the user back on the same column position. Cells use stable index keys so
|
|
24
|
+
the buttons persist across page nav.
|
|
25
|
+
|
|
26
|
+
Component-level integration tests added per CLAUDE.md §7 across `DatePicker`,
|
|
27
|
+
`RangePicker`, `DateTimePicker`, and `WeekPicker`: leap-year (Feb 29 2024)
|
|
28
|
+
click commit, `before`/`after` rule click block, `dayOfWeek` rule click block
|
|
29
|
+
plus visual `aria-disabled`, and keyboard ArrowLeft skip-disabled.
|
|
30
|
+
|
|
31
|
+
**Bundle target raised to 14 KB** — full grid keyboard nav (state + handlers
|
|
32
|
+
- auto-refocus) added ~1.4 KB gzip across the four grids. Measured 12.85 KB
|
|
33
|
+
ESM / 13.64 KB CJS at this point. README, docs, `scripts/check-bundle-size.js`,
|
|
34
|
+
PR template, and CI gate updated to ≤14 KB.
|
|
35
|
+
|
|
36
|
+
**Internal:** new shared `useGridState` hook in
|
|
37
|
+
`packages/react/src/components/_shared/grid-keyboard.ts` (not exported from
|
|
38
|
+
the package public API) consolidates keyboard handling and roving-focus
|
|
39
|
+
state across all four grids.
|
|
40
|
+
|
|
41
|
+
- 9b19df4: `MonthPicker.Grid` and `YearPicker.Grid` now respect `before` / `after`
|
|
42
|
+
disabled rules — months/years that fall entirely outside the allowed range
|
|
43
|
+
are rendered with the `disabled` HTML attribute, `aria-disabled="true"`, the
|
|
44
|
+
new `monthDisabled` / `yearDisabled` className slots, and are skipped during
|
|
45
|
+
keyboard navigation.
|
|
46
|
+
|
|
47
|
+
This was deliberately deferred from PR #46 to keep that bundle under 14 KB;
|
|
48
|
+
it lands now with a 14 → 15 KB ceiling bump.
|
|
49
|
+
|
|
50
|
+
Behavioral details:
|
|
51
|
+
- A month is "fully disabled" only when every day in it is excluded by a
|
|
52
|
+
`before` or `after` rule. `date` and `dayOfWeek` rules can never disable a
|
|
53
|
+
whole month, so they remain a per-day concern.
|
|
54
|
+
- A year follows the same rule against `[Jan 1 00:00:00, Dec 31 23:59:59.999]`.
|
|
55
|
+
- Click and keyboard `Enter` / `Space` on a disabled cell are no-ops.
|
|
56
|
+
- Initial focus and post-PageUp/PageDown focus both re-anchor to the first
|
|
57
|
+
enabled cell when the natural target is itself disabled. (A `disabled`
|
|
58
|
+
HTML button can't receive DOM focus, so without the re-anchor the user
|
|
59
|
+
would silently lose keyboard navigation.)
|
|
60
|
+
|
|
61
|
+
**Internal:** `useGridState` regains its optional `disabledFlags` parameter
|
|
62
|
+
plus a focus re-anchor effect; `isRangeFullyDisabled` is reintroduced as an
|
|
63
|
+
internal helper. Neither is exposed in the package public API.
|
|
64
|
+
|
|
65
|
+
**Bundle target:** raised 14 → 15 KB (measured 13.96 KB ESM / 14.21 KB CJS).
|
|
66
|
+
Same precedent as the 12 → 13 KB and 13 → 14 KB bumps when prior feature
|
|
67
|
+
work landed. Updated `scripts/check-bundle-size.js`, `pr-check.yml`, READMEs,
|
|
68
|
+
CLAUDE.md, PR template, and `check-bundle.md`.
|
|
69
|
+
|
|
70
|
+
## 1.0.0-rc.4
|
|
71
|
+
|
|
72
|
+
### Patch Changes
|
|
73
|
+
|
|
74
|
+
- df97687: P1 audit follow-ups for v1.0-rc:
|
|
75
|
+
- **SSR hydration safety in 4 commit/drilldown grids** — `DatePicker.MonthGrid`, `DatePicker.YearGrid`, `MonthPicker.Grid`, and `YearPicker.Grid` previously called `adapter.today()` directly inside their render bodies, producing a server/client clock-mismatch hydration warning across day boundaries (and intermittently wrong "today" highlights in tz-different SSR setups). Today is now snapshotted via `useState(null)` + post-mount `useEffect`, so the server output and the first client render agree, and the highlight settles on the first effect tick.
|
|
76
|
+
- **`AmPmToggle` now follows the WAI-ARIA radiogroup pattern** — Arrow / Home / End / Space / Enter move and commit selection between AM and PM, and `tabIndex` is roving (only the checked radio is in the tab order). Previously both buttons were tabbable and arrow keys were ignored.
|
|
77
|
+
- **`DatePicker.Preset` / `RangePicker.Preset` now use `aria-pressed`** instead of `role="option"` + `aria-selected`. `role="option"` is invalid outside `role="listbox"` / `role="combobox"`, so axe was flagging the previous markup. Active state still appears on `data-active` for CSS targeting.
|
|
78
|
+
- **`RangePicker.Calendar` no longer advertises `aria-multiselectable="true"`** — a date range is one selection (two endpoints), not a multi-select grid.
|
|
79
|
+
- **Test stability** — `useRangePicker` `respects disabled rules` test pinned to April 2026 via `defaultValue` so the calendar grid contains the expected weekend day regardless of the system clock (was failing once the clock crossed into May).
|
|
80
|
+
- **`labels.ts` test coverage** — first unit tests for the default-label exports.
|
|
81
|
+
|
|
82
|
+
Behavioral notes for users (none of these are breaking for code that follows the documented `data-*` styling contract):
|
|
83
|
+
- If you targeted Preset buttons via `[aria-selected="true"]` in CSS, switch to `[aria-pressed="true"]` or `[data-active]`.
|
|
84
|
+
- If you targeted the range grid via `[aria-multiselectable]`, that attribute is gone; use `[role="grid"]` on the calendar root instead.
|
|
85
|
+
|
|
86
|
+
- Updated dependencies [df97687]
|
|
87
|
+
- @kalyx/core@1.0.0-rc.4
|
|
88
|
+
|
|
3
89
|
## 1.0.0-rc.3
|
|
4
90
|
|
|
5
91
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
# @kalyx/react
|
|
2
2
|
|
|
3
|
-
> The headless React DatePicker, finally complete. Zero CSS · SSR-safe ·
|
|
3
|
+
> The headless React DatePicker, finally complete. Zero CSS · SSR-safe · ~14 KB gzip (≤ 15 KB ceiling).
|
|
4
4
|
|
|
5
5
|
[](https://www.npmjs.com/package/@kalyx/react)
|
|
6
|
-
[](https://kalyx-docs.vercel.app/docs/api/react#bundle-size)
|
|
7
7
|
[](https://www.typescriptlang.org/)
|
|
8
8
|
[](https://github.com/jiji-hoon96/kalyx/blob/main/LICENSE)
|
|
9
9
|
|