2022-06-07 11:41:26 +00:00
|
|
|
import classNames from "classnames"
|
2022-06-06 01:15:44 +00:00
|
|
|
import { ReactNode } from "react"
|
|
|
|
|
|
|
|
type FormDateRangeProps = {
|
2022-06-07 11:41:26 +00:00
|
|
|
preview: boolean,
|
2022-06-06 01:15:44 +00:00
|
|
|
icon: ReactNode,
|
|
|
|
start: ReactNode,
|
|
|
|
connector: ReactNode,
|
|
|
|
end: ReactNode,
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2022-06-09 21:50:11 +00:00
|
|
|
export function FormFromTo(props: FormDateRangeProps) {
|
2022-06-06 01:15:44 +00:00
|
|
|
return (
|
2022-06-07 11:41:26 +00:00
|
|
|
<div className={classNames({
|
2022-06-09 21:50:11 +00:00
|
|
|
"form-fromto": true,
|
|
|
|
"form-fromto-preview": props.preview,
|
2022-06-07 11:41:26 +00:00
|
|
|
})}>
|
2022-06-09 21:50:11 +00:00
|
|
|
<div className="form-fromto-icon">
|
2022-06-06 01:15:44 +00:00
|
|
|
{props.icon}
|
|
|
|
</div>
|
2022-06-09 21:50:11 +00:00
|
|
|
<div className="form-fromto-start">
|
2022-06-06 01:15:44 +00:00
|
|
|
{props.start}
|
|
|
|
</div>
|
2022-06-09 21:50:11 +00:00
|
|
|
<div className="form-fromto-connector">
|
2022-06-06 01:15:44 +00:00
|
|
|
{props.connector}
|
|
|
|
</div>
|
2022-06-09 21:50:11 +00:00
|
|
|
<div className="form-fromto-end">
|
2022-06-06 01:15:44 +00:00
|
|
|
{props.end}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
)
|
|
|
|
}
|