@keenmate/svelte-treeview 5.0.0-rc04 → 5.0.0-rc06

package/CHANGELOG.md

@@ -7,6 +7,41 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [5.0.0-rc06] - 2026-03-31
+
+### Added
+- **`showCheckboxes` prop**: Renders a checkbox before each selectable node with custom styling and indeterminate support.
+- **`checkboxMode` prop** (`'independent'` | `'cascade'`): Controls whether checking a parent cascades to all descendants. Indeterminate state shown when partial.
+- **`beforeCheckboxToggleCallback` interceptor**: Cancel or override checkbox toggles.
+- **Three-level selection model**: Separated into `focusedNode` (single node, click/arrows), `highlightedPaths` (multi-select, Ctrl/Shift+click), and `selectedPaths` (checkbox data state). Highlight and checkbox state are independent — build a highlight selection, then check/uncheck all highlighted nodes with one checkbox click.
+- **`onHighlightChange` event**: Fires when highlighted paths change (Ctrl+click, Shift+click, etc.).
+- **Bulk checkbox via highlight**: When multiple nodes are highlighted and a checkbox in the highlight is clicked, all highlighted nodes toggle together.
+- **Shift+Arrow/Home/End keyboard highlight**: Shift+ArrowDown/Up extends highlight range by one sibling, Shift+Home/End extends to first/last visible node.
+- **PageUp/PageDown navigation**: Jumps 10 visible nodes forward/back. Shift+PageUp/PageDown extends highlight by 10 nodes.
+- **`ltree-selected-highlight` CSS class**: Explorer-style blue background highlight. Customizable via `--ltree-highlight-bg` and `--ltree-highlight-color`.
+- **Interaction example page** (`/examples/interaction`): Interactive demos for click behavior, checkboxes, multi-select, and keyboard navigation. All settings persisted to localStorage.
+
+### Fixed
+- **Keyboard navigation not working after node click**: Clicking a node now auto-focuses the tree container, so arrow keys work immediately without having to click the container separately.
+- **Svelte proxy equality warning on checkbox toggle**: `_setFocusedNode` now compares by path instead of object identity to avoid `state_proxy_equality_mismatch`.
+
+### Breaking
+- **`selectedNode` → `focusedNode`**: Renamed prop and bindable. The single focused node (last clicked / arrow-keyed to).
+- **`selectedPaths` repurposed**: Now represents checkbox-only data state. For click/highlight multi-select, use `highlightedPaths`.
+- **`highlightedPaths` (new)**: Replaces old `selectedPaths` for Ctrl+click / Shift+click UI highlight.
+- **`selectedNodeClass` → `highlightedNodeClass`**: CSS class applied to highlighted nodes.
+- **`focusedNodeClass` (new)**: CSS class applied to the single focused node.
+- **`onSelectionChange` repurposed**: Now fires on checkbox selection changes only. Use `onHighlightChange` for highlight changes.
+- **`selectNode()` / `selectNodes()` deprecated**: Use `highlightNode()` / `highlightNodes()` instead.
+
+## [5.0.0-rc05] - 2026-03-26
+
+### Added
+- **`clickBehavior` prop** (`'select'` | `'expand'` | `'expand-and-focus'`, default `'expand-and-focus'`): Controls what happens on node click. Replaces the boolean `shouldToggleOnNodeClick` prop. Matches canvas package's `ClickBehavior` type.
+
+### Breaking
+- **`shouldToggleOnNodeClick` removed**: Replace `shouldToggleOnNodeClick={true}` with `clickBehavior="expand-and-focus"` (default) and `shouldToggleOnNodeClick={false}` with `clickBehavior="select"`.
+
 ## [5.0.0-rc04] - 2026-03-12
 
 ### Added

package/README.md

