From a48fc25fcb7fe4bddc30a1bb9e706c723d886e43 Mon Sep 17 00:00:00 2001 From: Andrew Tate Date: Wed, 16 Nov 2022 09:54:30 -0600 Subject: [PATCH 1/3] always include baseTheme with charts theme --- .../expression_gauge/public/components/gauge_component.tsx | 1 + .../public/components/heatmap_component.tsx | 1 + .../expression_metric/public/components/metric_vis.tsx | 5 ++++- 3 files changed, 6 insertions(+), 1 deletion(-) diff --git a/src/plugins/chart_expressions/expression_gauge/public/components/gauge_component.tsx b/src/plugins/chart_expressions/expression_gauge/public/components/gauge_component.tsx index 37e3ca6bdd8f1..1aad61b4ecf14 100644 --- a/src/plugins/chart_expressions/expression_gauge/public/components/gauge_component.tsx +++ b/src/plugins/chart_expressions/expression_gauge/public/components/gauge_component.tsx @@ -354,6 +354,7 @@ export const GaugeComponent: FC = memo( noResults={} debugState={window._echDebugStateFlag ?? false} theme={[{ background: { color: 'transparent' } }, chartTheme]} + baseTheme={chartsThemeService.useChartsBaseTheme()} ariaLabel={args.ariaLabel} ariaUseDefaultSummary={!args.ariaLabel} onRenderChange={onRenderChange} diff --git a/src/plugins/chart_expressions/expression_heatmap/public/components/heatmap_component.tsx b/src/plugins/chart_expressions/expression_heatmap/public/components/heatmap_component.tsx index a497a629553fa..ce7b158f1908b 100644 --- a/src/plugins/chart_expressions/expression_heatmap/public/components/heatmap_component.tsx +++ b/src/plugins/chart_expressions/expression_heatmap/public/components/heatmap_component.tsx @@ -589,6 +589,7 @@ export const HeatmapComponent: FC = memo( debugState={window._echDebugStateFlag ?? false} tooltip={tooltip} theme={[themeOverrides, chartTheme]} + baseTheme={chartsThemeService.useChartsBaseTheme()} xDomain={{ min: dateHistogramMeta && dateHistogramMeta.timeRange diff --git a/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx b/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx index e8883ad16935b..a507e230ffd8d 100644 --- a/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx +++ b/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx @@ -336,9 +336,11 @@ export const MetricVis = ({ const scrollContainerRef = useRef(null); const scrollDimensions = useResizeObserver(scrollContainerRef.current); + const baseTheme = getThemeService().useChartsBaseTheme(); + const { metric: { minHeight }, - } = getThemeService().useChartsBaseTheme(); + } = baseTheme; useEffect(() => { const minimumRequiredVerticalSpace = minHeight * grid.length; @@ -377,6 +379,7 @@ export const MetricVis = ({ }, chartTheme, ]} + baseTheme={baseTheme} onRenderChange={onRenderChange} onElementClick={(events) => { if (!filterable) { From e23c41416a54714c1d4ff92940ba393ce9be1ee0 Mon Sep 17 00:00:00 2001 From: Andrew Tate Date: Wed, 16 Nov 2022 12:50:33 -0600 Subject: [PATCH 2/3] update snap --- .../components/__snapshots__/gauge_component.test.tsx.snap | 1 + 1 file changed, 1 insertion(+) diff --git a/src/plugins/chart_expressions/expression_gauge/public/components/__snapshots__/gauge_component.test.tsx.snap b/src/plugins/chart_expressions/expression_gauge/public/components/__snapshots__/gauge_component.test.tsx.snap index 6f08439797e88..30fb883c9d15f 100644 --- a/src/plugins/chart_expressions/expression_gauge/public/components/__snapshots__/gauge_component.test.tsx.snap +++ b/src/plugins/chart_expressions/expression_gauge/public/components/__snapshots__/gauge_component.test.tsx.snap @@ -6,6 +6,7 @@ exports[`GaugeComponent renders the chart 1`] = ` > Date: Wed, 16 Nov 2022 14:59:53 -0600 Subject: [PATCH 3/3] future-proof minHeight --- .../expression_metric/public/components/metric_vis.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx b/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx index a507e230ffd8d..20cf4d48a08ef 100644 --- a/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx +++ b/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx @@ -338,9 +338,7 @@ export const MetricVis = ({ const baseTheme = getThemeService().useChartsBaseTheme(); - const { - metric: { minHeight }, - } = baseTheme; + const minHeight = chartTheme.metric?.minHeight ?? baseTheme.metric.minHeight; useEffect(() => { const minimumRequiredVerticalSpace = minHeight * grid.length;