@yugabytedb/perf-advisor-ui 1.0.134 → 1.0.136

package/dist/common/YBPagination/YBInfinitePagination.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+import { InfiniteQueryObserverResult, FetchNextPageOptions } from 'react-query';
+interface YBInfinitePaginationProps<T> {
+    dataPrefetchFn: (options?: FetchNextPageOptions | undefined) => Promise<InfiniteQueryObserverResult<T, unknown>>;
+    page: number;
+    rowsPerPage?: number;
+    rowsPerPageOptions?: number[];
+    total: number;
+    showRecordsPerPage?: boolean;
+    recordsPerPageCaption?: string | React.ReactNode;
+    onPageChange: (newPage: number) => void;
+    onPageSizeChange: (newSize: string | number) => void;
+    hasMoreData?: boolean;
+}
+export declare const YBInfinitePagination: <T>({ dataPrefetchFn, page, onPageChange, onPageSizeChange, hasMoreData, total, rowsPerPageOptions, rowsPerPage, showRecordsPerPage, recordsPerPageCaption }: YBInfinitePaginationProps<T>) => React.ReactElement;
+export {};

package/dist/common/YBPanelItem/YBPanelItem.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export interface YBPanelItemProps {
+    noBackground?: boolean;
+    className?: any;
+    bodyClassName?: any;
+    children?: any;
+    header?: any;
+    body: any;
+    title?: string;
+}
+export declare const YBPanelItem: ({ noBackground, className, bodyClassName, children, body, header, title }: YBPanelItemProps) => JSX.Element;

package/dist/common/YBTable/AnomaliesTableFooter.d.ts

@@ -0,0 +1,4 @@
+import { ReactNode } from 'react';
+import { FetchNextPageOptions, InfiniteQueryObserverResult } from 'react-query';
+export type CustomFooterFunction = (count: number, page: number, rowsPerPage: number, changeRowsPerPage: (newPage: string | number) => void, changePage: (newPage: number) => void) => ReactNode;
+export declare const getCustomFooterComponent: <T>(fetchNextPage: (options?: FetchNextPageOptions) => Promise<InfiniteQueryObserverResult<T, unknown>>, pageSizeCaptionText: string, dataLength: number, hasNextPage?: boolean) => CustomFooterFunction | undefined;

package/dist/common/YBTable/TableHelper.d.ts

@@ -0,0 +1,9 @@
+import { AppName, QueryPageParams } from '../../components';
+export declare const handleRowClick: ({ rowData, appName, onClose, onSelectedQuery, isDbQueryLoadMetadata, onNavigateToUrl }: {
+    rowData: string[];
+    appName: AppName;
+    onClose: () => void;
+    onSelectedQuery?: ((queryId: string, params: QueryPageParams) => void) | undefined;
+    isDbQueryLoadMetadata?: boolean | undefined;
+    onNavigateToUrl?: ((url: string) => void) | undefined;
+}) => void;

package/dist/common/YBToggle/YBToggleField.d.ts

@@ -0,0 +1,6 @@
+import { ReactElement } from 'react';
+import { FieldValues, UseControllerProps } from 'react-hook-form';
+import { YBToggleProps } from '@yugabyte-ui-library/core';
+type YBInputFieldProps<T extends FieldValues> = UseControllerProps<T> & YBToggleProps;
+export declare const YBToggleField: <T extends FieldValues>(props: YBInputFieldProps<T>) => ReactElement;
+export {};

package/dist/common/index.d.ts

@@ -0,0 +1,14 @@
+export { useCodeBlockStyles } from './YBCodeBlock/codeBlock';
+export { YBErrorIndicator } from './YBErrorIndicator/YBErrorIndicator';
+export { YBInputField } from './YBInput/YBInputField';
+export { YBInfinitePagination } from './YBPagination/YBInfinitePagination';
+export { YBPanelItem } from './YBPanelItem/YBPanelItem';
+export { getCustomFooterComponent } from './YBTable/AnomaliesTableFooter';
+export { YBToggleField } from './YBToggle/YBToggleField';
+export { MetricSplitSelector } from './PAHeader/MetricSplitSelector';
+export { OutlierSelector } from './PAHeader/OutlierSelector';
+export { ZoneNodeSelector } from './PAHeader/YBZoneNodeSelector';
+export { ClusterRegionSelector } from './PAHeader/YBClusterRegionSelector';
+export { YBCheckboxField } from './YBCheckbox/YBCheckboxField';
+export { PerfAdvisorCodeBlock } from './PerfAdvisorCodeBlock/PerfAdvisorCodeBlock';
+export { CopyToClipboardButton } from './CopyToClipboardButton/CopyToClipboardButton';

