Move panel placement register to dashboard start contract

examples/embeddable_examples/public/app/register_embeddable.tsx

@@ -64,10 +64,11 @@ export const RegisterEmbeddable = () => {
       <EuiText>
         <h2>Configure initial dashboard placement (optional)</h2>
         <p>
-          Add an entry to <strong>registerDashboardPanelPlacementSetting</strong> to configure
-          initial dashboard placement. Panel placement lets you configure the width, height, and
-          placement strategy when panels get added to a dashboard. In the example below, the Field
-          List embeddable will be added to dashboards as a narrow and tall panel.
+          Add an entry to <strong>registerDashboardPanelPlacementSetting</strong> provided by the
+          Dashboard plugin start contract to configure initial dashboard placement. Panel placement
+          lets you configure the width, height, and placement strategy when panels get added to a
+          dashboard. In the example below, the Field List embeddable will be added to dashboards as
+          a narrow and tall panel.
         </p>
       </EuiText>
       <EuiSpacer size="s" />

examples/embeddable_examples/public/plugin.ts

@@ -8,6 +8,7 @@
 
 import { ChartsPluginStart } from '@kbn/charts-plugin/public';
 import { CoreSetup, CoreStart, Plugin } from '@kbn/core/public';
+import { DashboardStart } from '@kbn/dashboard-plugin/public';
 import { DataPublicPluginStart } from '@kbn/data-plugin/public';
 import { DataViewFieldEditorStart } from '@kbn/data-view-field-editor-plugin/public';
 import { DataViewsPublicPluginStart } from '@kbn/data-views-plugin/public';
@@ -44,6 +45,7 @@ export interface StartDeps {
   data: DataPublicPluginStart;
   charts: ChartsPluginStart;
   fieldFormats: FieldFormatsStart;
+  dashboard: DashboardStart;
 }
 
 export class EmbeddableExamplesPlugin implements Plugin<void, void, SetupDeps, StartDeps> {
@@ -59,7 +61,7 @@ export class EmbeddableExamplesPlugin implements Plugin<void, void, SetupDeps, S
       );
       return getFieldListFactory(core, deps);
     });