@@ -6,9 +6,13 @@ A high-performance, feature-rich hierarchical tree view component for Svelte 5 w
 
 Browse interactive code examples and the full API reference at **[svelte-treeview.keenmate.dev](https://svelte-treeview.keenmate.dev)**
 
-## What's New in v5.0.0-rc04
+## What's New in v5.0.0-rc06
 
-- **Pluggable keyboard navigation**: New `TreeNavigation<T>` interface — each renderer (HTML, Canvas) provides its own spatial implementation. Override individual methods via `TreeNavigationOverrides<T>`.
+- **Three-level selection**: `focusedNode` (click/arrows), `highlightedPaths` (Ctrl/Shift+click), `selectedPaths` (checkbox data state). Highlight and checkbox are independent — build a selection, then check/uncheck all at once.
+- **`clickBehavior` prop**: `'select'` | `'expand'` | `'expand-and-focus'` (default). Replaces `shouldToggleOnNodeClick`.
+- **`showCheckboxes` + `checkboxMode`**: Custom styled checkboxes with `'independent'` or `'cascade'` mode (parent toggles descendants, indeterminate state).
+- **Shift+Arrow/Home/End/PageUp/PageDown**: Extends highlight range via keyboard, like file managers.
+- **Pluggable keyboard navigation**: `TreeNavigation<T>` interface — each renderer provides its own spatial implementation. Override individual methods via `TreeNavigationOverrides<T>`.
 - **Bulk subtree operations**: `insertBranch()`, `replaceBranch()`, `deleteBranch()` on TreeController — add, replace, or remove entire subtrees with a single emission.
 - **Clipboard API**: `copyNodes()`, `cutNodes()`, `pasteNodes()`, `cancelCut()` on TreeController. Cut nodes are visually dimmed. Supports auto-handle and manual (server-driven) paste modes.
 
@@ -654,7 +658,8 @@ Without both requirements, no search indexing will occur.
 | Prop | Type | Default | Description |
 |------|------|---------|-------------|
 | `expandLevel` | `number \| null` | `2` | Automatically expand nodes up to this level |
-| `shouldToggleOnNodeClick` | `boolean` | `true` | Toggle expansion on node click |
+| `clickBehavior` | `ClickBehavior` | `'expand-and-focus'` | Node click behavior: `'select'` (click selects, dblclick expands), `'expand'` (click expands only), `'expand-and-focus'` (click selects + expands) |
+| `showCheckboxes` | `boolean` | `false` | Show selection checkboxes before each node. Clicking a checkbox toggles the node's selection (same as Ctrl+click). |
 | `orderMember` | `string \| null` | `null` | Property name for sort order (enables before/after positioning in drag-drop) |
 | `indexerBatchSize` | `number \| null` | `25` | Number of nodes to process per batch during search indexing |
 | `indexerTimeout` | `number \| null` | `50` | Maximum time (ms) to wait for idle callback before forcing indexing |
@@ -867,7 +872,7 @@ All Tree props can be updated except snippets/templates, including:
 - Callbacks: `sortCallback`, `getDisplayValueCallback`, `onNodeClicked`, etc.
 - Visual: `bodyClass`, `selectedNodeClass`, `expandIconClass`, etc.
 - Context menu: `contextMenuCallback`, `contextMenuXOffset`, `contextMenuYOffset`
-- Behavior: `shouldToggleOnNodeClick`, `shouldUseInternalSearchIndex`, etc.
+- Behavior: `clickBehavior`, `shouldUseInternalSearchIndex`, etc.
 
 ### Debug Information
 

package/ai/INDEX.txt

@@ -195,12 +195,15 @@ Search → search-features.txt
 searchNodes → search-features.txt
 searchText → search-features.txt, basic-setup.txt
 searchValueMember → search-features.txt, data-handling.txt
-selectedNode → basic-setup.txt, events-callbacks.txt
-selectedNodeClass → styling-theming.txt
-selectedPaths → advanced-patterns.txt
-selectNode → advanced-patterns.txt
+focusedNode → basic-setup.txt, events-callbacks.txt
+highlightedNodeClass → styling-theming.txt
+highlightedPaths → advanced-patterns.txt
+highlightNode → advanced-patterns.txt
+selectedPaths → advanced-patterns.txt (checkbox data state)
+showCheckboxes → basic-setup.txt
+checkboxMode → basic-setup.txt
 shouldDisplayDebugInformation → basic-setup.txt, performance.txt
-shouldToggleOnNodeClick → basic-setup.txt
+clickBehavior → basic-setup.txt, events-callbacks.txt
 shouldUseInternalSearchIndex → search-features.txt
 Snippets → basic-setup.txt, context-menu.txt
 sortCallback → data-handling.txt, basic-setup.txt