package/dist/components/ConfigureUniverse/ConfigureUniverseMetadata.d.ts

@@ -0,0 +1,8 @@
+import { AppName } from '../../helpers/dtos';
+interface TroubleshootConfigurationProps {
+    apiUrl: string;
+    customerUuid: string;
+    appName: AppName;
+}
+export declare const ConfigureUniverseMetadata: ({ apiUrl, customerUuid, appName }: TroubleshootConfigurationProps) => JSX.Element;
+export {};

package/dist/components/ConfigureUniverse/RemoveUniverseMetadata.d.ts

@@ -0,0 +1,10 @@
+import { MetadataFields } from '../../helpers/dtos';
+interface RemoveUniverseMetadataProps {
+    data: MetadataFields;
+    open: boolean;
+    apiUrl: string;
+    onClose: () => void;
+    onActionPerformed: () => void;
+}
+export declare const RemoveUniverseMetadata: ({ data, open, apiUrl, onClose, onActionPerformed }: RemoveUniverseMetadataProps) => JSX.Element;
+export {};

package/dist/components/ConfigureUniverse/UniverseListMetadata.d.ts

@@ -0,0 +1,14 @@
+import { MetadataFields } from '../../helpers/dtos';
+export declare enum AppStatus {
+    ACTIVE = "Active",
+    INACTIVE = "Inactive"
+}
+interface UniverseListMetadataProps {
+    metadata: MetadataFields[];
+    universeList: any[];
+    customerUuid: string;
+    apiUrl: string;
+    onActionPerformed: () => void;
+}
+export declare const UniverseListMetadata: ({ metadata, apiUrl, customerUuid, universeList, onActionPerformed }: UniverseListMetadataProps) => JSX.Element;
+export {};

package/dist/components/GanttChart/GanttChart.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { GanttChartProps } from './types';
+export declare const GanttChart: React.FC<GanttChartProps>;

package/dist/components/GanttChart/adapters/anomalyAdapter.d.ts

@@ -0,0 +1,5 @@
+import { GanttAdapterResult } from '../types';
+import { AnomalyResponse } from '../../../helpers/dtos';
+export declare function anomalyAdapter(data: AnomalyResponse | null, colorMap: Record<string, string>, options?: {
+    showMore?: boolean;
+}): GanttAdapterResult;

package/dist/components/GanttChart/adapters/backgroundJobsAdapter.d.ts

@@ -0,0 +1,3 @@
+import { TransformedBackgroundTasksResponse } from '../../../helpers/dtos';
+import { GanttAdapterResult } from '../types';
+export declare function backgroundJobsAdapter(data: TransformedBackgroundTasksResponse | null | undefined, colorMap: Record<string, string>): GanttAdapterResult;

package/dist/components/GanttChart/adapters/qpmAdapter.d.ts

@@ -0,0 +1,4 @@
+import { ProcessedQueryPlan } from '../../../helpers/utils';
+import { GanttAdapterResult, ColumnConfig } from '../types';
+export declare const QPM_COLUMN_CONFIG: ColumnConfig;
+export declare function qpmAdapter(plans: ProcessedQueryPlan[] | null | undefined): GanttAdapterResult;

package/dist/components/GanttChart/adapters/showMoreAnomalyAdapter.d.ts

@@ -0,0 +1,3 @@
+import { AnomalyGroup } from '../../../helpers/dtos';
+import { GanttAdapterResult } from '../types';
+export declare function showMoreAnomalyAdapter(groups: AnomalyGroup[] | null | undefined, colorMap: Record<string, string>): GanttAdapterResult;

package/dist/components/GanttChart/adapters/singleLevelAnomalyAdapter.d.ts

@@ -0,0 +1,3 @@
+import { AnomalyGroup } from '../../../helpers/dtos';
+import { GanttAdapterResult } from '../types';
+export declare function singleLevelAnomalyAdapter(groups: AnomalyGroup[] | null | undefined, colorMap: Record<string, string>): GanttAdapterResult;

