[controls] fix Time Slider text is not working properly with Dark Mode (

#145612)

Fixes #145594

TimeSlider component is not wrapped by KibanaThemeProvider and therefore
does not properly use kibana themeing. This PR resolves the issues by
wrapping TimeSlider by KibanaThemeProvider.

To test
* set advanced setting `theme:darkMode` to true
* open dashboard
* add time slider
* verify timeslider is using dark theme

<img width="500" alt="Screen Shot 2022-11-17 at 12 04 40 PM"
src="https://user-images.githubusercontent.com/373691/202536272-9ef9e9fe-debe-4722-a50e-03929b94c18d.png">

(cherry picked from commit d5ed16a)

src/plugins/controls/public/time_slider/embeddable/time_slider_embeddable.tsx

@@ -12,6 +12,7 @@ import moment from 'moment-timezone';
 import { Embeddable, IContainer } from '@kbn/embeddable-plugin/public';
 import { ReduxEmbeddableTools, ReduxEmbeddablePackage } from '@kbn/presentation-util-plugin/public';
 import type { TimeRange } from '@kbn/es-query';
+import { KibanaThemeProvider } from '@kbn/kibana-react-plugin/public';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Subscription } from 'rxjs';
@@ -270,16 +271,18 @@ export class TimeSliderControlEmbeddable extends Embeddable<
     const { Wrapper: TimeSliderControlReduxWrapper } = this.reduxEmbeddableTools;
 
     ReactDOM.render(
-      <TimeSliderControlReduxWrapper>
-        <TimeSlider
-          formatDate={this.epochToKbnDateFormat}
-          onChange={(value?: [number, number]) => {
-            this.onTimesliceChange(value);
-            const range = value ? value[TO_INDEX] - value[FROM_INDEX] : undefined;
-            this.onRangeChange(range);
-          }}
-        />
-      </TimeSliderControlReduxWrapper>,
+      <KibanaThemeProvider theme$={pluginServices.getServices().theme.theme$}>
+        <TimeSliderControlReduxWrapper>
+          <TimeSlider
+            formatDate={this.epochToKbnDateFormat}
+            onChange={(value?: [number, number]) => {
+              this.onTimesliceChange(value);
+              const range = value ? value[TO_INDEX] - value[FROM_INDEX] : undefined;
+              this.onRangeChange(range);
+            }}
+          />
+        </TimeSliderControlReduxWrapper>
+      </KibanaThemeProvider>,
       node
     );
   };