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

Merged in chore/replace-deprecated-body (pull request #3300)

Browse Source 
Replace deprecated <Body> with <Typography>

* chore: replace deprecated body component

* refactor: replace Body component with Typography across various components

* merge


Approved-by: Bianca Widstam
Approved-by: Matilda Landström
This commit is contained in:
Joakim Jäderberg
2025-12-09 12:45:34 +00:00
parent f40035baa9
commit 7eb74ea239
69 changed files with 755 additions and 899 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
packages/booking-flow/lib/components/EnterDetails/PriceChangeDialog/index.tsx
View File

@@ -2,12 +2,12 @@ import { Dialog, Modal, ModalOverlay } from "react-aria-components"
import { useIntl } from "react-intl"
import { formatPrice } from "@scandic-hotels/common/utils/numberFormatting"
import Body from "@scandic-hotels/design-system/Body"
import Caption from "@scandic-hotels/design-system/Caption"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { OldDSButton as Button } from "@scandic-hotels/design-system/OldDSButton"
import Subtitle from "@scandic-hotels/design-system/Subtitle"
import Title from "@scandic-hotels/design-system/Title"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { useEnterDetailsStore } from "../../../stores/enter-details"
import { calculateTotalRoomPrice } from "../Payment/helpers"
@@ -112,20 +112,22 @@ export default function PriceChangeDialog({
{title}
</Title>
</div>
<Body textAlign="center">
{intl.formatMessage(
{
id: "enterDetails.priceChangeDialog.description",
defaultMessage:
"Prices have increased since you selected your {roomSelection}.{linebreak} To continue your booking, accept the updated price,{linebreak} or go back to select {newRoomSelection}.",
},
{
roomSelection: roomSelectionMsg,
newRoomSelection: newRoomSelectionMsg,
linebreak: <br />,
}
)}
</Body>
<Typography variant="Body/Paragraph/mdRegular">
<p style={{ textAlign: "center" }}>
{intl.formatMessage(
{
id: "enterDetails.priceChangeDialog.description",
defaultMessage:
"Prices have increased since you selected your {roomSelection}.{linebreak} To continue your booking, accept the updated price,{linebreak} or go back to select {newRoomSelection}.",
},
{
roomSelection: roomSelectionMsg,
newRoomSelection: newRoomSelectionMsg,
linebreak: <br />,
}
)}
</p>
</Typography>
<div>
<Subtitle textAlign="center" color="burgundy">
{intl.formatMessage({
@@ -137,9 +139,11 @@ export default function PriceChangeDialog({
<Caption striked>
{formatPrice(intl, prevTotalPrice, currency)}
</Caption>
<Body textAlign="center" textTransform="bold">
{formatPrice(intl, newTotalPrice, currency)}
</Body>
<Typography variant="Body/Paragraph/mdBold">
<p style={{ textAlign: "center" }}>
{formatPrice(intl, newTotalPrice, currency)}
</p>
</Typography>
</div>
</div>
<PriceChangeSummary