@ixfx/components 0.8.7 → 0.8.9

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 (85) hide show
  1. package/bundle/index.d.ts +743 -383
  2. package/bundle/index.d.ts.map +1 -1
  3. package/bundle/index.js +2093 -222
  4. package/bundle/index.js.map +1 -1
  5. package/dist/crumbs.d.ts +1 -1
  6. package/dist/crumbs.js +2 -2
  7. package/dist/{data-grid-CYVPSUwh.d.ts → data-grid-C588pTgt.d.ts} +15 -2
  8. package/dist/data-grid-C588pTgt.d.ts.map +1 -0
  9. package/dist/data-grid.d.ts +3 -2
  10. package/dist/data-grid.js +95 -5
  11. package/dist/data-grid.js.map +1 -1
  12. package/dist/{detail-list-vH56z7WE.d.ts → detail-list-IKl76Wnp.d.ts} +22 -5
  13. package/dist/detail-list-IKl76Wnp.d.ts.map +1 -0
  14. package/dist/detail-list.d.ts +4 -3
  15. package/dist/detail-list.js +103 -3
  16. package/dist/detail-list.js.map +1 -1
  17. package/dist/{grid-list-Cq8ga2WZ.d.ts → grid-list-BUlUnisU.d.ts} +214 -112
  18. package/dist/grid-list-BUlUnisU.d.ts.map +1 -0
  19. package/dist/{grid-list-j5C7qtlG.js → grid-list-D18FNJRH.js} +77 -164
  20. package/dist/grid-list-D18FNJRH.js.map +1 -0
  21. package/dist/grid-list.d.ts +3 -2
  22. package/dist/grid-list.js +1 -1
  23. package/dist/incr-search.d.ts +1 -1
  24. package/dist/{index-DDREWqMm.d.ts → index--qnhBWZJ.d.ts} +2 -2
  25. package/dist/{index-DDREWqMm.d.ts.map → index--qnhBWZJ.d.ts.map} +1 -1
  26. package/dist/index.d.ts +212 -253
  27. package/dist/index.d.ts.map +1 -1
  28. package/dist/index.js +13 -12
  29. package/dist/index.js.map +1 -1
  30. package/dist/{interaction-B9AAlsFO.js → interaction-BskmlA9t.js} +1 -1
  31. package/dist/{labelled-slider-input-BCH9968c.js → labelled-slider-input-aEYDvW2S.js} +2 -2
  32. package/dist/{labelled-slider-input-BCH9968c.js.map → labelled-slider-input-aEYDvW2S.js.map} +1 -1
  33. package/dist/labelled-slider-input.js +1 -1
  34. package/dist/{list-item-animation-DuiwgN3l.js → list-item-animation-BUoEKi5s.js} +29 -10
  35. package/dist/list-item-animation-BUoEKi5s.js.map +1 -0
  36. package/dist/list-native-drag-controller-CFyrkKUj.d.ts +61 -0
  37. package/dist/list-native-drag-controller-CFyrkKUj.d.ts.map +1 -0
  38. package/dist/list-native-drag-controller-DxD6Yjci.js +567 -0
  39. package/dist/list-native-drag-controller-DxD6Yjci.js.map +1 -0
  40. package/dist/{menu-HMoxCPY2.js → menu-CMXhIaNZ.js} +3 -3
  41. package/dist/{menu-HMoxCPY2.js.map → menu-CMXhIaNZ.js.map} +1 -1
  42. package/dist/{menu-item-BQDYxk5A.js → menu-item-BYGQzyCe.js} +2 -2
  43. package/dist/{menu-item-BQDYxk5A.js.map → menu-item-BYGQzyCe.js.map} +1 -1
  44. package/dist/menu.js +2 -2
  45. package/dist/miller.d.ts +2 -2
  46. package/dist/miller.js +1 -1
  47. package/dist/narrowed-text.js +1 -1
  48. package/dist/plots.js +1 -1
  49. package/dist/select-horiz.js +1 -1
  50. package/dist/slider-input-BxURAAmD.d.ts.map +1 -1
  51. package/dist/{slider-input-WR8_RwHg.js → slider-input-Cb5uSV42.js} +78 -11
  52. package/dist/slider-input-Cb5uSV42.js.map +1 -0
  53. package/dist/slider-input.js +1 -1
  54. package/dist/{tree-CozQj01a.js → tree-a14n9y7i.js} +1055 -32
  55. package/dist/tree-a14n9y7i.js.map +1 -0
  56. package/dist/{tree-component-BMpxpdTi.d.ts → tree-component-BW2iCFq9.d.ts} +108 -4
  57. package/dist/tree-component-BW2iCFq9.d.ts.map +1 -0
  58. package/dist/tree.d.ts +102 -4
  59. package/dist/tree.d.ts.map +1 -1
  60. package/dist/tree.js +2 -2
  61. package/dist/{vertical-list-BGn9nyKh.d.ts → vertical-list-CHrXmmQ3.d.ts} +21 -4
  62. package/dist/vertical-list-CHrXmmQ3.d.ts.map +1 -0
  63. package/dist/vertical-list.d.ts +3 -2
  64. package/dist/vertical-list.js +103 -3
  65. package/dist/vertical-list.js.map +1 -1
  66. package/dist/{xy-axis-CrrVdDFe.js → xy-axis-COKw338Q.js} +2 -2
  67. package/dist/xy-axis-COKw338Q.js.map +1 -0
  68. package/dist/xy-axis-DQqd2yXJ.d.ts.map +1 -1
  69. package/docs-user/data-grid.md +30 -0
  70. package/docs-user/detail-list.md +29 -0
  71. package/docs-user/grid-list.md +34 -4
  72. package/docs-user/index.json +2 -2
  73. package/docs-user/tree.md +76 -1
  74. package/docs-user/vertical-list.md +30 -1
  75. package/package.json +1 -1
  76. package/dist/data-grid-CYVPSUwh.d.ts.map +0 -1
  77. package/dist/detail-list-vH56z7WE.d.ts.map +0 -1
  78. package/dist/grid-list-Cq8ga2WZ.d.ts.map +0 -1
  79. package/dist/grid-list-j5C7qtlG.js.map +0 -1
  80. package/dist/list-item-animation-DuiwgN3l.js.map +0 -1
  81. package/dist/slider-input-WR8_RwHg.js.map +0 -1
  82. package/dist/tree-CozQj01a.js.map +0 -1
  83. package/dist/tree-component-BMpxpdTi.d.ts.map +0 -1
  84. package/dist/vertical-list-BGn9nyKh.d.ts.map +0 -1
  85. package/dist/xy-axis-CrrVdDFe.js.map +0 -1
