Skip to content

Conversation

@metonym
Copy link
Collaborator

@metonym metonym commented Oct 19, 2025

Closes #2281

Add tree node filtering utilities for TreeView. Three new functions enable filtering hierarchical tree structures by predicate, ID, or text search.

  • filterTreeNodes: generic predicate-based filtering
  • filterTreeById: filter by node ID(s)
  • filterTreeByText: case-insensitive text search

The filterTreeNodes function accepts a predicate function to filter nodes based on custom logic. It returns a new tree containing only matching nodes and their ancestors by default.

import { filterTreeNodes } from "carbon-components-svelte";

const tree = [
  { id: 1, text: "Documents", nodes: [
    { id: 2, text: "Work", nodes: [
      { id: 3, text: "Report.docx" }
    ]}
  ]}
];

const filtered = filterTreeNodes(tree, (node) => node.id === 3);
// Returns: [{ id: 1, text: "Documents", nodes: [{ id: 2, text: "Work", nodes: [{ id: 3, text: "Report.docx" }] }] }]

The filterTreeById function filters nodes by ID, accepting either a single ID or an array of IDs.

import { filterTreeById } from "carbon-components-svelte";

const filtered = filterTreeById(tree, 3);
// Or filter by multiple IDs:
const filtered = filterTreeById(tree, [3, 4]);

The filterTreeByText function performs case-insensitive substring matching on node text properties.

import { filterTreeByText } from "carbon-components-svelte";

const filtered = filterTreeByText(tree, "work");
// Matches any node where text contains "work" (case-insensitive)

All filter functions accept an optional options object with two properties. The includeAncestors option (default: true) includes parent nodes of matching nodes, ensuring the filtered tree maintains valid parent-child relationships. The includeChildren option (default: false) includes all descendants of matching nodes.

// Include all children of matching nodes
const filtered = filterTreeByText(tree, "Documents", { includeChildren: true });

// Exclude ancestors, only return matching nodes
const filtered = filterTreeNodes(tree, (node) => node.id === 3, { includeAncestors: false });

@metonym metonym force-pushed the master branch 3 times, most recently from 234c1f9 to e774974 Compare October 28, 2025 20:48
@metonym metonym force-pushed the metonym/treeview-filter-util branch 2 times, most recently from aa57594 to 5afafaa Compare November 9, 2025 19:53
@metonym metonym changed the title feat(tree-view): add filter utilities feat(tree-view): add filterTreeNodes utilities Nov 9, 2025
Closes #2281

Add three new filtering utilities for TreeView:
- `filterTreeNodes`: generic predicate-based filtering
- `filterTreeById`: filter by node ID(s)
- `filterTreeByText`: case-insensitive text search
@metonym metonym force-pushed the metonym/treeview-filter-util branch from 5afafaa to 94e7fa8 Compare November 9, 2025 20:06
@metonym metonym marked this pull request as ready for review November 9, 2025 20:09
@metonym metonym force-pushed the metonym/treeview-filter-util branch from 94e7fa8 to 89cabaa Compare November 9, 2025 20:19
@metonym metonym force-pushed the metonym/treeview-filter-util branch from 89cabaa to f40eaf1 Compare November 9, 2025 20:20
@metonym metonym merged commit dfcc2f7 into master Nov 9, 2025
7 checks passed
@metonym metonym deleted the metonym/treeview-filter-util branch November 9, 2025 20:22
@metonym
Copy link
Collaborator Author

metonym commented Nov 10, 2025

Released in v0.91.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

TreeView has filtering utilities

1 participant