From 316017470167efe77d919bc82bf0bd0070d71ebb Mon Sep 17 00:00:00 2001 From: Pontus Dreij Date: Tue, 8 Oct 2024 08:57:19 +0200 Subject: [PATCH] feat(SW-350): Created Input field for booking widget --- .../BookingWidget/FormContent/Input/index.tsx | 22 ++++++++++ .../FormContent/Search/index.tsx | 44 +++++++++---------- .../FormContent/Search/search.module.css | 22 +++------- .../FormContent/Voucher/index.tsx | 16 +++---- .../Forms/BookingWidget/FormContent/index.tsx | 18 +++----- 5 files changed, 62 insertions(+), 60 deletions(-) create mode 100644 components/Forms/BookingWidget/FormContent/Input/index.tsx diff --git a/components/Forms/BookingWidget/FormContent/Input/index.tsx b/components/Forms/BookingWidget/FormContent/Input/index.tsx new file mode 100644 index 000000000..762d48cf3 --- /dev/null +++ b/components/Forms/BookingWidget/FormContent/Input/index.tsx @@ -0,0 +1,22 @@ +import React, { forwardRef, InputHTMLAttributes } from "react" + +import Body from "@/components/TempDesignSystem/Text/Body" + +import styles from "./input.module.css" + +const Input = forwardRef< + HTMLInputElement, + InputHTMLAttributes +>(function InputComponent(props, ref) { + return ( + + + + ) +}) + +export default Input diff --git a/components/Forms/BookingWidget/FormContent/Search/index.tsx b/components/Forms/BookingWidget/FormContent/Search/index.tsx index c6d69d45b..8ecd56e6b 100644 --- a/components/Forms/BookingWidget/FormContent/Search/index.tsx +++ b/components/Forms/BookingWidget/FormContent/Search/index.tsx @@ -13,10 +13,10 @@ import { useIntl } from "react-intl" import Body from "@/components/TempDesignSystem/Text/Body" import Caption from "@/components/TempDesignSystem/Text/Caption" +import Input from "../Input" import { init, localStorageKey, reducer, sessionStorageKey } from "./reducer" import SearchList from "./SearchList" -import inputStyles from "../Input/input.module.css" import styles from "./search.module.css" import type { BookingWidgetSchema } from "@/types/components/bookingWidget" @@ -143,29 +143,27 @@ export default function Search({ locations }: SearchProps) {
- - - + onChange: handleOnChange, + }), + type: "search", + })} + />
-
+
- - - + +
- - {rooms} - - - - + +