diff --git a/src/plugins/controls/public/control_group/utils/is_compressed.ts b/src/plugins/controls/public/control_group/utils/is_compressed.ts
index 331305c4934e6..46f7f27b66251 100644
--- a/src/plugins/controls/public/control_group/utils/is_compressed.ts
+++ b/src/plugins/controls/public/control_group/utils/is_compressed.ts
@@ -9,11 +9,11 @@
 
 import { apiHasParentApi } from '@kbn/presentation-publishing';
 
-export interface HasCompressed {
+interface HasCompressed {
   compressed: boolean;
 }
 
-export const apiHasCompressed = (unknownApi: unknown): unknownApi is HasCompressed => {
+const apiHasCompressed = (unknownApi: unknown): unknownApi is HasCompressed => {
   return Boolean(unknownApi) && typeof (unknownApi as HasCompressed).compressed === 'boolean';
 };
 
diff --git a/src/plugins/controls/public/controls/data_controls/range_slider/components/range_slider_control.tsx b/src/plugins/controls/public/controls/data_controls/range_slider/components/range_slider_control.tsx
index 16c7ad967e8df..a05957d083086 100644
--- a/src/plugins/controls/public/controls/data_controls/range_slider/components/range_slider_control.tsx
+++ b/src/plugins/controls/public/controls/data_controls/range_slider/components/range_slider_control.tsx
@@ -33,6 +33,7 @@ interface Props {
   value: RangeValue | undefined;
   uuid: string;
   controlPanelClassName?: string;
+  compressed: boolean;
 }
 
 export const RangeSliderControl: FC<Props> = ({
@@ -46,6 +47,7 @@ export const RangeSliderControl: FC<Props> = ({
   value,
   uuid,
   controlPanelClassName,
+  compressed,
 }: Props) => {
   const rangeSliderRef = useRef<EuiDualRangeProps | null>(null);
 
@@ -194,7 +196,7 @@ export const RangeSliderControl: FC<Props> = ({
         min={displayedMin}
         max={displayedMax}
         isLoading={isLoading}
-        compressed
+        compressed={compressed}
         inputPopoverProps={{
           className: controlPanelClassName,
           panelMinWidth: MIN_POPOVER_WIDTH,
diff --git a/src/plugins/controls/public/controls/data_controls/range_slider/get_range_slider_control_factory.tsx b/src/plugins/controls/public/controls/data_controls/range_slider/get_range_slider_control_factory.tsx
index 0605fe4586abb..3d0fa52c6a113 100644
--- a/src/plugins/controls/public/controls/data_controls/range_slider/get_range_slider_control_factory.tsx
+++ b/src/plugins/controls/public/controls/data_controls/range_slider/get_range_slider_control_factory.tsx
@@ -14,6 +14,7 @@ import { EuiFieldNumber, EuiFormRow } from '@elastic/eui';
 import { Filter, RangeFilterParams, buildRangeFilter } from '@kbn/es-query';
 import { useBatchedPublishingSubjects } from '@kbn/presentation-publishing';
 
+import { isCompressed } from '../../../control_group/utils/is_compressed';
 import { RANGE_SLIDER_CONTROL } from '../../../../common';
 import { initializeDataControl } from '../initialize_data_control';
 import type { DataControlFactory } from '../types';
@@ -248,6 +249,7 @@ export const getRangesliderControlFactory = (): DataControlFactory<
               step={step ?? 1}
               value={value}
               uuid={uuid}
+              compressed={isCompressed(api)}
             />
           );
         },
diff --git a/src/plugins/controls/public/controls/timeslider_control/components/time_slider_anchored_range.tsx b/src/plugins/controls/public/controls/timeslider_control/components/time_slider_anchored_range.tsx
index 0ab4a467e8694..88cd7fb1f1034 100644
--- a/src/plugins/controls/public/controls/timeslider_control/components/time_slider_anchored_range.tsx
+++ b/src/plugins/controls/public/controls/timeslider_control/components/time_slider_anchored_range.tsx
@@ -19,6 +19,7 @@ interface Props {
   ticks: EuiRangeTick[];
   timeRangeMin: number;
   timeRangeMax: number;
+  compressed: boolean;
 }
 
 export function TimeSliderAnchoredRange(props: Props) {
@@ -40,7 +41,7 @@ export function TimeSliderAnchoredRange(props: Props) {
       max={props.timeRangeMax}
       step={props.stepSize}
       ticks={props.ticks}
-      compressed
+      compressed={props.compressed}
     />
   );
 }
diff --git a/src/plugins/controls/public/controls/timeslider_control/components/time_slider_popover_content.tsx b/src/plugins/controls/public/controls/timeslider_control/components/time_slider_popover_content.tsx
index 0d45797d42799..fc4d050d71d59 100644
--- a/src/plugins/controls/public/controls/timeslider_control/components/time_slider_popover_content.tsx
+++ b/src/plugins/controls/public/controls/timeslider_control/components/time_slider_popover_content.tsx
@@ -24,6 +24,7 @@ interface Props {
   ticks: EuiRangeTick[];
   timeRangeMin: number;
   timeRangeMax: number;
+  compressed: boolean;
 }
 
 export function TimeSliderPopoverContent(props: Props) {
@@ -35,6 +36,7 @@ export function TimeSliderPopoverContent(props: Props) {
       ticks={props.ticks}
       timeRangeMin={props.timeRangeMin}
       timeRangeMax={props.timeRangeMax}
+      compressed={props.compressed}
     />
   ) : (
     <TimeSliderSlidingWindowRange
@@ -44,6 +46,7 @@ export function TimeSliderPopoverContent(props: Props) {
       ticks={props.ticks}
       timeRangeMin={props.timeRangeMin}
       timeRangeMax={props.timeRangeMax}
+      compressed={props.compressed}
     />
   );
   const anchorStartToggleButtonLabel = props.isAnchored
diff --git a/src/plugins/controls/public/controls/timeslider_control/components/time_slider_sliding_window_range.tsx b/src/plugins/controls/public/controls/timeslider_control/components/time_slider_sliding_window_range.tsx
index aa699a3082ebd..f1b93ccfb57a8 100644
--- a/src/plugins/controls/public/controls/timeslider_control/components/time_slider_sliding_window_range.tsx
+++ b/src/plugins/controls/public/controls/timeslider_control/components/time_slider_sliding_window_range.tsx
@@ -18,6 +18,7 @@ interface Props {
   ticks: EuiRangeTick[];
   timeRangeMin: number;
   timeRangeMax: number;
+  compressed: boolean;
 }
 
 export function TimeSliderSlidingWindowRange(props: Props) {
@@ -36,7 +37,7 @@ export function TimeSliderSlidingWindowRange(props: Props) {
       step={props.stepSize}
       ticks={props.ticks}
       isDraggable
-      compressed
+      compressed={props.compressed}
     />
   );
 }
diff --git a/src/plugins/controls/public/controls/timeslider_control/get_timeslider_control_factory.tsx b/src/plugins/controls/public/controls/timeslider_control/get_timeslider_control_factory.tsx
index b7d5b6f077080..a0c6c237ace00 100644
--- a/src/plugins/controls/public/controls/timeslider_control/get_timeslider_control_factory.tsx
+++ b/src/plugins/controls/public/controls/timeslider_control/get_timeslider_control_factory.tsx
@@ -37,6 +37,7 @@ import {
   roundUpToNextStepSizeFactor,
 } from './time_utils';
 import { Timeslice, TimesliderControlApi, TimesliderControlState } from './types';
+import { isCompressed } from '../../control_group/utils/is_compressed';
 
 const displayName = i18n.translate('controls.timesliderControl.displayName', {
   defaultMessage: 'Time slider',
@@ -306,6 +307,7 @@ export const getTimesliderControlFactory = (): ControlFactory<
                 ticks={timeRangeMeta.ticks}
                 timeRangeMin={timeRangeMeta.timeRangeMin}
                 timeRangeMax={timeRangeMeta.timeRangeMax}
+                compressed={isCompressed(api)}
               />
             </EuiInputPopover>
           );