@ixfx/components 0.16.2 → 0.16.3

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.
Files changed (91) hide show
  1. package/bundle/index.d.ts +59 -5
  2. package/bundle/index.js +148 -140
  3. package/dist/ac-text.d.ts +1 -1
  4. package/dist/{ac-token-Cq7lsYf-.d.ts → ac-token-qEs3FsQv.d.ts} +1 -1
  5. package/dist/ac-token.d.ts +1 -1
  6. package/dist/ac-token.js +1 -1
  7. package/dist/{button-D1sPDUCM.d.ts → button-N92DKoWb.d.ts} +1 -1
  8. package/dist/button.d.ts +1 -1
  9. package/dist/colour-picker.d.ts +1 -1
  10. package/dist/{crumb-navigation-nnr881n-.d.ts → crumb-navigation-BbqfmkYs.d.ts} +1 -1
  11. package/dist/crumbs.d.ts +1 -1
  12. package/dist/{data-grid-CaPLWt5E.js → data-grid-8TsiF2ES.js} +7 -6
  13. package/dist/{data-grid-BAEpfTkb.d.ts → data-grid-CslzF16R.d.ts} +4 -4
  14. package/dist/data-grid.d.ts +1 -1
  15. package/dist/data-grid.js +1 -1
  16. package/dist/{detail-list-DK49TsJd.d.ts → detail-list-n1MbNbhF.d.ts} +4 -4
  17. package/dist/{detail-list-C3XKTRmE.js → detail-list-w3GXKO2k.js} +4 -3
  18. package/dist/detail-list.d.ts +2 -2
  19. package/dist/detail-list.js +1 -1
  20. package/dist/{flat-list-Bv4-qfjp.d.ts → flat-list-D_4y3wgn.d.ts} +4 -4
  21. package/dist/flat-list.d.ts +1 -1
  22. package/dist/flat-list.js +2 -2
  23. package/dist/{grid-list-DaeSHv9P.d.ts → grid-list-CqYS28NY.d.ts} +4 -2
  24. package/dist/{grid-list-51XsR2X2.js → grid-list-Cz2tKcNZ.js} +4 -3
  25. package/dist/grid-list.d.ts +2 -2
  26. package/dist/grid-list.js +1 -1
  27. package/dist/{grouped-item-lister-DZIjo9nO.d.ts → grouped-item-lister-CS4yInuw.d.ts} +2 -2
  28. package/dist/grouped-item-lister.d.ts +1 -1
  29. package/dist/{icon-DR_3rSyZ.d.ts → icon-CDGprSdE.d.ts} +1 -1
  30. package/dist/icons.d.ts +2 -2
  31. package/dist/{incr-search-2YaxUUA9.js → incr-search-Dc6gYpJG.js} +24 -4
  32. package/dist/incr-search.d.ts +1 -1
  33. package/dist/incr-search.js +1 -1
  34. package/dist/{index-BjRoPrwj.d.ts → index-Bm9a9S3_.d.ts} +3 -2
  35. package/dist/{index-garxxqgV.d.ts → index-CYndvTWH.d.ts} +1 -1
  36. package/dist/{index-BUB5SICW.d.ts → index-CoqtMSd9.d.ts} +1 -1
  37. package/dist/{index-Bz3loIAf.d.ts → index-DN2BWctP.d.ts} +1 -1
  38. package/dist/{index-DXDz60XH.d.ts → index-DyaHA9Kk.d.ts} +2 -2
  39. package/dist/{index-CJ5fshD3.d.ts → index-UvnoZUAo.d.ts} +1 -1
  40. package/dist/{index-vdbbGE7N.d.ts → index-VAs9akt4.d.ts} +18 -2
  41. package/dist/{index-DM9OLgTH.d.ts → index-ZaA90u09.d.ts} +2 -2
  42. package/dist/index.d.ts +37 -26
  43. package/dist/index.js +88 -13
  44. package/dist/item-appearance-BjcMyauw.js +29 -0
  45. package/dist/{labelled-input-base-Dp_9KP0G.d.ts → labelled-input-base-DiTme1JO.d.ts} +1 -1
  46. package/dist/labelled-radial-input.d.ts +2 -2
  47. package/dist/labelled-range-input.d.ts +1 -1
  48. package/dist/labelled-slider-input.d.ts +1 -1
  49. package/dist/list-group-header.d.ts +1 -1
  50. package/dist/{list-selection-controller-CJDdjH7E.js → list-selection-controller-D4iIrvJH.js} +12 -8
  51. package/dist/{list-selection-types-hj9Njei3.d.ts → list-selection-types-Dnamh2Lu.d.ts} +29 -3
  52. package/dist/{menu-item-B0zqw2xp.d.ts → menu-item-bF6narIz.d.ts} +1 -1
  53. package/dist/menu.d.ts +2 -2
  54. package/dist/{miller-BfrTcujx.js → miller-Be7x4ufN.js} +3 -2
  55. package/dist/miller.d.ts +1 -1
  56. package/dist/miller.js +1 -1
  57. package/dist/narrowed-text.js +1 -1
  58. package/dist/panel.d.ts +1 -1
  59. package/dist/{item-appearance-Bl6rMIID.js → partial-keys-Ck6CiprB.js} +1 -29
  60. package/dist/{split-layout-ChZ0Glrs.d.ts → split-layout-CophkNeU.d.ts} +1 -1
  61. package/dist/split-layout.d.ts +1 -1
  62. package/dist/sunburst-tree.d.ts +1 -1
  63. package/dist/sunburst-tree.js +1 -1
  64. package/dist/{sunbursttree-list-BAS0KrDG.d.ts → sunbursttree-list-Bk20giTF.d.ts} +1 -1
  65. package/dist/{sunbursttree-list-906G33ME.js → sunbursttree-list-DQF6DcsS.js} +1 -1
  66. package/dist/{tab-list-wC0xNz1b.d.ts → tab-list-Df371rqw.d.ts} +1 -1
  67. package/dist/tabs.d.ts +1 -1
  68. package/dist/timeline.d.ts +1 -1
  69. package/dist/{titlebar-B5zSTZnF.d.ts → titlebar-Tqu-VvMU.d.ts} +1 -1
  70. package/dist/titlebar.d.ts +1 -1
  71. package/dist/{tree-C_H1COTf.js → tree-BaXYyt5U.js} +185 -69
  72. package/dist/tree.d.ts +1 -1
  73. package/dist/tree.js +1 -1
  74. package/dist/{vertical-list-od4050Bo.d.ts → vertical-list-DtHX26JO.d.ts} +2 -2
  75. package/dist/{vertical-list-qMRIxZIT.js → vertical-list-o5hfqH87.js} +4 -3
  76. package/dist/vertical-list.d.ts +2 -2
  77. package/dist/vertical-list.js +1 -1
  78. package/docs-user/README.md +1 -0
  79. package/docs-user/data-grid.md +1 -1
  80. package/docs-user/grid-list.md +1 -1
  81. package/docs-user/index.json +6 -2
  82. package/docs-user/llms.txt +1 -0
  83. package/docs-user/miller.md +4 -0
  84. package/docs-user/multicol-list.md +6 -0
  85. package/docs-user/select-horiz.md +1 -1
  86. package/docs-user/tree.md +6 -0
  87. package/docs-user/user-selection-intents.md +86 -0
  88. package/docs-user/vertical-list.md +1 -1
  89. package/llms.txt +1 -0
  90. package/package.json +1 -1
  91. /package/dist/{index-DV3iaUBW.d.ts → index-DV3iaUBW2.d.ts} +0 -0
