mirror of https://github.com/grafana/grafana
commit
a4d35e2fbc
@ -1,26 +1,38 @@ |
||||
// Libraries
|
||||
import React, { SFC } from 'react'; |
||||
import React, { FunctionComponent } from 'react'; |
||||
|
||||
interface Props { |
||||
title?: string; |
||||
onClose?: () => void; |
||||
children: JSX.Element | JSX.Element[]; |
||||
children: JSX.Element | JSX.Element[] | boolean; |
||||
onAdd?: () => void; |
||||
} |
||||
|
||||
export const PanelOptionsGroup: SFC<Props> = props => { |
||||
export const PanelOptionsGroup: FunctionComponent<Props> = props => { |
||||
return ( |
||||
<div className="panel-options-group"> |
||||
{props.title && ( |
||||
{props.onAdd ? ( |
||||
<div className="panel-options-group__header"> |
||||
{props.title} |
||||
{props.onClose && ( |
||||
<button className="btn btn-link" onClick={props.onClose}> |
||||
<i className="fa fa-remove" /> |
||||
</button> |
||||
)} |
||||
<button className="panel-options-group__add-btn" onClick={props.onAdd}> |
||||
<div className="panel-options-group__add-circle"> |
||||
<i className="fa fa-plus" /> |
||||
</div> |
||||
<span className="panel-options-group__title">{props.title}</span> |
||||
</button> |
||||
</div> |
||||
) : ( |
||||
props.title && ( |
||||
<div className="panel-options-group__header"> |
||||
<span className="panel-options-group__title">{props.title}</span> |
||||
{props.onClose && ( |
||||
<button className="btn btn-link" onClick={props.onClose}> |
||||
<i className="fa fa-remove" /> |
||||
</button> |
||||
)} |
||||
</div> |
||||
) |
||||
)} |
||||
<div className="panel-options-group__body">{props.children}</div> |
||||
{props.children && <div className="panel-options-group__body">{props.children}</div>} |
||||
</div> |
||||
); |
||||
}; |
||||
|
Loading…
Reference in new issue