45 lines
1.1 KiB
TypeScript
45 lines
1.1 KiB
TypeScript
// Copyright 2021 Signal Messenger, LLC
|
|
// SPDX-License-Identifier: AGPL-3.0-only
|
|
|
|
import React, { ChangeEvent } from 'react';
|
|
import classNames from 'classnames';
|
|
|
|
export type Option = Readonly<{
|
|
disabled?: boolean;
|
|
text: string;
|
|
value: string | number;
|
|
}>;
|
|
|
|
export type PropsType = Readonly<{
|
|
moduleClassName?: string;
|
|
options: ReadonlyArray<Option>;
|
|
onChange(value: string): void;
|
|
value: string | number;
|
|
}>;
|
|
|
|
export function Select(props: PropsType): JSX.Element {
|
|
const { moduleClassName, value, options, onChange } = props;
|
|
|
|
const onSelectChange = (event: ChangeEvent<HTMLSelectElement>) => {
|
|
onChange(event.target.value);
|
|
};
|
|
|
|
return (
|
|
<div className={classNames(['module-select', moduleClassName])}>
|
|
<select value={value} onChange={onSelectChange}>
|
|
{options.map(({ disabled, text, value: optionValue }) => {
|
|
return (
|
|
<option
|
|
disabled={disabled}
|
|
value={optionValue}
|
|
key={optionValue}
|
|
aria-label={text}
|
|
>
|
|
{text}
|
|
</option>
|
|
);
|
|
})}
|
|
</select>
|
|
</div>
|
|
);
|
|
}
|