47 lines
1.4 KiB
TypeScript
47 lines
1.4 KiB
TypeScript
|
/**
|
||
|
|
* Copyright (c) 2021 lingdocs.com
|
||
|
|
*
|
||
|
|
* This source code is licensed under the MIT license found in the
|
||
|
|
* LICENSE file in the root directory of this source tree.
|
||
|
|
*
|
||
|
|
*/
|
||
|
|
|
||
|
|
import classNames from "classnames";
|
||
|
|
|
||
|
|
type PickerProps = {
|
||
|
|
options: { label: any, value: string }[],
|
||
|
|
value: string,
|
||
|
|
handleChange: (payload: string) => void,
|
||
|
|
small?: boolean,
|
||
|
|
xSmall?: boolean,
|
||
|
|
}
|
||
|
|
|
||
|
|
function ButtonSelect(props: PickerProps) {
|
||
|
|
return (
|
||
|
|
<div className="d-inline-flex flex-row justify-content-center">
|
||
|
|
<div className="btn-group">
|
||
|
|
{props.options.map((option) => (
|
||
|
|
<button
|
||
|
|
key={option.value}
|
||
|
|
type="button"
|
||
|
|
className={classNames(
|
||
|
|
"btn",
|
||
|
|
"btn-outline-secondary",
|
||
|
|
{ active: props.value === option.value },
|
||
|
|
{ "btn-sm": props.small || props.xSmall }
|
||
|
|
)}
|
||
|
|
onClick={() => props.handleChange(option.value)}
|
||
|
|
style={props.xSmall ? {
|
||
|
|
fontSize: "small",
|
||
|
|
} : {}}
|
||
|
|
>
|
||
|
|
{option.label}
|
||
|
|
</button>
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export default ButtonSelect;
|