@@ -116,6 +116,36 @@ selection actually changes.
116
116
 
117
117
  ---
118
118
 
119
+ ## Native drag-out
120
+
121
+ Set `items-draggable` to make selectable rows draggable out of the grid. A
122
+ dragged row is one logical item and its preview renders identically to the
123
+ other list components. On `dragstart` the grid fires the cancelable,
124
+ `composed`, bubbling `list-native-drag-start` event with
125
+ `{ key, index, item, selectedKeys, selected, preview }`:
126
+
127
+ - `selected` is the full selection as display-ordered `ListDragEntry[]`
128
+ (`{ key, index, item, element }`, where `item` is the row value and
129
+ `element` the `.row` div); `selectedKeys` mirrors the keys. The origin rule
130
+ applies: dragging an unselected row replaces the selection with it first.
131
+ - `preview` is the shared built-in drag preview: `preview.element` for
132
+ `DataTransfer.setDragImage()` (a row of cards for ≤5 rows, a compact
133
+ `N items` list with `+N more` for 6+; the row caption is the first visible
134
+ column's formatted value), plus a pre-painted `preview.canvas` for native
135
+ hosts.
136
+ - Assign `dragPreviewRenderer` for a custom synchronous preview returning
137
+ `{ element, hotspot?, canvas?, dispose? }`.
138
+ - `preventDefault()` on the event cancels the browser drag, but the sync
139
+ listener still sees `preview` (incl. `canvas`) — what lets an Electron host
140
+ rasterize it during the synchronous turn. Column-header reorder (pointer
141
+ drag) is a different mechanism and is unaffected.
142
+
143
+ The built-in preview is theme-aware (`--surface-4`, `--surface-4-text`,
144
+ `--border-subtle`, `--radius-m`, `--accent`, `font`) and exposes
145
+ `part="drag-preview"`.
146
+
147
+ ---
148
+
119
149
  ## Sorting
120
150
 
121
151
  Click header to cycle `asc → desc → none`. Or set:
@@ -23,6 +23,7 @@ Selection semantics match `ixfx-vertical-list` — same modes, same `list-*` eve
23
23
  - [Interaction modes](#interaction-modes)
24
24
  - [Custom checkbox](#custom-checkbox)
25
25
  - [Events](#events)
26
+ - [Native drag-out](#native-drag-out)
26
27
  - [Keyboard navigation](#keyboard-navigation)
27
28
  - [Wrapping](#wrapping)
28
29
  - [Incremental search](#incremental-search)
@@ -274,6 +275,7 @@ list.checkboxRenderer = { checked: '✓', unchecked: '' };
274
275
  | `list-tickle` | `{ item: Element }` | Hover/focus cursor moved |
275
276
  | `list-activate` | `{ item: Element }` | Item activated (Enter/double-click) |
276
277
  | `list-item-click` | `{ item: Element }` | Item clicked |
278
+ | `list-native-drag-start` | `{ key, index, item, selectedKeys, selected, preview }` | Cancelable; native item drag begins |
277
279
 
278
280
  ```typescript
279
281
  list.addEventListener('list-select', (e) => {
@@ -283,6 +285,33 @@ list.addEventListener('list-select', (e) => {
283
285
 
284
286
  ---
285
287
 
288
+ ## Native drag-out
289
+
290
+ Set `items-draggable` to make selectable rows draggable out of the list. On
291
+ `dragstart` the list fires the cancelable, `composed`, bubbling
292
+ `list-native-drag-start` event with
293
+ `{ key, index, item, selectedKeys, selected, preview }`:
294
+
295
+ - `selected` is the full selection as display-ordered `ListDragEntry[]`
296
+ (`{ key, index, item, element }`); `selectedKeys` mirrors the keys. The
297
+ origin rule applies: dragging an unselected row replaces the selection with
298
+ it first.
299
+ - `preview` is the shared built-in drag preview: `preview.element` for
300
+ `DataTransfer.setDragImage()` (a row of cards for ≤5 items, a compact
301
+ `N items` list with `+N more` for 6+), plus a pre-painted `preview.canvas`
302
+ for native hosts.
303
+ - Assign `dragPreviewRenderer` for a custom synchronous preview returning
304
+ `{ element, hotspot?, canvas?, dispose? }`.
305
+ - `preventDefault()` on the event cancels the browser drag, but the sync
306
+ listener still sees `preview` (incl. `canvas`) — what lets an Electron host
307
+ rasterize it during the synchronous turn.
308
+
309
+ The built-in preview is theme-aware (`--surface-4`, `--surface-4-text`,
310
+ `--border-subtle`, `--radius-m`, `--accent`, `font`) and exposes
311
+ `part="drag-preview"`.
312
+
313
+ ---
314
+
286
315
  ## Keyboard navigation
287
316
 
288
317
  The list must have focus for keyboard navigation. Click an item to focus, or set `tabindex="0"` on the element.
@@ -17,10 +17,11 @@ single vertical column, or a horizontally-scrolling strip.
17
17
  6. [Selection](#selection)
18
18
  7. [Cursor](#cursor)
19
19
  8. [Events](#events)
20
- 9. [Keyboard](#keyboard)
21
- 10. [Virtualisation](#virtualisation)
22
- 11. [CSS parts](#css-parts)
23
- 12. [Choosing a list component](#choosing-a-list-component)
20
+ 9. [Native drag-out](#native-drag-out)
21
+ 10. [Keyboard](#keyboard)
22
+ 11. [Virtualisation](#virtualisation)
23
+ 12. [CSS parts](#css-parts)
24
+ 13. [Choosing a list component](#choosing-a-list-component)
24
25
 
25
26
  ---
26
27
 
@@ -214,11 +215,40 @@ All bubble and are `composed`.
214
215
  | `list-item-click` | `{ key, index, item, element }` | Single click / `Enter` |
215
216
  | `list-tickle` | `{ key, index, item, element }` | Cursor moves onto an item |
216
217
  | `grid-list-viewport-change` | `{ renderedKeys, visibleKeys }` | Scroll, resize, filter, content change, or `refreshLayout()` — the rendered window moved |
218
+ | `list-native-drag-start` | `{ key, index, item, selectedKeys, selected, preview }` | Cancelable; native item drag begins |
217
219
 
218
220
  `key` / `index` are the stable contract in both modes. `item` is backward-compatible: the light-DOM `Element` in element mode, the data value in data mode. `element` is the DOM node when there is one (`undefined` in data mode). `selected` / `previous` (Element sets) are populated in element mode only; use `selectedKeys` / `previousKeys` everywhere.
219
221
 
220
222
  ---
221
223
 
224
+ ## Native drag-out
225
+
226
+ Set `items-draggable` to make selectable cells draggable out of the grid. On
227
+ `dragstart` the grid fires the cancelable, `composed`, bubbling
228
+ `list-native-drag-start` event with
229
+ `{ key, index, item, selectedKeys, selected, preview }`:
230
+
231
+ - `selected` is the full selection as display-ordered `ListDragEntry[]`
232
+ (`{ key, index, item, element? }`); `selectedKeys` mirrors the keys. The
233
+ origin rule applies: dragging an unselected cell replaces the selection with
234
+ it first. Works in data-backed mode too — `item` is the data value and
235
+ `element` is `undefined` there.
236
+ - `preview` is the shared built-in drag preview: `preview.element` for
237
+ `DataTransfer.setDragImage()` (a row of cards for ≤5 items, a compact
238
+ `N items` list with `+N more` for 6+), plus a pre-painted `preview.canvas`
239
+ for native hosts.
240
+ - Assign `dragPreviewRenderer` for a custom synchronous preview returning
241
+ `{ element, hotspot?, canvas?, dispose? }`.
242
+ - `preventDefault()` on the event cancels the browser drag, but the sync
243
+ listener still sees `preview` (incl. `canvas`) — what lets an Electron host
244
+ rasterize it during the synchronous turn.
245
+
246
+ The built-in preview is theme-aware (`--surface-4`, `--surface-4-text`,
247
+ `--border-subtle`, `--radius-m`, `--accent`, `font`) and exposes
248
+ `part="drag-preview"`.
249
+
250
+ ---
251
+
222
252
  ## Keyboard
223
253
 
224
254
  | Key | `grid` | `row` / `column` |
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ixfx/components",
3
- "version": "0.8.7",
4
- "generated": "2026-09-09T21:12:58.854Z",
3
+ "version": "0.8.9",
4
+ "generated": "2026-09-10T16:22:17.114Z",
5
5
  "components": [
6
6
  {
7
7
  "name": "ac-text",
package/docs-user/tree.md CHANGED
@@ -279,6 +279,74 @@ All events **bubble** and are **composed** (cross shadow-DOM boundaries).
279
279
  | `item-dblclick` | `TreeItemDblClickDetail` | User double-clicks an item. The second click is swallowed, so a branch is never toggled open/closed by a double-click. `activate` also fires. |
280
280
  | `expand` | `{ node: TreeNode; depth: number }` | A branch expands |
281
281
  | `collapse` | `{ node: TreeNode; depth: number }` | A branch collapses |
282
+ | `list-native-drag-start` | `ListNativeDragStartDetail<TreeNode>` | A drag begins on a draggable row (see drag & drop below). Cancelable. |
283
+ | `tree-drag-start` | `TreeDragContext` — `{ nodes, keys }` | A drag of tree nodes has begun (fires just after a non-cancelled `list-native-drag-start`). |
284
+ | `tree-drag-over` | `TreeDropContext` | Every `dragover` where a drop target resolved. `preventDefault()` rejects the drop (same as `canDrop` returning `false`). Cancelable. |
285
+ | `tree-drop` | `TreeDropDetail` | A validated drop occurred. `preventDefault()` stops the component applying it (you handle it). Cancelable. |
286
+ | `tree-drag-end` | `{ dropped: boolean }` | A drag ended. `dropped` is `true` only for a drop that landed on this tree. |
287
+
288
+ ## Drag & drop
289
+
290
+ `ixfx-tree-list` can let its rows be dragged — to **reparent** or **reorder**
291
+ nodes within the tree, and/or **out** of the element entirely (native
292
+ file/OS drag-out, like `ixfx-grid-list`). It can also be a **drop target** for
293
+ nodes from another `ixfx-tree-list` or from an arbitrary external source.
294
+
295
+ Opt in with the single **`item-dnd`** attribute:
296
+
297
+ | `item-dnd` | Rows draggable | Internal reparent/reorder | Native drag-out | Accepts drops |
298
+ |------------|:--:|:--:|:--:|:--:|
299
+ | `none` *(default)* | – | – | – | – |
300
+ | `internal` | ✓ | ✓ | – | ✓ (from any `ixfx-tree-list`) |
301
+ | `external` | ✓ | – | ✓ | ✓ (foreign payloads via `parseExternalDrop`) |
302
+ | `both` | ✓ | ✓ | ✓ | both |
303
+
304
+ ### Properties
305
+
306
+ | Property | Attribute | Type | Default | Purpose |
307
+ |----------|-----------|------|---------|---------|
308
+ | `itemDnd` | `item-dnd` | `'none' \| 'internal' \| 'external' \| 'both'` | `'none'` | Opt in (table above). |
309
+ | `acceptDropTypes` | `accept-drop-types` | `string` | – | Space-separated MIME list; an external `dragenter` is only honoured when `dataTransfer.types` intersects it. |
310
+ | `dndExpandHoverMs` | `dnd-expand-hover-ms` | `number` | `500` | Hover-to-open delay: hovering a collapsed branch this long during a drag expands it (spring-loaded folders). |
311
+ | `reorderable` | `reorderable` | `boolean` | `true` | When `false` (`reorderable="false"`), a drag that only reorders siblings — or drops a node back into its current parent — is rejected: no drop indicator, no `tree-drop`. Use for models with no meaningful child order (a filesystem). Reparenting, including via the x-position ancestor walk, is unaffected. |
312
+ | `dragPreviewRenderer` | – | `ListDragPreviewRenderer<TreeNode>` | – | Custom drag image (same contract as `ixfx-grid-list`); unset ⇒ built-in cards/list preview. |
313
+ | `canDrag` | – | `(ctx) => boolean` | – | Per-row gate at `dragstart`. Return `false` for every row (with `item-dnd` still set) for a **drop-target-only** tree. |
314
+ | `canDrop` | – | `(ctx: TreeDropContext) => boolean` | – | Sync gate on every `dragover`; controls the valid indicator and whether the drop is allowed. |
315
+ | `parseExternalDrop` | – | `(dt: DataTransfer) => TreeNode[] \| undefined` | – | Turn a foreign payload into nodes to insert (`external` / `both`). |
316
+ | `applyInternalDrop` | – | `boolean` | `true` when `model` is set | When `true`, the component performs an accepted internal drop itself via `model.applyDrop()`. Set `false` to mutate `root`/`model` yourself in the `tree-drop` handler. |
317
+
318
+ ### Drop targeting (VS Code Explorer style)
319
+
320
+ While dragging over the tree:
321
+
322
+ - **Vertical position** in a row picks `before` / `inside` (reparent) / `after`.
323
+ `inside` a leaf falls back to `after`; `after` an expanded branch lands as its
324
+ first child.
325
+ - **Horizontal position** on a `before`/`after` line walks the target *up* the
326
+ ancestor chain — drag left across a deeply-indented row to drop as a sibling of
327
+ one of its ancestors without scrolling. The insertion line and its nub move to
328
+ that depth.
329
+ - Hovering a collapsed branch for `dndExpandHoverMs` springs it open.
330
+ - With `reorderable="false"`, `before`/`after` between current siblings gives no
331
+ feedback — only reparenting drops resolve a target.
332
+ - Dragging near the top/bottom edge auto-scrolls.
333
+ - Dropping a node onto itself or into its own subtree is rejected (no indicator).
334
+
335
+ ### Applying drops without a model
336
+
337
+ ```ts
338
+ import { applyTreeDrop } from '@ixfx/components';
339
+
340
+ tree.addEventListener('tree-drop', (e) => {
341
+ e.preventDefault(); // we'll apply it ourselves
342
+ root = applyTreeDrop(root, e.detail); // pure, returns a new root
343
+ tree.root = root;
344
+ });
345
+ ```
346
+
347
+ `TreeDataModel` also gains `moveNode(key, parentKey, index?)`,
348
+ `moveNodeRelative(key, refKey, 'before'|'after')`, `insertNode(...)` and
349
+ `applyDrop(ctx)` — all off-by-one-safe and no-ops for invalid moves.
282
350
 
283
351
  ### Detail types
284
352
 
@@ -525,9 +593,16 @@ These are set by the global theme and inherited by all tree components.
525
593
  | Variable | Default | Description |
526
594
  |----------|---------|-------------|
527
595
  | `--tree-indent` | `20px` | Indentation per depth level |
528
- | `--tree-item-height` | `2ch` | Height of each row |
596
+ | `--tree-item-height` | `30px` | Height of each row |
529
597
  | `--tree-caret-size` | `30px` | Expand/collapse caret size |
530
598
  | `--ixfx-list-item-move-duration` | `200ms` | Row enter / leave animation duration |
599
+ | `--tree-drop-line` | `var(--accent)` | Colour of the before/after insertion line + nub |
600
+ | `--tree-drop-nub-size` | `5px` | Diameter of the insertion-line nub |
601
+ | `--tree-drop-into-outline` | `2px solid var(--accent)` | Outline of a row that is a reparent (`inside`) drop target |
602
+ | `--tree-drop-into-bg` | `color-mix(...)` | Background tint of a reparent drop target |
603
+
604
+ `part`s: `drop-target` (the highlighted row), `drop-indicator` (the
605
+ before/after line).
531
606
 
532
607
  ### `ixfx-miller-list` specific
533
608
 
@@ -13,7 +13,8 @@ A scrollable vertical list of items with selection, keyboard navigation, and inc
13
13
  5. [Custom checkbox](#custom-checkbox)
14
14
  5. [Selection](#selection)
15
15
  6. [Events](#events)
16
- 7. [Keyboard navigation](#keyboard-navigation)
16
+ 7. [Native drag-out](#native-drag-out)
17
+ 8. [Keyboard navigation](#keyboard-navigation)
17
18
  8. [Incremental search](#incremental-search)
18
19
  9. [CSS variables](#css-variables)
19
20
  10. [CSS parts](#css-parts)
@@ -442,6 +443,7 @@ All events **bubble** and are **composed** (they cross shadow-DOM boundaries).
442
443
  | `list-tickle` | `ListTickleDetail` | An item enters cursor focus (hover or keyboard navigation) |
443
444
  | `list-activate` | `ListActivateDetail` | User explicitly activates an item: Enter key or double-click |
444
445
  | `list-item-click` | `ListItemClickDetail` | Raw click or Enter on any item |
446
+ | `list-native-drag-start` | `{ key, index, item, selectedKeys, selected, preview }` | Cancelable; native item drag begins |
445
447
 
446
448
  ### Detail types
447
449
 
@@ -481,6 +483,33 @@ list.addEventListener('list-item-click', ({ detail }) => {
481
483
 
482
484
  ---
483
485
 
486
+ ## Native drag-out
487
+
488
+ Set `items-draggable` to make selectable rows draggable out of the list. On
489
+ `dragstart` the list fires the cancelable, `composed`, bubbling
490
+ `list-native-drag-start` event with
491
+ `{ key, index, item, selectedKeys, selected, preview }`:
492
+
493
+ - `selected` is the full selection as display-ordered `ListDragEntry[]`
494
+ (`{ key, index, item, element }`); `selectedKeys` mirrors the keys. The
495
+ origin rule applies: dragging an unselected row replaces the selection with
496
+ it first.
497
+ - `preview` is the shared built-in drag preview: `preview.element` for
498
+ `DataTransfer.setDragImage()` (a row of cards for ≤5 items, a compact
499
+ `N items` list with `+N more` for 6+), plus a pre-painted `preview.canvas`
500
+ for native hosts.
501
+ - Assign `dragPreviewRenderer` for a custom synchronous preview returning
502
+ `{ element, hotspot?, canvas?, dispose? }`.
503
+ - `preventDefault()` on the event cancels the browser drag, but the sync
504
+ listener still sees `preview` (incl. `canvas`) — what lets an Electron host
505
+ rasterize it during the synchronous turn.
506
+
507
+ The built-in preview is theme-aware (`--surface-4`, `--surface-4-text`,
508
+ `--border-subtle`, `--radius-m`, `--accent`, `font`) and exposes
509
+ `part="drag-preview"`.
510
+
511
+ ---
512
+
484
513
  ## Keyboard navigation
485
514
 
486
515
  The element must be focused (click it or tab to it) before keyboard navigation works. A visible focus ring appears on focus.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ixfx/components",
3
3
  "type": "module",
4
- "version": "0.8.7",
4
+ "version": "0.8.9",
5
5
  "packageManager": "pnpm@10.0.0",
6
6
  "description": "Web components for ixfx — Lit-based UI toolkit",
7
7
  "author": "Clint Heyer",
@@ -1 +0,0 @@
1
- {"version":3,"file":"data-grid-CYVPSUwh.d.ts","names":[],"sources":["../src/data-grid/types.ts","../src/data-grid/data-grid.ts"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"detail-list-vH56z7WE.d.ts","names":[],"sources":["../src/detail-list/types.ts","../src/detail-list/detail-list.ts"],"mappings":";;;;;;;;;KACY;;KAGA;WACD,SAAS;WACT;WACA;;;KAIC,wBAAwB,GAAG,gBAAgB,GAAG;;KAG9C,mBAAmB,eAAe,2BAA2B;;;;;;;;;;;;;;;;;;;;cC8D5D,0BAA0B;;EAErC,eAAe;EAGf,iBAAiB;EAGjB,MAAM;EAGN;EAGA,gBAAgB;EAGhB;EAGA,UAAU;EAGV;EAGA,WAAW;EAGX;EAGA;EAGA,mBAAmB,IAAI;;;;;;EAQvB;;EAIA,oBAAoB,gCAAgC;;;;;;EAQpD;UAGQ;mBAeS;UAeT;;WAuEC,QAAM,qBAAA;;MAYX,YAAY;EAoBP;EA4DA;EAiBA;EAQA,QAAQ,SAAS;;MAqCtB,gBAAgB;;MAKhB,iBAAiB,YAAY;;;;;;EASjC;EAIA,QAAQ,MAAM,kBAAkB,UAAU;;;;;EAuB1C,WAAW,MAAM,UAAU;;EAW3B,YAAY,OAAO,SAAS,WAAW;EAIvC;;;;;EAYA,SAAS,gBAAgB;;;;;EAgBzB,YAAY,MAAM;;;;;;EASlB,SAAS,WAAW,WAAW,OAAO;EAItC,OAAO,MAAM;EAIb,WAAW,OAAO,SAAS;EAI3B,SAAS,MAAM;EAIf;EAIA;;MAQI,gBAAgB;;MAKhB;;EAMJ,WAAW,MAAM;;EAKjB,gBAAgB,MAAM;;EAKtB,mBAAmB,MAAM;;EAKzB,SAAS;EAgBP,eAAe,0CAA0C,UAAU;UAoa7D;;;;;;;;;EAkBF,kBAAkB;UAwBhB;UAMA;UAgCA;UAiBA;;;;;;;UA2DA;;UAoBA;UAcA;UAYA;UAUA;UAMA;UAIA;UA4EA;UAWA;UAMA;UAKA;SAUQ,sBAAM;EA6Ib,wBAAM;;QAsBT;YACI;IACR,oBAAoB;;YAGZ,4BAA4B"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"grid-list-Cq8ga2WZ.d.ts","names":[],"sources":["../src/grid-list/types.ts","../src/interaction/list-selection-controller.ts","../src/pan-text/pan-text.ts","../src/grid-list/grid-list.ts"],"mappings":"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"}