@iyulab/flex-table 0.50.1 → 0.50.3

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # Changelog
 
+## [0.50.3] - 2026-10-06
+
+### Documentation
+
+- README Quick Start looks the table up by its tag (`document.querySelector('flex-table')`), so the element is
+  typed in TypeScript and its `columns` / `data` are checked — `getElementById` gives a plain `HTMLElement`.
+
+## [0.50.2] - 2026-10-06
+
+### Documentation
+
+- Shift+F10 and the context-menu key on the active cell open the cell menu at that cell (and fire
+  `context-menu`) — documented and covered by a test. It works since 0.50.1, whose roving focus puts the
+  focus on the cell the browser opens the menu for.
+
 ## [0.50.1] - 2026-10-06
 
 ### Fixed

package/README.md

@@ -20,12 +20,12 @@ npm install @iyulab/flex-table
 
 ```html
 <!-- The table is its own scroll container, so give it a height — see Sizing below. -->
-<flex-table id="table" style="height: 400px" row-height="32" show-row-numbers></flex-table>
+<flex-table style="height: 400px" row-height="32" show-row-numbers></flex-table>
 
 <script type="module">
   import '@iyulab/flex-table';
 
-  const table = document.getElementById('table');
+  const table = document.querySelector('flex-table'); // the tag gives the element its type
 
   table.columns = [
     { key: 'name', label: 'Name', type: 'text', width: 200 },
@@ -65,7 +65,7 @@ npm install @iyulab/flex-table
 - **Row Numbers** — Optional `show-row-numbers` attribute with sticky positioning
 - **Footer Row** — Summary/aggregate row via `footer-data` property
 - **Data Mode** — Client-side or server-side sorting/filtering (`dataMode`)
-- **Context Menu** — `context-menu` event for custom right-click menus
+- **Context Menu** — `context-menu` event for custom right-click menus; Shift+F10 or the context-menu key opens it on the active cell
 - **React Wrapper** — `@iyulab/flex-table/react` subpath for idiomatic React usage
 - **ARIA** — `role="grid"` with roving focus (the focus sits on the active cell or header cell, so screen readers announce each move), `aria-sort`, `aria-selected`, `aria-readonly`, `aria-invalid`, `aria-rowcount`, `aria-colcount`, `aria-rowindex`, `aria-colindex`
 
@@ -351,7 +351,7 @@ type-checks without a cast. The React wrapper's `on*` props carry the same types
 | Event | Detail | Description |
 |-------|--------|-------------|
 | `undo-state-change` | `{ canUndo, canRedo }` | Undo/redo availability changed |
-| `context-menu` | `{ x, y, row, col, key, value, rowData }` | Right-click on cell. Cancelable — `preventDefault()` suppresses the built-in menu |
+| `context-menu` | `{ x, y, row, col, key, value, rowData }` | Right-click on a cell, or Shift+F10 / the context-menu key on the active cell. Cancelable — `preventDefault()` suppresses the built-in menu |
 
 ## CSS Custom Properties
 
@@ -458,6 +458,7 @@ package dependency; CSS custom properties are resolved at render time, not impor
 | ArrowLeft / ArrowRight / Home / End (header row) | Move along the header; ArrowDown returns to the first row |
 | Enter / Space (header row) | Sort the column (ascending → descending → none); with Shift, add it to the sort |
 | Alt+ArrowDown or the context-menu key (header row) | Open the column menu |
+| Shift+F10 or the context-menu key (a body cell) | Open the cell menu (`show-context-menu`) at the active cell / fire `context-menu` |
 | Enter / Space on a column menu button | Open the column menu |
 | ArrowUp / ArrowDown / Home / End (column menu) | Move between menu items |
 | Escape (column menu) | Close the menu and return focus to where it was opened from |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iyulab/flex-table",
-  "version": "0.50.1",
+  "version": "0.50.3",
   "description": "A minimalist, input-centric data grid web component",
   "type": "module",
   "main": "./dist/flex-table.js",

package/skills/iyulab-flex-table/references/styling.md

@@ -72,6 +72,7 @@ flex-table {
 | ArrowUp on the first row | Move onto the header row (arrows / Home / End along it, ArrowDown back) |
 | Enter / Space on a header cell | Sort (Shift adds to the sort) |
 | Alt+ArrowDown or context-menu key on a header cell | Open the column menu |
+| Shift+F10 or context-menu key on a body cell | Open the cell menu at the active cell (fires `context-menu`) |
 | Home / End, Ctrl+Home / Ctrl+End | Row start/end, table start/end |
 | Shift+Arrow, Shift+Click | Extend range selection |
 | Shift+Space | Select / deselect the active cell's row (`selectable`; row checkboxes are not Tab stops) |