package/dist/components/GanttChart/components/Bar.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+interface BarProps {
+    x: number;
+    width: number;
+    y: number;
+    height: number;
+    color: string;
+    onClick?: () => void;
+}
+export declare const Bar: React.NamedExoticComponent<BarProps>;
+export {};

package/dist/components/GanttChart/components/ColumnHeader.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { ColumnConfig } from '../types';
+interface ColumnHeaderProps {
+    labelWidth: number;
+    columnConfig: ColumnConfig;
+}
+export declare function getColumnHeaderHeight(columnConfig?: ColumnConfig): number;
+export declare const ColumnHeader: React.NamedExoticComponent<ColumnHeaderProps>;
+export {};

package/dist/components/GanttChart/components/GanttRefetchProgress.d.ts

@@ -0,0 +1,2 @@
+import { FC } from 'react';
+export declare const GanttRefetchProgress: FC;

package/dist/components/GanttChart/components/GroupPanel.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+import { GanttRow, LabelConfig, RowLayout, ColumnConfig } from '../types';
+interface GroupPanelProps {
+    rows: GanttRow[];
+    rowLayouts: RowLayout[];
+    expandedSet: Set<string>;
+    labelWidth: number;
+    labelConfigOverrides?: Record<number, Partial<LabelConfig>>;
+    columnConfig?: ColumnConfig;
+    onToggle: (rowId: string) => void;
+    onRowClick?: (row: GanttRow) => void;
+    onScroll: (e: React.UIEvent<HTMLDivElement>) => void;
+}
+export declare const GroupPanel: React.ForwardRefExoticComponent<GroupPanelProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/GanttChart/components/GroupRow.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+import { GanttRow, LabelConfig, RowLayout, ColumnDef } from '../types';
+interface GroupRowProps {
+    row: GanttRow;
+    expanded: boolean;
+    layout: RowLayout;
+    labelConfig: LabelConfig;
+    onToggle: (rowId: string) => void;
+    onClick?: (row: GanttRow) => void;
+    showTopSeparator: boolean;
+    isFirstRow: boolean;
+    isLastRow: boolean;
+    columnDefs?: ColumnDef[];
+    columnGap?: number;
+}
+export declare const GroupRow: React.NamedExoticComponent<GroupRowProps>;
+export {};

package/dist/components/GanttChart/components/TimeAxis.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+import { Tick } from '../hooks/useTimeScale';
+interface TimeAxisProps {
+    ticks: Tick[];
+    timezone: string;
+    intervalMs: number;
+    rowsHeight: number;
+    width: number;
+}
+declare const AXIS_HEIGHT: number;
+export declare const TimeAxis: React.NamedExoticComponent<TimeAxisProps>;
+export { AXIS_HEIGHT };

package/dist/components/GanttChart/components/TimelinePanel.d.ts

@@ -0,0 +1,24 @@
+import { default as React } from 'react';
+import { Tick } from '../hooks/useTimeScale';
+import { GanttItem, GanttRow, RowLayout } from '../types';
+interface TimelinePanelProps {
+    rows: GanttRow[];
+    rowLayouts: RowLayout[];
+    items: GanttItem[];
+    ticks: Tick[];
+    intervalMs: number;
+    timeToX: (date: Date) => number;
+    xToTime: (x: number) => Date;
+    barHeight: number;
+    timezone: string;
+    width: number;
+    headerHeight?: number;
+    showCrosshair?: boolean;
+    onBarClick?: (row: GanttRow, item: GanttItem) => void;
+    onToggle?: (rowId: string) => void;
+    onScroll: (e: React.UIEvent<HTMLDivElement>) => void;
+    enableDragZoom?: boolean;
+    onTimeRangeSelect?: (start: number, end: number) => void;
+}
+export declare const TimelinePanel: React.ForwardRefExoticComponent<TimelinePanelProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/GanttChart/config.d.ts

