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
This commit is contained in:
@@ -0,0 +1,13 @@
|
||||
.counterContainer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
}
|
||||
.counterBtn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
.counterBtn:not([disabled]) {
|
||||
box-shadow: 0px 0px 8px 1px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
@@ -0,0 +1,55 @@
|
||||
"use client"
|
||||
|
||||
import Body from "@scandic-hotels/design-system/Body"
|
||||
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
|
||||
import { OldDSButton as Button } from "@scandic-hotels/design-system/OldDSButton"
|
||||
|
||||
import styles from "./counter.module.css"
|
||||
|
||||
type CounterProps = {
|
||||
count: number
|
||||
handleOnIncrease: () => void
|
||||
handleOnDecrease: () => void
|
||||
disableIncrease: boolean
|
||||
disableDecrease: boolean
|
||||
}
|
||||
|
||||
export default function Counter({
|
||||
count,
|
||||
handleOnIncrease,
|
||||
handleOnDecrease,
|
||||
disableIncrease,
|
||||
disableDecrease,
|
||||
}: CounterProps) {
|
||||
return (
|
||||
<div className={styles.counterContainer}>
|
||||
<Button
|
||||
className={styles.counterBtn}
|
||||
intent="inverted"
|
||||
onClick={handleOnDecrease}
|
||||
size="small"
|
||||
theme="base"
|
||||
variant="icon"
|
||||
wrapping={true}
|
||||
disabled={disableDecrease}
|
||||
>
|
||||
<MaterialIcon icon="remove" color="CurrentColor" />
|
||||
</Button>
|
||||
<Body color="baseTextHighContrast" textAlign="center">
|
||||
{count}
|
||||
</Body>
|
||||
<Button
|
||||
className={styles.counterBtn}
|
||||
onClick={handleOnIncrease}
|
||||
intent="inverted"
|
||||
variant="icon"
|
||||
theme="base"
|
||||
wrapping={true}
|
||||
size="small"
|
||||
disabled={disableIncrease}
|
||||
>
|
||||
<MaterialIcon icon="add" color="CurrentColor" />
|
||||
</Button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user