+
${prefixText ? html`
${prefixText}` : ''}
` moves it into (`overflow`) / out of its popover. */
+ @property({ attribute: 'slot' }) slot = '';
+
+ @state() private _selected = new Set
();
+
+ private _anchorName = `--facet-anchor-${nextId++}`;
+ private _popoverId = `facet-popover-${nextId}`;
+
+ static styles = [
+ globalStyles,
+ css`
+ :host {
+ display: inline-flex;
+ }
+
+ /* In the overflow panel the control is a full-width row: label + checklist. */
+ :host([slot='overflow']) {
+ display: block;
+ width: 100%;
+ }
+
+ /* Aligned row: label column (shared width) + control column. */
+ .facet-panel {
+ display: grid;
+ grid-template-columns: var(--filter-panel-label-width) 1fr;
+ column-gap: 8px;
+ row-gap: 4px;
+ align-items: start;
+ }
+
+ .facet-panel__label {
+ grid-column: 1;
+ font-size: var(--filter-control-font-size);
+ font-weight: 600;
+ color: var(--vscode-foreground);
+ /* Nudge onto the first option row's baseline. */
+ padding-top: 3px;
+ }
+
+ .facet-panel__options {
+ grid-column: 2;
+ display: flex;
+ flex-direction: column;
+ gap: 2px;
+ max-height: 180px;
+ overflow-y: auto;
+ }
+
+ .facet-panel .facet-popover__clear {
+ grid-column: 2;
+ width: auto;
+ padding: 2px 0;
+ }
+
+ .facet-trigger__count {
+ font-weight: 600;
+ color: var(--vscode-badge-foreground);
+ background-color: var(--vscode-badge-background);
+ border-radius: 999px;
+ padding: 0 5px;
+ font-size: 10px;
+ line-height: 1.5;
+ visibility: hidden;
+ }
+
+ .facet-trigger__count.visible {
+ visibility: visible;
+ }
+
+ .facet-trigger__chevron {
+ color: var(--vscode-descriptionForeground);
+ }
+
+ .facet-popover {
+ position: fixed;
+ position-area: bottom span-left;
+ /* Flip above / to the other side when the default placement would run
+ off-screen, so every value stays visible. */
+ position-try-fallbacks:
+ flip-block,
+ flip-inline,
+ flip-block flip-inline;
+ /* Auto-hide when the trigger scrolls out of view instead of stranding
+ at stale fixed coords in the top layer. */
+ position-visibility: anchors-visible;
+ inset: auto;
+ margin: 6px 0 0 0;
+ /* Hug the widest option row's content; never narrower than the
+ trigger button itself (anchor-size reads the anchored trigger's
+ box β same content-sizing contract as VsSelect's '.dropdown'). */
+ width: max-content;
+ min-width: anchor-size(width);
+ max-width: min(92vw, 280px);
+ max-height: min(60vh, 360px);
+ overflow-y: auto;
+ padding: 4px;
+ }
+
+ .facet-option {
+ display: flex;
+ align-items: center;
+ gap: 6px;
+ }
+
+ .facet-option span {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ .facet-popover__empty {
+ padding: 6px 8px;
+ color: var(--vscode-descriptionForeground);
+ font-size: 12px;
+ }
+
+ .facet-popover__footer {
+ margin-top: 2px;
+ border-top: 1px solid var(--divider-background, var(--vscode-menu-separatorBackground));
+ }
+
+ .facet-popover__clear {
+ display: block;
+ width: 100%;
+ padding: 4px 8px;
+ border: none;
+ background: none;
+ color: var(--vscode-textLink-foreground);
+ font: inherit;
+ font-size: 12px;
+ text-align: left;
+ cursor: pointer;
+ visibility: hidden;
+ }
+
+ .facet-popover__clear.visible {
+ visibility: visible;
+ }
+
+ .facet-popover__clear:hover {
+ color: var(--vscode-textLink-activeForeground);
+ }
+ `,
+ ];
+
+ render() {
+ return this.slot === 'overflow' ? this._renderPanel() : this._renderInline();
+ }
+
+ /** Compact bar pill that opens the checklist in a native popover. */
+ private _renderInline() {
+ const count = this._selected.size;
+ return html`
+
+
+ ${this._options()}
+
+
+ `;
+ }
+
+ /** Full-width row (inside the overflow panel): label + inline checklist. */
+ private _renderPanel() {
+ const count = this._selected.size;
+ return html`
+
+
${this.label}
+
${this._options()}
+ ${
+ count > 0
+ ? html`
`
+ : ''
+ }
+
No values
`
+ : this.values.map(
+ (value) => html`
+
+ `,
+ );
+ }
+
+ private _toggle(value: string): void {
+ const next = new Set(this._selected);
+ if (next.has(value)) {
+ next.delete(value);
+ } else {
+ next.add(value);
+ }
+ this._selected = next;
+ this._emit();
+ }
+
+ private _clear(): void {
+ this._selected = new Set();
+ this._emit();
+ }
+
+ private _emit(): void {
+ this.dispatchEvent(
+ new CustomEvent('datagrid-facet-change', {
+ detail: { selected: [...this._selected] },
+ bubbles: true,
+ composed: true,
+ }),
+ );
+ }
+}
+
+declare global {
+ interface HTMLElementTagNameMap {
+ 'datagrid-facet-filter': DatagridFacetFilter;
+ }
+}
diff --git a/log-viewer/src/components/datagrid-filter-bar.ts b/log-viewer/src/components/datagrid-filter-bar.ts
index 9e7908d8..31327786 100644
--- a/log-viewer/src/components/datagrid-filter-bar.ts
+++ b/log-viewer/src/components/datagrid-filter-bar.ts
@@ -42,18 +42,41 @@ export class DatagridFilterBar extends LitElement {
display: flex;
align-items: flex-end;
gap: 8px;
+ /* Allow the clusters to shrink below content width so a section's
+ overflow-list receives a constrained width and can collapse. */
+ min-width: 0;
}
- /* Right cluster consumes the slack and right-aligns grouping + actions. */
- .filter-bar__right {
+ /* Left cluster consumes the slack (via its growable filters section) so a
+ collapsed overflow-list regains width and can re-expand on widen; the
+ right cluster then sits at the far edge with no growth. */
+ .filter-bar__left {
flex: 1 1 auto;
- justify-content: flex-end;
+ }
+
+ .filter-bar__right {
+ flex: 0 0 auto;
}
.section {
display: flex;
align-items: flex-end;
gap: 4px;
+ /* Shrinkable so the filters section can hand its overflow-list a
+ bounded width (min-width:auto would keep it at content size). */
+ min-width: 0;
+ }
+
+ /* Filters section takes the left cluster's slack and passes it to its
+ slotted overflow-list, so the list always knows the full width
+ available and can re-expand collapsed items when the bar widens. */
+ .section--grow {
+ flex: 1 1 auto;
+ }
+
+ .section--grow ::slotted([slot='filters']) {
+ flex: 1 1 auto;
+ min-width: 0;
}
.section[hidden] {
@@ -102,7 +125,7 @@ export class DatagridFilterBar extends LitElement {
${filtersDivider ? this._divider() : nothing}
-
diff --git a/log-viewer/src/components/datagrid-range-filter.ts b/log-viewer/src/components/datagrid-range-filter.ts
new file mode 100644
index 00000000..653d765c
--- /dev/null
+++ b/log-viewer/src/components/datagrid-range-filter.ts
@@ -0,0 +1,288 @@
+/*
+ * Copyright (c) 2026 Certinia Inc. All rights reserved.
+ */
+import '#vscode-elements/vscode-icon.js';
+
+import { LitElement, css, html } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+
+import { globalStyles } from '../styles/global.styles.js';
+
+let nextId = 0;
+
+export type FilterRange = { start: number | null; end: number | null };
+
+/**
+ * Min/max range control for the datagrid filter bar's `filters` slot β a pill
+ * that opens a native-popover with two number inputs (replaces per-column
+ * `headerFilter: MinMaxEditor`). Purely presentational: on Enter/blur it fires
+ * `datagrid-range-change` with `{ start, end }` (each `null` when empty), and
+ * the host owns turning that into a filter predicate.
+ */
+@customElement('datagrid-range-filter')
+export class DatagridRangeFilter extends LitElement {
+ @property() label = '';
+ /** Optional unit suffix shown on the trigger, e.g. "ms". */
+ @property() unit = '';
+ /** Reactive mirror of the native `slot` attribute so the element re-renders
+ * when `
` moves it into (`overflow`) / out of its popover. */
+ @property({ attribute: 'slot' }) slot = '';
+
+ @state() private _start: string = '';
+ @state() private _end: string = '';
+
+ private _debounceHandle?: ReturnType;
+ private _anchorName = `--range-anchor-${nextId++}`;
+ private _popoverId = `range-popover-${nextId}`;
+
+ static styles = [
+ globalStyles,
+ css`
+ :host {
+ display: inline-flex;
+ }
+
+ /* In the overflow panel the control is a full-width row of inline inputs. */
+ :host([slot='overflow']) {
+ display: block;
+ width: 100%;
+ }
+
+ /* Aligned row: label column (shared width) + control column. */
+ .range-panel {
+ display: grid;
+ grid-template-columns: var(--filter-panel-label-width) 1fr;
+ align-items: center;
+ column-gap: 8px;
+ }
+
+ .range-panel__label {
+ grid-column: 1;
+ font-size: var(--filter-control-font-size);
+ color: var(--vscode-foreground);
+ white-space: nowrap;
+ }
+
+ .range-panel__control {
+ grid-column: 2;
+ display: flex;
+ align-items: center;
+ gap: 6px;
+ }
+
+ .range-panel__unit {
+ font-size: 11px;
+ color: var(--vscode-descriptionForeground);
+ }
+
+ .range-trigger {
+ font-variant-numeric: tabular-nums;
+ }
+
+ .range-trigger__chevron {
+ color: var(--vscode-descriptionForeground);
+ }
+
+ .range-popover {
+ position: fixed;
+ position-area: bottom span-left;
+ /* Flip above / to the other side when the default placement would run
+ off-screen so the inputs stay visible. */
+ position-try-fallbacks:
+ flip-block,
+ flip-inline,
+ flip-block flip-inline;
+ /* Auto-hide when the trigger scrolls out of view instead of stranding
+ at stale fixed coords in the top layer. */
+ position-visibility: anchors-visible;
+ inset: auto;
+ margin: 6px 0 0 0;
+ padding: 8px;
+ }
+
+ /* Flex layout only while open β a class-level display would beat the UA
+ [popover]:not(:popover-open){display:none} rule and keep the closed
+ popover laid out (visible behind other content). */
+ .range-popover:popover-open {
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
+ }
+
+ .range-popover__inputs {
+ display: flex;
+ align-items: center;
+ gap: 6px;
+ }
+
+ .range-popover__input {
+ width: 8ch;
+ box-sizing: border-box;
+ padding: 3px 6px;
+ font: inherit;
+ font-size: 12px;
+ color: var(--vscode-settings-numberInputForeground);
+ background-color: var(--vscode-settings-numberInputBackground);
+ border: 1px solid var(--vscode-settings-numberInputBorder, transparent);
+ border-radius: 4px;
+ appearance: textfield;
+ }
+
+ .range-popover__input::-webkit-outer-spin-button,
+ .range-popover__input::-webkit-inner-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+ }
+
+ .range-popover__input:focus {
+ outline: 1px solid var(--vscode-focusBorder);
+ outline-offset: -1px;
+ }
+
+ .range-popover__clear {
+ align-self: flex-start;
+ padding: 2px 0;
+ border: none;
+ background: none;
+ color: var(--vscode-textLink-foreground);
+ font: inherit;
+ font-size: 12px;
+ cursor: pointer;
+ }
+
+ .range-popover__clear:hover {
+ color: var(--vscode-textLink-activeForeground);
+ }
+ `,
+ ];
+
+ render() {
+ return this.slot === 'overflow' ? this._renderPanel() : this._renderInline();
+ }
+
+ /** Compact bar pill that opens the min/max inputs in a native popover. */
+ private _renderInline() {
+ const active = this._start !== '' || this._end !== '';
+ const summary = active
+ ? `${this.label}: ${this._start || 'β¦'}β${this._end || 'β¦'}${this.unit}`
+ : this.label;
+
+ return html`
+
+
+ ${this._inputs()}
+ ${
+ active
+ ? html``
+ : ''
+ }
+
+ `;
+ }
+
+ /** Full-width row (inside the overflow panel): label + inline min/max inputs. */
+ private _renderPanel() {
+ const active = this._start !== '' || this._end !== '';
+ return html`
+
+
${this.label}
+
+ ${this._inputs()}
+ ${this.unit ? html`${this.unit}` : ''}
+ ${
+ active
+ ? html``
+ : ''
+ }
+
+
+
+
+
`;
+ }
+
+ private _onInput(event: Event): void {
+ const inputs = this.renderRoot.querySelectorAll('.range-popover__input');
+ this._start = inputs[0]?.value ?? '';
+ this._end = inputs[1]?.value ?? '';
+ event.stopPropagation();
+ clearTimeout(this._debounceHandle);
+ this._debounceHandle = setTimeout(() => this._emit(), 150);
+ }
+
+ private _onKeydown(event: KeyboardEvent): void {
+ if (event.key === 'Enter') {
+ clearTimeout(this._debounceHandle);
+ this._emit();
+ (event.target as HTMLInputElement).blur();
+ }
+ }
+
+ private _clear(): void {
+ clearTimeout(this._debounceHandle);
+ this._start = '';
+ this._end = '';
+ this._emit();
+ }
+
+ private _emit(): void {
+ this.dispatchEvent(
+ new CustomEvent<{ range: FilterRange }>('datagrid-range-change', {
+ detail: {
+ range: {
+ start: this._start !== '' ? +this._start : null,
+ end: this._end !== '' ? +this._end : null,
+ },
+ },
+ bubbles: true,
+ composed: true,
+ }),
+ );
+ }
+}
+
+declare global {
+ interface HTMLElementTagNameMap {
+ 'datagrid-range-filter': DatagridRangeFilter;
+ }
+}
diff --git a/log-viewer/src/features/analysis/components/AnalysisView.ts b/log-viewer/src/features/analysis/components/AnalysisView.ts
index 18b1f108..b0ea0529 100644
--- a/log-viewer/src/features/analysis/components/AnalysisView.ts
+++ b/log-viewer/src/features/analysis/components/AnalysisView.ts
@@ -2,7 +2,6 @@
* Copyright (c) 2022 Certinia Inc. All rights reserved.
*/
import '#vscode-elements/vscode-button.js';
-import '#vscode-elements/vscode-checkbox.js';
import '#vscode-elements/vscode-option.js';
import '../../../components/VsSelect.js';
import '#vscode-elements/vscode-toolbar-button.js';
@@ -41,8 +40,8 @@ import { globalStyles } from '../../../styles/global.styles.js';
import { soqlSyntaxStyles } from '../../soql/styles/soql-syntax.css.js';
// Components
-import '../../../components/GridSkeleton.js';
import '../../../components/datagrid-filter-bar.js';
+import '../../../components/GridSkeleton.js';
/** The Name column is always shown in the analysis table. */
const ALWAYS_VISIBLE = ['text'];
@@ -92,6 +91,15 @@ export class AnalysisView extends LitElement {
gap: 4px;
align-items: flex-end;
}
+
+ .filter-container vscode-button {
+ height: var(--filter-control-height);
+ }
+
+ .filter-container vscode-button::part(base) {
+ padding: var(--filter-control-padding);
+ font-size: var(--filter-control-font-size);
+ }
`,
categoryColoringStyles,
];
@@ -188,6 +196,7 @@ export class AnalysisView extends LitElement {
>
- Details
+
true,
showDetailsFilter: this._showDetailsFilter,
onFilterCacheClear: () => {
if (!this.blockClearHighlights && this.totalMatches > 0) {
diff --git a/log-viewer/src/features/call-tree/components/AggregatedTable.ts b/log-viewer/src/features/call-tree/components/AggregatedTable.ts
index 0f371930..13ee669d 100644
--- a/log-viewer/src/features/call-tree/components/AggregatedTable.ts
+++ b/log-viewer/src/features/call-tree/components/AggregatedTable.ts
@@ -6,8 +6,6 @@ import { Tabulator } from 'tabulator-tables';
import { vscodeMessenger } from '../../../core/messaging/VSCodeExtensionMessenger.js';
import { formatDuration } from '../../../core/utility/Util.js';
-import MinMaxEditor from '../../../tabulator/editors/MinMax.js';
-import { minMaxTreeFilter } from '../../../tabulator/filters/MinMax.js';
import { progressFormatterMS } from '../../../tabulator/format/ProgressMS.js';
import { VirtualVerticalRenderer } from '../../../tabulator/renderer/VirtualVerticalRenderer.js';
import { toAggregatedCallTree, type AggregatedRow } from '../utils/Aggregation.js';
@@ -32,10 +30,6 @@ export function createAggregatedTable(
): { table: Tabulator; tableBuilt: Promise } {
registerTableModules();
- const namespaceFilterCache = new Map();
- const totalTimeFilterCache = new Map();
- const selfTimeFilterCache = new Map();
-
let childIndent: number | undefined;
const tableRef: { current: Tabulator | undefined } = { current: undefined };
@@ -124,15 +118,6 @@ export function createAggregatedTable(
sorter: 'string',
width: 100,
minWidth: 80,
- headerFilter: 'list',
- headerFilterFunc: callbacks.namespaceFilter,
- headerFilterFuncParams: { filterCache: namespaceFilterCache },
- headerFilterParams: {
- values: rootMethod.namespaces,
- clearable: true,
- multiselect: true,
- },
- headerFilterLiveFilter: false,
},
{
title: 'Caller Namespace',
@@ -171,10 +156,6 @@ export function createAggregatedTable(
bottomCalcFormatter: progressFormatterMS,
bottomCalc: 'sum',
bottomCalcFormatterParams: { precision: 2, totalValue: rootMethod.duration.total },
- headerFilter: MinMaxEditor,
- headerFilterFunc: minMaxTreeFilter,
- headerFilterFuncParams: { columnName: 'totalTime', filterCache: totalTimeFilterCache },
- headerFilterLiveFilter: false,
tooltip: (_event, cell) => formatDuration(cell.getValue()),
},
{
@@ -194,10 +175,6 @@ export function createAggregatedTable(
bottomCalcFormatter: progressFormatterMS,
bottomCalc: selfTimeBottomCalc,
bottomCalcFormatterParams: { precision: 2, totalValue: rootMethod.duration.total },
- headerFilter: MinMaxEditor,
- headerFilterFunc: minMaxTreeFilter,
- headerFilterFuncParams: { columnName: 'totalSelfTime', filterCache: selfTimeFilterCache },
- headerFilterLiveFilter: false,
tooltip: (_event, cell) => formatDuration(cell.getValue()),
},
{
@@ -217,18 +194,15 @@ export function createAggregatedTable(
});
tableRef.current = table;
- // Filter caches are cleared once per render via `renderStarted`. Row ids
- // produced by `toAggregatedCallTree` are globally unique within a build
- // (per-build monotonic counter), so cached `deepFilter` results stay valid
- // across the cascaded `filter.filter()` passes Tabulator runs for each
- // expanded subtree β `getChildren` β `filter.filter(config.children)`
- // would otherwise fire `dataFiltered` multiple times per user action,
- // defeating the cache. If row ids ever lose their uniqueness guarantee
- // this must move back to `dataFiltered`.
+ // The host's filter caches (search/type/debug/namespace/duration) are cleared once per
+ // render via `renderStarted` β see CalltreeView's `onFilterCacheClear`. Row ids produced
+ // by `toAggregatedCallTree` are globally unique within a build (per-build monotonic
+ // counter), so cached `deepFilter` results stay valid across the cascaded
+ // `filter.filter()` passes Tabulator runs for each expanded subtree β
+ // `getChildren` β `filter.filter(config.children)` would otherwise fire `dataFiltered`
+ // multiple times per user action, defeating the cache. If row ids ever lose their
+ // uniqueness guarantee this must move back to `dataFiltered`.
table.on('renderStarted', () => {
- namespaceFilterCache.clear();
- totalTimeFilterCache.clear();
- selfTimeFilterCache.clear();
callbacks.onFilterCacheClear?.();
callbacks.onRenderStarted();
});
diff --git a/log-viewer/src/features/call-tree/components/BottomUpTable.ts b/log-viewer/src/features/call-tree/components/BottomUpTable.ts
index c69da3c3..5f8b6bca 100644
--- a/log-viewer/src/features/call-tree/components/BottomUpTable.ts
+++ b/log-viewer/src/features/call-tree/components/BottomUpTable.ts
@@ -6,8 +6,6 @@ import { Tabulator, type Options } from 'tabulator-tables';
import { vscodeMessenger } from '../../../core/messaging/VSCodeExtensionMessenger.js';
import { formatDuration } from '../../../core/utility/Util.js';
-import MinMaxEditor from '../../../tabulator/editors/MinMax.js';
-import MinMaxFilter from '../../../tabulator/filters/MinMax.js';
import { progressFormatterMS } from '../../../tabulator/format/ProgressMS.js';
import { GroupCalcs } from '../../../tabulator/groups/GroupCalcs.js';
import { GroupChildIndent } from '../../../tabulator/groups/GroupChildIndent.js';
@@ -186,14 +184,6 @@ export function createBottomUpTable(
sorter: 'string',
width: 100,
minWidth: 80,
- headerFilter: 'list',
- headerFilterFunc: 'in',
- headerFilterParams: {
- values: rootMethod.namespaces,
- clearable: true,
- multiselect: true,
- },
- headerFilterLiveFilter: false,
},
{
title: 'Caller Namespace',
@@ -240,9 +230,6 @@ export function createBottomUpTable(
bottomCalcFormatter: progressFormatterMS,
bottomCalc: totalTimeBottomCalc,
bottomCalcFormatterParams: { precision: 2, totalValue: rootMethod.duration.total },
- headerFilter: MinMaxEditor,
- headerFilterFunc: MinMaxFilter,
- headerFilterLiveFilter: false,
tooltip: (_event, cell) => formatDuration(cell.getValue()),
},
{
@@ -262,9 +249,6 @@ export function createBottomUpTable(
bottomCalcFormatter: progressFormatterMS,
bottomCalc: 'sum',
bottomCalcFormatterParams: { precision: 2, totalValue: rootMethod.duration.total },
- headerFilter: MinMaxEditor,
- headerFilterFunc: MinMaxFilter,
- headerFilterLiveFilter: false,
tooltip: (_event, cell) => formatDuration(cell.getValue()),
},
{
diff --git a/log-viewer/src/features/call-tree/components/CalltreeView.ts b/log-viewer/src/features/call-tree/components/CalltreeView.ts
index e09731a9..1bffa979 100644
--- a/log-viewer/src/features/call-tree/components/CalltreeView.ts
+++ b/log-viewer/src/features/call-tree/components/CalltreeView.ts
@@ -2,7 +2,6 @@
* Copyright (c) 2022 Certinia Inc. All rights reserved.
*/
import '#vscode-elements/vscode-button.js';
-import '#vscode-elements/vscode-checkbox.js';
import '#vscode-elements/vscode-option.js';
import '#vscode-elements/vscode-toolbar-button.js';
import '../../../components/VsSelect.js';
@@ -27,6 +26,8 @@ import { deepFilter } from '../utils/DetailsFilter.js';
import { expandCollapseAll } from '../utils/ExpandCollapse.js';
import type { TimeOrderRow } from '../utils/TimeOrderTree.js';
+import { inMsRange, type FilterRange } from '../../../tabulator/filters/MinMax.js';
+
import dataGridStyles from '../../../tabulator/style/DataGrid.scss';
// styles
@@ -37,7 +38,10 @@ import { soqlSyntaxStyles } from '../../soql/styles/soql-syntax.css.js';
import '../../../components/ContextMenu.js';
import type { ContextMenu } from '../../../components/ContextMenu.js';
import '../../../components/GridSkeleton.js';
+import '../../../components/datagrid-facet-filter.js';
import '../../../components/datagrid-filter-bar.js';
+import '../../../components/datagrid-range-filter.js';
+import '../../../components/OverflowList.js';
// Table creation functions
import { createAggregatedTable } from './AggregatedTable.js';
@@ -91,14 +95,19 @@ export class CalltreeView extends LitElement {
};
bottomUpGroupBy = 'None';
typeFilter = 'All';
+ namespaceSelected: string[] = [];
+ totalTimeRange: FilterRange = { start: null, end: null };
+ selfTimeRange: FilterRange = { start: null, end: null };
debugOnlyFilterCache = new Map();
typeFilterCache = new Map();
+ namespaceFilterCache = new Map();
+ totalTimeFilterCache = new Map();
+ selfTimeFilterCache = new Map();
findMap: { [key: number]: RowComponent } = {};
totalMatches = 0;
blockClearHighlights = true;
- searchString = '';
findArgs: { text: string; count: number; options: { matchCase: boolean } } = {
text: '',
count: 0,
@@ -211,12 +220,15 @@ export class CalltreeView extends LitElement {
gap: 0;
}
- .view-mode-buttons vscode-button {
- height: 26px;
+ .view-mode-buttons vscode-button,
+ .filter-container vscode-button {
+ height: var(--filter-control-height);
}
- .view-mode-buttons vscode-button::part(base) {
- padding: 0 8px;
+ .view-mode-buttons vscode-button::part(base),
+ .filter-container vscode-button::part(base) {
+ padding: var(--filter-control-padding);
+ font-size: var(--filter-control-font-size);
}
.view-mode-buttons vscode-button:first-child {
@@ -291,6 +303,7 @@ export class CalltreeView extends LitElement {
>