scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in chore/sw-3145-move-caption (pull request #2503)

Browse Source 
chore(SW-3145): Move Caption to design-system

* Move Caption to design-system

* Mark Caption as deprecated


Approved-by: Linus Flood
Approved-by: Joakim Jäderberg
This commit is contained in:
Anton Gunnarsson
2025-07-03 07:48:24 +00:00
parent c7d40fd173
commit a7ac79e429
66 changed files with 93 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx
View File

@@ -3,10 +3,10 @@
import { useIntl } from "react-intl"
import { dt } from "@scandic-hotels/common/dt"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Button from "@/components/TempDesignSystem/Button"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import useLang from "@/hooks/useLang"

2
apps/scandic-web/components/Blocks/DynamicContent/LoyaltyLevels/index.tsx
View File

@@ -1,10 +1,10 @@
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { serverClient } from "@/lib/trpc/server"
import MembershipLevelIcon from "@/components/Levels/Icon"
import BiroScript from "@/components/TempDesignSystem/Text/BiroScript"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Title from "@/components/TempDesignSystem/Text/Title"
import { getIntl } from "@/i18n"

3
apps/scandic-web/components/Blocks/DynamicContent/Overview/Friend/MembershipNumber/index.tsx
View File

@@ -1,4 +1,5 @@
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Caption from "@scandic-hotels/design-system/Caption"
import { getIntl } from "@/i18n"
import CopyButton from "../../Buttons/CopyButton"

3
apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/ActiveRedeemedBadge.tsx
View File

@@ -3,10 +3,9 @@
import { motion } from "motion/react"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./redeem.module.css"
export default function ActiveRedeemedBadge() {

2
apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/Flows/Campaign.tsx
View File

@@ -2,11 +2,11 @@
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Title from "@/components/TempDesignSystem/Text/Title"
import { toast } from "@/components/TempDesignSystem/Toasts"

2
apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/MembershipNumberBadge.tsx
View File

@@ -1,6 +1,6 @@
import { useIntl } from "react-intl"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Caption from "@scandic-hotels/design-system/Caption"
import styles from "./redeem.module.css"

2
apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/TimedRedeemedBadge.tsx
View File

@@ -3,10 +3,10 @@
import { useIntl } from "react-intl"
import { dt } from "@scandic-hotels/common/dt"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Countdown from "@/components/Countdown"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import useRedeemFlow from "./useRedeemFlow"

2
apps/scandic-web/components/Blocks/DynamicContent/Stays/StayCard/index.tsx
View File

@@ -1,11 +1,11 @@
"use client"
import { dt } from "@scandic-hotels/common/dt"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Image from "@/components/Image"
import Link from "@/components/TempDesignSystem/Link"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Title from "@/components/TempDesignSystem/Text/Title"
import useLang from "@/hooks/useLang"

3
apps/scandic-web/components/ContentType/HotelPage/Map/MapCard/index.tsx
View File

@@ -5,10 +5,11 @@ import { useParams } from "next/navigation"
import { useEffect, useState } from "react"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import PoiMarker from "@/components/Maps/Markers/Poi"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Title from "@/components/TempDesignSystem/Text/Title"
import { trackHotelMapClick } from "@/utils/tracking"

2
apps/scandic-web/components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/index.tsx
View File

@@ -1,3 +1,4 @@
import Caption from "@scandic-hotels/design-system/Caption"
import FacebookIcon from "@scandic-hotels/design-system/Icons/FacebookIcon"
import InstagramIcon from "@scandic-hotels/design-system/Icons/InstagramIcon"
import { Country } from "@scandic-hotels/trpc/types/country"
@@ -5,7 +6,6 @@ import { Country } from "@scandic-hotels/trpc/types/country"
import Image from "@/components/Image"
import Link from "@/components/TempDesignSystem/Link"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import Title from "@/components/TempDesignSystem/Text/Title"
import { getIntl } from "@/i18n"

2
apps/scandic-web/components/DatePicker/Range/Desktop.tsx
View File

@@ -6,12 +6,12 @@ import { useIntl } from "react-intl"
import { Lang } from "@scandic-hotels/common/constants/language"
import { dt } from "@scandic-hotels/common/dt"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
import Button from "@/components/TempDesignSystem/Button"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import useLang from "@/hooks/useLang"
import { locales } from "../locales"

2
apps/scandic-web/components/DatePicker/Single/Desktop.tsx
View File

@@ -6,11 +6,11 @@ import { useIntl } from "react-intl"
import { Lang } from "@scandic-hotels/common/constants/language"
import { dt } from "@scandic-hotels/common/dt"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Button from "@/components/TempDesignSystem/Button"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import useLang from "@/hooks/useLang"

2
apps/scandic-web/components/DeprecatedJsonToHtml/renderOptions.tsx
View File

@@ -1,4 +1,5 @@
import { removeMultipleSlashes } from "@scandic-hotels/common/utils/url"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import {
AvailableParagraphFormatEnum,
@@ -14,7 +15,6 @@ import ImageContainer from "../ImageContainer"
import Table from "../TempDesignSystem/Table"
import BiroScript from "../TempDesignSystem/Text/BiroScript"
import Body from "../TempDesignSystem/Text/Body"
import Caption from "../TempDesignSystem/Text/Caption"
import Footnote from "../TempDesignSystem/Text/Footnote"
import Subtitle from "../TempDesignSystem/Text/Subtitle"
import Title from "../TempDesignSystem/Text/Title"

2
apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
View File

@@ -4,6 +4,7 @@ import { type FieldError, useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import { useMediaQuery } from "usehooks-ts"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { SEARCH_TYPE_REDEMPTION } from "@scandic-hotels/trpc/constants/booking"
@@ -15,7 +16,6 @@ import Input from "@/components/TempDesignSystem/Form/Input"
import { getErrorMessage } from "@/components/TempDesignSystem/Form/Input/errors"
import Switch from "@/components/TempDesignSystem/Form/Switch"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { Input as BookingWidgetInput } from "../Input"
import { isMultiRoomError } from "../utils"

2
apps/scandic-web/components/Forms/BookingWidget/FormContent/RewardNight/index.tsx
View File

@@ -5,6 +5,7 @@ import { useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import { useMediaQuery } from "usehooks-ts"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { SEARCH_TYPE_REDEMPTION } from "@scandic-hotels/trpc/constants/booking"
@@ -13,7 +14,6 @@ import Modal from "@/components/Modal"
import Button from "@/components/TempDesignSystem/Button"
import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
import { getErrorMessage } from "@/components/TempDesignSystem/Form/Input/errors"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { RemoveExtraRooms } from "../BookingCode"
import { isMultiRoomError } from "../utils"

3
apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/ClearSearchButton/index.tsx
View File

@@ -1,10 +1,9 @@
"use client"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { buttonVariants } from "./variants"
import type { ClearSearchButtonProps } from "@/types/components/search"

2
apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/index.tsx
View File

@@ -4,12 +4,12 @@ import { useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import { useDebounceValue } from "usehooks-ts"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { trpc } from "@scandic-hotels/trpc/client"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Footnote from "@/components/TempDesignSystem/Text/Footnote"
import useLang from "@/hooks/useLang"

3
apps/scandic-web/components/Forms/BookingWidget/FormContent/ValidationError/index.tsx
View File

@@ -1,9 +1,8 @@
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./validationError.module.css"
export default function ValidationError() {

3
apps/scandic-web/components/Forms/BookingWidget/FormContent/Voucher/index.tsx
View File

@@ -2,8 +2,9 @@
import { FormProvider, useForm } from "react-hook-form"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import SkeletonShimmer from "@/components/SkeletonShimmer"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import BookingCode from "../BookingCode"
import RewardNight from "../RewardNight"

2
apps/scandic-web/components/GuestsRoomsPicker/AdultSelector/index.tsx
View File

@@ -3,7 +3,7 @@
import { useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Caption from "@scandic-hotels/design-system/Caption"
import Counter from "../Counter"

2
apps/scandic-web/components/GuestsRoomsPicker/ChildSelector/ChildInfoSelector.tsx
View File

@@ -3,11 +3,11 @@
import { useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { ChildBedMapEnum } from "@scandic-hotels/trpc/enums/childBedMapEnum"
import DeprecatedSelect from "@/components/TempDesignSystem/DeprecatedSelect"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./child-selector.module.css"

2
apps/scandic-web/components/GuestsRoomsPicker/ChildSelector/index.tsx
View File

@@ -3,7 +3,7 @@
import { useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Caption from "@scandic-hotels/design-system/Caption"
import Counter from "../Counter"
import ChildInfoSelector from "./ChildInfoSelector"

2
apps/scandic-web/components/Header/MainMenu/MyPagesMenuContent/index.tsx
View File

@@ -3,6 +3,7 @@
import FocusLock from "react-focus-lock"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { trpc } from "@scandic-hotels/trpc/client"
@@ -10,7 +11,6 @@ import { trpc } from "@scandic-hotels/trpc/client"
import { logout } from "@/constants/routes/handleAuth"
import Link from "@/components/TempDesignSystem/Link"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import useLang from "@/hooks/useLang"

2
apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx
View File

@@ -2,13 +2,13 @@
import FocusLock from "react-focus-lock"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import useDropdownStore from "@/stores/main-menu"
import Card from "@/components/TempDesignSystem/Card"
import Link from "@/components/TempDesignSystem/Link"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import styles from "./megaMenu.module.css"

2
apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx
View File

@@ -3,6 +3,7 @@
import { useIntl } from "react-intl"
import { dt } from "@scandic-hotels/common/dt"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
@@ -13,7 +14,6 @@ import {
} from "@/constants/dateFormats"
import Image from "@/components/Image"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import useLang from "@/hooks/useLang"
import RoomDetailsSidePeek from "./RoomDetailsSidePeek"

3
apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/Signup/index.tsx
View File

@@ -4,9 +4,10 @@ import { useEffect, useState } from "react"
import { type RegisterOptions, useWatch } from "react-hook-form"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import DateSelect from "@/components/TempDesignSystem/Form/Date"
import Input from "@/components/TempDesignSystem/Form/Input"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./signup.module.css"

2
apps/scandic-web/components/HotelReservation/EnterDetails/Payment/GuaranteeDetails/index.tsx
View File

@@ -1,9 +1,9 @@
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./guaranteeDetails.module.css"

3
apps/scandic-web/components/HotelReservation/EnterDetails/Payment/MixedRatePaymentBreakdown/index.tsx
View File

@@ -1,8 +1,9 @@
import React from "react"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { formatPrice } from "@/utils/numberFormatting"
import {

2
apps/scandic-web/components/HotelReservation/EnterDetails/Payment/TermsAndConditions/index.tsx
View File

@@ -1,12 +1,12 @@
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { bookingTermsAndConditions, privacyPolicy } from "@/constants/webHrefs"
import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
import Link from "@/components/TempDesignSystem/Link"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import useLang from "@/hooks/useLang"
import styles from "../payment.module.css"

2
apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/PriceChangeSummary/index.tsx
View File

@@ -9,12 +9,12 @@ import {
} from "react-aria-components"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import { formatPrice } from "@/utils/numberFormatting"

2
apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/index.tsx
View File

@@ -1,13 +1,13 @@
import { Dialog, Modal, ModalOverlay } from "react-aria-components"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { useEnterDetailsStore } from "@/stores/enter-details"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import Title from "@/components/TempDesignSystem/Text/Title"
import { formatPrice } from "@/utils/numberFormatting"

2
apps/scandic-web/components/HotelReservation/FindMyBooking/index.tsx
View File

@@ -6,6 +6,7 @@ import { FormProvider, useForm } from "react-hook-form"
import { useIntl } from "react-intl"
import { myStay } from "@scandic-hotels/common/constants/routes/myStay"
import Caption from "@scandic-hotels/design-system/Caption"
import { trpc } from "@scandic-hotels/trpc/client"
import { customerService } from "@/constants/webHrefs"
@@ -14,7 +15,6 @@ import Button from "@/components/TempDesignSystem/Button"
import Input from "@/components/TempDesignSystem/Form/Input"
import Link from "@/components/TempDesignSystem/Link"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Title from "@/components/TempDesignSystem/Text/Title"
import { toast } from "@/components/TempDesignSystem/Toasts"
import useLang from "@/hooks/useLang"

2
apps/scandic-web/components/HotelReservation/HotelCard/HotelChequeCard/index.tsx
View File

@@ -1,8 +1,8 @@
import { useIntl } from "react-intl"
import { CurrencyEnum } from "@scandic-hotels/common/constants/currency"
import Caption from "@scandic-hotels/design-system/Caption"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import styles from "./hotelChequeCard.module.css"

3
apps/scandic-web/components/HotelReservation/HotelCard/HotelPointsRow/index.tsx
View File

@@ -1,6 +1,7 @@
import { useIntl } from "react-intl"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Caption from "@scandic-hotels/design-system/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import styles from "./hotelPointsRow.module.css"

2
apps/scandic-web/components/HotelReservation/HotelCard/HotelPriceCard/index.tsx
View File

@@ -1,11 +1,11 @@
import { cx } from "class-variance-authority"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import { RateTypeEnum } from "@scandic-hotels/trpc/enums/rateType"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import styles from "./hotelPriceCard.module.css"

2
apps/scandic-web/components/HotelReservation/HotelCard/HotelVoucherCard/index.tsx
View File

@@ -1,8 +1,8 @@
import { useIntl } from "react-intl"
import { CurrencyEnum } from "@scandic-hotels/common/constants/currency"
import Caption from "@scandic-hotels/design-system/Caption"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import styles from "./hotelVoucherCard.module.css"

2
apps/scandic-web/components/HotelReservation/HotelCard/index.tsx
View File

@@ -11,6 +11,7 @@ import { memo } from "react"
import { useIntl } from "react-intl"
import { selectRate } from "@scandic-hotels/common/constants/routes/hotelReservation"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import HotelLogoIcon from "@scandic-hotels/design-system/Icons/HotelLogoIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
@@ -25,7 +26,6 @@ import BookingCodeChip from "@/components/BookingCodeChip"
import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
import ImageGallery from "@/components/ImageGallery"
import Link from "@/components/TempDesignSystem/Link"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { mapApiImagesToGalleryImages } from "@/utils/imageGallery"
import { getSingleDecimal } from "@/utils/numberFormatting"

2
apps/scandic-web/components/HotelReservation/HotelCardDialog/ListingHotelCardDialog/index.tsx
View File

@@ -4,6 +4,7 @@ import { useState } from "react"
import { useIntl } from "react-intl"
import { selectRate } from "@scandic-hotels/common/constants/routes/hotelReservation"
import Caption from "@scandic-hotels/design-system/Caption"
import { IconButton } from "@scandic-hotels/design-system/IconButton"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
@@ -11,7 +12,6 @@ import { Typography } from "@scandic-hotels/design-system/Typography"
import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
import Button from "@/components/TempDesignSystem/Button"
import Link from "@/components/TempDesignSystem/Link"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import useLang from "@/hooks/useLang"
import { isValidClientSession } from "@/utils/clientSession"

2
apps/scandic-web/components/HotelReservation/HotelCardDialog/StandaloneHotelCardDialog/index.tsx
View File

@@ -4,6 +4,7 @@ import { useState } from "react"
import { useIntl } from "react-intl"
import { selectRate } from "@scandic-hotels/common/constants/routes/hotelReservation"
import Caption from "@scandic-hotels/design-system/Caption"
import { IconButton } from "@scandic-hotels/design-system/IconButton"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
@@ -12,7 +13,6 @@ import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
import Button from "@/components/TempDesignSystem/Button"
import Link from "@/components/TempDesignSystem/Link"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Footnote from "@/components/TempDesignSystem/Text/Footnote"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import useLang from "@/hooks/useLang"

3
apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/PriceContainer/index.tsx
View File

@@ -1,4 +1,5 @@
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Caption from "@scandic-hotels/design-system/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import styles from "./priceContainer.module.css"

3
apps/scandic-web/components/HotelReservation/PaymentOption/index.tsx
View File

@@ -2,10 +2,11 @@ import { cx } from "class-variance-authority"
import Image from "next/image"
import { Radio } from "react-aria-components"
import Caption from "@scandic-hotels/design-system/Caption"
import { PAYMENT_METHOD_ICONS } from "@/constants/booking"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./paymentOption.module.css"

2
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/Summary.tsx
View File

@@ -5,6 +5,7 @@ import { useIntl } from "react-intl"
import { dt } from "@scandic-hotels/common/dt"
import { Button } from "@scandic-hotels/design-system/Button"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { ChildBedMapEnum } from "@scandic-hotels/trpc/enums/childBedMapEnum"
@@ -16,7 +17,6 @@ import PriceDetailsModal from "@/components/HotelReservation/PriceDetailsModal"
import SignupPromoDesktop from "@/components/HotelReservation/SignupPromo/Desktop"
import Modal from "@/components/Modal"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import useLang from "@/hooks/useLang"
import { formatPrice } from "@/utils/numberFormatting"

2
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/index.tsx
View File

@@ -5,6 +5,7 @@ import { useState, useTransition } from "react"
import { useIntl } from "react-intl"
import { dt } from "@scandic-hotels/common/dt"
import Caption from "@scandic-hotels/design-system/Caption"
import { RateEnum } from "@scandic-hotels/trpc/enums/rate"
import { RateTypeEnum } from "@scandic-hotels/trpc/enums/rateType"
@@ -13,7 +14,6 @@ import { useRatesStore } from "@/stores/select-rate"
import SignupPromoDesktop from "@/components/HotelReservation/SignupPromo/Desktop"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Footnote from "@/components/TempDesignSystem/Text/Footnote"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import { isValidClientSession } from "@/utils/clientSession"

2
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/index.tsx
View File

@@ -4,6 +4,7 @@ import { useIntl } from "react-intl"
import { CurrencyEnum } from "@scandic-hotels/common/constants/currency"
import { dt } from "@scandic-hotels/common/dt"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { RateEnum } from "@scandic-hotels/trpc/enums/rate"
@@ -13,7 +14,6 @@ import Image from "@/components/Image"
import Button from "@/components/TempDesignSystem/Button"
import Chip from "@/components/TempDesignSystem/Chip"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import { useRoomContext } from "@/contexts/SelectRate/Room"
import { isValidClientSession } from "@/utils/clientSession"

3
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/RoomNotAvailable/index.tsx
View File

@@ -1,10 +1,9 @@
"use client"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./notAvailable.module.css"
export default function RoomNotAvailable() {

3
apps/scandic-web/components/HotelReservation/SignupPromo/Desktop.tsx
View File

@@ -2,7 +2,8 @@
import { useIntl } from "react-intl"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Caption from "@scandic-hotels/design-system/Caption"
import Footnote from "@/components/TempDesignSystem/Text/Footnote"
import { formatPrice } from "@/utils/numberFormatting"

3
apps/scandic-web/components/HotelReservation/TripAdvisorChip/index.tsx
View File

@@ -1,7 +1,6 @@
import Caption from "@scandic-hotels/design-system/Caption"
import TripadvisorIcon from "@scandic-hotels/design-system/Icons/TripadvisorIcon"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./tripAdvisorChip.module.css"
import type { TripAdvisorProps } from "@/types/components/hotelReservation/tripAdvisorProps"

3
apps/scandic-web/components/ImageContainer/index.tsx
View File

@@ -1,5 +1,6 @@
import Caption from "@scandic-hotels/design-system/Caption"
import Image from "../Image"
import Caption from "../TempDesignSystem/Text/Caption"
import styles from "./imageContainer.module.css"

3
apps/scandic-web/components/Maps/InteractiveMap/PoiMapMarkers/index.tsx
View File

@@ -4,8 +4,9 @@ import {
} from "@vis.gl/react-google-maps"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import HotelMarkerByType from "../../Markers"
import PoiMarker from "../../Markers/Poi"

2
apps/scandic-web/components/Profile/CreditCardRow/index.tsx
View File

@@ -1,7 +1,7 @@
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import DeleteCreditCardConfirmation from "../DeleteCreditCardConfirmation"

2
apps/scandic-web/components/SasTierComparison/index.tsx
View File

@@ -1,6 +1,7 @@
"use client"
import Image from "next/image"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import JsonToHtml from "@/components/JsonToHtml"
@@ -9,7 +10,6 @@ import Link from "@/components/TempDesignSystem/Link"
import SectionContainer from "../Section/Container"
import Button from "../TempDesignSystem/Button"
import Body from "../TempDesignSystem/Text/Body"
import Caption from "../TempDesignSystem/Text/Caption"
import Subtitle from "../TempDesignSystem/Text/Subtitle"
import Title from "../TempDesignSystem/Text/Title"

2
apps/scandic-web/components/TempDesignSystem/AncillaryCard/index.tsx
View File

@@ -1,10 +1,10 @@
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import Image from "@/components/Image"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { formatPrice } from "@/utils/numberFormatting"
import styles from "./ancillaryCard.module.css"

3
apps/scandic-web/components/TempDesignSystem/Form/Checkbox/index.tsx
View File

@@ -5,10 +5,9 @@ import { Checkbox as AriaCheckbox } from "react-aria-components"
import { useController, useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { getErrorMessage } from "./errors"
import styles from "./checkbox.module.css"

3
apps/scandic-web/components/TempDesignSystem/Form/ErrorMessage/Error.tsx
View File

@@ -1,7 +1,6 @@
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./error.module.css"
export default function Error({ children }: React.PropsWithChildren) {

3
apps/scandic-web/components/TempDesignSystem/Form/Input/index.tsx
View File

@@ -5,11 +5,10 @@ import { Text, TextField } from "react-aria-components"
import { Controller, useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Input as InputWithLabel } from "@scandic-hotels/design-system/Input"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { getErrorMessage } from "./errors"
import styles from "./input.module.css"

2
apps/scandic-web/components/TempDesignSystem/Form/PasswordInput/index.tsx
View File

@@ -6,11 +6,11 @@ import { Controller, useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import { passwordValidators } from "@scandic-hotels/common/utils/zod/passwordValidator"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Input } from "@scandic-hotels/design-system/Input"
import Button from "@/components/TempDesignSystem/Button"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import { getErrorMessage } from "../Input/errors"

3
apps/scandic-web/components/TempDesignSystem/Form/Switch/index.tsx
View File

@@ -3,10 +3,9 @@
import { Switch as AriaSwitch } from "react-aria-components"
import { useController, useFormContext } from "react-hook-form"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import styles from "./switch.module.css"
import type { SwitchProps } from "@/types/components/switch"

3
apps/scandic-web/components/TempDesignSystem/Form/TextArea/index.tsx
View File

@@ -8,11 +8,10 @@ import {
} from "react-aria-components"
import { Controller, useFormContext } from "react-hook-form"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Label } from "@scandic-hotels/design-system/Label"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Body from "../../Text/Body"
import styles from "./textarea.module.css"

2
apps/scandic-web/components/TempDesignSystem/MeetingRoomCard/index.tsx
View File

@@ -2,6 +2,7 @@
import { useState } from "react"
import { useIntl } from "react-intl"
import Caption from "@scandic-hotels/design-system/Caption"
import { Divider } from "@scandic-hotels/design-system/Divider"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
@@ -9,7 +10,6 @@ import Image from "@/components/Image"
import ShowMoreButton from "../ShowMoreButton"
import Body from "../Text/Body"
import Caption from "../Text/Caption"
import Subtitle from "../Text/Subtitle"
import { translateRoomLighting, translateSeatingType } from "./utils"

127
apps/scandic-web/components/TempDesignSystem/Text/Caption/caption.module.css
View File

@@ -1,127 +0,0 @@
p.caption {
margin: 0;
padding: 0;
}
.captionFontOnly {
font-style: normal;
}
.bold {
font-family: var(--typography-Caption-Bold-fontFamily);
font-size: var(--typography-Caption-Bold-fontSize);
font-weight: 500; /* var(--typography-Caption-Bold-fontWeight); /* Commented till figma values are fixed to 500 instead of medium */
letter-spacing: var(--typography-Caption-Bold-letterSpacing);
line-height: var(--typography-Caption-Bold-lineHeight);
text-decoration: var(--typography-Caption-Bold-textDecoration);
}
.labels {
font-family: var(--typography-Caption-Labels-fontFamily);
font-size: var(--typography-Caption-Labels-fontSize);
font-weight: var(--typography-Caption-Labels-fontWeight);
letter-spacing: var(--typography-Caption-Labels-letterSpacing);
line-height: var(--typography-Caption-Labels-lineHeight);
text-decoration: var(--typography-Caption-Labels-textDecoration);
}
.underline {
font-family: var(--typography-Caption-Underline-fontFamily);
font-size: var(--typography-Caption-Underline-fontSize);
font-weight: var(--typography-Caption-Underline-fontWeight);
letter-spacing: var(--typography-Caption-Underline-letterSpacing);
line-height: var(--typography-Caption-Underline-lineHeight);
text-decoration: underline; /* var(--typography-Caption-Underline-textDecoration) /* Commented till figma values are fixed to underline instead of "underline" */
}
.regular {
font-family: var(--typography-Caption-Regular-fontFamily);
font-size: var(--typography-Caption-Regular-fontSize);
font-weight: var(--typography-Caption-Regular-fontWeight);
letter-spacing: var(--typography-Caption-Regular-letterSpacing);
line-height: var(--typography-Caption-Regular-lineHeight);
text-decoration: var(--typography-Caption-Regular-textDecoration);
}
.uppercase {
text-transform: uppercase;
}
.striked {
text-decoration: line-through;
}
.baseTextAccent {
color: var(--Base-Text-Accent);
}
.black {
color: var(--Main-Grey-100);
}
.burgundy {
color: var(--Scandic-Brand-Burgundy);
}
.pale {
color: var(--Scandic-Brand-Pale-Peach);
}
.textMediumContrast {
color: var(--Base-Text-Medium-contrast);
}
.baseTextHighContrast {
color: var(--Base-Text-High-contrast);
}
.baseTextMediumContrast {
color: var(--Base-Text-Medium-contrast);
}
.red {
color: var(--Scandic-Brand-Scandic-Red);
}
.white {
color: var(--UI-Opacity-White-100);
}
.uiTextActive {
color: var(--UI-Text-Active);
}
.uiTextMediumContrast {
color: var(--UI-Text-Medium-contrast);
}
.uiTextHighContrast {
color: var(--UI-Text-High-contrast);
}
.uiTextPlaceholder {
color: var(--UI-Text-Placeholder);
}
.disabled {
color: var(--Base-Text-Disabled);
}
.center {
text-align: center;
}
.left {
text-align: left;
}
.right {
text-align: right;
}
.green {
color: var(--UI-Semantic-Success);
}
.blue {
color: var(--UI-Semantic-Information);
}

10
apps/scandic-web/components/TempDesignSystem/Text/Caption/caption.ts
View File

@@ -1,10 +0,0 @@
import type { VariantProps } from "class-variance-authority"
import type { captionVariants } from "./variants"
export interface CaptionProps
extends Omit<React.HTMLAttributes<HTMLHeadingElement>, "color">,
VariantProps<typeof captionVariants> {
asChild?: boolean
fontOnly?: boolean
}

38
apps/scandic-web/components/TempDesignSystem/Text/Caption/index.tsx
View File

@@ -1,38 +0,0 @@
import { Slot } from "@radix-ui/react-slot"
import { captionVariants, fontOnlycaptionVariants } from "./variants"
import type { CaptionProps } from "./caption"
export default function Caption({
asChild = false,
className = "",
color,
fontOnly = false,
textAlign,
textTransform,
uppercase,
striked,
type,
...props
}: CaptionProps) {
const Comp = asChild ? Slot : "p"
const classNames = fontOnly
? fontOnlycaptionVariants({
className,
textTransform,
uppercase,
striked,
type,
})
: captionVariants({
className,
color,
textTransform,
textAlign,
uppercase,
striked,
type,
})
return <Comp className={classNames} {...props} />
}

80
apps/scandic-web/components/TempDesignSystem/Text/Caption/variants.ts
View File

@@ -1,80 +0,0 @@
import { cva } from "class-variance-authority"
import styles from "./caption.module.css"
const config = {
variants: {
type: {
regular: styles.regular,
bold: styles.bold,
label: styles.labels,
underline: styles.underline,
},
color: {
baseTextAccent: styles.baseTextAccent,
black: styles.black,
burgundy: styles.burgundy,
pale: styles.pale,
textMediumContrast: styles.textMediumContrast,
red: styles.red,
white: styles.white,
green: styles.green,
blue: styles.blue,
uiTextHighContrast: styles.uiTextHighContrast,
uiTextActive: styles.uiTextActive,
uiTextMediumContrast: styles.uiTextMediumContrast,
uiTextPlaceholder: styles.uiTextPlaceholder,
disabled: styles.disabled,
baseTextHighContrast: styles.baseTextHighContrast,
baseTextMediumContrast: styles.baseTextMediumContrast,
},
textTransform: {
uppercase: styles.uppercase,
},
textAlign: {
center: styles.center,
left: styles.left,
right: styles.right,
},
uppercase: {
true: styles.uppercase,
},
striked: {
true: styles.striked,
},
},
defaultVariants: {
color: "black",
type: "regular",
},
} as const
export const captionVariants = cva(styles.caption, config)
const fontOnlyConfig = {
variants: {
type: {
regular: styles.regular,
bold: styles.bold,
label: styles.labels,
underline: styles.underline,
},
textTransform: {
uppercase: styles.uppercase,
},
uppercase: {
true: styles.uppercase,
},
striked: {
true: styles.striked,
},
},
defaultVariants: {
type: "regular",
},
} as const
export const fontOnlycaptionVariants = cva(
styles.captionFontOnly,
fontOnlyConfig
)

2
apps/scandic-web/components/TempDesignSystem/Tooltip/index.tsx
View File

@@ -1,6 +1,6 @@
import { type PropsWithChildren, useState } from "react"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Caption from "@scandic-hotels/design-system/Caption"
import { tooltipVariants } from "./variants"