package/dist/tree.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import { A as TreeTickleDetail, M as TreeDataModel, N as TreeDataModelOptions, O as TreeSelectDetail, T as TreeRevealMode, _ as TreeDropTarget, b as TreeItemClickDetail, c as TreeDragContext, d as TreeDragStartEvent, g as TreeDropPosition, h as TreeDropEvent, i as TreeCollapseEvent, j as TreeTickleEvent, k as TreeSelectEvent, l as TreeDragEndEvent, m as TreeDropDetail, n as TreeActivateEvent, o as TreeComponentEventMap, p as TreeDropContext, r as TreeCollapseDetail, s as TreeDndMode, t as TreeActivateDetail, u as TreeDragOverEvent, v as TreeExpandDetail, w as TreeNavigateOptions, x as TreeItemClickEvent, y as TreeExpandEvent } from "./tree-component-DgfkxmVY.js";
2
2
  import { a as TreeItem, n as TreeExclusivity, o as TreeNode, r as TreeFilterPredicate, s as TreeSelectionFilter, t as LoadChildrenCallback } from "./types-Jky6oNAp.js";
3
- import { a as TreeDropVisibleRow, c as TreeListElement, d as TreeBaseElement, f as TreeBaseElementEventMap, h as TreeConfig, i as TreeDropRowInfo, l as TreeCheckboxState, m as TreeListViewState, n as TreeDropControllerConfig, o as TreeController, p as TreeVirtualize, r as TreeDropResolvedDrag, s as TreeControllerOptions, t as TreeDropController, u as TreeAnimation } from "./index-vdbbGE7N.js";
3
+ import { a as TreeDropVisibleRow, c as TreeListElement, d as TreeBaseElement, f as TreeBaseElementEventMap, h as TreeConfig, i as TreeDropRowInfo, l as TreeCheckboxState, m as TreeListViewState, n as TreeDropControllerConfig, o as TreeController, p as TreeVirtualize, r as TreeDropResolvedDrag, s as TreeControllerOptions, t as TreeDropController, u as TreeAnimation } from "./index-VAs9akt4.js";
4
4
  export { type LoadChildrenCallback, type TreeActivateDetail, type TreeActivateEvent, TreeAnimation, TreeBaseElement, TreeBaseElementEventMap, type TreeCheckboxState, type TreeCollapseDetail, type TreeCollapseEvent, type TreeComponentEventMap, TreeConfig, TreeController, TreeControllerOptions, TreeDataModel, type TreeDataModelOptions, type TreeDndMode, type TreeDragContext, type TreeDragEndEvent, type TreeDragOverEvent, type TreeDragStartEvent, type TreeDropContext, TreeDropController, TreeDropControllerConfig, type TreeDropDetail, type TreeDropEvent, type TreeDropPosition, TreeDropResolvedDrag, TreeDropRowInfo, type TreeDropTarget, TreeDropVisibleRow, type TreeExclusivity, type TreeExpandDetail, type TreeExpandEvent, type TreeFilterPredicate, type TreeItem, type TreeItemClickDetail, type TreeItemClickEvent, TreeListElement, type TreeListViewState, type TreeNavigateOptions, type TreeNode, type TreeRevealMode, type TreeSelectDetail, type TreeSelectEvent, type TreeSelectionFilter, type TreeTickleDetail, type TreeTickleEvent, TreeVirtualize };
