49 lines
1.1 KiB
TypeScript
49 lines
1.1 KiB
TypeScript
import clsx from "clsx";
|
|
import { FC } from "react";
|
|
|
|
import { Select } from "~/components/Select";
|
|
import { SelectProps } from "~/components/Select/Select";
|
|
|
|
import styles from "./styles.module.css";
|
|
|
|
interface Props extends SelectProps {
|
|
label: string;
|
|
description?: string;
|
|
}
|
|
export const SelectField: FC<Props> = ({
|
|
value,
|
|
className,
|
|
description,
|
|
label,
|
|
options,
|
|
onChange,
|
|
onChangeConfirm,
|
|
hidePlaceholderOption,
|
|
placeholder,
|
|
name,
|
|
}) => {
|
|
return (
|
|
<div
|
|
className={clsx([styles.selectField, className])}
|
|
data-testid="select-field-container"
|
|
>
|
|
<div>
|
|
<label className={styles.label} htmlFor={name}>
|
|
{label}
|
|
</label>
|
|
{description && <div className={styles.description}>{description}</div>}
|
|
</div>
|
|
<Select
|
|
className={styles.field}
|
|
options={options}
|
|
onChange={onChange}
|
|
onChangeConfirm={onChangeConfirm}
|
|
value={value}
|
|
hidePlaceholderOption={hidePlaceholderOption}
|
|
placeholder={placeholder}
|
|
name={name}
|
|
/>
|
|
</div>
|
|
);
|
|
};
|