-    registerFieldListPanelPlacementSetting();
+    registerFieldListPanelPlacementSetting(deps.dashboard);
 
     registerCreateEuiMarkdownAction(deps.uiActions);
     registerReactEmbeddableFactory(EUI_MARKDOWN_ID, async () => {

examples/embeddable_examples/public/react_embeddables/field_list/register_field_list_embeddable.ts

@@ -6,10 +6,7 @@
  * Side Public License, v 1.
  */
 
-import {
-  registerDashboardPanelPlacementSetting,
-  PanelPlacementStrategy,
-} from '@kbn/dashboard-plugin/public';
+import { DashboardStart, PanelPlacementStrategy } from '@kbn/dashboard-plugin/public';
 import { FIELD_LIST_ID } from './constants';
 import { FieldListSerializedStateState } from './types';
 
@@ -22,6 +19,6 @@ const getPanelPlacementSetting = (serializedState?: FieldListSerializedStateStat
   };
 };
 
-export function registerFieldListPanelPlacementSetting() {
-  registerDashboardPanelPlacementSetting(FIELD_LIST_ID, getPanelPlacementSetting);
+export function registerFieldListPanelPlacementSetting(dashboard: DashboardStart) {
+  dashboard.registerDashboardPanelPlacementSetting(FIELD_LIST_ID, getPanelPlacementSetting);
 }

src/plugins/dashboard/public/dashboard_container/embeddable/api/duplicate_dashboard_panel.ts

@@ -19,7 +19,7 @@ import { v4 as uuidv4 } from 'uuid';
 import { DashboardPanelState } from '../../../../common';
 import { dashboardClonePanelActionStrings } from '../../../dashboard_actions/_dashboard_actions_strings';
 import { pluginServices } from '../../../services/plugin_services';
-import { placeClonePanel } from '../../component/panel_placement';
+import { placeClonePanel } from '../../panel_placement';
 import { DashboardContainer } from '../dashboard_container';
 
 const duplicateLegacyInput = async (

src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts

@@ -46,7 +46,7 @@ import {
   SavedDashboardInput,
 } from '../../../services/dashboard_content_management/types';
 import { pluginServices } from '../../../services/plugin_services';
-import { runPanelPlacementStrategy } from '../../component/panel_placement/place_new_panel_strategies';
+import { runPanelPlacementStrategy } from '../../panel_placement/place_new_panel_strategies';
 import { startDiffingDashboardState } from '../../state/diffing/dashboard_diffing_integration';
 import { DashboardPublicState } from '../../types';
 import { DashboardContainer } from '../dashboard_container';

src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.tsx

@@ -62,11 +62,11 @@ import {
 import { DashboardAnalyticsService } from '../../services/analytics/types';
 import { DashboardCapabilitiesService } from '../../services/dashboard_capabilities/types';
 import { pluginServices } from '../../services/plugin_services';
-import { placePanel } from '../component/panel_placement';
-import { runPanelPlacementStrategy } from '../component/panel_placement/place_new_panel_strategies';
+import { placePanel } from '../panel_placement';
+import { runPanelPlacementStrategy } from '../panel_placement/place_new_panel_strategies';
 import { DashboardViewport } from '../component/viewport/dashboard_viewport';
 import { DashboardExternallyAccessibleApi } from '../external_api/dashboard_api';
-import { getDashboardPanelPlacementSetting } from '../external_api/dashboard_panel_placement_registry';
+import { getDashboardPanelPlacementSetting } from '../panel_placement/panel_placement_registry';
 import { dashboardContainerReducers } from '../state/dashboard_container_reducers';
 import { getDiffingMiddleware } from '../state/diffing/dashboard_diffing_integration';
 import {

src/plugins/dashboard/public/dashboard_container/index.ts

@@ -22,5 +22,5 @@ export {
 
 export { DashboardRenderer } from './external_api/dashboard_renderer';
 export type { DashboardAPI, AwaitingDashboardAPI } from './external_api/dashboard_api';
-export { registerDashboardPanelPlacementSetting } from './external_api/dashboard_panel_placement_registry';
 export type { DashboardLocatorParams } from './types';
+export type { IProvidesLegacyPanelPlacementSettings } from './panel_placement';

src/plugins/dashboard/public/dashboard_container/component/panel_placement/index.ts → src/plugins/dashboard/public/dashboard_container/panel_placement/index.ts

@@ -9,3 +9,7 @@
 export { placePanel } from './place_panel';
 
 export { placeClonePanel } from './place_clone_panel_strategy';
+
+export { registerDashboardPanelPlacementSetting } from './panel_placement_registry';
+
+export type { GetPanelPlacementSettings, IProvidesLegacyPanelPlacementSettings } from './types';

src/plugins/dashboard/public/dashboard_container/external_api/dashboard_panel_placement_registry.ts → src/plugins/dashboard/public/dashboard_container/panel_placement/panel_placement_registry.ts

@@ -6,13 +6,9 @@
  * Side Public License, v 1.
  */
 
-import { PanelPlacementSettings } from '../component/panel_placement/types';
+import { GetPanelPlacementSettings } from './types';
 import { panelPlacementStrings } from '../_dashboard_container_strings';
 
-type GetPanelPlacementSettings<SerializedState extends object = object> = (
-  serializedState?: SerializedState
-) => PanelPlacementSettings;
-
 const registry = new Map<string, GetPanelPlacementSettings<object>>();
 
 export const registerDashboardPanelPlacementSetting = (

src/plugins/dashboard/public/dashboard_container/component/panel_placement/place_clone_panel_strategy.ts → src/plugins/dashboard/public/dashboard_container/panel_placement/place_clone_panel_strategy.ts

@@ -9,10 +9,10 @@
 import { cloneDeep, forOwn } from 'lodash';
 import { PanelNotFoundError } from '@kbn/embeddable-plugin/public';
 
-import { DashboardPanelState } from '../../../../common';
-import { GridData } from '../../../../common/content_management';
+import { DashboardPanelState } from '../../../common';
+import { GridData } from '../../../common/content_management';
 import { PanelPlacementProps, PanelPlacementReturn } from './types';
-import { DASHBOARD_GRID_COLUMN_COUNT } from '../../../dashboard_constants';
+import { DASHBOARD_GRID_COLUMN_COUNT } from '../../dashboard_constants';
 
 interface IplacementDirection {
   grid: Omit<GridData, 'i'>;

src/plugins/dashboard/public/dashboard_container/component/panel_placement/place_new_panel_strategies.ts → src/plugins/dashboard/public/dashboard_container/panel_placement/place_new_panel_strategies.ts

@@ -7,8 +7,8 @@
  */
 
 import { cloneDeep } from 'lodash';
-import { DASHBOARD_GRID_COLUMN_COUNT, PanelPlacementStrategy } from '../../../dashboard_constants';
-import { panelPlacementStrings } from '../../_dashboard_container_strings';
+import { DASHBOARD_GRID_COLUMN_COUNT, PanelPlacementStrategy } from '../../dashboard_constants';
+import { panelPlacementStrings } from '../_dashboard_container_strings';
 import { PanelPlacementProps, PanelPlacementReturn } from './types';
 
 export const runPanelPlacementStrategy = (

src/plugins/dashboard/public/dashboard_container/component/panel_placement/place_panel.test.ts → src/plugins/dashboard/public/dashboard_container/panel_placement/place_panel.test.ts

@@ -6,13 +6,13 @@
  * Side Public License, v 1.
  */
 
-import { DashboardPanelState } from '../../../../common';
+import { DashboardPanelState } from '../../../common';
 import { EmbeddableFactory, EmbeddableInput } from '@kbn/embeddable-plugin/public';
 import { CONTACT_CARD_EMBEDDABLE } from '@kbn/embeddable-plugin/public/lib/test_samples';
-import { DEFAULT_PANEL_HEIGHT, DEFAULT_PANEL_WIDTH } from '../../../dashboard_constants';
+import { DEFAULT_PANEL_HEIGHT, DEFAULT_PANEL_WIDTH } from '../../dashboard_constants';
 
 import { placePanel } from './place_panel';
-import { IProvidesPanelPlacementSettings } from './types';
+import { IProvidesLegacyPanelPlacementSettings } from './types';
 
 interface TestInput extends EmbeddableInput {
   test: string;
@@ -92,8 +92,8 @@ test('adds a new panel state in the top most position when it is open', () => {
 });
 
 test('adds a new panel state at the very top of the Dashboard with default sizing', () => {
-  const embeddableFactoryStub: IProvidesPanelPlacementSettings = {
-    getPanelPlacementSettings: jest.fn().mockImplementation(() => {
+  const embeddableFactoryStub: IProvidesLegacyPanelPlacementSettings = {
+    getLegacyPanelPlacementSettings: jest.fn().mockImplementation(() => {
       return { strategy: 'placeAtTop' };
     }),
   };
@@ -111,15 +111,15 @@ test('adds a new panel state at the very top of the Dashboard with default sizin
   expect(panelState.gridData.h).toBe(DEFAULT_PANEL_HEIGHT);
   expect(panelState.gridData.w).toBe(DEFAULT_PANEL_WIDTH);
 
-  expect(embeddableFactoryStub.getPanelPlacementSettings).toHaveBeenCalledWith(
+  expect(embeddableFactoryStub.getLegacyPanelPlacementSettings).toHaveBeenCalledWith(
     { id: '9001', test: 'wowee' },
     undefined
   );
 });
 
 test('adds a new panel state at the very top of the Dashboard with custom sizing', () => {
-  const embeddableFactoryStub: IProvidesPanelPlacementSettings = {
-    getPanelPlacementSettings: jest.fn().mockImplementation(() => {
+  const embeddableFactoryStub: IProvidesLegacyPanelPlacementSettings = {
+    getLegacyPanelPlacementSettings: jest.fn().mockImplementation(() => {
       return { strategy: 'placeAtTop', width: 10, height: 5 };
     }),
   };
@@ -137,15 +137,15 @@ test('adds a new panel state at the very top of the Dashboard with custom sizing
   expect(panelState.gridData.h).toBe(5);
   expect(panelState.gridData.w).toBe(10);
 
-  expect(embeddableFactoryStub.getPanelPlacementSettings).toHaveBeenCalledWith(
+  expect(embeddableFactoryStub.getLegacyPanelPlacementSettings).toHaveBeenCalledWith(
     { id: '9002', test: 'woweee' },
     undefined
   );
 });
 
 test('passes through given attributes', () => {
-  const embeddableFactoryStub: IProvidesPanelPlacementSettings = {
-    getPanelPlacementSettings: jest.fn().mockImplementation(() => {
+  const embeddableFactoryStub: IProvidesLegacyPanelPlacementSettings = {
+    getLegacyPanelPlacementSettings: jest.fn().mockImplementation(() => {
       return { strategy: 'placeAtTop', width: 10, height: 5 };
     }),
   };
@@ -160,7 +160,7 @@ test('passes through given attributes', () => {
     { testAttr: 'hello' }
   );
 
-  expect(embeddableFactoryStub.getPanelPlacementSettings).toHaveBeenCalledWith(
+  expect(embeddableFactoryStub.getLegacyPanelPlacementSettings).toHaveBeenCalledWith(
     { id: '9004', test: 'wow' },
     { testAttr: 'hello' }
   );

src/plugins/dashboard/public/dashboard_container/component/panel_placement/place_panel.ts → src/plugins/dashboard/public/dashboard_container/panel_placement/place_panel.ts

@@ -8,19 +8,19 @@
 
 import { PanelState, EmbeddableInput, EmbeddableFactory } from '@kbn/embeddable-plugin/public';
 
-import { DashboardPanelState } from '../../../../common';
-import { IProvidesPanelPlacementSettings } from './types';
+import { DashboardPanelState } from '../../../common';
+import { IProvidesLegacyPanelPlacementSettings } from './types';
 import { runPanelPlacementStrategy } from './place_new_panel_strategies';
 import {
   DEFAULT_PANEL_HEIGHT,
   DEFAULT_PANEL_WIDTH,
   PanelPlacementStrategy,
-} from '../../../dashboard_constants';
+} from '../../dashboard_constants';
 
-export const providesPanelPlacementSettings = (
+export const providesLegacyPanelPlacementSettings = (
   value: unknown
-): value is IProvidesPanelPlacementSettings => {
-  return Boolean((value as IProvidesPanelPlacementSettings).getPanelPlacementSettings);
+): value is IProvidesLegacyPanelPlacementSettings => {
+  return Boolean((value as IProvidesLegacyPanelPlacementSettings).getLegacyPanelPlacementSettings);
 };
 
 export function placePanel<TEmbeddableInput extends EmbeddableInput>(
@@ -37,10 +37,10 @@ export function placePanel<TEmbeddableInput extends EmbeddableInput>(
     height: DEFAULT_PANEL_HEIGHT,
     strategy: PanelPlacementStrategy.findTopLeftMostOpenSpace,
   };
-  if (providesPanelPlacementSettings(factory)) {
+  if (providesLegacyPanelPlacementSettings(factory)) {
     placementSettings = {
       ...placementSettings,
-      ...factory.getPanelPlacementSettings(newPanel.explicitInput, attributes),
+      ...factory.getLegacyPanelPlacementSettings(newPanel.explicitInput, attributes),
     };
   }
   const { width, height, strategy } = placementSettings;

src/plugins/dashboard/public/dashboard_container/component/panel_placement/types.ts → src/plugins/dashboard/public/dashboard_container/panel_placement/types.ts

@@ -7,9 +7,9 @@
  */
 
 import { EmbeddableInput } from '@kbn/embeddable-plugin/public';
-import { DashboardPanelState } from '../../../../common';
-import { GridData } from '../../../../common/content_management';
-import { PanelPlacementStrategy } from '../../../dashboard_constants';
+import { DashboardPanelState } from '../../../common';
+import { GridData } from '../../../common/content_management';
+import { PanelPlacementStrategy } from '../../dashboard_constants';
 
 export interface PanelPlacementSettings {
   strategy?: PanelPlacementStrategy;
@@ -28,12 +28,16 @@ export interface PanelPlacementProps {
   currentPanels: { [key: string]: DashboardPanelState };
 }
 
-export interface IProvidesPanelPlacementSettings<
+export interface IProvidesLegacyPanelPlacementSettings<
   InputType extends EmbeddableInput = EmbeddableInput,
   AttributesType = unknown
 > {
-  getPanelPlacementSettings: (
+  getLegacyPanelPlacementSettings: (
     input: InputType,
     attributes?: AttributesType
   ) => Partial<PanelPlacementSettings>;
 }
+
+export type GetPanelPlacementSettings<SerializedState extends object = object> = (
+  serializedState?: SerializedState
+) => PanelPlacementSettings;

src/plugins/dashboard/public/index.ts

@@ -17,13 +17,13 @@ export {
   PanelPlacementStrategy,
 } from './dashboard_constants';
 export {
-  registerDashboardPanelPlacementSetting,
   type DashboardAPI,
   type AwaitingDashboardAPI,
   DashboardRenderer,
   DASHBOARD_CONTAINER_TYPE,
   type DashboardCreationOptions,
   type DashboardLocatorParams,
+  type IProvidesLegacyPanelPlacementSettings,
 } from './dashboard_container';
 export type { DashboardSetup, DashboardStart, DashboardFeatureFlagConfig } from './plugin';
 

src/plugins/dashboard/public/plugin.tsx

@@ -56,6 +56,7 @@ import type { NoDataPagePluginStart } from '@kbn/no-data-page-plugin/public';
 import { CustomBrandingStart } from '@kbn/core-custom-branding-browser';
 import { SavedObjectsManagementPluginStart } from '@kbn/saved-objects-management-plugin/public';
 import { DashboardContainerFactoryDefinition } from './dashboard_container/embeddable/dashboard_container_factory';
+import { registerDashboardPanelPlacementSetting } from './dashboard_container/panel_placement';
 import {
   type DashboardAppLocator,
   DashboardAppLocatorDefinition,
@@ -70,6 +71,7 @@ import { DashboardMountContextProps } from './dashboard_app/types';
 import type { FindDashboardsService } from './services/dashboard_content_management/types';
 import { CONTENT_ID, LATEST_VERSION } from '../common/content_management';
 import { addPanelMenuTrigger } from './triggers';
+import { GetPanelPlacementSettings } from './dashboard_container/panel_placement';
 
 export interface DashboardFeatureFlagConfig {
   allowByValueEmbeddables: boolean;
@@ -119,6 +121,10 @@ export interface DashboardStart {
   locator?: DashboardAppLocator;
   dashboardFeatureFlagConfig: DashboardFeatureFlagConfig;
   findDashboardsService: () => Promise<FindDashboardsService>;
+  registerDashboardPanelPlacementSetting: (
+    embeddableType: string,
+    getPanelPlacementSettings: GetPanelPlacementSettings
+  ) => void;
 }
 
 export let resolveServicesReady: () => void;
@@ -344,6 +350,7 @@ export class DashboardPlugin
     return {
       locator: this.locator,
       dashboardFeatureFlagConfig: this.dashboardFeatureFlagConfig!,
+      registerDashboardPanelPlacementSetting,
       findDashboardsService: async () => {
         const { pluginServices } = await import('./services/plugin_services');
         const {

src/plugins/links/public/components/dashboard_link/dashboard_link_component.test.tsx

@@ -9,7 +9,7 @@
 import React from 'react';
 
 import { getDashboardLocatorParamsFromEmbeddable } from '@kbn/dashboard-plugin/public';
-import { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
+import type { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
 import { DEFAULT_DASHBOARD_DRILLDOWN_OPTIONS } from '@kbn/presentation-util-plugin/public';
 import { createEvent, fireEvent, render, screen, waitFor, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';

src/plugins/links/public/components/dashboard_link/dashboard_link_component.tsx

@@ -17,7 +17,7 @@ import {
   DashboardLocatorParams,
   getDashboardLocatorParamsFromEmbeddable,
 } from '@kbn/dashboard-plugin/public';
-import { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
+import type { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
 import {
   DashboardDrilldownOptions,
   DEFAULT_DASHBOARD_DRILLDOWN_OPTIONS,

src/plugins/links/public/components/dashboard_link/dashboard_link_destination_picker.tsx

@@ -20,7 +20,7 @@ import {
   EuiFlexGroup,
   EuiComboBoxOptionOption,
 } from '@elastic/eui';
-import { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
+import type { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
 
 import { DashboardItem } from '../../embeddable/types';
 import { DashboardLinkStrings } from './dashboard_link_strings';

src/plugins/links/public/components/editor/link_destination.tsx

@@ -8,7 +8,7 @@
 
 import React, { useState } from 'react';
 
-import { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
+import type { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
 
 import { EuiFormRow } from '@elastic/eui';
 import {

src/plugins/links/public/components/editor/link_editor.tsx

@@ -26,7 +26,7 @@ import {
   EuiFlyoutHeader,
   EuiRadioGroupOption,
 } from '@elastic/eui';
-import { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
+import type { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
 
 import {
   LinkType,

src/plugins/links/public/components/editor/links_editor.tsx

@@ -28,7 +28,7 @@ import {
   EuiSwitch,
   EuiTitle,
 } from '@elastic/eui';
-import { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
+import type { DashboardContainer } from '@kbn/dashboard-plugin/public/dashboard_container';
 
 import {
   Link,