Merged in fix/3697-prettier-configs (pull request #3396)

fix(SW-3691): Setup one prettier config for whole repo * Setup prettierrc in root and remove other configs Approved-by: Joakim Jäderberg Approved-by: Linus Flood
2026-01-07 12:45:50 +00:00
parent 932413412b
commit d0546926a9
500 changed files with 18367 additions and 18419 deletions
--- a/packages/design-system/lib/components/JsonToHtml/JsonToHtml.stories.tsx
+++ b/packages/design-system/lib/components/JsonToHtml/JsonToHtml.stories.tsx
@@ -1,11 +1,11 @@
-import type { Meta, StoryObj } from '@storybook/nextjs-vite'
-import { expect } from 'storybook/test'
-import { JsonToHtml } from './JsonToHtml'
-import { RTETypeEnum } from './types/rte/enums'
-import { RTEImageVaultNode, RTENode } from './types/rte/node'
+import type { Meta, StoryObj } from "@storybook/nextjs-vite"
+import { expect } from "storybook/test"
+import { JsonToHtml } from "./JsonToHtml"
+import { RTETypeEnum } from "./types/rte/enums"
+import { RTEImageVaultNode, RTENode } from "./types/rte/node"

 const meta: Meta<typeof JsonToHtml> = {
-  title: 'Core Components/JsonToHtml',
+  title: "Core Components/JsonToHtml",
  component: JsonToHtml,
 }

@@ -15,80 +15,80 @@ type Story = StoryObj<typeof JsonToHtml>

 const headings: RTENode[] = [
  {
-    uid: 'heading-1',
+    uid: "heading-1",
    type: RTETypeEnum.h1,
-    attrs: { type: 'entry' },
-    children: [{ text: 'Heading 1' }],
+    attrs: { type: "entry" },
+    children: [{ text: "Heading 1" }],
  },
  {
-    uid: 'heading-2',
+    uid: "heading-2",
    type: RTETypeEnum.h2,
-    attrs: { type: 'entry' },
-    children: [{ text: 'Heading 2' }],
+    attrs: { type: "entry" },
+    children: [{ text: "Heading 2" }],
  },
  {
-    uid: 'heading-3',
+    uid: "heading-3",
    type: RTETypeEnum.h3,
-    attrs: { type: 'entry' },
-    children: [{ text: 'Heading 3' }],
+    attrs: { type: "entry" },
+    children: [{ text: "Heading 3" }],
  },
  {
-    uid: 'heading-4',
+    uid: "heading-4",
    type: RTETypeEnum.h4,
-    attrs: { type: 'entry' },
-    children: [{ text: 'Heading 4' }],
+    attrs: { type: "entry" },
+    children: [{ text: "Heading 4" }],
  },
 ]

 const paragraph: RTENode = {
-  uid: 'paragraph',
-  attrs: { type: 'asset' },
+  uid: "paragraph",
+  attrs: { type: "asset" },
  type: RTETypeEnum.p,
  children: [
-    { text: 'This paragraph has ' },
-    { text: 'bold', bold: true },
-    { text: ' and ' },
-    { text: 'italic', italic: true },
-    { text: ' text, plus an inline ' },
+    { text: "This paragraph has " },
+    { text: "bold", bold: true },
+    { text: " and " },
+    { text: "italic", italic: true },
+    { text: " text, plus an inline " },
    {
      type: RTETypeEnum.a,
-      attrs: { type: 'asset', url: 'https://example.com' },
-      uid: 'link-1',
-      children: [{ text: 'link' }],
+      attrs: { type: "asset", url: "https://example.com" },
+      uid: "link-1",
+      children: [{ text: "link" }],
    },
-    { text: '.' },
+    { text: "." },
  ],
 }
 const list: RTENode = {
  type: RTETypeEnum.ul,
-  attrs: { type: 'asset' },
-  uid: 'list-1',
+  attrs: { type: "asset" },
+  uid: "list-1",
  children: [
    {
      type: RTETypeEnum.li,
-      uid: 'list-item-1',
-      attrs: { type: 'asset' },
-      children: [{ text: 'First item' }],
+      uid: "list-item-1",
+      attrs: { type: "asset" },
+      children: [{ text: "First item" }],
    },
    {
      type: RTETypeEnum.li,
-      uid: 'list-item-2',
-      attrs: { type: 'asset' },
-      children: [{ text: 'Second item' }],
+      uid: "list-item-2",
+      attrs: { type: "asset" },
+      children: [{ text: "Second item" }],
    },
    {
      type: RTETypeEnum.li,
-      uid: 'list-item-3',
-      attrs: { type: 'asset' },
-      children: [{ text: 'Third item' }],
+      uid: "list-item-3",
+      attrs: { type: "asset" },
+      children: [{ text: "Third item" }],
    },
  ],
 }

 const code: RTENode = {
  type: RTETypeEnum.code,
-  uid: 'code',
-  attrs: { type: 'asset' },
+  uid: "code",
+  attrs: { type: "asset" },
  children: [
    {
      text: `function greet(name: string) {
@@ -100,50 +100,50 @@ const code: RTENode = {

 const blockquote: RTENode = {
  type: RTETypeEnum.blockquote,
-  uid: 'blockqoute',
-  attrs: { type: 'asset' },
-  children: [{ text: 'Simplicity is the soul of efficiency.' }],
+  uid: "blockqoute",
+  attrs: { type: "asset" },
+  children: [{ text: "Simplicity is the soul of efficiency." }],
 }

 const horizontalRule: RTENode = {
  type: RTETypeEnum.hr,
-  uid: 'horizontal-rule',
-  attrs: { type: 'entry' },
+  uid: "horizontal-rule",
+  attrs: { type: "entry" },
  children: [],
 }

 const table: RTENode = {
  type: RTETypeEnum.table,
-  uid: 'table',
-  attrs: { type: 'asset' },
+  uid: "table",
+  attrs: { type: "asset" },
  children: [
    {
      type: RTETypeEnum.thead,
-      uid: 'table-header',
-      attrs: { type: 'asset' },
+      uid: "table-header",
+      attrs: { type: "asset" },
      children: [
        {
          type: RTETypeEnum.tr,
-          uid: 'table-header-row-1',
-          attrs: { type: 'asset' },
+          uid: "table-header-row-1",
+          attrs: { type: "asset" },
          children: [
            {
              type: RTETypeEnum.th,
-              uid: 'table-head-1',
-              attrs: { type: 'asset' },
-              children: [{ text: 'Head 1' }],
+              uid: "table-head-1",
+              attrs: { type: "asset" },
+              children: [{ text: "Head 1" }],
            },
            {
              type: RTETypeEnum.th,
-              uid: 'table-head-2',
-              attrs: { type: 'asset' },
-              children: [{ text: 'Head 2' }],
+              uid: "table-head-2",
+              attrs: { type: "asset" },
+              children: [{ text: "Head 2" }],
            },
            {
              type: RTETypeEnum.th,
-              uid: 'table-head-3',
-              attrs: { type: 'asset' },
-              children: [{ text: 'Head 3' }],
+              uid: "table-head-3",
+              attrs: { type: "asset" },
+              children: [{ text: "Head 3" }],
            },
          ],
        },
@@ -151,31 +151,31 @@ const table: RTENode = {
    },
    {
      type: RTETypeEnum.tbody,
-      uid: 'table-body',
-      attrs: { type: 'asset' },
+      uid: "table-body",
+      attrs: { type: "asset" },
      children: [
        {
          type: RTETypeEnum.tr,
-          uid: 'table-row-1',
-          attrs: { type: 'asset' },
+          uid: "table-row-1",
+          attrs: { type: "asset" },
          children: [
            {
              type: RTETypeEnum.td,
-              uid: 'table-cell-1',
-              attrs: { type: 'asset' },
-              children: [{ text: 'Cell 1' }],
+              uid: "table-cell-1",
+              attrs: { type: "asset" },
+              children: [{ text: "Cell 1" }],
            },
            {
              type: RTETypeEnum.td,
-              uid: 'table-cell-2',
-              attrs: { type: 'asset' },
-              children: [{ text: 'Cell 2' }],
+              uid: "table-cell-2",
+              attrs: { type: "asset" },
+              children: [{ text: "Cell 2" }],
            },
            {
              type: RTETypeEnum.td,
-              uid: 'table-cell-3',
-              attrs: { type: 'asset' },
-              children: [{ text: 'Cell 3' }],
+              uid: "table-cell-3",
+              attrs: { type: "asset" },
+              children: [{ text: "Cell 3" }],
            },
          ],
        },
@@ -186,17 +186,17 @@ const table: RTENode = {

 const image: RTEImageVaultNode = {
  type: RTETypeEnum.ImageVault,
-  uid: 'image',
+  uid: "image",
  attrs: {
-    type: 'entry',
-    url: 'https://imagevault.scandichotels.com/publishedmedia/77obkq3g4harjm8wyua9/Scandic_Family_Breakfast_2.jpg',
-    height: '200px',
-    width: '200px',
-    fileName: 'Scandic_Family_Breakfast_2.jpg',
+    type: "entry",
+    url: "https://imagevault.scandichotels.com/publishedmedia/77obkq3g4harjm8wyua9/Scandic_Family_Breakfast_2.jpg",
+    height: "200px",
+    width: "200px",
+    fileName: "Scandic_Family_Breakfast_2.jpg",
    imageVaultId: 1,
-    title: 'Image Title',
+    title: "Image Title",
    dimensions: { width: 200, height: 200, aspectRatio: 1.5 },
-    meta: { alt: 'Image Alt', caption: 'Image Caption' },
+    meta: { alt: "Image Alt", caption: "Image Caption" },
    focalPoint: { x: 50, y: 50 },
  },
  children: [],
@@ -206,11 +206,11 @@ export const Example: Story = {
  args: {
    nodes: [
      {
-        uid: 'paragraph',
-        attrs: { type: 'asset' },
+        uid: "paragraph",
+        attrs: { type: "asset" },
        type: RTETypeEnum.p,
        children: [
-          { text: 'This is a kitchen sink of all Rich Text Editor to HTML' },
+          { text: "This is a kitchen sink of all Rich Text Editor to HTML" },
        ],
      },
      ...headings,
@@ -232,19 +232,19 @@ export const Headings: Story = {
  },
  play: async ({ canvas }) => {
    expect(
-      await canvas.findByRole('heading', { name: 'Heading 1' })
+      await canvas.findByRole("heading", { name: "Heading 1" })
    ).toBeInTheDocument()

    expect(
-      await canvas.findByRole('heading', { name: 'Heading 2' })
+      await canvas.findByRole("heading", { name: "Heading 2" })
    ).toBeInTheDocument()

    expect(
-      await canvas.findByRole('heading', { name: 'Heading 3' })
+      await canvas.findByRole("heading", { name: "Heading 3" })
    ).toBeInTheDocument()

    expect(
-      await canvas.findByRole('heading', { name: 'Heading 4' })
+      await canvas.findByRole("heading", { name: "Heading 4" })
    ).toBeInTheDocument()
  },
 }
--- a/packages/design-system/lib/components/JsonToHtml/JsonToHtml.tsx
+++ b/packages/design-system/lib/components/JsonToHtml/JsonToHtml.tsx
@@ -1,13 +1,13 @@
-import { cx } from 'class-variance-authority'
+import { cx } from "class-variance-authority"

-import { nodesToHtml } from './utils'
+import { nodesToHtml } from "./utils"

-import styles from './jsontohtml.module.css'
+import styles from "./jsontohtml.module.css"

-import { ImageVaultAsset } from '@scandic-hotels/common/utils/imageVault'
-import { ContentBlockType } from './types/rte/enums'
-import type { RTENode } from './types/rte/node'
-import type { RenderOptions } from './types/rte/option'
+import { ImageVaultAsset } from "@scandic-hotels/common/utils/imageVault"
+import { ContentBlockType } from "./types/rte/enums"
+import type { RTENode } from "./types/rte/node"
+import type { RenderOptions } from "./types/rte/option"

 export type Node<T> = {
  node: T
@@ -15,13 +15,13 @@ export type Node<T> = {

 export type Embeds =
  | {
-      __typename: Exclude<ContentBlockType, 'ImageContainer'>
+      __typename: Exclude<ContentBlockType, "ImageContainer">
      system?: { uid: string } | undefined | null
      url?: string | undefined | null
      title?: string | undefined | null
    }
  | {
-      __typename: 'ImageContainer'
+      __typename: "ImageContainer"
      system?: { uid: string } | null
      url?: string | null
      title?: string | null
--- a/packages/design-system/lib/components/JsonToHtml/jsontohtml.module.css
+++ b/packages/design-system/lib/components/JsonToHtml/jsontohtml.module.css
@@ -83,7 +83,7 @@
  gap: var(--Space-x1);

  &::before {
-    content: '';
+    content: "";
    position: relative;
    top: 3px;
    width: 16px;
@@ -98,13 +98,13 @@

 .check > .li::before,
 .li:has(.check)::before {
-  mask-image: url('/_static/icons/check_circle.svg');
+  mask-image: url("/_static/icons/check_circle.svg");
  background-color: var(--Icon-Interactive-Default);
 }

 .heart > .li::before,
 .li:has(.heart)::before {
-  mask-image: url('/_static/shared/icons/heart.svg');
+  mask-image: url("/_static/shared/icons/heart.svg");
 }

 .li > * {
--- a/packages/design-system/lib/components/JsonToHtml/renderOptions.tsx
+++ b/packages/design-system/lib/components/JsonToHtml/renderOptions.tsx
@@ -1,33 +1,33 @@
-import { cx } from 'class-variance-authority'
+import { cx } from "class-variance-authority"

-import { Divider } from '../Divider'
-import { MaterialIcon } from '../Icons/MaterialIcon'
-import Image from '../Image'
-import ImageContainer from '../ImageContainer'
-import Table from '../Table'
-import { Typography } from '../Typography'
+import { Divider } from "../Divider"
+import { MaterialIcon } from "../Icons/MaterialIcon"
+import Image from "../Image"
+import ImageContainer from "../ImageContainer"
+import Table from "../Table"
+import { Typography } from "../Typography"

 import {
  extractAvailableListClassNames,
  hasAvailableParagraphFormat,
-} from './utils'
+} from "./utils"

-import styles from './jsontohtml.module.css'
+import styles from "./jsontohtml.module.css"

 import {
  DeprecatedImageVaultAssetResponse,
  ImageVaultAssetResponse,
  mapImageVaultAssetResponseToImageVaultAsset,
  mapInsertResponseToImageVaultAsset,
-} from '@scandic-hotels/common/utils/imageVault'
-import { TextLink } from '../TextLink'
-import type { EmbedByUid } from './JsonToHtml'
-import type { Attributes } from './types/rte/attrs'
+} from "@scandic-hotels/common/utils/imageVault"
+import { TextLink } from "../TextLink"
+import type { EmbedByUid } from "./JsonToHtml"
+import type { Attributes } from "./types/rte/attrs"
 import {
  AvailableParagraphFormatEnum,
  RTEItemTypeEnum,
  RTETypeEnum,
-} from './types/rte/enums'
+} from "./types/rte/enums"
 import {
  type RTEDefaultNode,
  type RTEImageNode,
@@ -36,11 +36,11 @@ import {
  type RTENode,
  type RTERegularNode,
  type RTETextNode,
-} from './types/rte/node'
-import type { RenderOptions } from './types/rte/option'
+} from "./types/rte/node"
+import type { RenderOptions } from "./types/rte/option"

 function noNestedLinksOrReferences(node: RTENode) {
-  if ('type' in node) {
+  if ("type" in node) {
    if (node.type === RTETypeEnum.reference) {
      return node.children
    } else if (node.type === RTETypeEnum.a) {
@@ -60,17 +60,17 @@ function extractPossibleAttributes(attrs: Attributes | undefined) {
    props.id = attrs.id
  }

-  if (attrs.class && typeof attrs.class === 'string') {
+  if (attrs.class && typeof attrs.class === "string") {
    props.className = attrs.class
-  } else if (attrs['class-name']) {
-    props.className = attrs['class-name']
-  } else if (attrs.classname && typeof attrs.classname === 'string') {
+  } else if (attrs["class-name"]) {
+    props.className = attrs["class-name"]
+  } else if (attrs.classname && typeof attrs.classname === "string") {
    props.className = attrs.classname
  }

-  if (attrs.style?.['text-align']) {
+  if (attrs.style?.["text-align"]) {
    props.style = {
-      textAlign: attrs.style['text-align'] as React.CSSProperties['textAlign'],
+      textAlign: attrs.style["text-align"] as React.CSSProperties["textAlign"],
    }
  }

@@ -94,9 +94,9 @@ export const renderOptions: RenderOptions = {
        key={node.uid}
        className={className}
        {...props}
-        href={typeof node.attrs.url === 'string' ? node.attrs.url : ''}
+        href={typeof node.attrs.url === "string" ? node.attrs.url : ""}
        target={
-          typeof node.attrs.target === 'string' ? node.attrs.target : '_blank'
+          typeof node.attrs.target === "string" ? node.attrs.target : "_blank"
        }
        isInline
      >
@@ -310,9 +310,9 @@ export const renderOptions: RenderOptions = {
    // Determine whether to use a div or p based on children.
    // Some children use div or sections as wrappers and these are
    // not allowed inside p tags.
-    const Elem = node.children.some((child) => 'children' in child)
-      ? 'div'
-      : 'p'
+    const Elem = node.children.some((child) => "children" in child)
+      ? "div"
+      : "p"

    return (
      <Typography key={node.uid} variant="Body/Paragraph/mdRegular">
@@ -374,17 +374,17 @@ export const renderOptions: RenderOptions = {
    next: RTENext,
    fullRenderOptions: RenderOptions
  ) => {
-    if (!('attrs' in node)) {
+    if (!("attrs" in node)) {
      return null
    }

    const type = node.attrs.type
    if (type === RTEItemTypeEnum.asset) {
      const imageTypeRegex = /^image\//
-      const isImage = imageTypeRegex.test(node.attrs['asset-type'] as string)
+      const isImage = imageTypeRegex.test(node.attrs["asset-type"] as string)
      if (isImage) {
-        const image = embeds?.[node?.attrs?.['asset-uid'] as string]
-        if (image?.node.__typename === 'SysAsset') {
+        const image = embeds?.[node?.attrs?.["asset-uid"] as string]
+        if (image?.node.__typename === "SysAsset") {
          if (image.node.url) {
            const alt = image?.node?.title ?? node.attrs.alt
            const { className, ...props } = extractPossibleAttributes(
@@ -404,7 +404,7 @@ export const renderOptions: RenderOptions = {
            )
          }
        }
-      } else if (node.attrs['display-type'] === 'link' && node.attrs.href) {
+      } else if (node.attrs["display-type"] === "link" && node.attrs.href) {
        const { className, ...props } = extractPossibleAttributes(node.attrs)
        return (
          <TextLink
@@ -429,9 +429,9 @@ export const renderOptions: RenderOptions = {
    }

    if (type === RTEItemTypeEnum.entry) {
-      const entry = embeds?.[node?.attrs?.['entry-uid'] as string]
+      const entry = embeds?.[node?.attrs?.["entry-uid"] as string]

-      if (entry?.node.__typename === 'ImageContainer') {
+      if (entry?.node.__typename === "ImageContainer") {
        if (entry.node.image_left && entry.node.image_right) {
          return (
            <ImageContainer
@@ -443,17 +443,17 @@ export const renderOptions: RenderOptions = {
        }
        return null
      } else if (
-        entry?.node.__typename === 'AccountPage' ||
-        entry?.node.__typename === 'CampaignOverviewPage' ||
-        entry?.node.__typename === 'CampaignPage' ||
-        entry?.node.__typename === 'CollectionPage' ||
-        entry?.node.__typename === 'ContentPage' ||
-        entry?.node.__typename === 'DestinationCityPage' ||
-        entry?.node.__typename === 'DestinationCountryPage' ||
-        entry?.node.__typename === 'DestinationOverviewPage' ||
-        entry?.node.__typename === 'HotelPage' ||
-        entry?.node.__typename === 'LoyaltyPage' ||
-        entry?.node.__typename === 'StartPage'
+        entry?.node.__typename === "AccountPage" ||
+        entry?.node.__typename === "CampaignOverviewPage" ||
+        entry?.node.__typename === "CampaignPage" ||
+        entry?.node.__typename === "CollectionPage" ||
+        entry?.node.__typename === "ContentPage" ||
+        entry?.node.__typename === "DestinationCityPage" ||
+        entry?.node.__typename === "DestinationCountryPage" ||
+        entry?.node.__typename === "DestinationOverviewPage" ||
+        entry?.node.__typename === "HotelPage" ||
+        entry?.node.__typename === "LoyaltyPage" ||
+        entry?.node.__typename === "StartPage"
      ) {
        // If entry is not an ImageContainer, it is a page and we return it as a link
        const { className, ...props } = extractPossibleAttributes(node.attrs)
@@ -490,18 +490,18 @@ export const renderOptions: RenderOptions = {

  [RTETypeEnum.ImageVault]: (node: RTEImageNode) => {
    const type = node.type
-    if (!('attrs' in node) || type !== RTETypeEnum.ImageVault) {
+    if (!("attrs" in node) || type !== RTETypeEnum.ImageVault) {
      return null
    }

    let image = undefined
-    if ('imageVaultId' in node.attrs && 'fileName' in node.attrs) {
+    if ("imageVaultId" in node.attrs && "fileName" in node.attrs) {
      image = mapImageVaultAssetResponseToImageVaultAsset(
        node.attrs as unknown as ImageVaultAssetResponse
      )
    }

-    if ('Name' in node.attrs && 'Id' in node.attrs) {
+    if ("Name" in node.attrs && "Id" in node.attrs) {
      image = mapInsertResponseToImageVaultAsset(
        node.attrs as unknown as DeprecatedImageVaultAssetResponse
      )
@@ -765,7 +765,7 @@ export const renderOptions: RenderOptions = {
      )
    }

-    if (className === AvailableParagraphFormatEnum['script-1']) {
+    if (className === AvailableParagraphFormatEnum["script-1"]) {
      return (
        <Typography key={id} variant="Title/Decorative/lg">
          <p className={cx(styles.p, propsClassName)} {...props}>
@@ -775,7 +775,7 @@ export const renderOptions: RenderOptions = {
      )
    }

-    if (className === AvailableParagraphFormatEnum['script-2']) {
+    if (className === AvailableParagraphFormatEnum["script-2"]) {
      return (
        <Typography key={id} variant="Title/Decorative/md">
          <p className={cx(styles.p, propsClassName)} {...props}>
@@ -785,7 +785,7 @@ export const renderOptions: RenderOptions = {
      )
    }

-    if (className === AvailableParagraphFormatEnum['subtitle-1']) {
+    if (className === AvailableParagraphFormatEnum["subtitle-1"]) {
      return (
        <Typography key={id} variant="Title/Subtitle/lg">
          <p className={cx(styles.p, propsClassName)} {...props}>
@@ -794,7 +794,7 @@ export const renderOptions: RenderOptions = {
        </Typography>
      )
    }
-    if (className === AvailableParagraphFormatEnum['subtitle-2']) {
+    if (className === AvailableParagraphFormatEnum["subtitle-2"]) {
      return (
        <Typography key={id} variant="Title/Subtitle/md">
          <p className={cx(styles.p, propsClassName)} {...props}>
--- a/packages/design-system/lib/components/JsonToHtml/types/rte/attrs.ts
+++ b/packages/design-system/lib/components/JsonToHtml/types/rte/attrs.ts
@@ -1,23 +1,23 @@
-import type { Lang } from '@scandic-hotels/common/constants/language'
+import type { Lang } from "@scandic-hotels/common/constants/language"

-import type { EmbedTypesEnum, RTEItemType, RTEItemTypeEnum } from './enums'
+import type { EmbedTypesEnum, RTEItemType, RTEItemTypeEnum } from "./enums"

 export interface Attributes {
  [key: string]: unknown
-  'class-name'?: string
+  "class-name"?: string
  type: RTEItemType
  style?: { [key: string]: unknown } | undefined
 }

 export interface RTEAssetAttrs extends Attributes {
  alt: string
-  'asset-alt': string
-  'asset-link': string
-  'asset-name': string
-  'asset-type': 'image/png' | 'image/jpg' | 'image/jpeg'
-  'asset-uid': string
-  'display-type': EmbedTypesEnum.display
-  'content-type-uid': 'sys_assets'
+  "asset-alt": string
+  "asset-link": string
+  "asset-name": string
+  "asset-type": "image/png" | "image/jpg" | "image/jpeg"
+  "asset-uid": string
+  "display-type": EmbedTypesEnum.display
+  "content-type-uid": "sys_assets"
  inline: false
  type: RTEItemTypeEnum.asset
 }
@@ -28,13 +28,13 @@ export interface RTEAnchorAttrs extends Attributes {
 }

 export interface RTELinkAttrs extends Attributes {
-  'display-type': EmbedTypesEnum.link
-  'class-name': string
-  'content-type-uid': string
-  'entry-uid': string
+  "display-type": EmbedTypesEnum.link
+  "class-name": string
+  "content-type-uid": string
+  "entry-uid": string
  locale: Lang
  href: string
-  target: HTMLAnchorElement['target']
+  target: HTMLAnchorElement["target"]
  type: RTEItemTypeEnum.entry
 }

--- a/packages/design-system/lib/components/JsonToHtml/types/rte/constants.ts
+++ b/packages/design-system/lib/components/JsonToHtml/types/rte/constants.ts
@@ -1,6 +1,6 @@
 export const AVAILABLE_LIST_FORMATS = [
-  'heart',
-  'check',
-  'two-column',
-  'two-columns',
+  "heart",
+  "check",
+  "two-column",
+  "two-columns",
 ]
--- a/packages/design-system/lib/components/JsonToHtml/types/rte/enums.ts
+++ b/packages/design-system/lib/components/JsonToHtml/types/rte/enums.ts
@@ -1,80 +1,80 @@
 export enum EmbedTypesEnum {
-  block = 'block',
-  display = 'display',
-  download = 'download',
-  inline = 'inline',
-  link = 'link',
+  block = "block",
+  display = "display",
+  download = "download",
+  inline = "inline",
+  link = "link",
 }

 export type EmbedTypes = keyof typeof EmbedTypesEnum

 /** Copied from https://github.com/contentstack/contentstack-utils-javascript/blob/master/src/nodes/node-type.ts */
 export enum RTETypeEnum {
-  a = 'a',
-  blockquote = 'blockquote',
-  code = 'code',
-  doc = 'doc',
-  embed = 'embed',
-  h1 = 'h1',
-  h2 = 'h2',
-  h3 = 'h3',
-  h4 = 'h4',
-  h5 = 'h5',
-  h6 = 'h6',
-  hr = 'hr',
-  img = 'img',
-  li = 'li',
-  ol = 'ol',
-  p = 'p',
-  reference = 'reference',
-  span = 'span',
+  a = "a",
+  blockquote = "blockquote",
+  code = "code",
+  doc = "doc",
+  embed = "embed",
+  h1 = "h1",
+  h2 = "h2",
+  h3 = "h3",
+  h4 = "h4",
+  h5 = "h5",
+  h6 = "h6",
+  hr = "hr",
+  img = "img",
+  li = "li",
+  ol = "ol",
+  p = "p",
+  reference = "reference",
+  span = "span",
  /**
   * Included for compatibility when copying RTE from other sources e.g. epi
   */
-  div = 'div',
-  table = 'table',
-  tbody = 'tbody',
-  td = 'td',
-  text = 'text',
-  tfoot = 'tfoot',
-  th = 'th',
-  thead = 'thead',
-  tr = 'tr',
-  ul = 'ul',
-  ImageVault = 'ImageVault',
-  fragment = 'fragment',
+  div = "div",
+  table = "table",
+  tbody = "tbody",
+  td = "td",
+  text = "text",
+  tfoot = "tfoot",
+  th = "th",
+  thead = "thead",
+  tr = "tr",
+  ul = "ul",
+  ImageVault = "ImageVault",
+  fragment = "fragment",
 }

 export type RTEType = keyof typeof RTETypeEnum

 export enum RTEItemTypeEnum {
-  asset = 'asset',
-  entry = 'entry',
+  asset = "asset",
+  entry = "entry",
 }

 export type RTEItemType = keyof typeof RTEItemTypeEnum

 export enum AvailableParagraphFormatEnum {
-  'script-1' = 'script-1',
-  'script-2' = 'script-2',
-  'footnote' = 'footnote',
-  'caption' = 'caption',
-  'subtitle-1' = 'subtitle-1',
-  'subtitle-2' = 'subtitle-2',
+  "script-1" = "script-1",
+  "script-2" = "script-2",
+  "footnote" = "footnote",
+  "caption" = "caption",
+  "subtitle-1" = "subtitle-1",
+  "subtitle-2" = "subtitle-2",
 }

 export type ContentBlockType =
-  | 'AccountPage'
-  | 'CampaignOverviewPage'
-  | 'CampaignPage'
-  | 'CollectionPage'
-  | 'ContentPage'
-  | 'DestinationCityPage'
-  | 'DestinationCountryPage'
-  | 'DestinationOverviewPage'
-  | 'HotelPage'
-  | 'ImageContainer'
-  | 'LoyaltyPage'
-  | 'StartPage'
-  | 'SysAsset'
-  | 'PromoCampaignPage'
+  | "AccountPage"
+  | "CampaignOverviewPage"
+  | "CampaignPage"
+  | "CollectionPage"
+  | "ContentPage"
+  | "DestinationCityPage"
+  | "DestinationCountryPage"
+  | "DestinationOverviewPage"
+  | "HotelPage"
+  | "ImageContainer"
+  | "LoyaltyPage"
+  | "StartPage"
+  | "SysAsset"
+  | "PromoCampaignPage"
--- a/packages/design-system/lib/components/JsonToHtml/types/rte/node.ts
+++ b/packages/design-system/lib/components/JsonToHtml/types/rte/node.ts
@@ -1,18 +1,18 @@
-import type { JSX } from 'react'
+import type { JSX } from "react"

 import {
  DeprecatedImageVaultAssetResponse,
  ImageVaultAssetResponse,
-} from '@scandic-hotels/common/utils/imageVault'
-import type { EmbedByUid } from '../../JsonToHtml'
+} from "@scandic-hotels/common/utils/imageVault"
+import type { EmbedByUid } from "../../JsonToHtml"
 import type {
  Attributes,
  RTEAnchorAttrs,
  RTEAssetAttrs,
  RTELinkAttrs,
-} from './attrs'
-import type { RTETypeEnum } from './enums'
-import type { RenderOptions } from './option'
+} from "./attrs"
+import type { RTETypeEnum } from "./enums"
+import type { RenderOptions } from "./option"

 export interface RTEDefaultNode {
  attrs: Attributes
@@ -48,15 +48,15 @@ export interface RTEImageVaultNode extends RTEDefaultNode {
 }

 export enum RTEMarkType {
-  bold = 'bold',
-  break = 'break',
-  classnameOrId = 'classnameOrId',
-  inlineCode = 'inlineCode',
-  italic = 'italic',
-  strikethrough = 'strikethrough',
-  subscript = 'subscript',
-  superscript = 'superscript',
-  underline = 'underline',
+  bold = "bold",
+  break = "break",
+  classnameOrId = "classnameOrId",
+  inlineCode = "inlineCode",
+  italic = "italic",
+  strikethrough = "strikethrough",
+  subscript = "subscript",
+  superscript = "superscript",
+  underline = "underline",
 }

 type RTETextNodeOptionalKeys = {
--- a/packages/design-system/lib/components/JsonToHtml/types/rte/option.ts
+++ b/packages/design-system/lib/components/JsonToHtml/types/rte/option.ts
@@ -1,4 +1,4 @@
-import type { RTERenderMark, RTERenderOptionComponent } from './node'
+import type { RTERenderMark, RTERenderOptionComponent } from "./node"

 export type RenderOptions = {
  [type: string]: RTERenderOptionComponent | RTERenderMark
--- a/packages/design-system/lib/components/JsonToHtml/utils.tsx
+++ b/packages/design-system/lib/components/JsonToHtml/utils.tsx
@@ -1,26 +1,26 @@
-import React, { cloneElement } from 'react'
+import React, { cloneElement } from "react"

-import { renderOptions } from './renderOptions'
+import { renderOptions } from "./renderOptions"

-import styles from './jsontohtml.module.css'
+import styles from "./jsontohtml.module.css"

-import type { Embeds, Node } from './JsonToHtml'
+import type { Embeds, Node } from "./JsonToHtml"

-import { EmbedByUid } from './JsonToHtml'
-import { AVAILABLE_LIST_FORMATS } from './types/rte/constants'
-import { AvailableParagraphFormatEnum, RTETypeEnum } from './types/rte/enums'
+import { EmbedByUid } from "./JsonToHtml"
+import { AVAILABLE_LIST_FORMATS } from "./types/rte/constants"
+import { AvailableParagraphFormatEnum, RTETypeEnum } from "./types/rte/enums"
 import {
  RTEMarkType,
  type RTENode,
  type RTERenderMark,
  type RTERenderOptionComponent,
  type RTETextNode,
-} from './types/rte/node'
-import type { RenderOptions } from './types/rte/option'
+} from "./types/rte/node"
+import type { RenderOptions } from "./types/rte/option"

 export function groupEmbedsByUid(embedsArray: Node<Embeds>[]) {
  const embedsByUid = embedsArray.reduce<EmbedByUid>((acc, embed) => {
-    if ('system' in embed.node && embed.node.system?.uid) {
+    if ("system" in embed.node && embed.node.system?.uid) {
      acc[embed.node.system.uid] = embed
    }
    return acc
@@ -110,7 +110,7 @@ export function extractAvailableListClassNames(className?: string) {
  if (!className) {
    return []
  }
-  const classNames = className.split(' ')
+  const classNames = className.split(" ")
  return classNames
    .filter((name) => AVAILABLE_LIST_FORMATS.includes(name))
    .map((item) => styles[item] || item)
@@ -121,7 +121,7 @@ export function nodeToHtml(
  embeds: EmbedByUid,
  fullRenderOptions: RenderOptions
 ) {
-  if ('type' in node === false) {
+  if ("type" in node === false) {
    return textNodeToHtml(node, fullRenderOptions)
  } else {
    const renderer = fullRenderOptions[node.type] as RTERenderOptionComponent
@@ -138,7 +138,7 @@ export function nodeToHtml(
 }

 function getUniqueId(node: RTENode) {
-  if ('uid' in node) {
+  if ("uid" in node) {
    return node.uid
  }
  return node.id