grafana/public/app/features/search/components/SearchCheckbox.tsx
Torkel Ödegaard 6f02b51561
Search: Improving search look and feel (#23854)
* Search: Improving search look and feel

* Fixed issue with tag filter beeing cramped and wrapping tags

* Minor tag polish

* fixed type
2020-04-24 19:23:45 +02:00

31 lines
691 B
TypeScript

import React, { FC, memo } from 'react';
import { css } from 'emotion';
import { Checkbox, stylesFactory } from '@grafana/ui';
interface Props {
checked?: boolean;
onClick: any;
editable?: boolean;
}
export const SearchCheckbox: FC<Props> = memo(({ onClick, checked = false, editable = false }) => {
const styles = getStyles();
return editable ? (
<div onClick={onClick} className={styles.wrapper}>
<Checkbox value={checked} />
</div>
) : null;
});
const getStyles = stylesFactory(() => ({
// Vertically align absolutely positioned checkbox element
wrapper: css`
height: 21px;
margin-right: 12px;
& > label {
height: 100%;
}
`,
}));