accounts-frontend/src/components/ui/Panel.jsx

77 lines
1.4 KiB
React
Raw Normal View History

import React from 'react';
import styles from './panel.scss';
import icons from './icons.scss';
export function Panel(props) {
var { title, icon } = props;
if (icon) {
icon = (
<button className={styles.headerControl}>
<span className={icons[icon]} />
</button>
);
}
if (title) {
title = (
<PanelHeader>
{icon}
{title}
</PanelHeader>
);
}
return (
<div className={styles.panel}>
{title}
{props.children}
</div>
);
}
export function PanelHeader(props) {
return (
<div className={styles.header} {...props}>
{props.children}
</div>
);
}
export function PanelBody(props) {
return (
<div className={styles.body} {...props}>
{props.children}
</div>
);
}
export function PanelFooter(props) {
return (
<div className={styles.footer} {...props}>
{props.children}
</div>
);
}
export function PanelBodyHeader(props) {
var { type = 'default' } = props;
var close;
if (type === 'error') {
close = (
<span className={styles.close} />
);
}
return (
<div className={styles[`${type}BodyHeader`]} {...props}>
{close}
{props.children}
</div>
);
}