From 80057264d9e8c07f3871b74a629713e12e4c3b2e Mon Sep 17 00:00:00 2001 From: Anton Gunnarsson Date: Fri, 4 Jul 2025 06:11:25 +0000 Subject: [PATCH] Merged in chore/sw-3145-move-preamble (pull request #2519) chore(SW-3145): Move Preamble to design-system * Move Preamble to design-system Approved-by: Linus Flood --- .../Blocks/FullWidthCampaign/index.tsx | 3 +- .../HotelPage/SidePeeks/Activities/index.tsx | 3 +- .../ContentType/LoyaltyPage/index.tsx | 3 +- .../SelectHotel/HotelCount/index.tsx | 4 +-- apps/scandic-web/components/Modal/index.tsx | 2 +- .../components/Section/Header/index.tsx | 3 +- .../TempDesignSystem/Text/Preamble/index.tsx | 21 ------------- .../Text/Preamble/preamble.ts | 9 ------ .../lib/components/Preamble/index.tsx | 30 +++++++++++++++++++ .../components}/Preamble/preamble.module.css | 0 .../lib/components}/Preamble/variants.ts | 6 ++-- packages/design-system/package.json | 1 + 12 files changed, 45 insertions(+), 40 deletions(-) delete mode 100644 apps/scandic-web/components/TempDesignSystem/Text/Preamble/index.tsx delete mode 100644 apps/scandic-web/components/TempDesignSystem/Text/Preamble/preamble.ts create mode 100644 packages/design-system/lib/components/Preamble/index.tsx rename {apps/scandic-web/components/TempDesignSystem/Text => packages/design-system/lib/components}/Preamble/preamble.module.css (100%) rename {apps/scandic-web/components/TempDesignSystem/Text => packages/design-system/lib/components}/Preamble/variants.ts (78%) diff --git a/apps/scandic-web/components/Blocks/FullWidthCampaign/index.tsx b/apps/scandic-web/components/Blocks/FullWidthCampaign/index.tsx index e4881c1ff..d41b24643 100644 --- a/apps/scandic-web/components/Blocks/FullWidthCampaign/index.tsx +++ b/apps/scandic-web/components/Blocks/FullWidthCampaign/index.tsx @@ -1,8 +1,9 @@ +import Preamble from "@scandic-hotels/design-system/Preamble" + import Image from "@/components/Image" import Button from "@/components/TempDesignSystem/Button" import Link from "@/components/TempDesignSystem/Link" import BiroScript from "@/components/TempDesignSystem/Text/BiroScript" -import Preamble from "@/components/TempDesignSystem/Text/Preamble" import Title from "@/components/TempDesignSystem/Text/Title" import styles from "./fullWidthCampaign.module.css" diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Activities/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Activities/index.tsx index af79ae40d..e2cc09875 100644 --- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Activities/index.tsx +++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Activities/index.tsx @@ -1,7 +1,8 @@ +import Preamble from "@scandic-hotels/design-system/Preamble" + import Button from "@/components/TempDesignSystem/Button" import Link from "@/components/TempDesignSystem/Link" import SidePeek from "@/components/TempDesignSystem/SidePeek" -import Preamble from "@/components/TempDesignSystem/Text/Preamble" import { getIntl } from "@/i18n" import styles from "./activities.module.css" diff --git a/apps/scandic-web/components/ContentType/LoyaltyPage/index.tsx b/apps/scandic-web/components/ContentType/LoyaltyPage/index.tsx index 25e71217d..d4e8bf0be 100644 --- a/apps/scandic-web/components/ContentType/LoyaltyPage/index.tsx +++ b/apps/scandic-web/components/ContentType/LoyaltyPage/index.tsx @@ -1,6 +1,8 @@ import { cx } from "class-variance-authority" import { Suspense } from "react" +import Preamble from "@scandic-hotels/design-system/Preamble" + import { serverClient } from "@/lib/trpc/server" import Blocks from "@/components/Blocks" @@ -8,7 +10,6 @@ import Hero from "@/components/Hero" import MaxWidth from "@/components/MaxWidth" import Sidebar from "@/components/Sidebar" import SidebarSkeleton from "@/components/Sidebar/SidebarSkeleton" -import Preamble from "@/components/TempDesignSystem/Text/Preamble" import Title from "@/components/TempDesignSystem/Text/Title" import TrackingSDK from "@/components/TrackingSDK" import { isLoggedInUser } from "@/utils/isLoggedInUser" diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/HotelCount/index.tsx b/apps/scandic-web/components/HotelReservation/SelectHotel/HotelCount/index.tsx index cbc52cb3e..41ddb833f 100644 --- a/apps/scandic-web/components/HotelReservation/SelectHotel/HotelCount/index.tsx +++ b/apps/scandic-web/components/HotelReservation/SelectHotel/HotelCount/index.tsx @@ -2,9 +2,9 @@ import { useIntl } from "react-intl" -import { useHotelFilterStore } from "@/stores/hotel-filters" +import Preamble from "@scandic-hotels/design-system/Preamble" -import Preamble from "@/components/TempDesignSystem/Text/Preamble" +import { useHotelFilterStore } from "@/stores/hotel-filters" export default function HotelCount() { const intl = useIntl() diff --git a/apps/scandic-web/components/Modal/index.tsx b/apps/scandic-web/components/Modal/index.tsx index a67614bce..b70fa7221 100644 --- a/apps/scandic-web/components/Modal/index.tsx +++ b/apps/scandic-web/components/Modal/index.tsx @@ -12,8 +12,8 @@ import { import { useIntl } from "react-intl" import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon" +import Preamble from "@scandic-hotels/design-system/Preamble" -import Preamble from "@/components/TempDesignSystem/Text/Preamble" import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" import { diff --git a/apps/scandic-web/components/Section/Header/index.tsx b/apps/scandic-web/components/Section/Header/index.tsx index 67b2ff1d5..31b1f71f1 100644 --- a/apps/scandic-web/components/Section/Header/index.tsx +++ b/apps/scandic-web/components/Section/Header/index.tsx @@ -1,4 +1,5 @@ -import Preamble from "@/components/TempDesignSystem/Text/Preamble" +import Preamble from "@scandic-hotels/design-system/Preamble" + import Title from "@/components/TempDesignSystem/Text/Title" import SectionLink from "../Link" diff --git a/apps/scandic-web/components/TempDesignSystem/Text/Preamble/index.tsx b/apps/scandic-web/components/TempDesignSystem/Text/Preamble/index.tsx deleted file mode 100644 index 96af1f15d..000000000 --- a/apps/scandic-web/components/TempDesignSystem/Text/Preamble/index.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import { Slot } from "@radix-ui/react-slot" - -import { preambleVariants } from "./variants" - -import type { CaptionProps } from "./preamble" - -export default function Preamble({ - asChild = false, - className = "", - color, - textAlign, - ...props -}: CaptionProps) { - const Comp = asChild ? Slot : "p" - const classNames = preambleVariants({ - className, - color, - textAlign, - }) - return -} diff --git a/apps/scandic-web/components/TempDesignSystem/Text/Preamble/preamble.ts b/apps/scandic-web/components/TempDesignSystem/Text/Preamble/preamble.ts deleted file mode 100644 index 987ba5749..000000000 --- a/apps/scandic-web/components/TempDesignSystem/Text/Preamble/preamble.ts +++ /dev/null @@ -1,9 +0,0 @@ -import type { VariantProps } from "class-variance-authority" - -import type { preambleVariants } from "./variants" - -export interface CaptionProps - extends Omit, "color">, - VariantProps { - asChild?: boolean -} diff --git a/packages/design-system/lib/components/Preamble/index.tsx b/packages/design-system/lib/components/Preamble/index.tsx new file mode 100644 index 000000000..dfac9b8a6 --- /dev/null +++ b/packages/design-system/lib/components/Preamble/index.tsx @@ -0,0 +1,30 @@ +import { Slot } from '@radix-ui/react-slot' + +import { preambleVariants } from './variants' + +import type { VariantProps } from 'class-variance-authority' + +interface CaptionProps + extends Omit, 'color'>, + VariantProps { + asChild?: boolean +} + +/** + * @deprecated Use `Typography` instead. + */ +export default function Preamble({ + asChild = false, + className = '', + color, + textAlign, + ...props +}: CaptionProps) { + const Comp = asChild ? Slot : 'p' + const classNames = preambleVariants({ + className, + color, + textAlign, + }) + return +} diff --git a/apps/scandic-web/components/TempDesignSystem/Text/Preamble/preamble.module.css b/packages/design-system/lib/components/Preamble/preamble.module.css similarity index 100% rename from apps/scandic-web/components/TempDesignSystem/Text/Preamble/preamble.module.css rename to packages/design-system/lib/components/Preamble/preamble.module.css diff --git a/apps/scandic-web/components/TempDesignSystem/Text/Preamble/variants.ts b/packages/design-system/lib/components/Preamble/variants.ts similarity index 78% rename from apps/scandic-web/components/TempDesignSystem/Text/Preamble/variants.ts rename to packages/design-system/lib/components/Preamble/variants.ts index d007d985b..fff43bbe2 100644 --- a/apps/scandic-web/components/TempDesignSystem/Text/Preamble/variants.ts +++ b/packages/design-system/lib/components/Preamble/variants.ts @@ -1,6 +1,6 @@ -import { cva } from "class-variance-authority" +import { cva } from 'class-variance-authority' -import styles from "./preamble.module.css" +import styles from './preamble.module.css' const config = { variants: { @@ -17,7 +17,7 @@ const config = { }, }, defaultVariants: { - color: "black", + color: 'black', }, } as const diff --git a/packages/design-system/package.json b/packages/design-system/package.json index 69c784824..ea915cc7a 100644 --- a/packages/design-system/package.json +++ b/packages/design-system/package.json @@ -24,6 +24,7 @@ "./CampaignRateCard": "./dist/components/RateCard/Campaign/index.js", "./CodeRateCard": "./dist/components/RateCard/Code/index.js", "./PointsRateCard": "./dist/components/RateCard/Points/index.js", + "./Preamble": "./dist/components/Preamble/index.js", "./NoRateAvailableCard": "./dist/components/RateCard/NoRateAvailable/index.js", "./IconButton": "./dist/components/IconButton/index.js", "./Icons": "./dist/components/Icons/index.js",