@@ -0,0 +1,36 @@
+import { RowConfig, LabelConfig, RowLayout, GanttRow, ColumnConfig } from './types';
+export declare const LABEL_PRESETS: {
+    level3SansSerif: {
+        3: {
+            fontSize: number;
+            fontWeight: number;
+            lineHeight: string;
+            letterSpacing: number;
+            fontFamily: string;
+        };
+    };
+    level1Monospace: {
+        1: {
+            fontSize: number;
+            fontWeight: number;
+            fontFamily: string;
+            letterSpacing: number;
+        };
+    };
+    qpmMonospace: {
+        1: {
+            width: number;
+            fontSize: number;
+            fontWeight: number;
+            fontFamily: string;
+            letterSpacing: number;
+            color: string;
+        };
+    };
+};
+export declare const DEFAULT_BAR_HEIGHT = 8;
+export declare const DEFAULT_TIMEZONE: string;
+export declare function getRowConfig(level: number, overrides?: Record<number, Partial<RowConfig>>): RowConfig;
+export declare function getLabelConfig(level: number, overrides?: Record<number, Partial<LabelConfig>>): LabelConfig;
+export declare function getColumnsWidth(columnConfig?: ColumnConfig): number;
+export declare function computeRowLayouts(rows: GanttRow[], overrides?: Record<number, Partial<RowConfig>>): RowLayout[];

package/dist/components/GanttChart/hooks/useGanttRows.d.ts

@@ -0,0 +1,9 @@
+import { GanttItem, GanttRow } from '../types';
+interface UseGanttRowsResult {
+    visibleRows: GanttRow[];
+    visibleItems: GanttItem[];
+    expandedSet: Set<string>;
+    toggleExpand: (rowId: string) => void;
+}
+export declare function useGanttRows(rows: GanttRow[], items: GanttItem[], expandAll?: boolean): UseGanttRowsResult;
+export {};

package/dist/components/GanttChart/hooks/useTimeScale.d.ts

@@ -0,0 +1,12 @@
+export interface Tick {
+    date: Date;
+    x: number;
+}
+interface TimeScaleResult {
+    timeToX: (date: Date) => number;
+    xToTime: (x: number) => Date;
+    ticks: Tick[];
+    intervalMs: number;
+}
+export declare function useTimeScale(startTime: Date, endTime: Date, width: number): TimeScaleResult;
+export {};

package/dist/components/GanttChart/index.d.ts

@@ -0,0 +1,9 @@
+export { GanttChart } from './GanttChart';
+export { GanttRefetchProgress } from './components/GanttRefetchProgress';
+export type { GanttRow, GanttItem, GanttConfig, GanttChartProps, GanttRowBadge, GanttAdapterResult, RowConfig, LabelConfig, ColumnDef, HeaderGroup, ColumnConfig } from './types';
+export { LABEL_PRESETS } from './config';
+export { anomalyAdapter } from './adapters/anomalyAdapter';
+export { showMoreAnomalyAdapter } from './adapters/showMoreAnomalyAdapter';
+export { singleLevelAnomalyAdapter } from './adapters/singleLevelAnomalyAdapter';
+export { backgroundJobsAdapter } from './adapters/backgroundJobsAdapter';
+export { qpmAdapter, QPM_COLUMN_CONFIG } from './adapters/qpmAdapter';

package/dist/components/GanttChart/types.d.ts

@@ -0,0 +1,111 @@
+import { default as React } from 'react';
+export interface GanttRowBadge {
+    text: string;
+    variant: string;
+}
+export interface TooltipContent {
+    header: string;
+    body: string;
+}
+export interface GanttRowPrefix {
+    text: string;
+    borderColor: string;
+    textColor: string;
+    tooltip?: TooltipContent;
+}
+export interface StatusDotConfig {
+    color: string;
+    tooltip?: TooltipContent;
+}
+export interface GanttRow {
+    id: string;
+    label: string;
+    level: number;
+    parentId?: string;
+    category?: string;
+    expandable: boolean;
+    displayLabel?: string;
+    badge?: GanttRowBadge;
+    prefix?: GanttRowPrefix;
+    usePrefixLayout?: boolean;
+    statusDot?: StatusDotConfig;
+    defaultExpanded?: boolean;
+    collapsible?: boolean;
+    copyable?: boolean;
+    metadata?: Record<string, unknown>;
+    columns?: Record<string, React.ReactNode>;
+    columnTooltips?: Record<string, string>;
+}
+export interface GanttItem {
+    id: string;
+    rowId: string;
+    start: Date;
+    end: Date;
+    color?: string;
+}
+export interface RowConfig {
+    height: number;
+    indent: number;
+    gap: number;
+    sectionGap: number;
+}
+export interface LabelConfig {
+    width: number;
+    fontSize: number;
+    fontWeight: number;
+    fontFamily?: string;
+    lineHeight?: string;
+    letterSpacing?: number;
+    color?: string;
+}
+export interface RowLayout {
+    height: number;
+    marginBottom: number;
+    yOffset: number;
+    indent: number;
+    gap: number;
+}
+export interface ColumnDef {
+    id: string;
+    header: string;
+    width: number;
+    align?: 'left' | 'center' | 'right';
+}
+export interface HeaderGroup {
+    id: string;
+    label: string;
+    columnIds: string[];
+}
+export interface ColumnConfig {
+    columns: ColumnDef[];
+    headerGroups?: HeaderGroup[];
+    labelHeader?: string;
+    columnGap?: number;
+}
+export interface GanttConfig {
+    startTime: Date;
+    endTime: Date;
+    timezone?: string;
+    barHeight?: number;
+    rowConfig?: Record<number, Partial<RowConfig>>;
+    labelConfig?: Record<number, Partial<LabelConfig>>;
+    colors?: Record<string, string>;
+    columnConfig?: ColumnConfig;
+}
+export interface GanttChartProps {
+    rows: GanttRow[];
+    items: GanttItem[];
+    config: GanttConfig;
+    loading?: boolean;
+    expandAll?: boolean;
+    showCrosshair?: boolean;
+    onRowClick?: (row: GanttRow, item?: GanttItem) => void;
+    onToggleExpand?: (rowId: string) => void;
+    enableDragZoom?: boolean;
+    onTimeRangeSelect?: (start: number, end: number) => void;
+    className?: string;
+}
+export interface GanttAdapterResult {
+    rows: GanttRow[];
+    items: GanttItem[];
+}

