[Presentation] Deprecate Solution Toolbar Button in favor of Shared UX Component

src/plugins/presentation_util/kibana.json

@@ -9,7 +9,16 @@
   "kibanaVersion": "kibana",
   "server": true,
   "ui": true,
-  "extraPublicDirs": ["common/lib"],
-  "requiredPlugins": ["savedObjects", "kibanaReact", "embeddable", "expressions", "dataViews"],
+  "extraPublicDirs": [
+    "common/lib"
+  ],
+  "requiredPlugins": [
+    "savedObjects",
+    "kibanaReact",
+    "embeddable",
+    "expressions",
+    "dataViews",
+    "sharedUx"
+  ],
   "optionalPlugins": []
-}
+}

src/plugins/presentation_util/public/components/solution_toolbar/items/add_from_library.tsx

@@ -8,11 +8,11 @@
 
 import React from 'react';
 import { ComponentStrings } from '../../../i18n/components';
-import { SolutionToolbarButton, Props as SolutionToolbarButtonProps } from './button';
+import { SolutionToolbarButton, SolutionToolbarButtonProps } from '../../../../../shared_ux/public';
 
 const { SolutionToolbar: strings } = ComponentStrings;
 
-export type Props = Omit<SolutionToolbarButtonProps, 'iconType' | 'label'>;
+export type Props = Omit<typeof SolutionToolbarButtonProps, 'iconType' | 'label'>;
 
 export const AddFromLibraryButton = ({ onClick, ...rest }: Props) => (
   <SolutionToolbarButton

src/plugins/presentation_util/public/components/solution_toolbar/items/index.ts

@@ -6,10 +6,8 @@
  * Side Public License, v 1.
  */
 
-export { SolutionToolbarButton } from './button';
 export { SolutionToolbarPopover } from './popover';
 export { AddFromLibraryButton } from './add_from_library';
 export type { QuickButtonProps } from './quick_group';
 export { QuickButtonGroup } from './quick_group';
-export { PrimaryActionButton } from './primary_button';
 export { PrimaryActionPopover } from './primary_popover';

src/plugins/presentation_util/public/components/solution_toolbar/items/popover.tsx

@@ -9,10 +9,12 @@
 import React, { useState } from 'react';
 import { EuiPopover } from '@elastic/eui';
 import { Props as EuiPopoverProps } from '@elastic/eui/src/components/popover/popover';
+import {
+  SolutionToolbarButton,
+  SolutionToolbarButtonProps as ButtonProps,
+} from '../../../../../shared_ux/public/index';
 
-import { SolutionToolbarButton, Props as ButtonProps } from './button';
-
-type AllowedButtonProps = Omit<ButtonProps, 'onClick' | 'fill'>;
+type AllowedButtonProps = Omit<typeof ButtonProps, 'onClick' | 'fill'>;
 type AllowedPopoverProps = Omit<
   EuiPopoverProps,
   'button' | 'isOpen' | 'closePopover' | 'anchorPosition'

src/plugins/presentation_util/public/components/solution_toolbar/solution_toolbar.stories.tsx

@@ -11,9 +11,10 @@ import { Story } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
 import { EuiContextMenu } from '@elastic/eui';
 
+import { SolutionToolbarButton as PrimaryActionButton } from '../../../../shared_ux/public';
 import { SolutionToolbar } from './solution_toolbar';
 import { SolutionToolbarPopover } from './items';
-import { AddFromLibraryButton, PrimaryActionButton, QuickButtonGroup } from './items';
+import { AddFromLibraryButton, QuickButtonGroup } from './items';
 
 const quickButtons = [
   {

src/plugins/presentation_util/public/components/solution_toolbar/solution_toolbar.tsx

@@ -8,12 +8,13 @@
 
 import React, { ReactElement } from 'react';
 import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
+import { SolutionToolbarButton } from 'src/plugins/shared_ux/public';
+
+import { SolutionToolbarButton as PrimaryActionButton } from '../../../../shared_ux/public';
 
 import {
   AddFromLibraryButton,
   QuickButtonGroup,
-  PrimaryActionButton,
-  SolutionToolbarButton,
   PrimaryActionPopover,
   SolutionToolbarPopover,
 } from './items';

src/plugins/presentation_util/tsconfig.json

@@ -20,6 +20,7 @@
     { "path": "../saved_objects/tsconfig.json" },
     { "path": "../embeddable/tsconfig.json" },
     { "path": "../kibana_react/tsconfig.json" },
-    { "path": "../data/tsconfig.json" }
+    { "path": "../data/tsconfig.json" },
+    { "path": "../shared_ux/tsconfig.json" }
   ]
 }

src/plugins/shared_ux/public/components/index.ts

@@ -25,6 +25,12 @@ export const LazySolutionToolbarButton = React.lazy(() =>
   }))
 );
 
+export const LazySolutionToolbarButtonProps = React.lazy(() =>
+  import('./toolbar/index').then(({ SolutionToolbarButtonProps }: any) => ({
+    default: SolutionToolbarButtonProps,
+  }))
+);
+
 /**
  * A `ExitFullScreenButton` component that is wrapped by the `withSuspense` HOC.  This component can
  * be used directly by consumers and will load the `LazyExitFullScreenButton` component lazily with
@@ -39,6 +45,8 @@ export const ExitFullScreenButton = withSuspense(LazyExitFullScreenButton);
  */
 export const SolutionToolbarButton = withSuspense(LazySolutionToolbarButton);
 
+export const SolutionToolbarButtonProps = withSuspense(LazySolutionToolbarButtonProps);
+
 /**
  * The Lazily-loaded `NoDataViews` component.  Consumers should use `React.Suspennse` or the
  * `withSuspense` HOC to load this component.

src/plugins/shared_ux/public/components/toolbar/index.ts

@@ -6,4 +6,7 @@
  * Side Public License, v 1.
  */
 
-export { SolutionToolbarButton } from './solution_toolbar/button/primary';
+export {
+  SolutionToolbarButton,
+  SolutionToolbarButtonProps,
+} from './solution_toolbar/button/primary';

src/plugins/shared_ux/public/components/toolbar/solution_toolbar/button/primary.tsx

@@ -10,11 +10,12 @@ import React from 'react';
 import { EuiButton } from '@elastic/eui';
 import { EuiButtonPropsForButton } from '@elastic/eui/src/components/button/button';
 
-export interface Props extends Pick<EuiButtonPropsForButton, 'onClick' | 'iconType'> {
+export interface SolutionToolbarButtonProps
+  extends Pick<EuiButtonPropsForButton, 'onClick' | 'iconType'> {
   label: string;
 }
 
-export const SolutionToolbarButton = ({ label, ...rest }: Props) => {
+export const SolutionToolbarButton = ({ label, ...rest }: SolutionToolbarButtonProps) => {
   return (
     <EuiButton size="m" color="primary" fill={true} {...rest}>
       {label}

src/plugins/shared_ux/public/index.ts

@@ -18,3 +18,4 @@ export function plugin() {
 export type { SharedUXPluginSetup, SharedUXPluginStart } from './types';
 export { ExitFullScreenButton, LazyExitFullScreenButton } from './components';
 export { NoDataViewsPage, LazyNoDataViewsPage } from './components';
+export { SolutionToolbarButton, SolutionToolbarButtonProps } from './components';