diff --git a/docs/developer/plugin-list.asciidoc b/docs/developer/plugin-list.asciidoc
index c4be7a7367c168..0ab1c89c1d8f75 100644
--- a/docs/developer/plugin-list.asciidoc
+++ b/docs/developer/plugin-list.asciidoc
@@ -150,8 +150,8 @@ It also provides a stateful version of it on the start contract.
 Content is fetched from the remote (https://feeds.elastic.co and https://feeds-staging.elastic.co in dev mode) once a day, with periodic checks if the content needs to be refreshed. All newsfeed content is hosted remotely.
 
 
-|{kib-repo}blob/{branch}/src/plugins/presentation_util/README.md[presentationUtil]
-|Utilities and components used by the presentation-related plugins
+|{kib-repo}blob/{branch}/src/plugins/presentation_util/README.mdx[presentationUtil]
+|The Presentation Utility Plugin is a set of common, shared components and toolkits for solutions within the Presentation space, (e.g. Dashboards, Canvas).
 
 
 |{kib-repo}blob/{branch}/src/plugins/region_map/README.md[regionMap]
diff --git a/package.json b/package.json
index d6850a50c046f8..920e0c8ba5192e 100644
--- a/package.json
+++ b/package.json
@@ -393,6 +393,7 @@
     "@storybook/addon-essentials": "^6.0.26",
     "@storybook/addon-knobs": "^6.0.26",
     "@storybook/addon-storyshots": "^6.0.26",
+    "@storybook/addon-docs": "^6.0.26",
     "@storybook/components": "^6.0.26",
     "@storybook/core": "^6.0.26",
     "@storybook/core-events": "^6.0.26",
diff --git a/src/dev/build/lib/version_info.test.ts b/src/dev/build/lib/integration_tests/version_info.test.ts
similarity index 92%
rename from src/dev/build/lib/version_info.test.ts
rename to src/dev/build/lib/integration_tests/version_info.test.ts
index dc0bf4ce6a8336..36d052ebad937b 100644
--- a/src/dev/build/lib/version_info.test.ts
+++ b/src/dev/build/lib/integration_tests/version_info.test.ts
@@ -6,10 +6,11 @@
  * Public License, v 1.
  */
 
-import pkg from '../../../../package.json';
-import { getVersionInfo } from './version_info';
+import { kibanaPackageJSON as pkg } from '@kbn/dev-utils';
 
-jest.mock('./get_build_number');
+import { getVersionInfo } from '../version_info';
+
+jest.mock('../get_build_number');
 
 describe('isRelease = true', () => {
   it('returns unchanged package.version, build sha, and build number', async () => {
diff --git a/src/dev/build/tasks/os_packages/docker_generator/templates/build_docker_sh.template.ts b/src/dev/build/tasks/os_packages/docker_generator/templates/build_docker_sh.template.ts
index 93c5f82aa1e424..d896e9cfa671c8 100644
--- a/src/dev/build/tasks/os_packages/docker_generator/templates/build_docker_sh.template.ts
+++ b/src/dev/build/tasks/os_packages/docker_generator/templates/build_docker_sh.template.ts
@@ -19,7 +19,6 @@ function generator({
   ubiImageFlavor,
   architecture,
 }: TemplateContext) {
-  const fileArchitecture = architecture === 'aarch64' ? 'arm64' : 'amd64';
   return dedent(`
   #!/usr/bin/env bash
   #
@@ -56,9 +55,9 @@ function generator({
   retry_docker_pull ${baseOSImage}
 
   echo "Building: kibana${imageFlavor}${ubiImageFlavor}-docker"; \\
-  docker build -t ${imageTag}${imageFlavor}${ubiImageFlavor}:${version}-${fileArchitecture} -f Dockerfile . || exit 1;
+  docker build -t ${imageTag}${imageFlavor}${ubiImageFlavor}:${version} -f Dockerfile . || exit 1;
 
-  docker save ${imageTag}${imageFlavor}${ubiImageFlavor}:${version}-${fileArchitecture} | gzip -c > ${dockerTargetFilename}
+  docker save ${imageTag}${imageFlavor}${ubiImageFlavor}:${version} | gzip -c > ${dockerTargetFilename}
 
   exit 0
   `);
diff --git a/src/dev/storybook/aliases.ts b/src/dev/storybook/aliases.ts
index d1ebcfa1e8399c..675b5a682f272a 100644
--- a/src/dev/storybook/aliases.ts
+++ b/src/dev/storybook/aliases.ts
@@ -18,4 +18,5 @@ export const storybookAliases = {
   security_solution: 'x-pack/plugins/security_solution/.storybook',
   ui_actions_enhanced: 'x-pack/plugins/ui_actions_enhanced/.storybook',
   observability: 'x-pack/plugins/observability/.storybook',
+  presentation: 'src/plugins/presentation_util/storybook',
 };
diff --git a/src/plugins/data/public/ui/query_string_input/query_string_input.test.tsx b/src/plugins/data/public/ui/query_string_input/query_string_input.test.tsx
index d9066a7345fb85..b7d9be485a3033 100644
--- a/src/plugins/data/public/ui/query_string_input/query_string_input.test.tsx
+++ b/src/plugins/data/public/ui/query_string_input/query_string_input.test.tsx
@@ -84,7 +84,10 @@ function wrapQueryStringInputInContext(testProps: any, storage?: any) {
   );
 }
 
-describe('QueryStringInput', () => {
+// FAILING: https://github.com/elastic/kibana/issues/85715
+// FAILING: https://github.com/elastic/kibana/issues/89603
+// FAILING: https://github.com/elastic/kibana/issues/89641
+describe.skip('QueryStringInput', () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
@@ -102,7 +105,7 @@ describe('QueryStringInput', () => {
     await waitFor(() => getByText('KQL'));
   });
 
-  it.skip('Should pass the query language to the language switcher', () => {
+  it('Should pass the query language to the language switcher', () => {
     const component = mount(
       wrapQueryStringInputInContext({
         query: luceneQuery,
@@ -113,7 +116,7 @@ describe('QueryStringInput', () => {
     expect(component.find(QueryLanguageSwitcher).prop('language')).toBe(luceneQuery.language);
   });
 
-  it.skip('Should disable autoFocus on EuiTextArea when disableAutoFocus prop is true', () => {
+  it('Should disable autoFocus on EuiTextArea when disableAutoFocus prop is true', () => {
     const component = mount(
       wrapQueryStringInputInContext({
         query: kqlQuery,
diff --git a/src/plugins/presentation_util/README.md b/src/plugins/presentation_util/README.md
deleted file mode 100755
index 047423a0a90369..00000000000000
--- a/src/plugins/presentation_util/README.md
+++ /dev/null
@@ -1,3 +0,0 @@
-# presentationUtil
-
-Utilities and components used by the presentation-related plugins
\ No newline at end of file
diff --git a/src/plugins/presentation_util/README.mdx b/src/plugins/presentation_util/README.mdx
new file mode 100755
index 00000000000000..35b80e36345345
--- /dev/null
+++ b/src/plugins/presentation_util/README.mdx
@@ -0,0 +1,211 @@
+---
+id: presentationUtilPlugin
+slug: /kibana-dev-docs/presentationPlugin
+title: Presentation Utility Plugin
+summary: Introduction to the Presentation Utility Plugin.
+date: 2020-01-12
+tags: ['kibana', 'presentation', 'services']
+related: []
+---
+
+## Introduction
+
+The Presentation Utility Plugin is a set of common, shared components and toolkits for solutions within the Presentation space, (e.g. Dashboards, Canvas).
+
+## Plugin Services Toolkit
+
+While Kibana provides a `useKibana` hook for use in a plugin, the number of services it provides is very large.  This presents a set of difficulties:
+
+- a direct dependency upon the Kibana environment;
+- a requirement to mock the full Kibana environment when testing or using Storybook;
+- a lack of knowledge as to what services are being consumed at any given time.
+
+To mitigate these difficulties, the Presentation Team creates services within the plugin that then consume Kibana-provided (or other) services.  This is a toolkit for creating simple services within a plugin.
+
+### Overview
+
+- A `PluginServiceFactory` is a function that will return a set of functions-- which comprise a `Service`-- given a set of parameters.
+- A `PluginServiceProvider` is an object that use a factory to start, stop or provide a `Service`.
+- A `PluginServiceRegistry` is a collection of providers for a given environment, (e.g. Kibana, Jest, Storybook, stub, etc).
+- A `PluginServices` object uses a registry to provide services throughout the plugin.
+
+### Defining Services
+
+To start, a plugin should define a set of services it wants to provide to itself or other plugins.
+
+<DocAccordion buttonContent="Service Definition Example" initialIsOpen>
+```ts
+export interface PresentationDashboardsService {
+  findDashboards: (
+    query: string,
+    fields: string[]
+  ) => Promise<Array<SimpleSavedObject<DashboardSavedObject>>>;
+  findDashboardsByTitle: (title: string) => Promise<Array<SimpleSavedObject<DashboardSavedObject>>>;
+}
+
+export interface PresentationFooService {
+  getFoo: () => string;
+  setFoo: (bar: string) => void;
+}
+
+export interface PresentationUtilServices {
+  dashboards: PresentationDashboardsService;
+  foo: PresentationFooService;
+}
+```
+</DocAccordion>
+
+This definition will be used in the toolkit to ensure services are complete and as expected.
+
+### Plugin Services
+
+The `PluginServices` class hosts a registry of service providers from which a plugin can access its services.  It uses the service definition as a generic.
+
+```ts
+export const pluginServices = new PluginServices<PresentationUtilServices>();
+```
+
+This can be placed in the `index.ts` file of a `services` directory within your plugin.
+
+Once created, it simply requires a `PluginServiceRegistry` to be started and set.
+
+### Service Provider Registry
+
+Each environment in which components are used requires a `PluginServiceRegistry` to specify how the providers are started.  For example, simple stubs of services require no parameters to start, (so the `StartParameters` generic remains unspecified)
+
+<DocAccordion buttonContent="Stubbed Service Registry Example" initialIsOpen>
+```ts
+export const providers: PluginServiceProviders<PresentationUtilServices> = {
+  dashboards: new PluginServiceProvider(dashboardsServiceFactory),
+  foo: new PluginServiceProvider(fooServiceFactory),
+};
+
+export const serviceRegistry = new PluginServiceRegistry<PresentationUtilServices>(providers);
+```
+</DocAccordion>
+
+By contrast, a registry that uses Kibana can provide `KibanaPluginServiceParams` to determine how to start its providers, so the `StartParameters` generic is given:
+
+<DocAccordion buttonContent="Kibana Service Registry Example" initialIsOpen>
+```ts
+export const providers: PluginServiceProviders<
+  PresentationUtilServices,
+  KibanaPluginServiceParams<PresentationUtilPluginStart>
+> = {
+  dashboards: new PluginServiceProvider(dashboardsServiceFactory),
+  foo: new PluginServiceProvider(fooServiceFactory),
+};
+
+export const serviceRegistry = new PluginServiceRegistry<
+  PresentationUtilServices,
+  KibanaPluginServiceParams<PresentationUtilPluginStart>
+>(providers);
+```
+</DocAccordion>
+
+### Service Provider
+
+A `PluginServiceProvider` is a container for a Service Factory that is responsible for starting, stopping and providing a service implementation.  A Service Provider doesn't change, rather the factory and the relevant `StartParameters` change.
+
+### Service Factories
+
+A Service Factory is nothing more than a function that uses `StartParameters` to return a set of functions that conforms to a portion of the `Services` specification.  For each service, a factory is provided for each environment.
+
+Given a service definition:
+
+```ts
+export interface PresentationFooService {
+  getFoo: () => string;
+  setFoo: (bar: string) => void;
+}
+```
+
+a factory for a stubbed version might look like this:
+
+```ts
+type FooServiceFactory = PluginServiceFactory<PresentationFooService>;
+
+export const fooServiceFactory: FooServiceFactory = () => ({
+  getFoo: () => 'bar',
+  setFoo: (bar) => { console.log(`${bar} set!`)},
+});
+```
+
+and a factory for a Kibana version might look like this:
+
+```ts
+export type FooServiceFactory = KibanaPluginServiceFactory<
+  PresentationFooService,
+  PresentationUtilPluginStart
+>;
+
+export const fooServiceFactory: FooServiceFactory = ({
+  coreStart,
+  startPlugins,
+}) => {
+  // ...do something with Kibana services...
+
+  return {
+    getFoo: //...
+    setFoo: //...
+  }
+}
+```
+
+### Using Services
+
+Once your services and providers are defined, and you have at least one set of factories, you can use `PluginServices` to provide the services to your React components:
+
+<DocAccordion buttonContent="Services starting in a plugin" initialIsOpen>
+```ts
+// plugin.ts
+import { pluginServices } from './services';
+import { registry } from './services/kibana';
+
+  public async start(
+    coreStart: CoreStart,
+    startPlugins: StartDeps
+  ): Promise<PresentationUtilPluginStart> {
+    pluginServices.setRegistry(registry.start({ coreStart, startPlugins }));
+    return {};
+  }
+```
+</DocAccordion>
+
+and wrap your root React component with the `PluginServices` context:
+
+<DocAccordion buttonContent="Providing services in a React context" initialIsOpen>
+```ts
+import { pluginServices } from './services';
+
+const ContextProvider = pluginServices.getContextProvider(),
+
+return(
+  <I18nContext>
+    <WhateverElse>
+      <ContextProvider>{application}</ContextProvider>
+    </WhateverElse>
+  </I18nContext>
+)
+```
+</DocAccordion>
+
+and then, consume your services using provided hooks in a component:
+
+<DocAccordion buttonContent="Consuming services in a component" initialIsOpen>
+```ts
+// component.ts
+
+import { pluginServices } from '../services';
+
+export function MyComponent() {
+  // Retrieve all context hooks from `PluginServices`, destructuring for the one we're using
+  const { foo } = pluginServices.getHooks();
+
+  // Use the `useContext` hook to access the API.
+  const { getFoo } = foo.useService();
+
+  // ...
+}
+```
+</DocAccordion>
diff --git a/src/plugins/presentation_util/public/components/dashboard_picker.stories.tsx b/src/plugins/presentation_util/public/components/dashboard_picker.stories.tsx
new file mode 100644
index 00000000000000..cb9991e2160197
--- /dev/null
+++ b/src/plugins/presentation_util/public/components/dashboard_picker.stories.tsx
@@ -0,0 +1,27 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import React from 'react';
+import { action } from '@storybook/addon-actions';
+
+import { DashboardPicker } from './dashboard_picker';
+
+export default {
+  component: DashboardPicker,
+  title: 'Dashboard Picker',
+  argTypes: {
+    isDisabled: {
+      control: 'boolean',
+      defaultValue: false,
+    },
+  },
+};
+
+export const Example = ({ isDisabled }: { isDisabled: boolean }) => (
+  <DashboardPicker onChange={action('onChange')} isDisabled={isDisabled} />
+);
diff --git a/src/plugins/presentation_util/public/components/dashboard_picker.tsx b/src/plugins/presentation_util/public/components/dashboard_picker.tsx
index 8aaf9be6ef5c66..b156ef4ae764c7 100644
--- a/src/plugins/presentation_util/public/components/dashboard_picker.tsx
+++ b/src/plugins/presentation_util/public/components/dashboard_picker.tsx
@@ -6,18 +6,16 @@
  * Public License, v 1.
  */
 
-import React, { useState, useEffect, useCallback } from 'react';
+import React, { useState, useEffect } from 'react';
 
 import { i18n } from '@kbn/i18n';
 
 import { EuiComboBox } from '@elastic/eui';
-import { SavedObjectsClientContract } from '../../../../core/public';
-import { DashboardSavedObject } from '../../../../plugins/dashboard/public';
+import { pluginServices } from '../services';
 
 export interface DashboardPickerProps {
   onChange: (dashboard: { name: string; id: string } | null) => void;
   isDisabled: boolean;
-  savedObjectsClient: SavedObjectsClientContract;
 }
 
 interface DashboardOption {
@@ -26,34 +24,43 @@ interface DashboardOption {
 }
 
 export function DashboardPicker(props: DashboardPickerProps) {
-  const [dashboards, setDashboards] = useState<DashboardOption[]>([]);
+  const [dashboardOptions, setDashboardOptions] = useState<DashboardOption[]>([]);
   const [isLoadingDashboards, setIsLoadingDashboards] = useState(true);
   const [selectedDashboard, setSelectedDashboard] = useState<DashboardOption | null>(null);
+  const [query, setQuery] = useState('');
 
-  const { savedObjectsClient, isDisabled, onChange } = props;
+  const { isDisabled, onChange } = props;
+  const { dashboards } = pluginServices.getHooks();
+  const { findDashboardsByTitle } = dashboards.useService();
 
-  const fetchDashboards = useCallback(
-    async (query) => {
+  useEffect(() => {
+    // We don't want to manipulate the React state if the component has been unmounted
+    // while we wait for the saved objects to return.
+    let cleanedUp = false;
+
+    const fetchDashboards = async () => {
       setIsLoadingDashboards(true);
-      setDashboards([]);
-
-      const { savedObjects } = await savedObjectsClient.find<DashboardSavedObject>({
-        type: 'dashboard',
-        search: query ? `${query}*` : '',
-        searchFields: ['title'],
-      });
-      if (savedObjects) {
-        setDashboards(savedObjects.map((d) => ({ value: d.id, label: d.attributes.title })));
+      setDashboardOptions([]);
+
+      const objects = await findDashboardsByTitle(query ? `${query}*` : '');
+
+      if (cleanedUp) {
+        return;
+      }
+
+      if (objects) {
+        setDashboardOptions(objects.map((d) => ({ value: d.id, label: d.attributes.title })));
       }
+
       setIsLoadingDashboards(false);
-    },
-    [savedObjectsClient]
-  );
+    };
 
-  // Initial dashboard load
-  useEffect(() => {
-    fetchDashboards('');
-  }, [fetchDashboards]);
+    fetchDashboards();
+
+    return () => {
+      cleanedUp = true;
+    };
+  }, [findDashboardsByTitle, query]);
 
   return (
     <EuiComboBox
@@ -61,7 +68,7 @@ export function DashboardPicker(props: DashboardPickerProps) {
         defaultMessage: 'Search dashboards...',
       })}
       singleSelection={{ asPlainText: true }}
-      options={dashboards || []}
+      options={dashboardOptions || []}
       selectedOptions={!!selectedDashboard ? [selectedDashboard] : undefined}
       onChange={(e) => {
         if (e.length) {
@@ -72,7 +79,7 @@ export function DashboardPicker(props: DashboardPickerProps) {
           onChange(null);
         }
       }}
-      onSearchChange={fetchDashboards}
+      onSearchChange={setQuery}
       isDisabled={isDisabled}
       isLoading={isLoadingDashboards}
       compressed={true}
diff --git a/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard.tsx b/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard.tsx
index 58a70c9db7dd5c..7c7b12f52ab5f1 100644
--- a/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard.tsx
+++ b/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard.tsx
@@ -9,18 +9,6 @@
 import React, { useState } from 'react';
 
 import { i18n } from '@kbn/i18n';
-import { FormattedMessage } from '@kbn/i18n/react';
-
-import {
-  EuiFlexGroup,
-  EuiFlexItem,
-  EuiFormRow,
-  EuiRadio,
-  EuiIconTip,
-  EuiPanel,
-  EuiSpacer,
-} from '@elastic/eui';
-import { SavedObjectsClientContract } from '../../../../core/public';
 
 import {
   OnSaveProps,
@@ -28,9 +16,9 @@ import {
   SavedObjectSaveModal,
 } from '../../../../plugins/saved_objects/public';
 
-import { DashboardPicker } from './dashboard_picker';
-
 import './saved_object_save_modal_dashboard.scss';
+import { pluginServices } from '../services';
+import { SaveModalDashboardSelector } from './saved_object_save_modal_dashboard_selector';
 
 interface SaveModalDocumentInfo {
   id?: string;
@@ -38,116 +26,50 @@ interface SaveModalDocumentInfo {
   description?: string;
 }
 
-export interface DashboardSaveModalProps {
+export interface SaveModalDashboardProps {
   documentInfo: SaveModalDocumentInfo;
   objectType: string;
   onClose: () => void;
   onSave: (props: OnSaveProps & { dashboardId: string | null }) => void;
-  savedObjectsClient: SavedObjectsClientContract;
   tagOptions?: React.ReactNode | ((state: SaveModalState) => React.ReactNode);
 }
 
-export function SavedObjectSaveModalDashboard(props: DashboardSaveModalProps) {
-  const { documentInfo, savedObjectsClient, tagOptions } = props;
-  const initialCopyOnSave = !Boolean(documentInfo.id);
+export function SavedObjectSaveModalDashboard(props: SaveModalDashboardProps) {
+  const { documentInfo, tagOptions, objectType, onClose } = props;
+  const { id: documentId } = documentInfo;
+  const initialCopyOnSave = !Boolean(documentId);
+
+  const { capabilities } = pluginServices.getHooks();
+  const {
+    canAccessDashboards,
+    canCreateNewDashboards,
+    canEditDashboards,
+  } = capabilities.useService();
+
+  const disableDashboardOptions =
+    !canAccessDashboards() || (!canCreateNewDashboards && !canEditDashboards);
 
   const [dashboardOption, setDashboardOption] = useState<'new' | 'existing' | null>(
-    documentInfo.id ? null : 'existing'
+    documentId || disableDashboardOptions ? null : 'existing'
   );
   const [selectedDashboard, setSelectedDashboard] = useState<{ id: string; name: string } | null>(
     null
   );
   const [copyOnSave, setCopyOnSave] = useState<boolean>(initialCopyOnSave);
 
-  const renderDashboardSelect = (state: SaveModalState) => {
-    const isDisabled = Boolean(!state.copyOnSave && documentInfo.id);
-
-    return (
-      <>
-        <EuiFormRow
-          label={
-            <EuiFlexGroup alignItems="center" gutterSize="s" responsive={false}>
-              <EuiFlexItem grow={false}>
-                <FormattedMessage
-                  id="presentationUtil.saveModalDashboard.addToDashboardLabel"
-                  defaultMessage="Add to dashboard"
-                />
-              </EuiFlexItem>
-              <EuiFlexItem grow={false}>
-                <EuiIconTip
-                  type="iInCircle"
-                  content={
-                    <FormattedMessage
-                      id="presentationUtil.saveModalDashboard.dashboardInfoTooltip"
-                      defaultMessage="Items added to a dashboard will not appear in the library and must be edited from the dashboard."
-                    />
-                  }
-                />
-              </EuiFlexItem>
-            </EuiFlexGroup>
-          }
-          hasChildLabel={false}
-        >
-          <EuiPanel color="subdued" hasShadow={false} data-test-subj="add-to-dashboard-options">
-            <div>
-              <EuiRadio
-                checked={dashboardOption === 'existing'}
-                id="existing-dashboard-option"
-                name="dashboard-option"
-                label={i18n.translate(
-                  'presentationUtil.saveModalDashboard.existingDashboardOptionLabel',
-                  {
-                    defaultMessage: 'Existing',
-                  }
-                )}
-                onChange={() => setDashboardOption('existing')}
-                disabled={isDisabled}
-              />
-
-              <div className="savAddDashboard__searchDashboards">
-                <DashboardPicker
-                  savedObjectsClient={savedObjectsClient}
-                  isDisabled={dashboardOption !== 'existing'}
-                  onChange={(dash) => {
-                    setSelectedDashboard(dash);
-                  }}
-                />
-              </div>
-
-              <EuiSpacer size="s" />
-
-              <EuiRadio
-                checked={dashboardOption === 'new'}
-                id="new-dashboard-option"
-                name="dashboard-option"
-                label={i18n.translate(
-                  'presentationUtil.saveModalDashboard.newDashboardOptionLabel',
-                  {
-                    defaultMessage: 'New',
-                  }
-                )}
-                onChange={() => setDashboardOption('new')}
-                disabled={isDisabled}
-              />
-
-              <EuiSpacer size="s" />
-
-              <EuiRadio
-                checked={dashboardOption === null}
-                id="add-to-library-option"
-                name="dashboard-option"
-                label={i18n.translate('presentationUtil.saveModalDashboard.libraryOptionLabel', {
-                  defaultMessage: 'No dashboard, but add to library',
-                })}
-                onChange={() => setDashboardOption(null)}
-                disabled={isDisabled}
-              />
-            </div>
-          </EuiPanel>
-        </EuiFormRow>
-      </>
-    );
-  };
+  const rightOptions = !disableDashboardOptions
+    ? () => (
+        <SaveModalDashboardSelector
+          onSelectDashboard={(dash) => {
+            setSelectedDashboard(dash);
+          }}
+          onChange={(option) => {
+            setDashboardOption(option);
+          }}
+          {...{ copyOnSave, documentId, dashboardOption }}
+        />
+      )
+    : null;
 
   const onCopyOnSaveChange = (newCopyOnSave: boolean) => {
     setDashboardOption(null);
@@ -159,7 +81,7 @@ export function SavedObjectSaveModalDashboard(props: DashboardSaveModalProps) {
 
     // Don't save with a dashboard ID if we're
     // just updating an existing visualization
-    if (!(!onSaveProps.newCopyOnSave && documentInfo.id)) {
+    if (!(!onSaveProps.newCopyOnSave && documentId)) {
       if (dashboardOption === 'existing') {
         dashboardId = selectedDashboard?.id || null;
       } else {
@@ -171,13 +93,14 @@ export function SavedObjectSaveModalDashboard(props: DashboardSaveModalProps) {
   };
 
   const saveLibraryLabel =
-    !copyOnSave && documentInfo.id
+    !copyOnSave && documentId
       ? i18n.translate('presentationUtil.saveModalDashboard.saveLabel', {
           defaultMessage: 'Save',
         })
       : i18n.translate('presentationUtil.saveModalDashboard.saveToLibraryLabel', {
           defaultMessage: 'Save and add to library',
         });
+
   const saveDashboardLabel = i18n.translate(
     'presentationUtil.saveModalDashboard.saveAndGoToDashboardLabel',
     {
@@ -192,18 +115,20 @@ export function SavedObjectSaveModalDashboard(props: DashboardSaveModalProps) {
   return (
     <SavedObjectSaveModal
       onSave={onModalSave}
-      onClose={props.onClose}
       title={documentInfo.title}
-      showCopyOnSave={documentInfo.id ? true : false}
-      initialCopyOnSave={initialCopyOnSave}
-      confirmButtonLabel={confirmButtonLabel}
-      objectType={props.objectType}
+      showCopyOnSave={documentId ? true : false}
       options={dashboardOption === null ? tagOptions : undefined} // Show tags when not adding to dashboard
-      rightOptions={renderDashboardSelect}
       description={documentInfo.description}
       showDescription={true}
-      isValid={isValid}
-      onCopyOnSaveChange={onCopyOnSaveChange}
+      {...{
+        confirmButtonLabel,
+        initialCopyOnSave,
+        isValid,
+        objectType,
+        onClose,
+        onCopyOnSaveChange,
+        rightOptions,
+      }}
     />
   );
 }
diff --git a/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.stories.tsx b/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.stories.tsx
new file mode 100644
index 00000000000000..2044ecdd713e18
--- /dev/null
+++ b/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.stories.tsx
@@ -0,0 +1,57 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import React, { useState } from 'react';
+import { action } from '@storybook/addon-actions';
+
+import { StorybookParams } from '../services/storybook';
+import { SaveModalDashboardSelector } from './saved_object_save_modal_dashboard_selector';
+
+export default {
+  component: SaveModalDashboardSelector,
+  title: 'Save Modal Dashboard Selector',
+  description: 'A selector for determining where an object will be saved after it is created.',
+  argTypes: {
+    hasDocumentId: {
+      control: 'boolean',
+      defaultValue: false,
+    },
+    copyOnSave: {
+      control: 'boolean',
+      defaultValue: false,
+    },
+    canCreateNewDashboards: {
+      control: 'boolean',
+      defaultValue: true,
+    },
+    canEditDashboards: {
+      control: 'boolean',
+      defaultValue: true,
+    },
+  },
+};
+
+export function Example({
+  copyOnSave,
+  hasDocumentId,
+}: {
+  copyOnSave: boolean;
+  hasDocumentId: boolean;
+} & StorybookParams) {
+  const [dashboardOption, setDashboardOption] = useState<'new' | 'existing' | null>('existing');
+
+  return (
+    <SaveModalDashboardSelector
+      onSelectDashboard={action('onSelect')}
+      onChange={setDashboardOption}
+      dashboardOption={dashboardOption}
+      copyOnSave={copyOnSave}
+      documentId={hasDocumentId ? 'abc' : undefined}
+    />
+  );
+}
diff --git a/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.tsx b/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.tsx
new file mode 100644
index 00000000000000..b1bf9ed6958420
--- /dev/null
+++ b/src/plugins/presentation_util/public/components/saved_object_save_modal_dashboard_selector.tsx
@@ -0,0 +1,132 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import React from 'react';
+
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
+
+import {
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiFormRow,
+  EuiRadio,
+  EuiIconTip,
+  EuiPanel,
+  EuiSpacer,
+} from '@elastic/eui';
+
+import { pluginServices } from '../services';
+import { DashboardPicker, DashboardPickerProps } from './dashboard_picker';
+
+import './saved_object_save_modal_dashboard.scss';
+
+export interface SaveModalDashboardSelectorProps {
+  copyOnSave: boolean;
+  documentId?: string;
+  onSelectDashboard: DashboardPickerProps['onChange'];
+
+  dashboardOption: 'new' | 'existing' | null;
+  onChange: (dashboardOption: 'new' | 'existing' | null) => void;
+}
+
+export function SaveModalDashboardSelector(props: SaveModalDashboardSelectorProps) {
+  const { documentId, onSelectDashboard, dashboardOption, onChange, copyOnSave } = props;
+  const { capabilities } = pluginServices.getHooks();
+  const { canCreateNewDashboards, canEditDashboards } = capabilities.useService();
+
+  const isDisabled = !copyOnSave && !!documentId;
+
+  return (
+    <>
+      <EuiFormRow
+        label={
+          <EuiFlexGroup alignItems="center" gutterSize="s" responsive={false}>
+            <EuiFlexItem grow={false}>
+              <FormattedMessage
+                id="presentationUtil.saveModalDashboard.addToDashboardLabel"
+                defaultMessage="Add to dashboard"
+              />
+            </EuiFlexItem>
+            <EuiFlexItem grow={false}>
+              <EuiIconTip
+                type="iInCircle"
+                content={
+                  <FormattedMessage
+                    id="presentationUtil.saveModalDashboard.dashboardInfoTooltip"
+                    defaultMessage="Items added to a dashboard will not appear in the library and must be edited from the dashboard."
+                  />
+                }
+              />
+            </EuiFlexItem>
+          </EuiFlexGroup>
+        }
+        hasChildLabel={false}
+      >
+        <EuiPanel color="subdued" hasShadow={false} data-test-subj="add-to-dashboard-options">
+          <div>
+            {canEditDashboards() && (
+              <>
+                {' '}
+                <EuiRadio
+                  checked={dashboardOption === 'existing'}
+                  id="existing-dashboard-option"
+                  name="dashboard-option"
+                  label={i18n.translate(
+                    'presentationUtil.saveModalDashboard.existingDashboardOptionLabel',
+                    {
+                      defaultMessage: 'Existing',
+                    }
+                  )}
+                  onChange={() => onChange('existing')}
+                  disabled={isDisabled}
+                />
+                <div className="savAddDashboard__searchDashboards">
+                  <DashboardPicker
+                    isDisabled={dashboardOption !== 'existing'}
+                    onChange={onSelectDashboard}
+                  />
+                </div>
+                <EuiSpacer size="s" />
+              </>
+            )}
+            {canCreateNewDashboards() && (
+              <>
+                {' '}
+                <EuiRadio
+                  checked={dashboardOption === 'new'}
+                  id="new-dashboard-option"
+                  name="dashboard-option"
+                  label={i18n.translate(
+                    'presentationUtil.saveModalDashboard.newDashboardOptionLabel',
+                    {
+                      defaultMessage: 'New',
+                    }
+                  )}
+                  onChange={() => onChange('new')}
+                  disabled={isDisabled}
+                />
+                <EuiSpacer size="s" />
+              </>
+            )}
+            <EuiRadio
+              checked={dashboardOption === null}
+              id="add-to-library-option"
+              name="dashboard-option"
+              label={i18n.translate('presentationUtil.saveModalDashboard.libraryOptionLabel', {
+                defaultMessage: 'No dashboard, but add to library',
+              })}
+              onChange={() => onChange(null)}
+              disabled={isDisabled}
+            />
+          </div>
+        </EuiPanel>
+      </EuiFormRow>
+    </>
+  );
+}
diff --git a/src/plugins/presentation_util/public/index.ts b/src/plugins/presentation_util/public/index.ts
index baf40a1ea0ae4e..586ddd1320641c 100644
--- a/src/plugins/presentation_util/public/index.ts
+++ b/src/plugins/presentation_util/public/index.ts
@@ -10,9 +10,11 @@ import { PresentationUtilPlugin } from './plugin';
 
 export {
   SavedObjectSaveModalDashboard,
-  DashboardSaveModalProps,
+  SaveModalDashboardProps,
 } from './components/saved_object_save_modal_dashboard';
 
+export { DashboardPicker } from './components/dashboard_picker';
+
 export function plugin() {
   return new PresentationUtilPlugin();
 }
diff --git a/src/plugins/presentation_util/public/plugin.ts b/src/plugins/presentation_util/public/plugin.ts
index cbc1d0eb04e27a..5d3618b0346567 100644
--- a/src/plugins/presentation_util/public/plugin.ts
+++ b/src/plugins/presentation_util/public/plugin.ts
@@ -7,16 +7,39 @@
  */
 
 import { CoreSetup, CoreStart, Plugin } from '../../../core/public';
-import { PresentationUtilPluginSetup, PresentationUtilPluginStart } from './types';
+import { pluginServices } from './services';
+import { registry } from './services/kibana';
+import {
+  PresentationUtilPluginSetup,
+  PresentationUtilPluginStart,
+  PresentationUtilPluginSetupDeps,
+  PresentationUtilPluginStartDeps,
+} from './types';
 
 export class PresentationUtilPlugin
-  implements Plugin<PresentationUtilPluginSetup, PresentationUtilPluginStart> {
-  public setup(core: CoreSetup): PresentationUtilPluginSetup {
+  implements
+    Plugin<
+      PresentationUtilPluginSetup,
+      PresentationUtilPluginStart,
+      PresentationUtilPluginSetupDeps,
+      PresentationUtilPluginStartDeps
+    > {
+  public setup(
+    _coreSetup: CoreSetup<PresentationUtilPluginSetup>,
+    _setupPlugins: PresentationUtilPluginSetupDeps
+  ): PresentationUtilPluginSetup {
     return {};
   }
 
-  public start(core: CoreStart): PresentationUtilPluginStart {
-    return {};
+  public async start(
+    coreStart: CoreStart,
+    startPlugins: PresentationUtilPluginStartDeps
+  ): Promise<PresentationUtilPluginStart> {
+    pluginServices.setRegistry(registry.start({ coreStart, startPlugins }));
+
+    return {
+      ContextProvider: pluginServices.getContextProvider(),
+    };
   }
 
   public stop() {}
diff --git a/src/plugins/presentation_util/public/services/create/factory.ts b/src/plugins/presentation_util/public/services/create/factory.ts
new file mode 100644
index 00000000000000..01b143e612461f
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/create/factory.ts
@@ -0,0 +1,42 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { BehaviorSubject } from 'rxjs';
+import { CoreStart, AppUpdater } from 'src/core/public';
+
+/**
+ * A factory function for creating a service.
+ *
+ * The `Service` generic determines the shape of the API being produced.
+ * The `StartParameters` generic determines what parameters are expected to
+ * create the service.
+ */
+export type PluginServiceFactory<Service, Parameters = {}> = (params: Parameters) => Service;
+
+/**
+ * Parameters necessary to create a Kibana-based service, (e.g. during Plugin
+ * startup or setup).
+ *
+ * The `Start` generic refers to the specific Plugin `TPluginsStart`.
+ */
+export interface KibanaPluginServiceParams<Start extends {}> {
+  coreStart: CoreStart;
+  startPlugins: Start;
+  appUpdater?: BehaviorSubject<AppUpdater>;
+}
+
+/**
+ * A factory function for creating a Kibana-based service.
+ *
+ * The `Service` generic determines the shape of the API being produced.
+ * The `Setup` generic refers to the specific Plugin `TPluginsSetup`.
+ * The `Start` generic refers to the specific Plugin `TPluginsStart`.
+ */
+export type KibanaPluginServiceFactory<Service, Start extends {}> = (
+  params: KibanaPluginServiceParams<Start>
+) => Service;
diff --git a/src/plugins/presentation_util/public/services/create/index.ts b/src/plugins/presentation_util/public/services/create/index.ts
new file mode 100644
index 00000000000000..59f1f9fd7a43b4
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/create/index.ts
@@ -0,0 +1,82 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { mapValues } from 'lodash';
+
+import { PluginServiceRegistry } from './registry';
+
+export { PluginServiceRegistry } from './registry';
+export { PluginServiceProvider, PluginServiceProviders } from './provider';
+export {
+  PluginServiceFactory,
+  KibanaPluginServiceFactory,
+  KibanaPluginServiceParams,
+} from './factory';
+
+/**
+ * `PluginServices` is a top-level class for specifying and accessing services within a plugin.
+ *
+ * A `PluginServices` object can be provided with a `PluginServiceRegistry` at any time, which will
+ * then be used to provide services to any component that accesses it.
+ *
+ * The `Services` generic determines the shape of all service APIs being produced.
+ */
+export class PluginServices<Services> {
+  private registry: PluginServiceRegistry<Services, any> | null = null;
+
+  /**
+   * Supply a `PluginServiceRegistry` for the class to use to provide services and context.
+   *
+   * @param registry A setup and started `PluginServiceRegistry`.
+   */
+  setRegistry(registry: PluginServiceRegistry<Services, any> | null) {
+    if (registry && !registry.isStarted()) {
+      throw new Error('Registry has not been started.');
+    }
+
+    this.registry = registry;
+  }
+
+  /**
+   * Returns true if a registry has been provided, false otherwise.
+   */
+  hasRegistry() {
+    return !!this.registry;
+  }
+
+  /**
+   * Private getter that will enforce proper setup throughout the class.
+   */
+  private getRegistry() {
+    if (!this.registry) {
+      throw new Error('No registry has been provided.');
+    }
+
+    return this.registry;
+  }
+
+  /**
+   * Return the React Context Provider that will supply services.
+   */
+  getContextProvider() {
+    return this.getRegistry().getContextProvider();
+  }
+
+  /**
+   * Return a map of React Hooks that can be used in React components.
+   */
+  getHooks(): { [K in keyof Services]: { useService: () => Services[K] } } {
+    const registry = this.getRegistry();
+    const providers = registry.getServiceProviders();
+
+    // @ts-expect-error Need to fix this; the type isn't fully understood when inferred.
+    return mapValues(providers, (provider) => ({
+      useService: provider.getUseServiceHook(),
+    }));
+  }
+}
diff --git a/src/plugins/presentation_util/public/services/create/provider.tsx b/src/plugins/presentation_util/public/services/create/provider.tsx
new file mode 100644
index 00000000000000..981ff1527f9819
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/create/provider.tsx
@@ -0,0 +1,83 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import React, { createContext, useContext } from 'react';
+import { PluginServiceFactory } from './factory';
+
+/**
+ * A collection of `PluginServiceProvider` objects, keyed by the `Services` API generic.
+ *
+ * The `Services` generic determines the shape of all service APIs being produced.
+ * The `StartParameters` generic determines what parameters are expected to
+ * start the service.
+ */
+export type PluginServiceProviders<Services, StartParameters = {}> = {
+  [K in keyof Services]: PluginServiceProvider<Services[K], StartParameters>;
+};
+
+/**
+ * An object which uses a given factory to start, stop or provide a service.
+ *
+ * The `Service` generic determines the shape of the API being produced.
+ * The `StartParameters` generic determines what parameters are expected to
+ * start the service.
+ */
+export class PluginServiceProvider<Service extends {}, StartParameters = {}> {
+  private factory: PluginServiceFactory<Service, StartParameters>;
+  private context = createContext<Service | null>(null);
+  private pluginService: Service | null = null;
+  public readonly Provider: React.FC = ({ children }) => {
+    return <this.context.Provider value={this.getService()}>{children}</this.context.Provider>;
+  };
+
+  constructor(factory: PluginServiceFactory<Service, StartParameters>) {
+    this.factory = factory;
+    this.context.displayName = 'PluginServiceContext';
+  }
+
+  /**
+   * Private getter that will enforce proper setup throughout the class.
+   */
+  private getService() {
+    if (!this.pluginService) {
+      throw new Error('Service not started');
+    }
+    return this.pluginService;
+  }
+
+  /**
+   * Start the service.
+   *
+   * @param params Parameters used to start the service.
+   */
+  start(params: StartParameters) {
+    this.pluginService = this.factory(params);
+  }
+
+  /**
+   * Returns a function for providing a Context hook for the service.
+   */
+  getUseServiceHook() {
+    return () => {
+      const service = useContext(this.context);
+
+      if (!service) {
+        throw new Error('Provider is not set up correctly');
+      }
+
+      return service;
+    };
+  }
+
+  /**
+   * Stop the service.
+   */
+  stop() {
+    this.pluginService = null;
+  }
+}
diff --git a/src/plugins/presentation_util/public/services/create/registry.tsx b/src/plugins/presentation_util/public/services/create/registry.tsx
new file mode 100644
index 00000000000000..5165380780fa90
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/create/registry.tsx
@@ -0,0 +1,89 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import React from 'react';
+import { values } from 'lodash';
+import { PluginServiceProvider, PluginServiceProviders } from './provider';
+
+/**
+ * A `PluginServiceRegistry` maintains a set of service providers which can be collectively
+ * started, stopped or retreived.
+ *
+ * The `Services` generic determines the shape of all service APIs being produced.
+ * The `StartParameters` generic determines what parameters are expected to
+ * start the service.
+ */
+export class PluginServiceRegistry<Services, StartParameters = {}> {
+  private providers: PluginServiceProviders<Services, StartParameters>;
+  private _isStarted = false;
+
+  constructor(providers: PluginServiceProviders<Services, StartParameters>) {
+    this.providers = providers;
+  }
+
+  /**
+   * Returns true if the registry has been started, false otherwise.
+   */
+  isStarted() {
+    return this._isStarted;
+  }
+
+  /**
+   * Returns a map of `PluginServiceProvider` objects.
+   */
+  getServiceProviders() {
+    if (!this._isStarted) {
+      throw new Error('Registry not started');
+    }
+    return this.providers;
+  }
+
+  /**
+   * Returns a React Context Provider for use in consuming applications.
+   */
+  getContextProvider() {
+    // Collect and combine Context.Provider elements from each Service Provider into a single
+    // Functional Component.
+    const provider: React.FC = ({ children }) => (
+      <>
+        {values<PluginServiceProvider<any, any>>(this.getServiceProviders()).reduceRight(
+          (acc, serviceProvider) => {
+            return <serviceProvider.Provider>{acc}</serviceProvider.Provider>;
+          },
+          children
+        )}
+      </>
+    );
+
+    return provider;
+  }
+
+  /**
+   * Start the registry.
+   *
+   * @param params Parameters used to start the registry.
+   */
+  start(params: StartParameters) {
+    values<PluginServiceProvider<any, any>>(this.providers).map((serviceProvider) =>
+      serviceProvider.start(params)
+    );
+    this._isStarted = true;
+    return this;
+  }
+
+  /**
+   * Stop the registry.
+   */
+  stop() {
+    values<PluginServiceProvider<any, any>>(this.providers).map((serviceProvider) =>
+      serviceProvider.stop()
+    );
+    this._isStarted = false;
+    return this;
+  }
+}
diff --git a/src/plugins/presentation_util/public/services/index.ts b/src/plugins/presentation_util/public/services/index.ts
new file mode 100644
index 00000000000000..732cc19e147631
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/index.ts
@@ -0,0 +1,31 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { SimpleSavedObject } from 'src/core/public';
+import { DashboardSavedObject } from 'src/plugins/dashboard/public';
+import { PluginServices } from './create';
+export interface PresentationDashboardsService {
+  findDashboards: (
+    query: string,
+    fields: string[]
+  ) => Promise<Array<SimpleSavedObject<DashboardSavedObject>>>;
+  findDashboardsByTitle: (title: string) => Promise<Array<SimpleSavedObject<DashboardSavedObject>>>;
+}
+
+export interface PresentationCapabilitiesService {
+  canAccessDashboards: () => boolean;
+  canCreateNewDashboards: () => boolean;
+  canEditDashboards: () => boolean;
+}
+
+export interface PresentationUtilServices {
+  dashboards: PresentationDashboardsService;
+  capabilities: PresentationCapabilitiesService;
+}
+
+export const pluginServices = new PluginServices<PresentationUtilServices>();
diff --git a/src/plugins/presentation_util/public/services/kibana/capabilities.ts b/src/plugins/presentation_util/public/services/kibana/capabilities.ts
new file mode 100644
index 00000000000000..f36b2779793581
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/kibana/capabilities.ts
@@ -0,0 +1,26 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { PresentationUtilPluginStartDeps } from '../../types';
+import { KibanaPluginServiceFactory } from '../create';
+import { PresentationCapabilitiesService } from '..';
+
+export type CapabilitiesServiceFactory = KibanaPluginServiceFactory<
+  PresentationCapabilitiesService,
+  PresentationUtilPluginStartDeps
+>;
+
+export const capabilitiesServiceFactory: CapabilitiesServiceFactory = ({ coreStart }) => {
+  const { dashboard } = coreStart.application.capabilities;
+
+  return {
+    canAccessDashboards: () => Boolean(dashboard.show),
+    canCreateNewDashboards: () => Boolean(dashboard.createNew),
+    canEditDashboards: () => !Boolean(dashboard.hideWriteControls),
+  };
+};
diff --git a/src/plugins/presentation_util/public/services/kibana/dashboards.ts b/src/plugins/presentation_util/public/services/kibana/dashboards.ts
new file mode 100644
index 00000000000000..acfe4bd33e26ac
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/kibana/dashboards.ts
@@ -0,0 +1,39 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { DashboardSavedObject } from 'src/plugins/dashboard/public';
+
+import { PresentationUtilPluginStartDeps } from '../../types';
+import { KibanaPluginServiceFactory } from '../create';
+import { PresentationDashboardsService } from '..';
+
+export type DashboardsServiceFactory = KibanaPluginServiceFactory<
+  PresentationDashboardsService,
+  PresentationUtilPluginStartDeps
+>;
+
+export const dashboardsServiceFactory: DashboardsServiceFactory = ({ coreStart }) => {
+  const findDashboards = async (query: string = '', fields: string[] = []) => {
+    const { find } = coreStart.savedObjects.client;
+
+    const { savedObjects } = await find<DashboardSavedObject>({
+      type: 'dashboard',
+      search: `${query}*`,
+      searchFields: fields,
+    });
+
+    return savedObjects;
+  };
+
+  const findDashboardsByTitle = async (title: string = '') => findDashboards(title, ['title']);
+
+  return {
+    findDashboards,
+    findDashboardsByTitle,
+  };
+};
diff --git a/src/plugins/presentation_util/public/services/kibana/index.ts b/src/plugins/presentation_util/public/services/kibana/index.ts
new file mode 100644
index 00000000000000..a129b0d94479f1
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/kibana/index.ts
@@ -0,0 +1,34 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { dashboardsServiceFactory } from './dashboards';
+import { capabilitiesServiceFactory } from './capabilities';
+import {
+  PluginServiceProviders,
+  KibanaPluginServiceParams,
+  PluginServiceProvider,
+  PluginServiceRegistry,
+} from '../create';
+import { PresentationUtilPluginStartDeps } from '../../types';
+import { PresentationUtilServices } from '..';
+
+export { dashboardsServiceFactory } from './dashboards';
+export { capabilitiesServiceFactory } from './capabilities';
+
+export const providers: PluginServiceProviders<
+  PresentationUtilServices,
+  KibanaPluginServiceParams<PresentationUtilPluginStartDeps>
+> = {
+  dashboards: new PluginServiceProvider(dashboardsServiceFactory),
+  capabilities: new PluginServiceProvider(capabilitiesServiceFactory),
+};
+
+export const registry = new PluginServiceRegistry<
+  PresentationUtilServices,
+  KibanaPluginServiceParams<PresentationUtilPluginStartDeps>
+>(providers);
diff --git a/src/plugins/presentation_util/public/services/storybook/capabilities.ts b/src/plugins/presentation_util/public/services/storybook/capabilities.ts
new file mode 100644
index 00000000000000..5048fe50cc0257
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/storybook/capabilities.ts
@@ -0,0 +1,29 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { PluginServiceFactory } from '../create';
+import { StorybookParams } from '.';
+import { PresentationCapabilitiesService } from '..';
+
+type CapabilitiesServiceFactory = PluginServiceFactory<
+  PresentationCapabilitiesService,
+  StorybookParams
+>;
+
+export const capabilitiesServiceFactory: CapabilitiesServiceFactory = ({
+  canAccessDashboards,
+  canCreateNewDashboards,
+  canEditDashboards,
+}) => {
+  const check = (value: boolean = true) => value;
+  return {
+    canAccessDashboards: () => check(canAccessDashboards),
+    canCreateNewDashboards: () => check(canCreateNewDashboards),
+    canEditDashboards: () => check(canEditDashboards),
+  };
+};
diff --git a/src/plugins/presentation_util/public/services/storybook/index.ts b/src/plugins/presentation_util/public/services/storybook/index.ts
new file mode 100644
index 00000000000000..536cad3a9d1317
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/storybook/index.ts
@@ -0,0 +1,28 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { PluginServices, PluginServiceProviders, PluginServiceProvider } from '../create';
+import { dashboardsServiceFactory } from '../stub/dashboards';
+import { capabilitiesServiceFactory } from './capabilities';
+import { PresentationUtilServices } from '..';
+
+export { PluginServiceProviders, PluginServiceProvider, PluginServiceRegistry } from '../create';
+export { PresentationUtilServices } from '..';
+
+export interface StorybookParams {
+  canAccessDashboards?: boolean;
+  canCreateNewDashboards?: boolean;
+  canEditDashboards?: boolean;
+}
+
+export const providers: PluginServiceProviders<PresentationUtilServices, StorybookParams> = {
+  dashboards: new PluginServiceProvider(dashboardsServiceFactory),
+  capabilities: new PluginServiceProvider(capabilitiesServiceFactory),
+};
+
+export const pluginServices = new PluginServices<PresentationUtilServices>();
diff --git a/src/plugins/presentation_util/public/services/stub/capabilities.ts b/src/plugins/presentation_util/public/services/stub/capabilities.ts
new file mode 100644
index 00000000000000..33c091022421c0
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/stub/capabilities.ts
@@ -0,0 +1,18 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { PluginServiceFactory } from '../create';
+import { PresentationCapabilitiesService } from '..';
+
+type CapabilitiesServiceFactory = PluginServiceFactory<PresentationCapabilitiesService>;
+
+export const capabilitiesServiceFactory: CapabilitiesServiceFactory = () => ({
+  canAccessDashboards: () => true,
+  canCreateNewDashboards: () => true,
+  canEditDashboards: () => true,
+});
diff --git a/src/plugins/presentation_util/public/services/stub/dashboards.ts b/src/plugins/presentation_util/public/services/stub/dashboards.ts
new file mode 100644
index 00000000000000..862fa4f952c1e1
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/stub/dashboards.ts
@@ -0,0 +1,37 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { PluginServiceFactory } from '../create';
+import { PresentationDashboardsService } from '..';
+
+// TODO (clint): Create set of dashboards to stub and return.
+
+type DashboardsServiceFactory = PluginServiceFactory<PresentationDashboardsService>;
+
+function sleep(ms: number) {
+  return new Promise((resolve) => setTimeout(resolve, ms));
+}
+
+export const dashboardsServiceFactory: DashboardsServiceFactory = () => ({
+  findDashboards: async (query: string = '', _fields: string[] = []) => {
+    if (!query) {
+      return [];
+    }
+
+    await sleep(2000);
+    return [];
+  },
+  findDashboardsByTitle: async (title: string) => {
+    if (!title) {
+      return [];
+    }
+
+    await sleep(2000);
+    return [];
+  },
+});
diff --git a/src/plugins/presentation_util/public/services/stub/index.ts b/src/plugins/presentation_util/public/services/stub/index.ts
new file mode 100644
index 00000000000000..a2bde357fd4c0f
--- /dev/null
+++ b/src/plugins/presentation_util/public/services/stub/index.ts
@@ -0,0 +1,22 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { dashboardsServiceFactory } from './dashboards';
+import { capabilitiesServiceFactory } from './capabilities';
+import { PluginServiceProviders, PluginServiceProvider, PluginServiceRegistry } from '../create';
+import { PresentationUtilServices } from '..';
+
+export { dashboardsServiceFactory } from './dashboards';
+export { capabilitiesServiceFactory } from './capabilities';
+
+export const providers: PluginServiceProviders<PresentationUtilServices> = {
+  dashboards: new PluginServiceProvider(dashboardsServiceFactory),
+  capabilities: new PluginServiceProvider(capabilitiesServiceFactory),
+};
+
+export const registry = new PluginServiceRegistry<PresentationUtilServices>(providers);
diff --git a/src/plugins/presentation_util/public/types.ts b/src/plugins/presentation_util/public/types.ts
index ae5646bd9bbae4..7371ebc6f736e5 100644
--- a/src/plugins/presentation_util/public/types.ts
+++ b/src/plugins/presentation_util/public/types.ts
@@ -8,5 +8,12 @@
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface PresentationUtilPluginSetup {}
+
+export interface PresentationUtilPluginStart {
+  ContextProvider: React.FC;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface PresentationUtilPluginSetupDeps {}
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
-export interface PresentationUtilPluginStart {}
+export interface PresentationUtilPluginStartDeps {}
diff --git a/src/plugins/presentation_util/storybook/decorator.tsx b/src/plugins/presentation_util/storybook/decorator.tsx
new file mode 100644
index 00000000000000..5f56c70a2f849f
--- /dev/null
+++ b/src/plugins/presentation_util/storybook/decorator.tsx
@@ -0,0 +1,28 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import React from 'react';
+
+import { DecoratorFn } from '@storybook/react';
+import { I18nProvider } from '@kbn/i18n/react';
+import { pluginServices } from '../public/services';
+import { PresentationUtilServices } from '../public/services';
+import { providers, StorybookParams } from '../public/services/storybook';
+import { PluginServiceRegistry } from '../public/services/create';
+
+export const servicesContextDecorator: DecoratorFn = (story: Function, storybook) => {
+  const registry = new PluginServiceRegistry<PresentationUtilServices, StorybookParams>(providers);
+  pluginServices.setRegistry(registry.start(storybook.args));
+  const ContextProvider = pluginServices.getContextProvider();
+
+  return (
+    <I18nProvider>
+      <ContextProvider>{story()}</ContextProvider>
+    </I18nProvider>
+  );
+};
diff --git a/src/plugins/presentation_util/storybook/main.ts b/src/plugins/presentation_util/storybook/main.ts
new file mode 100644
index 00000000000000..d12b98f38a03f5
--- /dev/null
+++ b/src/plugins/presentation_util/storybook/main.ts
@@ -0,0 +1,19 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { Configuration } from 'webpack';
+import { defaultConfig } from '@kbn/storybook';
+import webpackConfig from '@kbn/storybook/target/webpack.config';
+
+module.exports = {
+  ...defaultConfig,
+  addons: ['@storybook/addon-essentials'],
+  webpackFinal: (config: Configuration) => {
+    return webpackConfig({ config });
+  },
+};
diff --git a/src/plugins/presentation_util/storybook/manager.ts b/src/plugins/presentation_util/storybook/manager.ts
new file mode 100644
index 00000000000000..e9b6a11242036c
--- /dev/null
+++ b/src/plugins/presentation_util/storybook/manager.ts
@@ -0,0 +1,21 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import { addons } from '@storybook/addons';
+import { create } from '@storybook/theming';
+import { PANEL_ID } from '@storybook/addon-actions';
+
+addons.setConfig({
+  theme: create({
+    base: 'light',
+    brandTitle: 'Kibana Presentation Utility Storybook',
+    brandUrl: 'https://github.com/elastic/kibana/tree/master/src/plugins/presentation_util',
+  }),
+  showPanel: true.valueOf,
+  selectedPanel: PANEL_ID,
+});
diff --git a/src/plugins/presentation_util/storybook/preview.tsx b/src/plugins/presentation_util/storybook/preview.tsx
new file mode 100644
index 00000000000000..dfa8ad3be04e7c
--- /dev/null
+++ b/src/plugins/presentation_util/storybook/preview.tsx
@@ -0,0 +1,29 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * and the Server Side Public License, v 1; you may not use this file except in
+ * compliance with, at your election, the Elastic License or the Server Side
+ * Public License, v 1.
+ */
+
+import React from 'react';
+import { addDecorator } from '@storybook/react';
+import { Title, Subtitle, Description, Primary, Stories } from '@storybook/addon-docs/blocks';
+
+import { servicesContextDecorator } from './decorator';
+
+addDecorator(servicesContextDecorator);
+
+export const parameters = {
+  docs: {
+    page: () => (
+      <>
+        <Title />
+        <Subtitle />
+        <Description />
+        <Primary />
+        <Stories />
+      </>
+    ),
+  },
+};
diff --git a/src/plugins/presentation_util/tsconfig.json b/src/plugins/presentation_util/tsconfig.json
index 1e3756f45e9537..a9657db2888486 100644
--- a/src/plugins/presentation_util/tsconfig.json
+++ b/src/plugins/presentation_util/tsconfig.json
@@ -7,7 +7,7 @@
     "declaration": true,
     "declarationMap": true
   },
-  "include": ["common/**/*", "public/**/*"],
+  "include": ["common/**/*", "public/**/*", "storybook/**/*", "../../../typings/**/*"],
   "references": [
     { "path": "../../core/tsconfig.json" },
     { "path": "../dashboard/tsconfig.json" },
diff --git a/src/plugins/saved_objects/public/save_modal/show_saved_object_save_modal.tsx b/src/plugins/saved_objects/public/save_modal/show_saved_object_save_modal.tsx
index 6702255ee2e2c2..f87169d4b828ad 100644
--- a/src/plugins/saved_objects/public/save_modal/show_saved_object_save_modal.tsx
+++ b/src/plugins/saved_objects/public/save_modal/show_saved_object_save_modal.tsx
@@ -31,7 +31,8 @@ interface MinimalSaveModalProps {
 
 export function showSaveModal(
   saveModal: React.ReactElement<MinimalSaveModalProps>,
-  I18nContext: I18nStart['Context']
+  I18nContext: I18nStart['Context'],
+  Wrapper?: React.FC
 ) {
   const container = document.createElement('div');
   const closeModal = () => {
@@ -55,5 +56,13 @@ export function showSaveModal(
     onClose: closeModal,
   });
 
-  ReactDOM.render(<I18nContext>{element}</I18nContext>, container);
+  const wrappedElement = Wrapper ? (
+    <I18nContext>
+      <Wrapper>{element}</Wrapper>
+    </I18nContext>
+  ) : (
+    <I18nContext>{element}</I18nContext>
+  );
+
+  ReactDOM.render(wrappedElement, container);
 }
diff --git a/src/plugins/visualize/kibana.json b/src/plugins/visualize/kibana.json
index 7f5c7d0dc08a20..2256a7a7f550df 100644
--- a/src/plugins/visualize/kibana.json
+++ b/src/plugins/visualize/kibana.json
@@ -11,7 +11,8 @@
     "visualizations",
     "embeddable",
     "dashboard",
-    "uiActions"
+    "uiActions",
+    "presentationUtil"
   ],
   "optionalPlugins": [
     "home",
@@ -22,7 +23,6 @@
     "kibanaUtils",
     "kibanaReact",
     "home",
-    "presentationUtil",
     "discover"
   ]
 }
diff --git a/src/plugins/visualize/public/application/components/visualize_top_nav.tsx b/src/plugins/visualize/public/application/components/visualize_top_nav.tsx
index b0d931c6c87fa7..02da16c9e67cac 100644
--- a/src/plugins/visualize/public/application/components/visualize_top_nav.tsx
+++ b/src/plugins/visualize/public/application/components/visualize_top_nav.tsx
@@ -69,7 +69,6 @@ const TopNav = ({
     },
     [visInstance.embeddableHandler]
   );
-  const savedObjectsClient = services.savedObjects.client;
 
   const config = useMemo(() => {
     if (isEmbeddableRendered) {
@@ -85,7 +84,6 @@ const TopNav = ({
           stateContainer,
           visualizationIdFromUrl,
           stateTransfer: services.stateTransferService,
-          savedObjectsClient,
           embeddableId,
         },
         services
@@ -104,7 +102,6 @@ const TopNav = ({
     visualizationIdFromUrl,
     services,
     embeddableId,
-    savedObjectsClient,
   ]);
   const [indexPatterns, setIndexPatterns] = useState<IndexPattern[]>(
     vis.data.indexPattern ? [vis.data.indexPattern] : []
diff --git a/src/plugins/visualize/public/application/index.tsx b/src/plugins/visualize/public/application/index.tsx
index 455e51a8f58d42..ae11e1de486ea4 100644
--- a/src/plugins/visualize/public/application/index.tsx
+++ b/src/plugins/visualize/public/application/index.tsx
@@ -30,9 +30,11 @@ export const renderApp = (
   const app = (
     <Router history={services.history}>
       <KibanaContextProvider services={services}>
-        <services.i18n.Context>
-          <VisualizeApp onAppLeave={onAppLeave} />
-        </services.i18n.Context>
+        <services.presentationUtil.ContextProvider>
+          <services.i18n.Context>
+            <VisualizeApp onAppLeave={onAppLeave} />
+          </services.i18n.Context>
+        </services.presentationUtil.ContextProvider>
       </KibanaContextProvider>
     </Router>
   );
diff --git a/src/plugins/visualize/public/application/types.ts b/src/plugins/visualize/public/application/types.ts
index d923851a68d9c9..5d884889367bc3 100644
--- a/src/plugins/visualize/public/application/types.ts
+++ b/src/plugins/visualize/public/application/types.ts
@@ -34,6 +34,7 @@ import { SharePluginStart } from 'src/plugins/share/public';
 import { SavedObjectsStart, SavedObject } from 'src/plugins/saved_objects/public';
 import { EmbeddableStart, EmbeddableStateTransfer } from 'src/plugins/embeddable/public';
 import { UrlForwardingStart } from 'src/plugins/url_forwarding/public';
+import { PresentationUtilPluginStart } from 'src/plugins/presentation_util/public';
 import { EventEmitter } from 'events';
 import { DashboardStart } from '../../../dashboard/public';
 import type { SavedObjectsTaggingApi } from '../../../saved_objects_tagging_oss/public';
@@ -93,6 +94,7 @@ export interface VisualizeServices extends CoreStart {
   dashboard: DashboardStart;
   setHeaderActionMenu: AppMountParameters['setHeaderActionMenu'];
   savedObjectsTagging?: SavedObjectsTaggingApi;
+  presentationUtil: PresentationUtilPluginStart;
 }
 
 export interface SavedVisInstance {
diff --git a/src/plugins/visualize/public/application/utils/get_top_nav_config.tsx b/src/plugins/visualize/public/application/utils/get_top_nav_config.tsx
index b4ac98b672ee98..d782937bce40a9 100644
--- a/src/plugins/visualize/public/application/utils/get_top_nav_config.tsx
+++ b/src/plugins/visualize/public/application/utils/get_top_nav_config.tsx
@@ -20,7 +20,6 @@ import {
 } from '../../../../saved_objects/public';
 import { SavedObjectSaveModalDashboard } from '../../../../presentation_util/public';
 import { unhashUrl } from '../../../../kibana_utils/public';
-import { SavedObjectsClientContract } from '../../../../../core/public';
 
 import {
   VisualizeServices,
@@ -50,7 +49,6 @@ interface TopNavConfigParams {
   stateContainer: VisualizeAppStateContainer;
   visualizationIdFromUrl?: string;
   stateTransfer: EmbeddableStateTransfer;
-  savedObjectsClient: SavedObjectsClientContract;
   embeddableId?: string;
 }
 
@@ -72,7 +70,6 @@ export const getTopNavConfig = (
     hasUnappliedChanges,
     visInstance,
     stateContainer,
-    savedObjectsClient,
     visualizationIdFromUrl,
     stateTransfer,
     embeddableId,
@@ -88,6 +85,7 @@ export const getTopNavConfig = (
     i18n: { Context: I18nContext },
     dashboard,
     savedObjectsTagging,
+    presentationUtil,
   }: VisualizeServices
 ) => {
   const { vis, embeddableHandler } = visInstance;
@@ -397,39 +395,43 @@ export const getTopNavConfig = (
                 );
               }
 
-              const saveModal =
-                !!originatingApp ||
-                !dashboard.dashboardFeatureFlagConfig.allowByValueEmbeddables ? (
-                  <SavedObjectSaveModalOrigin
-                    documentInfo={savedVis || { title: '' }}
-                    onSave={onSave}
-                    options={tagOptions}
-                    getAppNameFromId={stateTransfer.getAppNameFromId}
-                    objectType={'visualization'}
-                    onClose={() => {}}
-                    originatingApp={originatingApp}
-                    returnToOriginSwitchLabel={
-                      originatingApp && embeddableId
-                        ? i18n.translate('visualize.topNavMenu.updatePanel', {
-                            defaultMessage: 'Update panel on {originatingAppName}',
-                            values: {
-                              originatingAppName: stateTransfer.getAppNameFromId(originatingApp),
-                            },
-                          })
-                        : undefined
-                    }
-                  />
-                ) : (
-                  <SavedObjectSaveModalDashboard
-                    documentInfo={savedVis || { title: '' }}
-                    onSave={onSave}
-                    tagOptions={tagOptions}
-                    objectType={'visualization'}
-                    onClose={() => {}}
-                    savedObjectsClient={savedObjectsClient}
-                  />
-                );
-              showSaveModal(saveModal, I18nContext);
+              const useByRefFlow =
+                !!originatingApp || !dashboard.dashboardFeatureFlagConfig.allowByValueEmbeddables;
+
+              const saveModal = useByRefFlow ? (
+                <SavedObjectSaveModalOrigin
+                  documentInfo={savedVis || { title: '' }}
+                  onSave={onSave}
+                  options={tagOptions}
+                  getAppNameFromId={stateTransfer.getAppNameFromId}
+                  objectType={'visualization'}
+                  onClose={() => {}}
+                  originatingApp={originatingApp}
+                  returnToOriginSwitchLabel={
+                    originatingApp && embeddableId
+                      ? i18n.translate('visualize.topNavMenu.updatePanel', {
+                          defaultMessage: 'Update panel on {originatingAppName}',
+                          values: {
+                            originatingAppName: stateTransfer.getAppNameFromId(originatingApp),
+                          },
+                        })
+                      : undefined
+                  }
+                />
+              ) : (
+                <SavedObjectSaveModalDashboard
+                  documentInfo={savedVis || { title: '' }}
+                  onSave={onSave}
+                  tagOptions={tagOptions}
+                  objectType={'visualization'}
+                  onClose={() => {}}
+                />
+              );
+              showSaveModal(
+                saveModal,
+                I18nContext,
+                !useByRefFlow ? presentationUtil.ContextProvider : React.Fragment
+              );
             },
           },
         ]
diff --git a/src/plugins/visualize/public/plugin.ts b/src/plugins/visualize/public/plugin.ts
index 111ee7b0041ed3..8d02e08549663d 100644
--- a/src/plugins/visualize/public/plugin.ts
+++ b/src/plugins/visualize/public/plugin.ts
@@ -20,6 +20,7 @@ import {
   ScopedHistory,
 } from 'kibana/public';
 
+import { PresentationUtilPluginStart } from '../../../../src/plugins/presentation_util/public';
 import {
   Storage,
   createKbnUrlTracker,
@@ -62,6 +63,7 @@ export interface VisualizePluginStartDependencies {
   savedObjects: SavedObjectsStart;
   dashboard: DashboardStart;
   savedObjectsTaggingOss?: SavedObjectTaggingOssPluginStart;
+  presentationUtil: PresentationUtilPluginStart;
 }
 
 export interface VisualizePluginSetupDependencies {
@@ -204,6 +206,7 @@ export class VisualizePlugin
           dashboard: pluginsStart.dashboard,
           setHeaderActionMenu: params.setHeaderActionMenu,
           savedObjectsTagging: pluginsStart.savedObjectsTaggingOss?.getTaggingApi(),
+          presentationUtil: pluginsStart.presentationUtil,
         };
 
         params.element.classList.add('visAppWrapper');
diff --git a/typings/index.d.ts b/typings/index.d.ts
index 782cc4271a06b5..8223d85d53289f 100644
--- a/typings/index.d.ts
+++ b/typings/index.d.ts
@@ -23,3 +23,10 @@ declare module '*.svg' {
   // eslint-disable-next-line import/no-default-export
   export default content;
 }
+
+// Storybook references this module. It's @ts-ignored in the codebase but when
+// built into its dist it strips that out. Add it here to avoid a type checking
+// error.
+//
+// See https://github.com/storybookjs/storybook/issues/11684
+declare module 'react-syntax-highlighter/dist/cjs/create-element';
diff --git a/x-pack/build_chromium/README.md b/x-pack/build_chromium/README.md
index 51c034e510024f..9934d06a9d96a5 100644
--- a/x-pack/build_chromium/README.md
+++ b/x-pack/build_chromium/README.md
@@ -15,11 +15,12 @@ gain familiarity.
 2. Click the "Compute Engine" tab.
 3. Ensure that `chromium-build-linux` and `chromium-build-windows-12-beefy` are there.
 4. If #3 fails, you'll have to spin up new instances. Generally, these need `n1-standard-8` types or 8 vCPUs/30 GB memory.
-5. Ensure that there's enough room left on the disk. `ncdu` is a good linux util to verify what's claming space.
+5. Ensure that there's enough room left on the disk: 100GB is required. `ncdu` is a good linux util to verify what's claming space.
 
 ## Usage
 
 ```
+export PATH=$HOME/chromium/depot_tools:$PATH
 # Create a dedicated working directory for this directory of Python scripts.
 mkdir ~/chromium && cd ~/chromium
 # Copy the scripts from the Kibana repo to use them conveniently in the working directory
diff --git a/x-pack/plugins/apm/server/lib/services/get_throughput.ts b/x-pack/plugins/apm/server/lib/services/get_throughput.ts
index 29071f96e3a06f..bde826a568da95 100644
--- a/x-pack/plugins/apm/server/lib/services/get_throughput.ts
+++ b/x-pack/plugins/apm/server/lib/services/get_throughput.ts
@@ -27,12 +27,17 @@ interface Options {
 
 type ESResponse = PromiseReturnType<typeof fetcher>;
 
-function transform(response: ESResponse) {
+function transform(response: ESResponse, options: Options) {
+  const { end, start } = options.setup;
+  const deltaAsMinutes = (end - start) / 1000 / 60;
   if (response.hits.total.value === 0) {
     return [];
   }
   const buckets = response.aggregations?.throughput.buckets ?? [];
-  return buckets.map(({ key: x, doc_count: y }) => ({ x, y }));
+  return buckets.map(({ key: x, doc_count: y }) => ({
+    x,
+    y: y / deltaAsMinutes,
+  }));
 }
 
 async function fetcher({
@@ -82,6 +87,6 @@ async function fetcher({
 
 export async function getThroughput(options: Options) {
   return {
-    throughput: transform(await fetcher(options)),
+    throughput: transform(await fetcher(options), options),
   };
 }
diff --git a/x-pack/plugins/enterprise_search/common/version.ts b/x-pack/plugins/enterprise_search/common/version.ts
deleted file mode 100644
index e1a990e5c4710a..00000000000000
--- a/x-pack/plugins/enterprise_search/common/version.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import SemVer from 'semver/classes/semver';
-import pkg from '../../../../package.json';
-
-export const CURRENT_VERSION = new SemVer(pkg.version as string);
-export const CURRENT_MAJOR_VERSION = `${CURRENT_VERSION.major}.${CURRENT_VERSION.minor}`;
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine_overview/engine_overview_empty.test.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine_overview/engine_overview_empty.test.tsx
index 6c46c849c79bc0..1b6acf341c08eb 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine_overview/engine_overview_empty.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine_overview/engine_overview_empty.test.tsx
@@ -8,7 +8,7 @@ import React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { EuiButton } from '@elastic/eui';
 
-import { CURRENT_MAJOR_VERSION } from '../../../../../common/version';
+import { docLinks } from '../../../shared/doc_links';
 
 import { DocumentCreationButtons, DocumentCreationFlyout } from '../document_creation';
 import { EmptyEngineOverview } from './engine_overview_empty';
@@ -24,10 +24,8 @@ describe('EmptyEngineOverview', () => {
     expect(wrapper.find('h1').text()).toEqual('Engine setup');
   });
 
-  it('renders correctly versioned documentation URLs', () => {
-    expect(wrapper.find(EuiButton).prop('href')).toEqual(
-      `https://www.elastic.co/guide/en/app-search/${CURRENT_MAJOR_VERSION}/index.html`
-    );
+  it('renders a documentation link', () => {
+    expect(wrapper.find(EuiButton).prop('href')).toEqual(`${docLinks.appSearchBase}/index.html`);
   });
 
   it('renders document creation components', () => {
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/routes.ts b/x-pack/plugins/enterprise_search/public/applications/app_search/routes.ts
index 41e9bfa19e0f0f..7f12f7d29671a7 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/routes.ts
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/routes.ts
@@ -4,9 +4,9 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { CURRENT_MAJOR_VERSION } from '../../../common/version';
+import { docLinks } from '../shared/doc_links';
 
-export const DOCS_PREFIX = `https://www.elastic.co/guide/en/app-search/${CURRENT_MAJOR_VERSION}`;
+export const DOCS_PREFIX = docLinks.appSearchBase;
 
 export const ROOT_PATH = '/';
 export const SETUP_GUIDE_PATH = '/setup_guide';
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/constants/documentation_links.ts b/x-pack/plugins/enterprise_search/public/applications/shared/constants/documentation_links.ts
deleted file mode 100644
index 7e774616ff5989..00000000000000
--- a/x-pack/plugins/enterprise_search/public/applications/shared/constants/documentation_links.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import { CURRENT_MAJOR_VERSION } from '../../../../common/version';
-
-export const ENT_SEARCH_DOCS_PREFIX = `https://www.elastic.co/guide/en/enterprise-search/${CURRENT_MAJOR_VERSION}`;
-
-export const CLOUD_DOCS_PREFIX = `https://www.elastic.co/guide/en/cloud/current`; // Cloud does not have version-prefixed documentation
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/constants/index.ts b/x-pack/plugins/enterprise_search/public/applications/shared/constants/index.ts
index 8fa3ccdcb863e6..4d4ff5f52ef20c 100644
--- a/x-pack/plugins/enterprise_search/public/applications/shared/constants/index.ts
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/constants/index.ts
@@ -5,4 +5,3 @@
  */
 
 export { DEFAULT_META } from './default_meta';
-export * from './documentation_links';
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/doc_links/doc_links.test.ts b/x-pack/plugins/enterprise_search/public/applications/shared/doc_links/doc_links.test.ts
new file mode 100644
index 00000000000000..3bee87dbfda3dc
--- /dev/null
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/doc_links/doc_links.test.ts
@@ -0,0 +1,30 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { docLinks } from './';
+
+describe('DocLinks', () => {
+  it('setDocLinks', () => {
+    const links = {
+      DOC_LINK_VERSION: '',
+      ELASTIC_WEBSITE_URL: 'https://elastic.co/',
+      links: {
+        enterpriseSearch: {
+          base: 'http://elastic.enterprise.search',
+          appSearchBase: 'http://elastic.app.search',
+          workplaceSearchBase: 'http://elastic.workplace.search',
+        },
+      },
+    };
+
+    docLinks.setDocLinks(links as any);
+
+    expect(docLinks.enterpriseSearchBase).toEqual('http://elastic.enterprise.search');
+    expect(docLinks.appSearchBase).toEqual('http://elastic.app.search');
+    expect(docLinks.workplaceSearchBase).toEqual('http://elastic.workplace.search');
+    expect(docLinks.cloudBase).toEqual('https://elastic.co/guide/en/cloud/current');
+  });
+});
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/doc_links/doc_links.ts b/x-pack/plugins/enterprise_search/public/applications/shared/doc_links/doc_links.ts
new file mode 100644
index 00000000000000..3ecb28d1d47297
--- /dev/null
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/doc_links/doc_links.ts
@@ -0,0 +1,30 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { DocLinksStart } from 'kibana/public';
+
+class DocLinks {
+  public enterpriseSearchBase: string;
+  public appSearchBase: string;
+  public workplaceSearchBase: string;
+  public cloudBase: string;
+
+  constructor() {
+    this.enterpriseSearchBase = '';
+    this.appSearchBase = '';
+    this.workplaceSearchBase = '';
+    this.cloudBase = '';
+  }
+
+  public setDocLinks(docLinks: DocLinksStart): void {
+    this.enterpriseSearchBase = docLinks.links.enterpriseSearch.base;
+    this.appSearchBase = docLinks.links.enterpriseSearch.appSearchBase;
+    this.workplaceSearchBase = docLinks.links.enterpriseSearch.workplaceSearchBase;
+    this.cloudBase = `${docLinks.ELASTIC_WEBSITE_URL}guide/en/cloud/current`;
+  }
+}
+
+export const docLinks = new DocLinks();
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/doc_links/index.ts b/x-pack/plugins/enterprise_search/public/applications/shared/doc_links/index.ts
new file mode 100644
index 00000000000000..a926efd59a5747
--- /dev/null
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/doc_links/index.ts
@@ -0,0 +1,7 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+export { docLinks } from './doc_links';
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/setup_guide/cloud/instructions.tsx b/x-pack/plugins/enterprise_search/public/applications/shared/setup_guide/cloud/instructions.tsx
index 383fd4b11108a4..26bbc8814d108a 100644
--- a/x-pack/plugins/enterprise_search/public/applications/shared/setup_guide/cloud/instructions.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/setup_guide/cloud/instructions.tsx
@@ -9,7 +9,7 @@ import { FormattedMessage } from '@kbn/i18n/react';
 import { i18n } from '@kbn/i18n';
 import { EuiPageContent, EuiSteps, EuiText, EuiLink, EuiCallOut } from '@elastic/eui';
 
-import { CLOUD_DOCS_PREFIX, ENT_SEARCH_DOCS_PREFIX } from '../../constants';
+import { docLinks } from '../../doc_links';
 
 interface Props {
   productName: string;
@@ -73,7 +73,7 @@ export const CloudSetupInstructions: React.FC<Props> = ({ productName, cloudDepl
                   values={{
                     optionsLink: (
                       <EuiLink
-                        href={`${ENT_SEARCH_DOCS_PREFIX}/configuration.html`}
+                        href={`${docLinks.enterpriseSearchBase}/configuration.html`}
                         target="_blank"
                       >
                         configurable options
@@ -115,7 +115,7 @@ export const CloudSetupInstructions: React.FC<Props> = ({ productName, cloudDepl
                     productName,
                     configurePolicyLink: (
                       <EuiLink
-                        href={`${CLOUD_DOCS_PREFIX}/ec-configure-index-management.html`}
+                        href={`${docLinks.cloudBase}/ec-configure-index-management.html`}
                         target="_blank"
                       >
                         configure an index lifecycle policy
diff --git a/x-pack/plugins/enterprise_search/public/applications/workplace_search/routes.ts b/x-pack/plugins/enterprise_search/public/applications/workplace_search/routes.ts
index 1e4b51e157724a..ef1bb03b7921cd 100644
--- a/x-pack/plugins/enterprise_search/public/applications/workplace_search/routes.ts
+++ b/x-pack/plugins/enterprise_search/public/applications/workplace_search/routes.ts
@@ -6,8 +6,7 @@
 
 import { generatePath } from 'react-router-dom';
 
-import { CURRENT_MAJOR_VERSION } from '../../../common/version';
-import { ENT_SEARCH_DOCS_PREFIX } from '../shared/constants';
+import { docLinks } from '../shared/doc_links';
 
 export const SETUP_GUIDE_PATH = '/setup_guide';
 
@@ -16,7 +15,7 @@ export const NOT_FOUND_PATH = '/404';
 export const LEAVE_FEEDBACK_EMAIL = 'support@elastic.co';
 export const LEAVE_FEEDBACK_URL = `mailto:${LEAVE_FEEDBACK_EMAIL}?Subject=Elastic%20Workplace%20Search%20Feedback`;
 
-export const DOCS_PREFIX = `https://www.elastic.co/guide/en/workplace-search/${CURRENT_MAJOR_VERSION}`;
+export const DOCS_PREFIX = docLinks.workplaceSearchBase;
 export const DOCUMENT_PERMISSIONS_DOCS_URL = `${DOCS_PREFIX}/workplace-search-sources-document-permissions.html`;
 export const DOCUMENT_PERMISSIONS_SYNC_DOCS_URL = `${DOCUMENT_PERMISSIONS_DOCS_URL}#sources-permissions-synchronizing`;
 export const PRIVATE_SOURCES_DOCS_URL = `${DOCUMENT_PERMISSIONS_DOCS_URL}#sources-permissions-org-private`;
@@ -42,7 +41,7 @@ export const ZENDESK_DOCS_URL = `${DOCS_PREFIX}/workplace-search-zendesk-connect
 export const CUSTOM_SOURCE_DOCS_URL = `${DOCS_PREFIX}/workplace-search-custom-api-sources.html`;
 export const CUSTOM_API_DOCS_URL = `${DOCS_PREFIX}/workplace-search-custom-sources-api.html`;
 export const CUSTOM_API_DOCUMENT_PERMISSIONS_DOCS_URL = `${CUSTOM_SOURCE_DOCS_URL}#custom-api-source-document-level-access-control`;
-export const ENT_SEARCH_LICENSE_MANAGEMENT = `${ENT_SEARCH_DOCS_PREFIX}/license-management.html`;
+export const ENT_SEARCH_LICENSE_MANAGEMENT = `${docLinks.enterpriseSearchBase}/license-management.html`;
 
 export const PERSONAL_PATH = '/p';
 
diff --git a/x-pack/plugins/enterprise_search/public/plugin.ts b/x-pack/plugins/enterprise_search/public/plugin.ts
index 632bb425f203e0..5f467c872447d0 100644
--- a/x-pack/plugins/enterprise_search/public/plugin.ts
+++ b/x-pack/plugins/enterprise_search/public/plugin.ts
@@ -6,6 +6,7 @@
 
 import {
   AppMountParameters,
+  CoreStart,
   CoreSetup,
   HttpSetup,
   Plugin,
@@ -27,6 +28,8 @@ import {
 } from '../common/constants';
 import { InitialAppData } from '../common/types';
 
+import { docLinks } from './applications/shared/doc_links';
+
 export interface ClientConfigType {
   host?: string;
 }
@@ -153,7 +156,11 @@ export class EnterpriseSearchPlugin implements Plugin {
     }
   }
 
-  public start() {}
+  public start(core: CoreStart) {
+    // This must be called here in start() and not in `applications/index.tsx` to prevent loading
+    // race conditions with our apps' `routes.ts` being initialized before `renderApp()`
+    docLinks.setDocLinks(core.docLinks);
+  }
 
   public stop() {}
 
diff --git a/x-pack/plugins/lens/kibana.json b/x-pack/plugins/lens/kibana.json
index 9df3f41fbd855b..d473d728dc361e 100644
--- a/x-pack/plugins/lens/kibana.json
+++ b/x-pack/plugins/lens/kibana.json
@@ -14,10 +14,26 @@
     "dashboard",
     "uiActions",
     "embeddable",
-    "share"
+    "share",
+    "presentationUtil"
   ],
-  "optionalPlugins": ["usageCollection", "taskManager", "globalSearch", "savedObjectsTagging"],
-  "configPath": ["xpack", "lens"],
-  "extraPublicDirs": ["common/constants"],
-  "requiredBundles": ["savedObjects", "kibanaUtils", "kibanaReact", "embeddable", "presentationUtil"]
+  "optionalPlugins": [
+    "usageCollection",
+    "taskManager",
+    "globalSearch",
+    "savedObjectsTagging"
+  ],
+  "configPath": [
+    "xpack",
+    "lens"
+  ],
+  "extraPublicDirs": [
+    "common/constants"
+  ],
+  "requiredBundles": [
+    "savedObjects",
+    "kibanaUtils",
+    "kibanaReact",
+    "embeddable"
+  ]
 }
diff --git a/x-pack/plugins/lens/public/app_plugin/app.tsx b/x-pack/plugins/lens/public/app_plugin/app.tsx
index 28e1f6da607421..c7764684029c72 100644
--- a/x-pack/plugins/lens/public/app_plugin/app.tsx
+++ b/x-pack/plugins/lens/public/app_plugin/app.tsx
@@ -707,7 +707,6 @@ export function App({
         isVisible={state.isSaveModalVisible}
         originatingApp={state.isLinkedToOriginatingApp ? incomingState?.originatingApp : undefined}
         allowByValueEmbeddables={dashboardFeatureFlag.allowByValueEmbeddables}
-        savedObjectsClient={savedObjectsClient}
         savedObjectsTagging={savedObjectsTagging}
         tagsIds={tagsIds}
         onSave={runSave}
diff --git a/x-pack/plugins/lens/public/app_plugin/mounter.tsx b/x-pack/plugins/lens/public/app_plugin/mounter.tsx
index e769e402ff0e1d..c4961b80c51228 100644
--- a/x-pack/plugins/lens/public/app_plugin/mounter.tsx
+++ b/x-pack/plugins/lens/public/app_plugin/mounter.tsx
@@ -3,7 +3,7 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
-import React, { useCallback } from 'react';
+import React, { FC, useCallback } from 'react';
 
 import { AppMountParameters, CoreSetup } from 'kibana/public';
 import { FormattedMessage, I18nProvider } from '@kbn/i18n/react';
@@ -39,9 +39,15 @@ export async function mountApp(
     createEditorFrame: EditorFrameStart['createInstance'];
     getByValueFeatureFlag: () => Promise<DashboardFeatureFlagConfig>;
     attributeService: () => Promise<LensAttributeService>;
+    getPresentationUtilContext: () => Promise<FC>;
   }
 ) {
-  const { createEditorFrame, getByValueFeatureFlag, attributeService } = mountProps;
+  const {
+    createEditorFrame,
+    getByValueFeatureFlag,
+    attributeService,
+    getPresentationUtilContext,
+  } = mountProps;
   const [coreStart, startDependencies] = await core.getStartServices();
   const { data, navigation, embeddable, savedObjectsTagging } = startDependencies;
 
@@ -196,21 +202,26 @@ export async function mountApp(
   });
 
   params.element.classList.add('lnsAppWrapper');
+
+  const PresentationUtilContext = await getPresentationUtilContext();
+
   render(
     <I18nProvider>
       <KibanaContextProvider services={lensServices}>
-        <HashRouter>
-          <Switch>
-            <Route exact path="/edit/:id" component={EditorRoute} />
-            <Route
-              exact
-              path={`/${LENS_EDIT_BY_VALUE}`}
-              render={(routeProps) => <EditorRoute {...routeProps} editByValue />}
-            />
-            <Route exact path="/" component={EditorRoute} />
-            <Route path="/" component={NotFound} />
-          </Switch>
-        </HashRouter>
+        <PresentationUtilContext>
+          <HashRouter>
+            <Switch>
+              <Route exact path="/edit/:id" component={EditorRoute} />
+              <Route
+                exact
+                path={`/${LENS_EDIT_BY_VALUE}`}
+                render={(routeProps) => <EditorRoute {...routeProps} editByValue />}
+              />
+              <Route exact path="/" component={EditorRoute} />
+              <Route path="/" component={NotFound} />
+            </Switch>
+          </HashRouter>
+        </PresentationUtilContext>
       </KibanaContextProvider>
     </I18nProvider>,
     params.element
diff --git a/x-pack/plugins/lens/public/app_plugin/save_modal.tsx b/x-pack/plugins/lens/public/app_plugin/save_modal.tsx
index 4fa35bd9148899..a3ac7322db31f3 100644
--- a/x-pack/plugins/lens/public/app_plugin/save_modal.tsx
+++ b/x-pack/plugins/lens/public/app_plugin/save_modal.tsx
@@ -7,8 +7,6 @@
 import React from 'react';
 import { i18n } from '@kbn/i18n';
 
-import { SavedObjectsStart } from '../../../../../src/core/public';
-
 import { Document } from '../persistence';
 import type { SavedObjectTaggingPluginStart } from '../../../saved_objects_tagging/public';
 
@@ -29,8 +27,6 @@ export interface Props {
   originatingApp?: string;
   allowByValueEmbeddables: boolean;
 
-  savedObjectsClient: SavedObjectsStart['client'];
-
   savedObjectsTagging?: SavedObjectTaggingPluginStart;
   tagsIds: string[];
 
@@ -51,7 +47,6 @@ export const SaveModal = (props: Props) => {
   const {
     originatingApp,
     savedObjectsTagging,
-    savedObjectsClient,
     tagsIds,
     lastKnownDoc,
     allowByValueEmbeddables,
@@ -88,7 +83,6 @@ export const SaveModal = (props: Props) => {
   return (
     <TagEnhancedSavedObjectSaveModalDashboard
       savedObjectsTagging={savedObjectsTagging}
-      savedObjectsClient={savedObjectsClient}
       initialTags={tagsIds}
       onSave={(saveProps) => {
         const saveToLibrary = saveProps.dashboardId === null;
diff --git a/x-pack/plugins/lens/public/app_plugin/tags_saved_object_save_modal_dashboard_wrapper.tsx b/x-pack/plugins/lens/public/app_plugin/tags_saved_object_save_modal_dashboard_wrapper.tsx
index 087cfdc9f3a8af..b191b8829347cb 100644
--- a/x-pack/plugins/lens/public/app_plugin/tags_saved_object_save_modal_dashboard_wrapper.tsx
+++ b/x-pack/plugins/lens/public/app_plugin/tags_saved_object_save_modal_dashboard_wrapper.tsx
@@ -7,7 +7,7 @@
 import React, { FC, useState, useMemo, useCallback } from 'react';
 import { OnSaveProps } from '../../../../../src/plugins/saved_objects/public';
 import {
-  DashboardSaveModalProps,
+  SaveModalDashboardProps,
   SavedObjectSaveModalDashboard,
 } from '../../../../../src/plugins/presentation_util/public';
 import { SavedObjectTaggingPluginStart } from '../../../saved_objects_tagging/public';
@@ -19,7 +19,7 @@ export type DashboardSaveProps = OnSaveProps & {
 };
 
 export type TagEnhancedSavedObjectSaveModalDashboardProps = Omit<
-  DashboardSaveModalProps,
+  SaveModalDashboardProps,
   'onSave'
 > & {
   initialTags: string[];
@@ -48,7 +48,7 @@ export const TagEnhancedSavedObjectSaveModalDashboard: FC<TagEnhancedSavedObject
 
   const tagEnhancedOptions = <>{tagSelectorOption}</>;
 
-  const tagEnhancedOnSave: DashboardSaveModalProps['onSave'] = useCallback(
+  const tagEnhancedOnSave: SaveModalDashboardProps['onSave'] = useCallback(
     (saveOptions) => {
       onSave({
         ...saveOptions,
diff --git a/x-pack/plugins/lens/public/plugin.ts b/x-pack/plugins/lens/public/plugin.ts
index 3fb7186aeac59a..9848551e7873ff 100644
--- a/x-pack/plugins/lens/public/plugin.ts
+++ b/x-pack/plugins/lens/public/plugin.ts
@@ -17,6 +17,7 @@ import { NavigationPublicPluginStart } from '../../../../src/plugins/navigation/
 import { UrlForwardingSetup } from '../../../../src/plugins/url_forwarding/public';
 import { GlobalSearchPluginSetup } from '../../global_search/public';
 import { ChartsPluginSetup, ChartsPluginStart } from '../../../../src/plugins/charts/public';
+import { PresentationUtilPluginStart } from '../../../../src/plugins/presentation_util/public';
 import { EmbeddableStateTransfer } from '../../../../src/plugins/embeddable/public';
 import { EditorFrameService } from './editor_frame_service';
 import {
@@ -71,6 +72,7 @@ export interface LensPluginStartDependencies {
   embeddable: EmbeddableStart;
   charts: ChartsPluginStart;
   savedObjectsTagging?: SavedObjectTaggingPluginStart;
+  presentationUtil: PresentationUtilPluginStart;
 }
 
 export interface LensPublicStart {
@@ -172,6 +174,12 @@ export class LensPlugin {
       return deps.dashboard.dashboardFeatureFlagConfig;
     };
 
+    const getPresentationUtilContext = async () => {
+      const [, deps] = await core.getStartServices();
+      const { ContextProvider } = deps.presentationUtil;
+      return ContextProvider;
+    };
+
     core.application.register({
       id: 'lens',
       title: NOT_INTERNATIONALIZED_PRODUCT_NAME,
@@ -183,6 +191,7 @@ export class LensPlugin {
           createEditorFrame: this.createEditorFrame!,
           attributeService: this.attributeService!,
           getByValueFeatureFlag,
+          getPresentationUtilContext,
         });
       },
     });
diff --git a/x-pack/plugins/maps/kibana.json b/x-pack/plugins/maps/kibana.json
index 2536601d0e6b19..744cc18c36f3e1 100644
--- a/x-pack/plugins/maps/kibana.json
+++ b/x-pack/plugins/maps/kibana.json
@@ -2,7 +2,10 @@
   "id": "maps",
   "version": "8.0.0",
   "kibanaVersion": "kibana",
-  "configPath": ["xpack", "maps"],
+  "configPath": [
+    "xpack",
+    "maps"
+  ],
   "requiredPlugins": [
     "licensing",
     "features",
@@ -17,11 +20,21 @@
     "mapsLegacy",
     "usageCollection",
     "savedObjects",
-    "share"
+    "share",
+    "presentationUtil"
+  ],
+  "optionalPlugins": [
+    "home",
+    "savedObjectsTagging"
   ],
-  "optionalPlugins": ["home", "savedObjectsTagging"],
   "ui": true,
   "server": true,
-  "extraPublicDirs": ["common/constants"],
-  "requiredBundles": ["kibanaReact", "kibanaUtils", "home", "presentationUtil"]
+  "extraPublicDirs": [
+    "common/constants"
+  ],
+  "requiredBundles": [
+    "kibanaReact",
+    "kibanaUtils",
+    "home"
+  ]
 }
diff --git a/x-pack/plugins/maps/public/kibana_services.ts b/x-pack/plugins/maps/public/kibana_services.ts
index 99c9311a2a4548..56e342a95be51c 100644
--- a/x-pack/plugins/maps/public/kibana_services.ts
+++ b/x-pack/plugins/maps/public/kibana_services.ts
@@ -49,6 +49,7 @@ export const getSearchService = () => pluginsStart.data.search;
 export const getEmbeddableService = () => pluginsStart.embeddable;
 export const getNavigateToApp = () => coreStart.application.navigateToApp;
 export const getSavedObjectsTagging = () => pluginsStart.savedObjectsTagging;
+export const getPresentationUtilContext = () => pluginsStart.presentationUtil.ContextProvider;
 
 // xpack.maps.* kibana.yml settings from this plugin
 let mapAppConfig: MapsConfigType;
diff --git a/x-pack/plugins/maps/public/plugin.ts b/x-pack/plugins/maps/public/plugin.ts
index 4173328a41d571..5bd0bd7346ab1e 100644
--- a/x-pack/plugins/maps/public/plugin.ts
+++ b/x-pack/plugins/maps/public/plugin.ts
@@ -55,6 +55,7 @@ import { DataPublicPluginStart } from '../../../../src/plugins/data/public';
 import { LicensingPluginSetup, LicensingPluginStart } from '../../licensing/public';
 import { StartContract as FileUploadStartContract } from '../../maps_file_upload/public';
 import { SavedObjectsStart } from '../../../../src/plugins/saved_objects/public';
+import { PresentationUtilPluginStart } from '../../../../src/plugins/presentation_util/public';
 import {
   getIsEnterprisePlus,
   registerLicensedFeatures,
@@ -86,6 +87,7 @@ export interface MapsPluginStartDependencies {
   savedObjects: SavedObjectsStart;
   dashboard: DashboardStart;
   savedObjectsTagging?: SavedObjectTaggingPluginStart;
+  presentationUtil: PresentationUtilPluginStart;
 }
 
 /**
diff --git a/x-pack/plugins/maps/public/routes/map_page/top_nav_config.tsx b/x-pack/plugins/maps/public/routes/map_page/top_nav_config.tsx
index 7010c281d24c61..803b9defe9a246 100644
--- a/x-pack/plugins/maps/public/routes/map_page/top_nav_config.tsx
+++ b/x-pack/plugins/maps/public/routes/map_page/top_nav_config.tsx
@@ -16,6 +16,7 @@ import {
   getSavedObjectsClient,
   getCoreOverlays,
   getSavedObjectsTagging,
+  getPresentationUtilContext,
 } from '../../kibana_services';
 import {
   checkForDuplicateTitle,
@@ -185,7 +186,7 @@ export function getTopNavConfig({
             defaultMessage: 'map',
           }),
         };
-
+        const PresentationUtilContext = getPresentationUtilContext();
         const saveModal =
           savedMap.getOriginatingApp() || !getIsAllowByValueEmbeddables() ? (
             <SavedObjectSaveModalOrigin
@@ -195,14 +196,10 @@ export function getTopNavConfig({
               options={tagSelector}
             />
           ) : (
-            <SavedObjectSaveModalDashboard
-              {...saveModalProps}
-              savedObjectsClient={getSavedObjectsClient()}
-              tagOptions={tagSelector}
-            />
+            <SavedObjectSaveModalDashboard {...saveModalProps} tagOptions={tagSelector} />
           );
 
-        showSaveModal(saveModal, getCoreI18n().Context);
+        showSaveModal(saveModal, getCoreI18n().Context, PresentationUtilContext);
       },
     });
 
diff --git a/x-pack/test/apm_api_integration/tests/services/__snapshots__/throughput.snap b/x-pack/test/apm_api_integration/tests/services/__snapshots__/throughput.snap
index f23601fccb1747..eee0ec7f9ad38a 100644
--- a/x-pack/test/apm_api_integration/tests/services/__snapshots__/throughput.snap
+++ b/x-pack/test/apm_api_integration/tests/services/__snapshots__/throughput.snap
@@ -8,7 +8,7 @@ Array [
   },
   Object {
     "x": 1607435880000,
-    "y": 4,
+    "y": 0.133333333333333,
   },
   Object {
     "x": 1607435910000,
@@ -16,7 +16,7 @@ Array [
   },
   Object {
     "x": 1607435940000,
-    "y": 2,
+    "y": 0.0666666666666667,
   },
   Object {
     "x": 1607435970000,
@@ -24,11 +24,11 @@ Array [
   },
   Object {
     "x": 1607436000000,
-    "y": 3,
+    "y": 0.1,
   },
   Object {
     "x": 1607436030000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607436060000,
@@ -40,7 +40,7 @@ Array [
   },
   Object {
     "x": 1607436120000,
-    "y": 4,
+    "y": 0.133333333333333,
   },
   Object {
     "x": 1607436150000,
@@ -56,7 +56,7 @@ Array [
   },
   Object {
     "x": 1607436240000,
-    "y": 6,
+    "y": 0.2,
   },
   Object {
     "x": 1607436270000,
@@ -68,15 +68,15 @@ Array [
   },
   Object {
     "x": 1607436330000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607436360000,
-    "y": 5,
+    "y": 0.166666666666667,
   },
   Object {
     "x": 1607436390000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607436420000,
@@ -88,11 +88,11 @@ Array [
   },
   Object {
     "x": 1607436480000,
-    "y": 2,
+    "y": 0.0666666666666667,
   },
   Object {
     "x": 1607436510000,
-    "y": 5,
+    "y": 0.166666666666667,
   },
   Object {
     "x": 1607436540000,
@@ -104,11 +104,11 @@ Array [
   },
   Object {
     "x": 1607436600000,
-    "y": 2,
+    "y": 0.0666666666666667,
   },
   Object {
     "x": 1607436630000,
-    "y": 7,
+    "y": 0.233333333333333,
   },
   Object {
     "x": 1607436660000,
@@ -124,7 +124,7 @@ Array [
   },
   Object {
     "x": 1607436750000,
-    "y": 2,
+    "y": 0.0666666666666667,
   },
   Object {
     "x": 1607436780000,
@@ -132,15 +132,15 @@ Array [
   },
   Object {
     "x": 1607436810000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607436840000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607436870000,
-    "y": 2,
+    "y": 0.0666666666666667,
   },
   Object {
     "x": 1607436900000,
@@ -152,11 +152,11 @@ Array [
   },
   Object {
     "x": 1607436960000,
-    "y": 2,
+    "y": 0.0666666666666667,
   },
   Object {
     "x": 1607436990000,
-    "y": 4,
+    "y": 0.133333333333333,
   },
   Object {
     "x": 1607437020000,
@@ -168,11 +168,11 @@ Array [
   },
   Object {
     "x": 1607437080000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607437110000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607437140000,
@@ -184,15 +184,15 @@ Array [
   },
   Object {
     "x": 1607437200000,
-    "y": 2,
+    "y": 0.0666666666666667,
   },
   Object {
     "x": 1607437230000,
-    "y": 7,
+    "y": 0.233333333333333,
   },
   Object {
     "x": 1607437260000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607437290000,
@@ -200,11 +200,11 @@ Array [
   },
   Object {
     "x": 1607437320000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607437350000,
-    "y": 2,
+    "y": 0.0666666666666667,
   },
   Object {
     "x": 1607437380000,
@@ -216,11 +216,11 @@ Array [
   },
   Object {
     "x": 1607437440000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607437470000,
-    "y": 3,
+    "y": 0.1,
   },
   Object {
     "x": 1607437500000,
@@ -232,7 +232,7 @@ Array [
   },
   Object {
     "x": 1607437560000,
-    "y": 1,
+    "y": 0.0333333333333333,
   },
   Object {
     "x": 1607437590000,
diff --git a/yarn.lock b/yarn.lock
index befb7295699459..1b8cc2f8dc6e2c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4445,7 +4445,7 @@
     core-js "^3.0.1"
     ts-dedent "^1.1.1"
 
-"@storybook/addon-docs@6.0.26":
+"@storybook/addon-docs@6.0.26", "@storybook/addon-docs@^6.0.26":
   version "6.0.26"
   resolved "https://registry.yarnpkg.com/@storybook/addon-docs/-/addon-docs-6.0.26.tgz#bd7fc1fcdc47bb7992fa8d3254367e8c3bba373d"
   integrity sha512-3t8AOPkp8ZW74h7FnzxF3wAeb1wRyYjMmgJZxqzgi/x7K0i1inbCq8MuJnytuTcZ7+EK4HR6Ih7o9tJuAtIBLw==