Docs(web-react): Add Heading demo #DS-899

Heading demo in web-react is now same as demo in web and web-twig

packages/web-react/src/components/Heading/demo/HeadingDefault.tsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import Heading from '../Heading';
+
+const HeadingDefault = () => (
+  <>
+    <Heading>Heading</Heading>
+    <Heading elementType="h2">Heading H2</Heading>
+  </>
+);
+
+export default HeadingDefault;

packages/web-react/src/components/Heading/demo/HeadingSizes.tsx

@@ -1,26 +1,14 @@
 import React from 'react';
 import Heading from '../Heading';
 
-// @see: https://github.com/storybookjs/storybook/issues/8104#issuecomment-932310244
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const Story = (props: unknown) => (
+const HeadingSizes = () => (
   <>
-    <Heading elementType="p" size="xlarge">
-      Heading XLarge Text
-    </Heading>
-    <Heading elementType="p" size="large">
-      Heading Large Text
-    </Heading>
-    <Heading elementType="p" size="medium">
-      Heading Medium Text
-    </Heading>
-    <Heading elementType="p" size="small">
-      Heading Small Text
-    </Heading>
-    <Heading elementType="p" size="xsmall">
-      Heading XSmall Text
-    </Heading>
+    <Heading size="xsmall">Heading xsmall</Heading>
+    <Heading size="small">Heading small</Heading>
+    <Heading size="medium">Heading medium</Heading>
+    <Heading size="large">Heading large</Heading>
+    <Heading size="xlarge">Heading xlarge</Heading>
   </>
 );
 
-export default Story;
+export default HeadingSizes;

packages/web-react/src/components/Heading/demo/index.tsx

@@ -1,20 +1,16 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import DocsSection from '../../../../docs/DocsSections';
-import Heading from './Heading';
 import HeadingSizes from './HeadingSizes';
-import HeadingLinks from './HeadingLinks';
+import HeadingDefault from './HeadingDefault';
 
 ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
   <React.StrictMode>
     <DocsSection title="Default">
-      <Heading {...Heading.args} />
+      <HeadingDefault />
     </DocsSection>
     <DocsSection title="Sizes">
       <HeadingSizes />
     </DocsSection>
-    <DocsSection title="Links">
-      <HeadingLinks />
-    </DocsSection>
   </React.StrictMode>,
 );