package/dist/components/GanttChart/utils/mergeIntervals.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Merges a list of potentially overlapping time intervals into the smallest
+ * set of non-overlapping intervals. Used to consolidate child anomaly spans
+ * into a single merged bar for parent rows.
+ */
+export interface TimeInterval {
+    startTime: string;
+    endTime: string;
+}
+export declare function mergeIntervals(intervals: TimeInterval[]): TimeInterval[];

package/dist/components/GanttChart/utils/severity.d.ts

@@ -0,0 +1,19 @@
+import { TooltipContent } from '../types';
+export declare enum Severity {
+    CRITICAL = "CRITICAL",
+    WARNING = "WARNING",
+    LOW = "LOW",
+    NONE = "NONE"
+}
+export declare const SEVERITY_CONFIG: Record<Severity, {
+    borderColor: string;
+    textColor: string;
+    minPercent: number;
+}>;
+export declare function getSeverityFromPercent(percent: number): Severity;
+export declare function getSeverityBorderColor(severity: Severity): string;
+export declare function getSeverityTextColor(severity: Severity): string;
+export declare function shouldShowStatusDot(severity: Severity): boolean;
+export declare function getHighestSeverity(severities: Severity[]): Severity;
+export declare function getStatusDotTooltip(severity: Severity): TooltipContent | undefined;
+export declare function getPrefixTooltip(loadPercent: number): TooltipContent;

package/dist/components/GanttChart/utils/timeFormatters.d.ts

@@ -0,0 +1,12 @@
+import { Tick } from '../hooks/useTimeScale';
+export interface MonthBoundary {
+    label: string;
+    x: number;
+}
+/**
+ * Scans ticks and returns a label + x position for each month boundary,
+ * i.e. wherever the month changes between consecutive ticks.
+ */
+export declare function getMonthBoundaries(ticks: Tick[], timezone: string): MonthBoundary[];
+export declare function formatTickLabel(date: Date, timezone: string, intervalMs: number): string;
+export declare function formatCrosshairLabel(date: Date, timezone: string): string;

package/dist/components/GanttChart/utils/truncateLabel.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Label truncation utility — shortens long row labels to fit the GroupPanel.
+ * Node/app categories truncate from the start (keeping the unique suffix),
+ * while other categories truncate from the end.
+ */
+/**
+ * Truncates a label based on category: node/app-based categories truncate from
+ * the start (keeping the unique suffix), others truncate from the end.
+ */
+interface TruncateLabelProps {
+    label: string;
+    maxChars?: number;
+    category?: string;
+}
+export declare function truncateLabel({ label, maxChars, category }: TruncateLabelProps): string;
+export {};

package/dist/components/Header/BreadCrumbsHeader.d.ts

