feat: OHIF-v3 UI Component Library (#2653)

* wip on storybook as a replacement for using UI components in docusaurus, since it causes too many problems

* fix: storybook webpack config

* feat: add more stories

* feat: add more stories

* feat: add more stories

* feat: fix logo and babel runtime error

* feat: move to mdx docs for ui

* feat: enhanced mdx for header and styles

* feat: Add button usecases

* feat: Add buttonGroup docs

* feat: Add docs and use case to cine and contex menu

* feat: fix decorators

* feat: add header and dropdown docs

* feat: add Icon and input docs

* feat: add more docs

* feat: add more stories

* fix: feedback section

* feat: Add doc page

* feat: Add typography and color stories

* yarn lock

* add analytics to v3-ui

* new banner image

* new viewport component

* update review comments

platform/ui/src/components/Notification/Notification.jsx

@@ -3,7 +3,14 @@ import classnames from 'classnames';
 import PropTypes from 'prop-types';
 import { Button, Icon } from '../';
 
-const Notification = ({ id, type, message, actions, onSubmit, onOutsideClick }) => {
+const Notification = ({
+  id,
+  type,
+  message,
+  actions,
+  onSubmit,
+  onOutsideClick,
+}) => {
   const notificationRef = useRef(null);
 
   useEffect(() => {
@@ -93,7 +100,7 @@ Notification.defaultProps = {
 };
 
 Notification.propTypes = {
-  type: PropTypes.string,
+  type: PropTypes.oneOf(['error', 'warning', 'info', 'success']),
   message: PropTypes.string.isRequired,
   actions: PropTypes.arrayOf(
     PropTypes.shape({

platform/ui/src/components/Notification/__stories__/notification.stories.mdx

@@ -0,0 +1,63 @@
+import Notification from '../Notification';
+
+import { ArgsTable, Story, Canvas, Meta } from '@storybook/addon-docs';
+import { createComponentTemplate } from '../../../storybook/functions/create-component-story';
+
+export const argTypes = {
+  component: Notification,
+  title: 'Components/Notification',
+};
+
+<Meta title="Components/Notification" component={Notification} />
+
+export const NotificationTemplate = createComponentTemplate(Notification);
+
+<Heading
+  title="Notification"
+  componentRelativePath="Notification/Notification.jsx"
+/>
+
+- [Overview](#overview)
+- [Props](#props)
+- [Contribute](#contribute)
+
+## Overview
+
+Notification is a component that renders the Notifications.
+
+<Canvas>
+  <Story
+    name="Overview"
+    args={{
+      message: 'Track all measurement for this series?',
+      type: 'info',
+      actions: [
+        {
+          type: 'cancel',
+          text: 'No',
+          value: 0,
+        },
+        {
+          type: 'secondary',
+          text: 'No, do not ask again',
+          value: -1,
+        },
+        {
+          type: 'primary',
+          text: 'Yes',
+          value: 1,
+        },
+      ],
+    }}
+  >
+    {NotificationTemplate.bind({})}
+  </Story>
+</Canvas>
+
+## Props
+
+<ArgsTable of={Notification} />
+
+## Contribute
+
+<Footer componentRelativePath="Notification/__stories__/notification.stories.mdx" />