@gravity-ui/chartkit 6.1.1 → 7.0.0

package/build/plugins/{d3 → gravity-charts}/index.d.ts

@@ -6,4 +6,4 @@ export * from './types';
  *
  * DO NOT USE IT IN YOUR PRODUCTION
  * */
-export declare const D3Plugin: ChartKitPlugin;
+export declare const GravityChartsPlugin: ChartKitPlugin;

package/build/plugins/{d3 → gravity-charts}/index.js

@@ -6,8 +6,7 @@ export * from './types';
  *
  * DO NOT USE IT IN YOUR PRODUCTION
  * */
-export const D3Plugin = {
-    // TODO: rename to 'gravity-chart' in the next major
-    type: 'd3',
-    renderer: React.lazy(() => import('./renderer/D3Widget')),
+export const GravityChartsPlugin = {
+    type: 'gravity-charts',
+    renderer: React.lazy(() => import('./renderer/GravityChartsWidget')),
 };

package/build/plugins/{d3/renderer/D3Widget.d.ts → gravity-charts/renderer/GravityChartsWidget.d.ts}

@@ -1,13 +1,13 @@
 import React from 'react';
 import type { ChartKitWidgetRef } from '../../../types';
-declare const D3Widget: React.ForwardRefExoticComponent<{
-    type: "d3";
+export declare const GravityChartsWidget: React.ForwardRefExoticComponent<{
+    type: "gravity-charts";
     data: import("@gravity-ui/charts").ChartData<any>;
     id?: string | undefined;
     isMobile?: boolean | undefined;
-    onLoad?: ((data?: import("../../../types").ChartKitOnLoadData<"d3"> | undefined) => void) | undefined;
+    onLoad?: ((data?: import("../../../types").ChartKitOnLoadData<"gravity-charts"> | undefined) => void) | undefined;
     onRender?: ((data: import("../../../types").ChartKitOnRenderData) => void) | undefined;
-    onChartLoad?: ((data: import("../../../types").ChartKitOnChartLoad<"d3">) => void) | undefined;
+    onChartLoad?: ((data: import("../../../types").ChartKitOnChartLoad<"gravity-charts">) => void) | undefined;
     onError?: import("../../../types").ChartKitOnError | undefined;
     renderError?: import("../../../types").RenderError | undefined;
     renderPluginLoader?: import("../../../types").ChartKitRenderPluginLoader | undefined;
@@ -16,4 +16,4 @@ declare const D3Widget: React.ForwardRefExoticComponent<{
         splitted?: boolean | undefined;
     } | undefined;
 } & React.RefAttributes<ChartKitWidgetRef | undefined>>;
-export default D3Widget;
+export default GravityChartsWidget;

package/build/plugins/{d3/renderer/D3Widget.js → gravity-charts/renderer/GravityChartsWidget.js}

@@ -5,7 +5,7 @@ import { settings } from '../../../libs';
 import { measurePerformance } from '../../../utils';
 import { withSplitPane } from './withSplitPane/withSplitPane';
 const ChartWithSplitPane = withSplitPane(Chart);
-const D3Widget = React.forwardRef(function D3Widget(props, forwardedRef) {
+export const GravityChartsWidget = React.forwardRef(function GravityChartsWidget(props, forwardedRef) {
     const { data, tooltip, onLoad, onRender, onChartLoad } = props;
     const lang = settings.get('lang');
     const performanceMeasure = React.useRef(measurePerformance());
@@ -43,4 +43,4 @@ const D3Widget = React.forwardRef(function D3Widget(props, forwardedRef) {
     }, [onChartLoad]);
     return React.createElement(ChartComponent, { ref: chartRef, data: data, lang: lang, onResize: handleResize });
 });
-export default D3Widget;
+export default GravityChartsWidget;

package/build/plugins/{d3 → gravity-charts}/renderer/withSplitPane/withSplitPane.js

@@ -7,6 +7,7 @@ import { usePrevious } from '../../../../hooks';
 import { isScreenOrientationEventType } from '../../../../utils';
 import { TooltipContent } from './TooltipContent';
 import { RESIZER_HEIGHT, getVerticalSize, useWithSplitPaneState } from './useWithSplitPaneState';
+const tooltipPaneStyles = { overflow: 'auto' };
 export function withSplitPane(ChartComponent) {
     const componentName = getComponentName(ChartComponent);
     const component = React.forwardRef(function WithSplitPaneComponent(props, _ref) {
@@ -93,7 +94,7 @@ export function withSplitPane(ChartComponent) {
         }, [handleOrientationChange, handleScreenOrientationChange]);
         return (React.createElement("div", { ref: containerRef, style: { position: 'relative', height: '100%' } },
             React.createElement(StyledSplitPane, { allowResize: allowResize, maxSize: maxSize, minSize: minSize, size: size, split: split, onChange: handleSizeChange, paneOneRender: () => (React.createElement(ChartComponent, Object.assign({}, restProps, { ref: chartRef, data: resultData }))), paneTwoRender: () => (React.createElement("div", { ref: tooltipContainerRef },
-                    React.createElement(TooltipContent, { ref: tooltipRef, renderer: resultData.tooltip.renderer }))) })));
+                    React.createElement(TooltipContent, { ref: tooltipRef, renderer: resultData.tooltip.renderer }))), pane2Style: tooltipPaneStyles })));
     });
     component.displayName = `withSplitPane(${componentName})`;
     return component;

