mirror of
https://github.com/grafana/grafana.git
synced 2025-02-12 16:45:43 -06:00
546f569e0c
* Chore: Enable eslint react/display-name Enable react/display-name and fixed the corresponding linting issue part of: #29201 * Chore: Enable eslint react/no-deprecated Enable react/no-deprecated and add the UNSAFE_ prefix for deprected methods part of: #29201 * Chore: Enable eslint react/no-find-dom-node Enable react/no-find-dom-node rule and use ref instead part of: #29201 * Test: Update TeamGroupSync test snapshot Since we added the displayName for ToolTip compontent and tag name is changed. * Fix: Fixed ClickOutsideWrapper render The props.children might contains numbers of nodes which make cloneElement failed. Change to simply use a div to wrapper the children and assign the ref to div for this feature * Style: Use shorthand method definition style for inline component * Fix: Rebase master and fix linting Rebase from master branch and fix new displayName linting warning
58 lines
1.6 KiB
TypeScript
58 lines
1.6 KiB
TypeScript
import React from 'react';
|
|
import { ButtonProps, Elements } from '@jaegertracing/jaeger-ui-components';
|
|
import { Button, Input, stylesFactory, useTheme } from '@grafana/ui';
|
|
import { css } from 'emotion';
|
|
import { GrafanaTheme } from '@grafana/data';
|
|
import cx from 'classnames';
|
|
|
|
/**
|
|
* Right now Jaeger components need some UI elements to be injected. This is to get rid of AntD UI library that was
|
|
* used by default.
|
|
*/
|
|
|
|
// This needs to be static to prevent remounting on every render.
|
|
export const UIElements: Elements = {
|
|
Popover: (() => null as any) as any,
|
|
Tooltip: (() => null as any) as any,
|
|
Icon: (() => null as any) as any,
|
|
Dropdown: (() => null as any) as any,
|
|
Menu: (() => null as any) as any,
|
|
MenuItem: (() => null as any) as any,
|
|
Button({ onClick, children, className }: ButtonProps) {
|
|
return (
|
|
<Button variant={'secondary'} onClick={onClick} className={className}>
|
|
{children}
|
|
</Button>
|
|
);
|
|
},
|
|
Divider,
|
|
Input(props) {
|
|
return <Input {...props} />;
|
|
},
|
|
InputGroup({ children, className, style }) {
|
|
return (
|
|
<span className={className} style={style}>
|
|
{children}
|
|
</span>
|
|
);
|
|
},
|
|
};
|
|
|
|
const getStyles = stylesFactory((theme: GrafanaTheme) => {
|
|
return {
|
|
Divider: css`
|
|
display: inline-block;
|
|
background: ${theme.isDark ? '#242424' : '#e8e8e8'};
|
|
width: 1px;
|
|
height: 0.9em;
|
|
margin: 0 8px;
|
|
vertical-align: middle;
|
|
`,
|
|
};
|
|
});
|
|
|
|
function Divider({ className }: { className?: string }) {
|
|
const styles = getStyles(useTheme());
|
|
return <div style={{}} className={cx(styles.Divider, className)} />;
|
|
}
|