package/dist/tree.js CHANGED
@@ -1,2 +1,2 @@
1
- import { a as TreeDataModel, i as TreeDropController, n as TreeListElement, r as TreeBaseElement, t as TreeController } from "./tree-C_H1COTf.js";
1
+ import { a as TreeDataModel, i as TreeDropController, n as TreeListElement, r as TreeBaseElement, t as TreeController } from "./tree-BaXYyt5U.js";
2
2
  export { TreeBaseElement, TreeController, TreeDataModel, TreeDropController, TreeListElement };
@@ -2,8 +2,8 @@ import { L as ListDragPreviewRenderer, R as ListDragPreviewSourceResolver, V as
2
2
  import { a as ViewStateBase, t as GetViewStateOptions } from "./types-LU1u0CB8.js";
3
3
  import "./index-9ttcdwlL.js";
4
4
  import { n as ListViewportChangeEvent } from "./list-viewport-types-BRZsLcvp.js";
5
- import { i as ListInteractionMode, m as ListSelectionMode, r as ListElementEventMap } from "./list-selection-types-hj9Njei3.js";
6
- import { S as ListSearchController } from "./index-BjRoPrwj.js";
5
+ import { h as ListSelectionMode, i as ListInteractionMode, r as ListElementEventMap } from "./list-selection-types-Dnamh2Lu.js";
6
+ import { S as ListSearchController } from "./index-Bm9a9S3_.js";
7
7
  import "./editable-label-rzXkjf1H.js";
8
8
  import { LitElement, PropertyValues } from "lit";
9
9
  import { CommandId, CommandRegistry } from "@clinth/ui-commands";
@@ -1,13 +1,14 @@
1
1
  import { t as TickledController } from "./tickled-controller-D-HZymaZ.js";
2
2
  import { t as themeFallbacks } from "./fallbacks-DQ_5OsmR.js";
3
3
  import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
4
- import { c as createElementListSearchAdapter, d as keysOfElements, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-2YaxUUA9.js";
4
+ import { c as createElementListSearchAdapter, d as keysOfElements, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-Dc6gYpJG.js";
5
5
  import { i as animateListItemOut, r as animateListItemIn, t as ListNativeDragController } from "./list-native-drag-controller-CcXoS0YX.js";
6
- import { i as ListDragSelectController, n as gestureOf, t as ListSelectionController } from "./list-selection-controller-CJDdjH7E.js";
6
+ import { i as ListDragSelectController, n as gestureOf, t as ListSelectionController } from "./list-selection-controller-D4iIrvJH.js";
7
7
  import { l as keysToArray } from "./pending-BGidHppL.js";
8
- import { a as isPartialKey, i as applyPartialAttributes, n as appearanceColor, o as sameKeySet, t as appearanceAbsent } from "./item-appearance-Bl6rMIID.js";
8
+ import { i as sameKeySet, n as applyPartialAttributes, r as isPartialKey } from "./partial-keys-Ck6CiprB.js";
9
9
  import { t as scrollFadeStyles } from "./scroll-fade-Xx28D7mH.js";
10
10
  import { a as restoreElementScroll, n as anchorFromRow, o as scrollToOffset, r as captureElementScroll, t as ViewStateController } from "./view-state-controller-BdyXWUUM.js";
11
+ import { n as appearanceColor, t as appearanceAbsent } from "./item-appearance-BjcMyauw.js";
11
12
  import "./editable-label.js";
12
13
  import { LitElement, css, html, render } from "lit";
13
14
  import { property } from "lit/decorators.js";
@@ -1,5 +1,5 @@
1
1
  import { B as ListNativeDragStartDetail, F as ListDragPreview, I as ListDragPreviewContext, L as ListDragPreviewRenderer, P as ListDragEntry, V as ListNativeDragStartEvent, z as ListDragSource } from "./tree-component-DgfkxmVY.js";
2
2
  import { n as ListViewportChangeEvent, t as ListViewportChangeDetail } from "./list-viewport-types-BRZsLcvp.js";
3
- import { a as ListItemClickDetail, c as ListSelectEvent, g as ListTickleEvent, h as ListTickleDetail, i as ListInteractionMode, m as ListSelectionMode, n as ListActivateEvent, o as ListItemClickEvent, r as ListElementEventMap, s as ListSelectDetail, t as ListActivateDetail } from "./list-selection-types-hj9Njei3.js";
4
- import { a as VerticalListViewState, c as ListDragLeaveDetail, d as ListDropDetail, f as ListDropEvent, g as ListEditCommitEvent, h as ListEditCommitDetail, i as VerticalListElementEventMap, l as ListDragLeaveEvent, m as ListEditCancelEvent, n as CustomCheckboxOptions, o as ListContextMenuDetail, p as ListEditCancelDetail, r as VerticalListElement, s as ListContextMenuEvent, t as AddItemOptions, u as ListDragOverEvent } from "./vertical-list-od4050Bo.js";
3
+ import { _ as ListTickleEvent, a as ListItemClickDetail, c as ListSelectDetail, g as ListTickleDetail, h as ListSelectionMode, i as ListInteractionMode, l as ListSelectEvent, n as ListActivateEvent, o as ListItemClickEvent, r as ListElementEventMap, t as ListActivateDetail } from "./list-selection-types-Dnamh2Lu.js";
4
+ import { a as VerticalListViewState, c as ListDragLeaveDetail, d as ListDropDetail, f as ListDropEvent, g as ListEditCommitEvent, h as ListEditCommitDetail, i as VerticalListElementEventMap, l as ListDragLeaveEvent, m as ListEditCancelEvent, n as CustomCheckboxOptions, o as ListContextMenuDetail, p as ListEditCancelDetail, r as VerticalListElement, s as ListContextMenuEvent, t as AddItemOptions, u as ListDragOverEvent } from "./vertical-list-DtHX26JO.js";
5
5
  export { AddItemOptions, CustomCheckboxOptions, type ListActivateDetail, type ListActivateEvent, type ListContextMenuDetail, type ListContextMenuEvent, type ListDragEntry, type ListDragLeaveDetail, type ListDragLeaveEvent, type ListDragOverEvent, type ListDragPreview, type ListDragPreviewContext, type ListDragPreviewRenderer, type ListDragSource, type ListDropDetail, type ListDropEvent, type ListEditCancelDetail, type ListEditCancelEvent, type ListEditCommitDetail, type ListEditCommitEvent, type ListElementEventMap, type ListInteractionMode, type ListItemClickDetail, type ListItemClickEvent, type ListNativeDragStartDetail, type ListNativeDragStartEvent, type ListSelectDetail, type ListSelectEvent, type ListSelectionMode, type ListTickleDetail, type ListTickleEvent, type ListViewportChangeDetail, type ListViewportChangeEvent, VerticalListElement, VerticalListElementEventMap, type VerticalListViewState };
@@ -1,2 +1,2 @@
1
- import { t as VerticalListElement } from "./vertical-list-qMRIxZIT.js";
1
+ import { t as VerticalListElement } from "./vertical-list-o5hfqH87.js";
2
2
  export { VerticalListElement };
@@ -69,4 +69,5 @@ This directory contains documentation for each component and some architectural
69
69
 
70
70
  - [infra-tickled.md](infra-tickled.md)
71
71
  - [user-catalog.md](user-catalog.md)
72
+ - [user-selection-intents.md](user-selection-intents.md)
72
73
  - [user-theming.md](user-theming.md)
@@ -227,7 +227,7 @@ The setter fires `datagrid-select` `{ selectedKeys, previous }` (and `list-selec
227
227
  only when the selection actually changes. A cancelable `list-select-intent` fires
228
228
  before every selection gesture, and `partialKeys` marks partially selected rows
229
229
  (`data-partial`, indeterminate checkbox in `checked` mode).
230
- See [Selection intents, partial rows, unloaded keys](../../docs/infra-selection-intents.md): `list-select-intent`, `partialKeys`, and keys that arrive later.
230
+ See [Selection intents, partial rows, unloaded keys](./user-selection-intents.md): `list-select-intent`, `partialKeys`, and keys that arrive later.
231
231
 
232
232
  Selected rows that leave `rows` are deselected silently, and reselected if they
233
233
  return. See [View state](#view-state). In `checked` mode the row checkbox toggles
@@ -194,7 +194,7 @@ grid.addEventListener('list-select', ({ detail }) => {
194
194
  ```
195
195
 
196
196
  Caller-owned selection: a cancelable `list-select-intent` fires before every gesture, and `partialKeys` marks partially selected cells (`data-partial`, `part="item partial"`).
197
- See [Selection intents, partial rows, unloaded keys](../../docs/infra-selection-intents.md): `list-select-intent`, `partialKeys`, and keys that arrive later.
197
+ See [Selection intents, partial rows, unloaded keys](./user-selection-intents.md): `list-select-intent`, `partialKeys`, and keys that arrive later.
198
198
 
199
199
  Restore across a reload:
200
200
 
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ixfx/components",
3
- "version": "0.16.2",
4
- "generated": "2026-11-02T19:16:08.207Z",
3
+ "version": "0.16.3",
4
+ "generated": "2026-11-02T20:40:41.501Z",
5
5
  "components": [
6
6
  {
7
7
  "name": "ac-text",
@@ -313,6 +313,10 @@
313
313
  "name": "user-catalog.md",
314
314
  "path": "docs-user/user-catalog.md"
315
315
  },
316
+ {
317
+ "name": "user-selection-intents.md",
318
+ "path": "docs-user/user-selection-intents.md"
319
+ },
316
320
  {
317
321
  "name": "user-theming.md",
318
322
  "path": "docs-user/user-theming.md"
@@ -75,4 +75,5 @@ import '@ixfx/components/data-grid';
75
75
  ## Overviews
76
76
  - [infra-tickled.md](docs-user/infra-tickled.md)
77
77
  - [user-catalog.md](docs-user/user-catalog.md)
78
+ - [user-selection-intents.md](docs-user/user-selection-intents.md)
78
79
  - [user-theming.md](docs-user/user-theming.md)
@@ -149,6 +149,10 @@ The `change` event is fired on the component after every checkbox toggle.
149
149
 
150
150
  ---
151
151
 
152
+ ## Selection intents and partial rows
153
+
154
+ `ixfx-miller-list` fires a cancelable `list-select-intent` before a click (all interaction modes, including `manual`), a checkbox toggle or a Shift+Arrow range changes the selection; `preventDefault()` means "I'll apply it". Navigation (opening the node's column) still happens. It also fires `list-select` `{ selectedKeys, previousKeys, previous }` next to `select`, and supports `partialKeys` (indeterminate checkbox in `checked` mode, `.partial` otherwise; selected wins; in `checked` mode it overrides the state derived from loaded descendants). In `checked` mode the checkbox intent is for the node only: the cascade to loaded descendants is the caller's call. See [Selection intents, partial rows, unloaded keys](./user-selection-intents.md).
155
+
152
156
  ## Selection API
153
157
 
154
158
  ```typescript
@@ -62,6 +62,12 @@ one column (the first category) once `categories` is assigned.
62
62
 
63
63
  ---
64
64
 
65
+ ## Selection intents and partial rows
66
+
67
+ Gestures in a column (click, Space, Enter, Shift+Arrow, Cmd/Ctrl+A, marquee, the column's incremental search, the "All" row) fire a cancelable `list-select-intent` on the multicol host with `columnId` set; `keys` are that column's item keys. Going back to "All" is a `clear` intent. `preventDefault()` leaves the column alone.
68
+
69
+ `partialKeys` marks items as partially selected in every column that has an item with that key; `setColumnPartialKeys(columnId, keys)` adds keys for one column only. Selected wins. See [Selection intents, partial rows, unloaded keys](./user-selection-intents.md).
70
+
65
71
  ## Data flow
66
72
 
67
73
  1. A selection change in column *i* re-queries **every other** column; column *i*'s list
@@ -98,7 +98,7 @@ Click an item (or Tab to the element) to focus it first — a focus ring appears
98
98
  | `--select-horiz-spacer-width` | `10%` | Width of the leading/trailing spacer that lets the first/last item scroll to center |
99
99
  | `--scroll-fade-width` | `30px` | Width of the edge fade and the inner horizontal padding (shared with `scrollFadeStyles`) |
100
100
 
101
- Items are styled with the standard `--item-*` theming tokens (see [`docs/user-theming.md`](../../docs/user-theming.md)):
101
+ Items are styled with the standard `--item-*` theming tokens (see [`docs/user-theming.md`](./user-theming.md)):
102
102
 
103
103
  | Property | State |
104
104
  |---|---|
package/docs-user/tree.md CHANGED
@@ -424,6 +424,12 @@ el.addEventListener('select', ({ detail }) => {
424
424
 
425
425
  ---
426
426
 
427
+ ### Selection intents and partial rows (`ixfx-tree-list`)
428
+
429
+ A cancelable `list-select-intent` fires before a click, Space, Enter, Shift+Arrow, Ctrl/Cmd+A, a checkbox or `selectAll()` changes the selection (in every interaction mode, including `manual`); `preventDefault()` means "I'll apply it". Expansion and the cursor still behave normally. Checking a branch in `checked` mode is one `toggle` intent with `descendants: true` and `checked` (the state it is being set to): `keys` lists the loaded selectable nodes under it, but the caller can express it as a rule ("this folder and everything under it"). `list-select` `{ selectedKeys, previousKeys, previous }` fires next to `select`.
430
+
431
+ `partialKeys` marks nodes as partially selected: in `checked` mode the checkbox is indeterminate if either the loaded descendants or `partialKeys` say so (selected wins over partial); otherwise `data-partial` and an accessible description. Incremental search in `select` mode fires a `match` intent first (see below). See [Selection intents, partial rows, unloaded keys](./user-selection-intents.md).
432
+
427
433
  ## Expansion
428
434
 
429
435
  ### Programmatic expansion
@@ -0,0 +1,86 @@
1
+ # Selection intents, partial rows, unloaded keys
2
+
3
+ Shared by every list-like component: `ixfx-vertical-list`, `ixfx-flat-list`, `ixfx-detail-list`, `ixfx-grid-list`, `ixfx-data-grid`, `ixfx-miller-list`, `ixfx-tree-list` and `ixfx-multicol-list`. For a caller that owns the selection itself (e.g. a selection that is an expression or a set of rules, not a key set), so a list shows what it is given and reports what the user did.
4
+
5
+ ---
6
+
7
+ ## `list-select-intent` (cancelable)
8
+
9
+ Fired **before** a component changes its selection, in every interaction mode (including `manual`, where nothing is selected by default). `preventDefault()` means "I apply this myself": the component changes nothing. Without it, behaviour is unchanged.
10
+
11
+ ```ts
12
+ type ListSelectIntentDetail = {
13
+ readonly kind:
14
+ | `replace` // plain click / Enter: select only `keys`
15
+ | `toggle` // Cmd/Ctrl-click, Space, sticky tap, checkbox: flip `keys`
16
+ | `extend` // Shift-click / Shift+Arrow: range from `anchorKey` to `targetKey`
17
+ | `all` // Cmd/Ctrl+A or selectAll(): "everything in this view", not a key list
18
+ | `marquee` // drag-select: `keys` covered; `mode` says how they combine with the selection
19
+ | `match` // incremental search in `select` mode / "Select matches"
20
+ | `clear`; // Escape / click on empty space / back to "All" in a multicol column
21
+ readonly keys: readonly string[]; // keys directly affected (empty for `all` / `clear`)
22
+ readonly anchorKey?: string; // `extend`
23
+ readonly targetKey?: string; // `extend`
24
+ readonly mode?: `replace` | `add` | `toggle`; // `marquee`
25
+ readonly additive?: boolean; // `marquee`: `mode` is not `replace`
26
+ readonly query?: string; // `match`: the search text
27
+ readonly groupKey?: string | null; // `all`: the group the select-all is confined to
28
+ readonly descendants?: boolean; // `toggle` on a tree branch checkbox: node + loaded descendants
29
+ readonly checked?: boolean; // ...and the state it is being set to
30
+ readonly columnId?: string; // multicol-list: the column
31
+ readonly source: `pointer` | `keyboard` | `touch` | `api`;
32
+ };
33
+ ```
34
+
35
+ ```ts
36
+ list.addEventListener('list-select-intent', (e) => {
37
+ e.preventDefault();
38
+ const { kind, keys, anchorKey, targetKey } = e.detail;
39
+ // ...compute the new selection from your own model, then:
40
+ list.selectKeys(newKeys);
41
+ });
42
+ ```
43
+
44
+ - **`extend` gives endpoints.** `keys` also holds the range as loaded here, but rows in between may not be loaded (virtualised / progressive listings): compute the range from your own order using `anchorKey` / `targetKey`.
45
+ - **`all` is a meaning, not a list.** Turn it into your own scope rule instead of enumerating keys. In grouped lists with `cross-group-selection` off, select-all is confined to one group (the anchor's group, else the cursor's): `groupKey` names it, so a caller that takes over does the same. It is absent when select-all is not confined.
46
+ - **`marquee` `mode`.** `replace`: the selection becomes the covered `keys` (plain drag). `add`: covered keys are added (Shift-drag). `toggle`: each covered key flips, so a Cmd/Ctrl-drag can deselect. `additive` is just `mode !== 'replace'`; use `mode`.
47
+ - **`match` is a search.** Incremental search in `select` mode (typing, and `selectMatches()` / the "Select matches" button) reports `{ kind: 'match', query, keys }` — `keys` are the current matches, a convenience; `query` is what to keep as a live rule. Cancelling it leaves the selection untouched while the popover keeps showing the matches. Source is `keyboard` while typing, `pointer` for the button, `api` for `selectMatches()`.
48
+ - **Tree branch checkboxes.** In `ixfx-tree-list` `checked` mode, checking a branch is one `toggle` with `descendants: true` and `checked` (the state the branch is being set to); `keys` lists the loaded selectable nodes under it, but express it as a rule.
49
+ - **Cursor and anchor keep moving when cancelled.** They are view state, not selection; the next `extend` still has its `anchorKey`.
50
+ - **Who fires it.** Gestures (click, Space, Enter, double-click, checkbox, Shift+Arrow, Cmd/Ctrl+A, marquee, Escape, click on empty space) and `selectAll()`. The imperative `select()` / `selectKeys()` / `clearSelection()` family never fires it, so applying your decision through them cannot re-enter your handler.
51
+ - **`manual` mode.** The intent is reported and nothing else happens, so the caller never re-implements modifier handling. (`ixfx-data-grid` keeps Space toggling in `manual`, as before.)
52
+ - **Not covered.** Right-click auto-select and the drag-origin auto-select of native drag-out still apply directly. `ixfx-miller-list` reports click / checkbox / Shift+Arrow; it has no select-all, and Escape navigates rather than clears. In `checked` mode a miller checkbox intent is for the node only; the descendant cascade is the caller's decision.
53
+
54
+ ## `list-select` (consistent)
55
+
56
+ Every list-like component fires `list-select` with the same key-based detail:
57
+
58
+ ```ts
59
+ { selectedKeys: ReadonlySet<string>, previousKeys: ReadonlySet<string> /* , plus component-specific extras */ }
60
+ ```
61
+
62
+ Vertical-list, detail-list and grid-list keep their element-based `selected` / `previous`; data-grid keeps `datagrid-select` (and adds `list-select` with `previous` as keys); miller keeps `select` (and adds `list-select`). One adapter can read any of them through `selectedKeys` / `previousKeys`. Miller now also fires for Cmd-click and Shift-click selection changes.
63
+
64
+ ## `partialKeys`
65
+
66
+ A row whose resource is only partly selected (a time range of an audio file, a region of an image):
67
+
68
+ ```ts
69
+ list.partialKeys = ['k1', 'k2']; // ReadonlySet<string> getter; replace-on-set
70
+ ```
71
+
72
+ - Independent of `selectedKeys`; a key in both counts as selected.
73
+ - Light-DOM lists (vertical, detail): `data-partial` on the row; grid-list cell and data-grid row: `data-partial` plus `.partial` (`part="item partial"` on grid-list); miller: `.partial`.
74
+ - Accessibility: in `checked` mode the checkbox is indeterminate with `aria-checked="mixed"`; otherwise the row gets `aria-description="Partially selected"` (an author-set `aria-description` is never overwritten).
75
+ - Style hooks: `--item-bg-partial`, `--item-border-partial` (`--grid-list-partial-outline` on grid-list).
76
+ - `ixfx-flat-list` forwards `partialKeys` to its inner list. Miller's `checked` mode still derives indeterminate from loaded descendants; `partialKeys` overrides that for the keys you set.
77
+
78
+ ## Selected keys that aren't loaded yet
79
+
80
+ `selectKeys()` on vertical-list, flat-list (`flat.list`), detail-list and grid-list keeps keys with no row yet as *pending* and selects them when the row appears (`selectedKeys` lists only present rows). `addSelectedKeys()` does the same; `removeSelectedKeys()` also drops pending keys. Any explicit gesture-driven selection change supersedes pending keys, in single-select only the last unresolved key is kept, and pending keys are capped (2000, oldest dropped). `ixfx-data-grid` already behaved this way. A key that is selected and then leaves the data is reselected if it returns (view-state pending).
81
+
82
+ ## Per-component notes
83
+
84
+ - **`ixfx-tree-list`** — also fires `list-select` next to `select`. `partialKeys` combines with the checkbox state derived from loaded descendants: indeterminate if either says so; selected wins.
85
+ - **`ixfx-multicol-list`** — the intent is re-fired on the host with `columnId`; the "All" row is a `clear`. `partialKeys` applies to every column with a matching item key; `setColumnPartialKeys(columnId, keys)` targets one column.
86
+ - **`ixfx-miller-list`** — see above; `checked` mode checkbox intents are for the node only.
@@ -537,7 +537,7 @@ type ListItemClickDetail = { readonly item: Element };
537
537
  ### Caller-owned selection: `list-select-intent` and `partialKeys`
538
538
 
539
539
  `list-select-intent` is fired before any gesture changes the selection (in every `interactionMode`, including `manual`); `preventDefault()` means "I'll apply it". `partialKeys` marks rows as partially selected (`data-partial`, indeterminate checkbox in `checked` mode). Both are shared across the list-like components.
540
- See [Selection intents, partial rows, unloaded keys](../../docs/infra-selection-intents.md): `list-select-intent`, `partialKeys`, and keys that arrive later.
540
+ See [Selection intents, partial rows, unloaded keys](./user-selection-intents.md): `list-select-intent`, `partialKeys`, and keys that arrive later.
541
541
 
542
542
  ### Usage example
543
543
 
package/llms.txt CHANGED
@@ -75,4 +75,5 @@ import '@ixfx/components/data-grid';
75
75
  ## Overviews
76
76
  - [infra-tickled.md](docs-user/infra-tickled.md)
77
77
  - [user-catalog.md](docs-user/user-catalog.md)
78
+ - [user-selection-intents.md](docs-user/user-selection-intents.md)
78
79
  - [user-theming.md](docs-user/user-theming.md)
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ixfx/components",
3
3
  "type": "module",
4
- "version": "0.16.2",
4
+ "version": "0.16.3",
5
5
  "packageManager": "pnpm@10.0.0",
6
6
  "description": "Web components for ixfx — Lit-based UI toolkit",
7
7
  "author": "Clint Heyer",