Merged in chore/SW-3246-move-alert-to-design-system (pull request #2698)

chore(SW-3246): Moved Alert component into design system

* chore(SW-3246): Moved Alert component into design system

* chore(SW-3246): Optimsed code and imports

* chore(SW-3246): Moved type AlertTypeEnum and other to common package


Approved-by: Anton Gunnarsson

packages/design-system/lib/components/Alert/Sidepeek/index.tsx

@@ -0,0 +1,52 @@
+'use client'
+
+import { useState } from 'react'
+import { useIntl } from 'react-intl'
+
+import { MaterialIcon } from '../../Icons/MaterialIcon'
+import { JsonToHtml } from '../../JsonToHtml/JsonToHtml'
+import { Button } from '../../Button'
+import SidePeek from '../../SidePeek'
+
+import styles from './sidepeek.module.css'
+
+import type { AlertSidepeekProps } from './sidepeek'
+
+export default function AlertSidepeek({
+  ctaText,
+  sidePeekContent,
+}: AlertSidepeekProps) {
+  const intl = useIntl()
+  const [sidePeekIsOpen, setSidePeekIsOpen] = useState(false)
+  const { heading, content } = sidePeekContent
+
+  return (
+    <div className={styles.alertSidepeek}>
+      <Button
+        onPress={() => setSidePeekIsOpen(true)}
+        variant="Text"
+        color="Primary"
+        size="Small"
+        wrapping
+        typography="Body/Supporting text (caption)/smBold"
+      >
+        {ctaText}
+        <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
+      </Button>
+
+      <SidePeek
+        title={heading}
+        isOpen={sidePeekIsOpen}
+        handleClose={() => setSidePeekIsOpen(false)}
+        closeLabel={intl.formatMessage({
+          defaultMessage: 'Close',
+        })}
+      >
+        <JsonToHtml
+          nodes={content.json.children}
+          embeds={content.embedded_itemsConnection.edges}
+        />
+      </SidePeek>
+    </div>
+  )
+}

packages/design-system/lib/components/Alert/Sidepeek/sidepeek.module.css

@@ -0,0 +1,3 @@
+.alertSidepeek {
+  flex-shrink: 0;
+}

packages/design-system/lib/components/Alert/Sidepeek/sidepeek.ts

@@ -0,0 +1,6 @@
+import type { SidepeekContent } from '@scandic-hotels/common/constants/alert'
+
+export interface AlertSidepeekProps {
+  ctaText: string
+  sidePeekContent: NonNullable<SidepeekContent>
+}