Skip to content

Commit

Permalink
feat(D3 plugin): add splitTooltip property (#539)
Browse files Browse the repository at this point in the history
* refactor: add typed SplitPane

* feat(D3 plugin): add splitTooltip property

* chore: remove Gravity Charts stories from development mode

* chore: remove temporary property from hc stories

* fix: review fixes
  • Loading branch information
korvin89 authored Nov 20, 2024
1 parent 4412abf commit d5f970a
Show file tree
Hide file tree
Showing 25 changed files with 1,071 additions and 51 deletions.
16 changes: 11 additions & 5 deletions .storybook/main.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,17 @@ const config: StorybookConfig = {
{name: '@storybook/addon-essentials', options: {backgrounds: false}},
'./theme-addon/register.tsx',
],
refs: {
'gravity-charts': {
title: 'Gravity Charts',
url: 'https://preview.gravity-ui.com/charts',
},
refs: (_config, {configType}) => {
if (configType !== 'PRODUCTION') {
return {} as Record<string, {title: string; url: string}>;
}

return {
'gravity-charts': {
title: 'Gravity Charts',
url: 'https://preview.gravity-ui.com/charts',
},
};
},
};

Expand Down
88 changes: 56 additions & 32 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 2 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -47,13 +47,12 @@
],
"dependencies": {
"@bem-react/classname": "^1.6.0",
"@gravity-ui/charts": "^0.2.0",
"@gravity-ui/charts": "^0.4.0",
"@gravity-ui/date-utils": "^2.1.0",
"@gravity-ui/i18n": "^1.0.0",
"@gravity-ui/yagr": "^4.3.4",
"afterframe": "^1.0.2",
"lodash": "^4.17.21",
"react-split-pane": "^0.1.92",
"tslib": "^2.6.2"
},
"devDependencies": {
Expand All @@ -64,7 +63,7 @@
"@gravity-ui/prettier-config": "^1.1.0",
"@gravity-ui/stylelint-config": "^4.0.1",
"@gravity-ui/tsconfig": "^1.0.0",
"@gravity-ui/uikit": "^6.0.0",
"@gravity-ui/uikit": "^6.35.2",
"@jest/types": "^29.6.3",
"@playwright/experimental-ct-react17": "^1.41.1",
"@storybook/addon-actions": "^7.6.14",
Expand Down
46 changes: 46 additions & 0 deletions src/components/SplitPane/Pane.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
// Copyright 2015 tomkp
// Copyright 2022 YANDEX LLC

import React from 'react';

import type {SplitLayoutType} from './types';

type Props = {
className?: string;
children?: React.ReactNode;
size?: number | string;
split?: SplitLayoutType;
style?: React.CSSProperties;
eleRef?: (node: HTMLDivElement) => void;
};

export class Pane extends React.PureComponent<Props> {
render() {
const {children, className, split, style: styleProps, size, eleRef} = this.props;
const classes = ['Pane', split, className];

let style: React.CSSProperties = {
flex: 1,
position: 'relative',
outline: 'none',
};

if (size !== undefined) {
if (split === 'vertical') {
style.width = size;
} else {
style.height = size;
style.display = 'flex';
}
style.flex = 'none';
}

style = Object.assign({}, style, styleProps || {});

return (
<div ref={eleRef} className={classes.join(' ')} style={style}>
{children}
</div>
);
}
}
65 changes: 65 additions & 0 deletions src/components/SplitPane/Resizer.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
// Copyright 2015 tomkp
// Copyright 2022 YANDEX LLC

import React from 'react';

import type {SplitLayoutType} from './types';

export const RESIZER_DEFAULT_CLASSNAME = 'Resizer';

type Props = {
onMouseDown: React.MouseEventHandler;
onTouchStart: React.TouchEventHandler;
onTouchEnd: React.TouchEventHandler;
className?: string;
split?: SplitLayoutType;
style?: React.CSSProperties;
resizerClassName?: string;
onClick?: React.MouseEventHandler;
onDoubleClick?: React.MouseEventHandler;
};

export class Resizer extends React.Component<Props> {
render() {
const {
className,
onClick,
onDoubleClick,
onMouseDown,
onTouchEnd,
onTouchStart,
resizerClassName = RESIZER_DEFAULT_CLASSNAME,
split,
style,
} = this.props;
const classes = [resizerClassName, split, className];

return (
<span
role="presentation"
className={classes.join(' ')}
style={style}
onMouseDown={(event) => onMouseDown(event)}
onTouchStart={(event) => {
onTouchStart(event);
}}
onTouchEnd={(event) => {
event.preventDefault();
onTouchEnd(event);
}}
onClick={(event) => {
if (onClick) {
event.preventDefault();
onClick(event);
}
}}
onDoubleClick={(event) => {
if (onDoubleClick) {
event.preventDefault();
onDoubleClick(event);
}
}}
/>
);
}
}
Loading

0 comments on commit d5f970a

Please sign in to comment.