From 649fbeea7d73efdc30cfd6e50a65a20be22389ad Mon Sep 17 00:00:00 2001
From: MH4GF <h.miyagi.cnw@gmail.com>
Date: Tue, 4 Apr 2023 00:36:50 +0900
Subject: [PATCH] fix: @storybook/react/demo has been removed and a replacement
 component added

ref: https://github.com/storybookjs/storybook/pull/17899
---
 examples/v7-managed-react/.storybook/preview-head.html | 10 ++++++++++
 examples/v7-managed-react/src/Button.jsx               |  7 +++++++
 examples/v7-managed-react/src/Button.stories.jsx       |  2 +-
 examples/v7-managed-react/src/Welcome.jsx              |  5 +++++
 examples/v7-managed-react/src/Welcome.stories.jsx      |  2 +-
 .../v7-managed-react/src/WelcomeOverride.stories.jsx   |  2 +-
 6 files changed, 25 insertions(+), 3 deletions(-)
 create mode 100644 examples/v7-managed-react/src/Button.jsx
 create mode 100644 examples/v7-managed-react/src/Welcome.jsx

diff --git a/examples/v7-managed-react/.storybook/preview-head.html b/examples/v7-managed-react/.storybook/preview-head.html
index f16824f0f..c933a5fee 100644
--- a/examples/v7-managed-react/.storybook/preview-head.html
+++ b/examples/v7-managed-react/.storybook/preview-head.html
@@ -1,4 +1,14 @@
 <style>
+.button {
+  border: 1px solid #eee;
+  border-radius: 3;
+  background-color: #FFFFFF;
+  cursor: pointer;
+  font-size: 15;
+  padding: 3px 10px;
+  margin: 10;
+}
+
 .my-button {
   cursor: pointer;
   height: 32px;
diff --git a/examples/v7-managed-react/src/Button.jsx b/examples/v7-managed-react/src/Button.jsx
new file mode 100644
index 000000000..110779580
--- /dev/null
+++ b/examples/v7-managed-react/src/Button.jsx
@@ -0,0 +1,7 @@
+import React from 'react';
+
+export const Button = ({ children, onClick }) => (
+  <button className='button' onClick={onClick} type="button">
+    {children}
+  </button>
+);
diff --git a/examples/v7-managed-react/src/Button.stories.jsx b/examples/v7-managed-react/src/Button.stories.jsx
index d69af559b..adc03a88d 100644
--- a/examples/v7-managed-react/src/Button.stories.jsx
+++ b/examples/v7-managed-react/src/Button.stories.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Button } from '@storybook/react/demo';
+import { Button } from './Button';
 import { action } from '@storybook/addon-actions';
 
 import { isScreenshot } from 'storycap';
diff --git a/examples/v7-managed-react/src/Welcome.jsx b/examples/v7-managed-react/src/Welcome.jsx
new file mode 100644
index 000000000..ca26dc2ed
--- /dev/null
+++ b/examples/v7-managed-react/src/Welcome.jsx
@@ -0,0 +1,5 @@
+export const Welcome = ({ showApp }) => (
+  <button type="button" onClick={showApp}>
+    Welcome
+  </button>
+);
diff --git a/examples/v7-managed-react/src/Welcome.stories.jsx b/examples/v7-managed-react/src/Welcome.stories.jsx
index 09dfa76ef..9a86d527b 100644
--- a/examples/v7-managed-react/src/Welcome.stories.jsx
+++ b/examples/v7-managed-react/src/Welcome.stories.jsx
@@ -1,5 +1,5 @@
 import { linkTo } from '@storybook/addon-links';
-import { Welcome } from '@storybook/react/demo';
+import { Welcome } from './Welcome';
 
 export default {
   title: 'Welcome',
diff --git a/examples/v7-managed-react/src/WelcomeOverride.stories.jsx b/examples/v7-managed-react/src/WelcomeOverride.stories.jsx
index 2df3d9caf..84b1365a1 100644
--- a/examples/v7-managed-react/src/WelcomeOverride.stories.jsx
+++ b/examples/v7-managed-react/src/WelcomeOverride.stories.jsx
@@ -1,5 +1,5 @@
 import { linkTo } from '@storybook/addon-links';
-import { Welcome } from '@storybook/react/demo';
+import { Welcome } from './Welcome';
 
 export default {
   title: 'Welcome Override',