Skip to content

N
nexpie-grafana-theme
Commit 79c6fdc0 by Dominik Prokop
Options

wip

parent 22c9ce7d
Showing with 46 additions and 28 deletions
packages/grafana-ui/package.json
......@@ -11,6 +11,8 @@
"license": "ISC",
"dependencies": {
"@torkelo/react-select": "2.1.1",
"@types/react-test-renderer": "^16.0.3",
"@types/react-transition-group": "^2.0.15",
"classnames": "^2.2.5",
"jquery": "^3.2.1",
"lodash": "^4.17.10",
......@@ -23,11 +25,11 @@
"react-virtualized": "^9.21.0"
},
"devDependencies": {
"@types/classnames": "^2.2.6",
"@types/jest": "^23.3.2",
"@types/jquery": "^1.10.35",
"@types/lodash": "^4.14.119",
"@types/react": "^16.7.6",
"@types/classnames": "^2.2.6",
"@types/jquery": "^1.10.35",
"typescript": "^3.2.2"
}
}
public/app/core/components/Tooltip/Tooltip.test.tsx → packages/grafana-ui/src/components/Tooltip/Tooltip.test.tsx
import React from 'react';
import renderer from 'react-test-renderer';
import Tooltip from './Tooltip';
import { Tooltip } from './Tooltip';
describe('Tooltip', () => {
it('renders correctly', () => {
const tree = renderer
.create(
<Tooltip placement="auto" content="Tooltip text">
<a className="test-class" href="http://www.grafana.com">Link with tooltip</a>
<Tooltip placement="auto" content="Tooltip text">
<a className="test-class" href="http://www.grafana.com">
Link with tooltip
</a>
</Tooltip>
)
.toJSON();
......
public/app/core/components/Tooltip/Tooltip.tsx → packages/grafana-ui/src/components/Tooltip/Tooltip.tsx
import React, { createRef } from 'react';
import * as PopperJS from 'popper.js';
import Popper from './Popper';
import PopperController, { UsingPopperProps } from './PopperController';
const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperProps) => {
export const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperProps) => {
const tooltipTriggerRef = createRef<PopperJS.ReferenceObject>();
return (
......@@ -12,12 +11,14 @@ const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperPro
{(showPopper, hidePopper, popperProps) => {
return (
<>
<Popper
{...popperProps}
onMouseEnter={showPopper}
onMouseLeave={hidePopper}
referenceElement={tooltipTriggerRef.current}
/>
{tooltipTriggerRef.current && (
<Popper
{...popperProps}
onMouseEnter={showPopper}
onMouseLeave={hidePopper}
referenceElement={tooltipTriggerRef.current}
/>
)}
{React.cloneElement(children, {
ref: tooltipTriggerRef,
onMouseEnter: showPopper,
......@@ -29,5 +30,3 @@ const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperPro
</PopperController>
);
};
export default Tooltip;
packages/grafana-ui/src/components/index.scss
@import 'DeleteButton/DeleteButton';
@import 'Tooltip/Tooltip';
packages/grafana-ui/src/components/index.ts
export { DeleteButton } from './DeleteButton/DeleteButton';
export { Tooltip } from './Tooltip/Tooltip';
public/app/core/components/Label/Label.tsx
import React, { SFC, ReactNode } from 'react';
import Tooltip from '../Tooltip/Tooltip';
import { Tooltip } from '@grafana/ui';
interface Props {
tooltip?: string;
......
public/app/core/components/ToggleButtonGroup/ToggleButtonGroup.tsx
import React, { SFC, ReactNode, PureComponent } from 'react';
import Tooltip from 'app/core/components/Tooltip/Tooltip';
import { Tooltip } from '@grafana/ui';
interface ToggleButtonGroupProps {
label?: string;
......
public/app/features/dashboard/dashgrid/DataSourceOption.tsx
import React, { SFC } from 'react';
import Tooltip from 'app/core/components/Tooltip/Tooltip';
import { Tooltip } from '@grafana/ui';
interface Props {
label: string;
......
public/app/features/dashboard/dashgrid/PanelEditor.tsx
......@@ -15,7 +15,7 @@ import { PanelModel } from '../panel_model';
import { DashboardModel } from '../dashboard_model';
import { PanelPlugin } from 'app/types/plugins';
import Tooltip from 'app/core/components/Tooltip/Tooltip';
import { Tooltip } from '@grafana/ui';
interface PanelEditorProps {
panel: PanelModel;
......
public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx
import React, { Component } from 'react';
import Remarkable from 'remarkable';
import { Tooltip } from '@grafana/ui';
import { PanelModel } from 'app/features/dashboard/panel_model';
import Tooltip from 'app/core/components/Tooltip/Tooltip';
import templateSrv from 'app/features/templating/template_srv';
import { LinkSrv } from 'app/features/dashboard/panellinks/link_srv';
import { getTimeSrv, TimeSrv } from 'app/features/dashboard/time_srv';
import Remarkable from 'remarkable';
enum InfoModes {
Error = 'Error',
......@@ -78,7 +78,7 @@ export class PanelHeaderCorner extends Component<Props> {
{infoMode === InfoModes.Info || infoMode === InfoModes.Links ? (
<Tooltip
content={this.getInfoContent}
placement="bottom-start"
placement="bottom-start"
>
<div
className={`panel-info-corner panel-info-corner--${infoMode.toLowerCase()}`}
......
public/app/features/dashboard/permissions/DashboardPermissions.tsx
import React, { PureComponent } from 'react';
import Tooltip from 'app/core/components/Tooltip/Tooltip';
import { Tooltip } from '@grafana/ui';
import SlideDown from 'app/core/components/Animations/SlideDown';
import { StoreState, FolderInfo } from 'app/types';
import { DashboardAcl, PermissionLevel, NewDashboardAclItem } from 'app/types/acl';
......
public/app/features/folders/FolderPermissions.tsx
......@@ -2,7 +2,7 @@ import React, { PureComponent } from 'react';
import { hot } from 'react-hot-loader';
import { connect } from 'react-redux';
import PageHeader from 'app/core/components/PageHeader/PageHeader';
import Tooltip from 'app/core/components/Tooltip/Tooltip';
import { Tooltip } from '@grafana/ui';
import SlideDown from 'app/core/components/Animations/SlideDown';
import { getNavModel } from 'app/core/selectors/navModel';
import { NavModel, StoreState, FolderState } from 'app/types';
......
public/app/features/teams/TeamGroupSync.tsx
import React, { PureComponent } from 'react';
import { connect } from 'react-redux';
import SlideDown from 'app/core/components/Animations/SlideDown';
import Tooltip from 'app/core/components/Tooltip/Tooltip';
import { Tooltip } from '@grafana/ui';
import { TeamGroup } from '../../types';
import { addTeamGroup, loadTeamGroups, removeTeamGroup } from './state/actions';
import { getTeamGroups } from './state/selectors';
......
public/sass/_grafana.scss
......@@ -97,7 +97,6 @@
@import 'components/page_header';
@import 'components/dashboard_settings';
@import 'components/empty_list_cta';
@import 'components/popper';
@import 'components/form_select_box';
@import 'components/panel_editor';
@import 'components/toolbar';
......
yarn.lock
......@@ -1091,6 +1091,13 @@
"@types/react-dom" "*"
"@types/react-transition-group" "*"
"@types/react-test-renderer@^16.0.3":
version "16.0.3"
resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-16.0.3.tgz#cce5c983d66cc5c3582e7c2f44b274ab635a8acc"
integrity sha512-NWOAxVQeJxpXuNKgw83Hah0nquiw1nUexM9qY/Hk3a+XhZwgMtaa6GLA9E1TKMT75Odb3/KE/jiBO4enTuEJjQ==
dependencies:
"@types/react" "*"
"@types/react-transition-group@*":
version "2.0.14"
resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-2.0.14.tgz#afd0cd785a97f070b55765e9f9d76ff568269001"
......@@ -1098,7 +1105,14 @@
dependencies:
"@types/react" "*"
"@types/react@*", "@types/react@16.7.6", "@types/react@^16.1.0", "@types/react@^16.7.6":
"@types/react-transition-group@^2.0.15":
version "2.0.15"
resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-2.0.15.tgz#e5ee3fe558832e141cc6041bdd54caea7b787af8"
integrity sha512-S0QnNzbHoWXDbKBl/xk5dxA4FT+BNlBcI3hku991cl8Cz3ytOkUMcCRtzdX11eb86E131bSsQqy5WrPCdJYblw==
dependencies:
"@types/react" "*"
"@types/react@*", "@types/react@^16.1.0", "@types/react@^16.7.6":
version "16.7.6"
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.7.6.tgz#80e4bab0d0731ad3ae51f320c4b08bdca5f03040"
integrity sha512-QBUfzftr/8eg/q3ZRgf/GaDP6rTYc7ZNem+g4oZM38C9vXyV8AWRWaTQuW5yCoZTsfHrN7b3DeEiUnqH9SrnpA==
......@@ -3161,7 +3175,7 @@ caniuse-api@^1.5.2:
lodash.memoize "^4.1.2"
lodash.uniq "^4.5.0"
caniuse-db@1.0.30000772, caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634, caniuse-db@^1.0.30000639:
caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634, caniuse-db@^1.0.30000639:
version "1.0.30000772"
resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000772.tgz#51aae891768286eade4a3d8319ea76d6a01b512b"
integrity sha1-UarokXaChureSj2DGep21qAbUSs=
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment