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

feat(SW-350): Created Input field for booking widget

Browse Source
This commit is contained in:
Pontus Dreij
2024-10-08 08:57:19 +02:00
parent af8d1b8d6e
commit 3160174701
5 changed files with 62 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
components/Forms/BookingWidget/FormContent/Search/index.tsx
View File

@@ -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) {
</Caption>
</label>
<div {...getRootProps({}, { suppressRefError: true })}>
<Body asChild>
<input
{...getInputProps({
className: `${styles.searchInput} ${inputStyles.input}`,
id: name,
onFocus(evt) {
handleOnFocus(evt)
openMenu()
<Input
{...getInputProps({
className: styles.input,
id: name,
onFocus(evt) {
handleOnFocus(evt)
openMenu()
},
placeholder: intl.formatMessage({
id: "Destinations & hotels",
}),
...register(name, {
onBlur: function () {
handleOnBlur()
closeMenu()
},
placeholder: intl.formatMessage({
id: "Destinations & hotels",
}),
...register(name, {
onBlur: function () {
handleOnBlur()
closeMenu()
},
onChange: handleOnChange,
}),
type: "search",
})}
/>
</Body>
onChange: handleOnChange,
}),
type: "search",
})}
/>
</div>
<SearchList
getItemProps={getItemProps}