example of a sdk ee plugin

enterprise/frontend/src/embedding-sdk-ee/example-button/ExampleButton.tsx

@@ -0,0 +1,15 @@
+import {
+  type ExampleButtonProps,
+  PLUGIN_SDK_EE_EXAMPLE_BUTTON,
+} from "embedding-sdk-bundle/components/private/ExampleButton/ExampleButton";
+
+// not exported because, in 99% of the cases we cannot use this directly without the plugin so it would only
+// be suggested by the IDE but then we'll get the `no-restrict-import` error if we import it from oss code
+const ExampleButton = (props: ExampleButtonProps) => {
+  return <button>{props.label}</button>;
+};
+
+// Note 1: this may be wrapped in a hasTokenFeature check and/or in a initializePlugin function
+// Note 2: we could do `PLUGIN_SDK_EE_EXAMPLE_BUTTON.ExampleButton = (props) =>....` but then it'll complain
+// that the inline component doesn't have a display name
+PLUGIN_SDK_EE_EXAMPLE_BUTTON.ExampleButton = ExampleButton;

enterprise/frontend/src/embedding-sdk-ee/example-button/index.ts

@@ -0,0 +1 @@
+import "./ExampleButton";

enterprise/frontend/src/metabase-enterprise/sdk-plugins.ts

@@ -28,3 +28,4 @@ export function initializePlugins() {
 // These only apply to the SDK, not to the core app
 import "../embedding-sdk-ee/auth";
 import "../embedding-sdk-ee/metabot";
+import "../embedding-sdk-ee/example-button";

frontend/src/embedding-sdk-bundle/components/private/ExampleButton/ExampleButton.tsx

@@ -0,0 +1,11 @@
+export type ExampleButtonProps = {
+  label: string;
+};
+
+export const PLUGIN_SDK_EE_EXAMPLE_BUTTON = {
+  ExampleButton: (_props: ExampleButtonProps) => <></>, // noop in OSS, `<></>` makes it return JSX Element to have correct type
+};
+
+export const ExampleButton = (props: ExampleButtonProps) => {
+  return <PLUGIN_SDK_EE_EXAMPLE_BUTTON.ExampleButton {...props} />;
+};

frontend/src/embedding-sdk-bundle/components/private/ExampleButton/index.ts

@@ -0,0 +1 @@
+export { ExampleButton, type ExampleButtonProps } from "./ExampleButton";