@@ -0,0 +1,16 @@
+import { AnomalyGroup, AppName, PAUrlParams, QueryPageParams } from '../../helpers/dtos';
+interface BreadCrumbsHeaderProps {
+    appName: AppName;
+    isDrilldownView?: boolean;
+    queryObject?: any;
+    isHistoricalQueryView: boolean;
+    showStandaloneAnomalies: boolean;
+    anomalyData: AnomalyGroup | null;
+    showDetails: boolean;
+    onSelectedQuery?: (queryId: string | null, params?: QueryPageParams) => void;
+    onSelectedIssue?: (troubleshootUuid: string | null, params?: PAUrlParams) => void;
+    onShowDetails: (hasClicked: boolean) => void;
+    onNavigateToUrl?: (url: string) => void;
+}
+export declare const BreadCrumbsHeader: ({ appName, anomalyData, showDetails, isDrilldownView, isHistoricalQueryView, showStandaloneAnomalies, queryObject, onSelectedQuery, onSelectedIssue, onShowDetails, onNavigateToUrl }: BreadCrumbsHeaderProps) => JSX.Element;
+export {};

package/dist/components/Header/DateSelectorHeader.d.ts

@@ -0,0 +1,21 @@
+import { AppName, InsightsTabs, ClusterLoadSubTabs } from '../../helpers/dtos';
+export declare const MAX_LOOKBACK_DAYS = 15;
+interface DateSelectorHeaderProps {
+    appName: AppName;
+    filterDuration: string;
+    startDateTime: Date;
+    endDateTime: Date;
+    isDrilldownView?: boolean;
+    isTopKMetricsView?: boolean;
+    metricMeasure: string;
+    currentTab?: InsightsTabs;
+    showStandaloneAnomalies?: boolean;
+    clusterLoadSubTab?: ClusterLoadSubTabs | null;
+    onSelectedFilterDuration: (selectedOption: string) => void;
+    onStartDateChange: (startDate: Date | string | null) => void;
+    onEndDateChange: (endDate: Date | string | null) => void;
+    onRefresh: () => void;
+    onTimezoneChange?: (timezone: string) => void;
+}
+export declare const DateSelectorHeader: ({ appName, filterDuration, startDateTime, endDateTime, isDrilldownView, isTopKMetricsView, showStandaloneAnomalies, onSelectedFilterDuration, metricMeasure, currentTab, clusterLoadSubTab, onStartDateChange, onEndDateChange, onRefresh, onTimezoneChange }: DateSelectorHeaderProps) => JSX.Element;
+export {};

package/dist/components/Header/DbLoadHeader.d.ts

@@ -0,0 +1,14 @@
+import { SplitMode } from '../../helpers/dtos';
+interface DbLoadHeaderProps {
+    outlierType: SplitMode;
+    numNodes: number;
+    waitEventType: string;
+    isDbClusterLoadView?: boolean;
+    showOutlierSelector?: boolean;
+    showWaitEventTypeSelector?: boolean;
+    onChangeDbWaitEventType: (waitEventType: string) => void;
+    onOutlierTypeSelected: (selectedOption: SplitMode) => void;
+    onNumNodesChanged: (numNodes: number) => void;
+}
+export declare const DbLoadHeader: ({ outlierType, numNodes, waitEventType, isDbClusterLoadView, showOutlierSelector, showWaitEventTypeSelector, onChangeDbWaitEventType, onOutlierTypeSelected, onNumNodesChanged }: DbLoadHeaderProps) => JSX.Element | null;
+export {};

package/dist/components/Header/GenericHeader.d.ts