package/build/plugins/{d3 → gravity-charts}/types.d.ts

@@ -1,4 +1,4 @@
 import type { ChartData } from '@gravity-ui/charts';
-export type D3WidgetData = {
+export type GravityChartsWidgetData = {
     data: ChartData;
 };

package/build/plugins/highcharts/renderer/components/withSplitPane/withSplitPane.js

@@ -13,6 +13,7 @@ const CHART_SECTION_PERCENTAGE = 0.6;
 const MIN_TOOLTIP_SECTION_HEIGHT = 62;
 const seriesTypesNeedsOnlyHoverState = ['line', 'area', 'arearange', 'bubble', 'map'];
 const deviceWithNavBarHeight = window.innerHeight;
+const tooltipPaneStyles = { overflow: 'auto' };
 function getPointsForInitialRefresh(chart) {
     let minX = Infinity;
     let points = null;
@@ -202,12 +203,12 @@ export const withSplitPane = (ComposedComponent) => {
         renderHorizontal() {
             const { paneSize, maxPaneSize, componentKey } = this.state;
             const thirdOfViewport = window.innerHeight / 3;
-            return (React.createElement(StyledSplitPane, { split: "horizontal", onChange: this.debouncedHandlePaneChange, minSize: thirdOfViewport, maxSize: maxPaneSize || undefined, size: paneSize, paneOneRender: () => (React.createElement(ComposedComponent, Object.assign({}, this.props, { key: componentKey, ref: this.props.forwardedRef, callback: this.afterCreateCallback }))), paneTwoRender: () => React.createElement("div", { ref: this.tooltipContainerRef }) }));
+            return (React.createElement(StyledSplitPane, { split: "horizontal", onChange: this.debouncedHandlePaneChange, minSize: thirdOfViewport, maxSize: maxPaneSize || undefined, size: paneSize, paneOneRender: () => (React.createElement(ComposedComponent, Object.assign({}, this.props, { key: componentKey, ref: this.props.forwardedRef, callback: this.afterCreateCallback }))), paneTwoRender: () => React.createElement("div", { ref: this.tooltipContainerRef }), pane2Style: tooltipPaneStyles }));
         }
         renderVertical() {
             const { componentKey } = this.state;
             const paneSize = window.innerWidth * CHART_SECTION_PERCENTAGE;
-            return (React.createElement(StyledSplitPane, { split: "vertical", allowResize: false, size: paneSize, paneOneRender: () => (React.createElement(ComposedComponent, Object.assign({}, this.props, { key: componentKey, ref: this.props.forwardedRef, callback: this.afterCreateCallback }))), paneTwoRender: () => React.createElement("div", { ref: this.tooltipContainerRef }) }));
+            return (React.createElement(StyledSplitPane, { split: "vertical", allowResize: false, size: paneSize, paneOneRender: () => (React.createElement(ComposedComponent, Object.assign({}, this.props, { key: componentKey, ref: this.props.forwardedRef, callback: this.afterCreateCallback }))), paneTwoRender: () => React.createElement("div", { ref: this.tooltipContainerRef }), pane2Style: tooltipPaneStyles }));
         }
     }
     return React.forwardRef((props, ref) => {

package/build/types/widget.d.ts

@@ -32,7 +32,7 @@ export interface ChartKitWidget {
             forceUpdate: boolean;
         }, callExternalOnChange?: boolean) => void;
     };
-    d3: {
+    'gravity-charts': {
         data: ChartData;
         widget: never;
         tooltip?: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/chartkit",
-  "version": "6.1.1",
+  "version": "7.0.0",
   "description": "React component used to render charts based on any sources you need",
   "license": "MIT",
   "repository": "git@github.com:gravity-ui/ChartKit.git",
@@ -8,7 +8,7 @@
   "types": "build/index.d.ts",
   "exports": {
     ".": "./build/index.js",
-    "./d3": "./build/plugins/d3/index.js",
+    "./gravity-charts": "./build/plugins/gravity-charts/index.js",
     "./highcharts": "./build/plugins/highcharts/index.js",
     "./indicator": "./build/plugins/indicator/index.js",
     "./yagr": "./build/plugins/yagr/index.js"
@@ -18,8 +18,8 @@
       "index.d.ts": [
         "./build/index.d.ts"
       ],
-      "d3": [
-        "./build/plugins/d3/index.d.ts"
+      "gravity-charts": [
+        "./build/plugins/gravity-charts/index.d.ts"
       ],
       "highcharts": [
         "./build/plugins/highcharts/index.d.ts"
@@ -47,7 +47,7 @@
   ],
   "dependencies": {
     "@bem-react/classname": "^1.6.0",
-    "@gravity-ui/charts": "^0.8.0",
+    "@gravity-ui/charts": "^1.0.1",
     "@gravity-ui/date-utils": "^2.1.0",
     "@gravity-ui/i18n": "^1.0.0",
     "@gravity-ui/yagr": "^4.7.1",