Merged in feat/sw-2879-booking-widget-to-booking-flow-package (pull request #2532)

feat(SW-2879): Move BookingWidget to booking-flow package * Fix lockfile * Fix styling * a tiny little booking widget test * Tiny fixes * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Remove unused scripts * lint:fix * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Tiny lint fixes * update test * Update Input in booking-flow * Clean up comments etc * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Setup tracking context for booking-flow * Add missing use client * Fix temp tracking function * Pass booking to booking-widget * Remove comment * Add use client to booking widget tracking provider * Add use client to tracking functions * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Move debug page * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package * Merge branch 'master' into feat/sw-2879-booking-widget-to-booking-flow-package Approved-by: Bianca Widstam
2025-08-05 09:20:20 +00:00
parent 03c9244fdf
commit 1bd8fe6821
206 changed files with 1936 additions and 796 deletions
--- a/packages/booking-flow/lib/components/BookingWidget/GuestsRoomsPicker/AdultSelector/adult-selector.module.css
+++ b/packages/booking-flow/lib/components/BookingWidget/GuestsRoomsPicker/AdultSelector/adult-selector.module.css
@@ -0,0 +1,5 @@
+.container {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
--- a/packages/booking-flow/lib/components/BookingWidget/GuestsRoomsPicker/AdultSelector/index.tsx
+++ b/packages/booking-flow/lib/components/BookingWidget/GuestsRoomsPicker/AdultSelector/index.tsx
@@ -0,0 +1,53 @@
+"use client"
+
+import { useFormContext } from "react-hook-form"
+import { useIntl } from "react-intl"
+
+import Caption from "@scandic-hotels/design-system/Caption"
+
+import Counter from "../Counter"
+
+import styles from "./adult-selector.module.css"
+
+type AdultSelectorProps = {
+  roomIndex: number
+  currentAdults: number
+}
+export default function AdultSelector({
+  roomIndex = 0,
+  currentAdults,
+}: AdultSelectorProps) {
+  const name = `rooms.${roomIndex}.adults`
+  const intl = useIntl()
+  const adultsLabel = intl.formatMessage({
+    defaultMessage: "Adults",
+  })
+  const { setValue } = useFormContext()
+
+  function increaseAdultsCount() {
+    if (currentAdults < 6) {
+      setValue(name, currentAdults + 1, { shouldDirty: true })
+    }
+  }
+
+  function decreaseAdultsCount() {
+    if (currentAdults > 1) {
+      setValue(name, currentAdults - 1, { shouldDirty: true })
+    }
+  }
+
+  return (
+    <section className={styles.container}>
+      <Caption color="uiTextHighContrast" type="bold">
+        {adultsLabel}
+      </Caption>
+      <Counter
+        count={currentAdults}
+        handleOnDecrease={decreaseAdultsCount}
+        handleOnIncrease={increaseAdultsCount}
+        disableDecrease={currentAdults == 1}
+        disableIncrease={currentAdults == 6}
+      />
+    </section>
+  )
+}