@@ -0,0 +1,30 @@
+import { AnomalyGroup, AppName, MetricMeasure, QueryTypeMode, SplitMode } from '../../helpers/dtos';
+import { ClusterRegionSelection, ZoneNodeSelection } from '../hooks/useClusterFilterState';
+interface GenericHeaderProps {
+    appName: AppName;
+    startDateTime: Date;
+    endDateTime: Date;
+    apiUrl: string;
+    universeUuid: string;
+    clusterRegionItem: string;
+    zoneNodeItem: string;
+    isPrimaryCluster: boolean;
+    cluster: string;
+    region: string;
+    queryType?: QueryTypeMode;
+    metricMeasure: string;
+    outlierType: SplitMode;
+    numNodes: number;
+    isDrilldownView?: boolean;
+    showMetricAggregator?: boolean;
+    showSplitSelector?: boolean;
+    onZoneNodeSelected: (selection: ZoneNodeSelection) => void;
+    onClusterRegionSelected: (selection: ClusterRegionSelection) => void;
+    anomalyData: AnomalyGroup | null;
+    onOutlierTypeSelected: (selectedOption: SplitMode) => void;
+    onSplitTypeSelected: (selectedOption: MetricMeasure) => void;
+    onNumNodesChanged: (numNodes: number) => void;
+    onQueryTypeSelected?: (selectedOption: QueryTypeMode) => void;
+}
+export declare const GenericHeader: ({ appName, startDateTime, endDateTime, apiUrl, universeUuid, anomalyData, clusterRegionItem, zoneNodeItem, isPrimaryCluster, cluster, region, metricMeasure, outlierType, numNodes, isDrilldownView, onZoneNodeSelected, onClusterRegionSelected, onOutlierTypeSelected, onSplitTypeSelected, onQueryTypeSelected, onNumNodesChanged, showMetricAggregator, showSplitSelector }: GenericHeaderProps) => JSX.Element;
+export {};

package/dist/components/Header/MetadataHeader.d.ts

@@ -0,0 +1,16 @@
+import { AnomalyGroup } from '../../helpers/dtos';
+interface MetadataHeaderProps {
+    isDrilldownView?: boolean;
+    isHistoricalQueryView: boolean;
+    queryObject?: any;
+    universeQueryStatsData?: any;
+    anomalyData: AnomalyGroup | null;
+    showDetails: boolean;
+    startDateTime: Date;
+    endDateTime: Date;
+    apiUrl: string;
+    universeUuid: string;
+    onShowDetails: (hasClicked: boolean) => void;
+}
+export declare const MetadataHeader: ({ anomalyData, isHistoricalQueryView, isDrilldownView, queryObject, showDetails, startDateTime, endDateTime, apiUrl, universeUuid, universeQueryStatsData, onShowDetails }: MetadataHeaderProps) => JSX.Element;
+export {};

package/dist/components/Header/TimezoneSelector.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+interface TimezoneSelectorProps {
+    value: string;
+    onChange: (timezone: string) => void;
+    dataTestId?: string;
+    className?: string;
+}
+export declare const TimezoneSelector: ({ value, onChange, dataTestId, className }: TimezoneSelectorProps) => JSX.Element;
+export {};

package/dist/components/Header/metadata/AnomalyMetadataFields.d.ts

@@ -0,0 +1,12 @@
+import { AnomalyGroup, QueryPlanData } from '../../../helpers/dtos';
+interface AnomalyMetadataFieldsProps {
+    anomalyData: AnomalyGroup;
+    anomalyCategory: string | undefined;
+    isAnomalyTabletType: boolean;
+    universeQueryStatsData?: QueryPlanData[];
+    regionName: string;
+    zoneName: string;
+}
+/** Assembles the anomaly (non-historical) metadata columns for a given category. */
+export declare const AnomalyMetadataFields: (props: AnomalyMetadataFieldsProps) => JSX.Element;
+export {};

package/dist/components/Header/metadata/MetadataField.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+export interface MetadataFieldConfig {
+    key: string;
+    label: ReactNode;
+    value?: ReactNode;
+    /** Full value shown in a tooltip on hover (used when the value is truncated). */
+    tooltip?: string;
+    /**
+     * regular -> regularMetadata span (anomaly drilldown columns)
+     * tag     -> anomalyTypeTag/anomalyTypeText chip (the ANOMALY column)
+     * plain   -> bare value, no metadata class (historical query columns)
+     */
+    valueVariant?: 'regular' | 'tag' | 'plain';
+    /** When defined, render a copy icon that copies this text. */
+    copyText?: string;
+    copyAltText?: string;
+    /** Layout overrides used by the historical query columns. */
+    flex?: number;
+    alignItems?: 'flex-start';
+}
+/** A single labeled metadata column (label on top, value below). */
+export declare const MetadataField: ({ label, value, tooltip, valueVariant, copyText, copyAltText, flex, alignItems }: Omit<MetadataFieldConfig, 'key'>) => JSX.Element;

package/dist/components/Header/metadata/index.d.ts

@@ -0,0 +1,4 @@
+export { MetadataField } from './MetadataField';
+export type { MetadataFieldConfig } from './MetadataField';
+export { buildSqlMetadataFields } from './sqlMetadataFields';
+export { AnomalyMetadataFields } from './AnomalyMetadataFields';