2019-10-20 16:59:02 +02:00
|
|
|
import React, { ReactNode } from "react";
|
|
|
|
|
import classNames from "classnames";
|
2019-01-29 11:06:11 +01:00
|
|
|
|
|
|
|
|
type Props = {
|
2019-10-19 16:38:07 +02:00
|
|
|
className?: string;
|
2019-10-20 16:59:02 +02:00
|
|
|
children: ReactNode;
|
2019-01-29 11:06:11 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
class ButtonGroup extends React.Component<Props> {
|
2019-02-07 09:29:53 +01:00
|
|
|
render() {
|
2019-06-20 14:57:00 +02:00
|
|
|
const { className, children } = this.props;
|
2019-06-20 13:40:12 +02:00
|
|
|
|
2019-10-20 16:59:02 +02:00
|
|
|
const childWrapper: ReactNode[] = [];
|
2019-06-20 14:57:00 +02:00
|
|
|
React.Children.forEach(children, child => {
|
|
|
|
|
if (child) {
|
2019-10-19 16:38:07 +02:00
|
|
|
childWrapper.push(
|
|
|
|
|
<div className="control" key={childWrapper.length}>
|
|
|
|
|
{child}
|
2019-10-20 16:59:02 +02:00
|
|
|
</div>
|
2019-10-19 16:38:07 +02:00
|
|
|
);
|
2019-06-20 14:57:00 +02:00
|
|
|
}
|
|
|
|
|
});
|
2019-06-20 13:40:12 +02:00
|
|
|
|
2019-01-29 11:06:11 +01:00
|
|
|
return (
|
2019-10-20 16:59:02 +02:00
|
|
|
<div className={classNames("field", "is-grouped", className)}>
|
2019-06-20 14:57:00 +02:00
|
|
|
{childWrapper}
|
2019-01-29 11:06:11 +01:00
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export default ButtonGroup;
|