@visactor/react-vchart 1.10.0-alpha.0 → 1.10.0-alpha.10

package/cjs/VChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/VChart.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAiE;AAEjE,8DAA0C;AACjC,qBADF,gBAAU,CACE;AAIN,QAAA,MAAM,GAAG,IAAA,uBAAW,EAAc,QAAQ,EAAE;IACvD,kBAAkB,EAAE,gBAAU;CAC/B,CAAC,CAAC","file":"VChart.js","sourcesContent":["import { BaseChartProps, createChart } from './charts/BaseChart';\nimport type { IVChartConstructor } from '@visactor/vchart';\nimport VChartCore from '@visactor/vchart';\nexport { VChartCore };\n\nexport type VChartProps = Omit<BaseChartProps, 'container' | 'data' | 'width' | 'height' | 'type'>;\n\nexport const VChart = createChart<VChartProps>('VChart', {\n  vchartConstrouctor: VChartCore\n});\n"]}
+{"version":3,"sources":["../src/VChart.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAiE;AACjE,8DAA0C;AACjC,qBADF,gBAAU,CACE;AAIN,QAAA,MAAM,GAAG,IAAA,uBAAW,EAAc,QAAQ,EAAE;IACvD,kBAAkB,EAAE,gBAAU;CAC/B,CAAC,CAAC","file":"VChart.js","sourcesContent":["import { BaseChartProps, createChart } from './charts/BaseChart';\nimport VChartCore from '@visactor/vchart';\nexport { VChartCore };\n\nexport type VChartProps = Omit<BaseChartProps, 'container' | 'data' | 'width' | 'height' | 'type'>;\n\nexport const VChart = createChart<VChartProps>('VChart', {\n  vchartConstrouctor: VChartCore\n});\n"]}

package/cjs/charts/BaseChart.d.ts

@@ -2,8 +2,9 @@ import type { IVChart, IData, IInitOption, ISpec, IVChartConstructor } from '@vi
 import React from 'react';
 import { ContainerProps } from '../containers/withContainer';
 import { EventsProps, LegendEventProps, ScrollBarEventProps, BrushEventProps, DataZoomEventProps, PlayerEventProps, DimensionEventProps, HierarchyEventProps, ChartLifeCycleEventProps } from '../eventsUtils';
+import { IReactTooltipProps } from '../components/tooltip/interface';
 export type ChartOptions = Omit<IInitOption, 'dom'>;
-export interface BaseChartProps extends EventsProps, LegendEventProps, ScrollBarEventProps, BrushEventProps, DataZoomEventProps, PlayerEventProps, DimensionEventProps, HierarchyEventProps, ChartLifeCycleEventProps {
+export interface BaseChartProps extends EventsProps, LegendEventProps, ScrollBarEventProps, BrushEventProps, DataZoomEventProps, PlayerEventProps, DimensionEventProps, HierarchyEventProps, ChartLifeCycleEventProps, IReactTooltipProps {
     vchartConstrouctor?: IVChartConstructor;
     type?: string;
     container?: HTMLDivElement;

package/cjs/charts/BaseChart.js

@@ -33,18 +33,32 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.createChart = void 0;
 
-const react_1 = __importStar(require("react")), withContainer_1 = __importDefault(require("../containers/withContainer")), chart_1 = __importDefault(require("../context/chart")), vutils_1 = require("@visactor/vutils"), view_1 = __importDefault(require("../context/view")), util_1 = require("../util"), constants_1 = require("../constants"), eventsUtils_1 = require("../eventsUtils"), notSpecKeys = [ ...constants_1.REACT_PRIVATE_PROPS, ...eventsUtils_1.CHART_EVENTS_KEYS, "skipFunctionDiff", "onError", "onReady", "spec", "container", "options" ], BaseChart = react_1.default.forwardRef(((props, ref) => {
-    const [updateId, setUpdateId] = (0, react_1.useState)(0), chartContext = (0, react_1.useRef)({
-        specFromChildren: {}
-    });
+const react_1 = __importStar(require("react")), withContainer_1 = __importDefault(require("../containers/withContainer")), chart_1 = __importDefault(require("../context/chart")), vutils_1 = require("@visactor/vutils"), view_1 = __importDefault(require("../context/view")), util_1 = require("../util"), constants_1 = require("../constants"), eventsUtils_1 = require("../eventsUtils"), util_2 = require("../components/tooltip/util"), notSpecKeys = [ ...constants_1.REACT_PRIVATE_PROPS, ...eventsUtils_1.CHART_EVENTS_KEYS, "vchartConstrouctor", "useSyncRender", "skipFunctionDiff", "onError", "onReady", "spec", "container", "options" ], getComponentId = (child, index) => `${child && child.type && (child.type.displayName || child.type.name)}-${index}`, parseSpecFromChildren = props => {
+    const specFromChildren = {};
+    return (0, util_1.toArray)(props.children).map(((child, index) => {
+        const parseSpec = child && child.type && child.type.parseSpec;
+        if (parseSpec && child.props) {
+            const specResult = parseSpec((0, vutils_1.isNil)(child.props.componentId) ? Object.assign(Object.assign({}, child.props), {
+                componentId: getComponentId(child, index)
+            }) : child.props);
+            specResult.isSingle ? specFromChildren[specResult.specName] = specResult.spec : (specFromChildren[specResult.specName] || (specFromChildren[specResult.specName] = []), 
+            specFromChildren[specResult.specName].push(specResult.spec));
+        }
+    })), specFromChildren;
+}, BaseChart = react_1.default.forwardRef(((props, ref) => {
+    const [updateId, setUpdateId] = (0, react_1.useState)(0), chartContext = (0, react_1.useRef)({});
     (0, react_1.useImperativeHandle)(ref, (() => {
         var _a;
         return null === (_a = chartContext.current) || void 0 === _a ? void 0 : _a.chart;
     }));
     const hasSpec = !!props.spec, [view, setView] = (0, react_1.useState)(null), isUnmount = (0, 
-    react_1.useRef)(!1), prevSpec = (0, react_1.useRef)((0, vutils_1.pickWithout)(props, notSpecKeys)), eventsBinded = react_1.default.useRef(null), skipFunctionDiff = !!props.skipFunctionDiff, parseSpec = props => {
-        var _a;
-        return hasSpec && props.spec ? props.spec : Object.assign(Object.assign({}, prevSpec.current), null === (_a = chartContext.current) || void 0 === _a ? void 0 : _a.specFromChildren);
+    react_1.useRef)(!1), prevSpec = (0, react_1.useRef)((0, vutils_1.pickWithout)(props, notSpecKeys)), specFromChildren = (0, 
+    react_1.useRef)(null), eventsBinded = react_1.default.useRef(null), skipFunctionDiff = !!props.skipFunctionDiff, [tooltipNode, setTooltipNode] = (0, 
+    react_1.useState)(null), parseSpec = props => {
+        let spec;
+        return spec = hasSpec && props.spec ? props.spec : Object.assign(Object.assign({}, prevSpec.current), specFromChildren.current), 
+        spec.tooltip = (0, util_2.initCustomTooltip)(setTooltipNode, props, spec.tooltip), 
+        spec;
     }, handleChartRender = () => {
         if (!isUnmount.current) {
             if (!chartContext.current || !chartContext.current.chart) return;
@@ -56,7 +70,9 @@ const react_1 = __importStar(require("react")), withContainer_1 = __importDefaul
     };
     return (0, react_1.useEffect)((() => {
         var _a;
-        if (!(null === (_a = chartContext.current) || void 0 === _a ? void 0 : _a.chart)) return (props => {
+        const newSpecFromChildren = hasSpec ? null : parseSpecFromChildren(props);
+        if (!(null === (_a = chartContext.current) || void 0 === _a ? void 0 : _a.chart)) return hasSpec || (specFromChildren.current = newSpecFromChildren), 
+        (props => {
             const cs = new props.vchartConstrouctor(parseSpec(props), Object.assign(Object.assign({}, props.options), {
                 onError: props.onError,
                 autoFit: !0,
@@ -64,13 +80,10 @@ const react_1 = __importStar(require("react")), withContainer_1 = __importDefaul
             }));
             chartContext.current = Object.assign(Object.assign({}, chartContext.current), {
                 chart: cs
-            });
+            }), isUnmount.current = !1;
         })(props), chartContext.current.chart && (chartContext.current.chart.renderSync({
             reuse: !1
-        }), handleChartRender()), (0, eventsUtils_1.bindEventsToChart)(chartContext.current.chart, props, null, eventsUtils_1.CHART_EVENTS), 
-        chartContext.current = Object.assign(Object.assign({}, chartContext.current), {
-            isChildrenUpdated: !1
-        }), void (eventsBinded.current = props);
+        }), handleChartRender()), void (eventsBinded.current = props);
         if (hasSpec) return void ((0, vutils_1.isEqual)(eventsBinded.current.spec, props.spec, {
             skipFunction: skipFunctionDiff
         }) || (eventsBinded.current = props, chartContext.current.chart.updateSpecSync(parseSpec(props), void 0, {
@@ -80,27 +93,28 @@ const react_1 = __importStar(require("react")), withContainer_1 = __importDefaul
         const newSpec = (0, vutils_1.pickWithout)(props, notSpecKeys);
         (0, vutils_1.isEqual)(newSpec, prevSpec.current, {
             skipFunction: skipFunctionDiff
-        }) && !chartContext.current.isChildrenUpdated || (prevSpec.current = newSpec, chartContext.current.chart.updateSpecSync(parseSpec(props), void 0, {
+        }) && (0, vutils_1.isEqual)(newSpecFromChildren, specFromChildren.current) || (prevSpec.current = newSpec, 
+        specFromChildren.current = newSpecFromChildren, chartContext.current.chart.updateSpecSync(parseSpec(props), void 0, {
             morph: !1,
             enableExitAnimation: !1
-        }), handleChartRender()), chartContext.current = Object.assign(Object.assign({}, chartContext.current), {
-            isChildrenUpdated: !1
-        });
+        }), handleChartRender());
     }), [ props ]), (0, react_1.useEffect)((() => () => {
-        chartContext && (chartContext.current.chart && chartContext.current.chart.release(), 
-        chartContext.current = null), isUnmount.current = !0;
+        chartContext && chartContext.current && chartContext.current.chart && (chartContext.current.chart.release(), 
+        chartContext.current.chart = null), eventsBinded.current = null, isUnmount.current = !0;
     }), []), react_1.default.createElement(chart_1.default.Provider, {
         value: chartContext.current
     }, react_1.default.createElement(view_1.default.Provider, {
         value: view
     }, (0, util_1.toArray)(props.children).map(((child, index) => {
-        var _a, _b, _c;
+        if ("string" == typeof child) return;
+        const childId = getComponentId(child, index);
         return react_1.default.createElement(react_1.default.Fragment, {
-            key: null !== (_c = null !== (_b = null === (_a = null == child ? void 0 : child.props) || void 0 === _a ? void 0 : _a.id) && void 0 !== _b ? _b : null == child ? void 0 : child.id) && void 0 !== _c ? _c : `child-${index}`
+            key: childId
         }, react_1.default.cloneElement(child, {
-            updateId: updateId
+            updateId: updateId,
+            componentId: childId
         }));
-    }))));
+    })), tooltipNode));
 })), createChart = (componentName, defaultProps, callback) => {
     const Com = (0, withContainer_1.default)(BaseChart, componentName, (props => callback ? callback(props, defaultProps) : defaultProps ? Object.assign(props, defaultProps) : props));
     return Com.displayName = componentName, Com;

package/cjs/charts/BaseChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/charts/BaseChart.tsx"],"names":[],"mappings":"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","file":"BaseChart.js","sourcesContent":["import type { IVChart, IData, IInitOption, ISpec, IVChartConstructor } from '@visactor/vchart';\nimport React, { useState, useEffect, useRef, useImperativeHandle } from 'react';\nimport withContainer, { ContainerProps } from '../containers/withContainer';\nimport RootChartContext, { ChartContextType } from '../context/chart';\nimport type { IView } from '@visactor/vgrammar-core';\nimport { isEqual, pickWithout } from '@visactor/vutils';\nimport ViewContext from '../context/view';\nimport { toArray } from '../util';\nimport { REACT_PRIVATE_PROPS } from '../constants';\nimport { IMarkElement } from '../components';\nimport {\n  bindEventsToChart,\n  EventsProps,\n  CHART_EVENTS_KEYS,\n  CHART_EVENTS,\n  LegendEventProps,\n  ScrollBarEventProps,\n  BrushEventProps,\n  DataZoomEventProps,\n  PlayerEventProps,\n  DimensionEventProps,\n  HierarchyEventProps,\n  ChartLifeCycleEventProps\n} from '../eventsUtils';\n\nexport type ChartOptions = Omit<IInitOption, 'dom'>;\n\nexport interface BaseChartProps\n  extends EventsProps,\n    LegendEventProps,\n    ScrollBarEventProps,\n    BrushEventProps,\n    DataZoomEventProps,\n    PlayerEventProps,\n    DimensionEventProps,\n    HierarchyEventProps,\n    ChartLifeCycleEventProps {\n  vchartConstrouctor?: IVChartConstructor;\n  type?: string;\n  /** 上层container */\n  container?: HTMLDivElement;\n  /**\n   * used only by <VChart />\n   */\n  spec?: ISpec;\n  /** 数据 */\n  data?: IData;\n  /** 画布宽度 */\n  width?: number;\n  /** 画布高度 */\n  height?: number;\n  /** 图表配置 */\n  options?: ChartOptions;\n  /** skip function diff when component update */\n  skipFunctionDiff?: boolean;\n  /** 图表渲染完成事件 */\n  onReady?: (instance: IVChart, isInitial: boolean) => void;\n  /** throw error when chart run into an error */\n  onError?: (err: Error) => void;\n  /**\n   * use sync render\n   *\n   * @since 1.8.3\n   * @deprecated 1.9.0\n   **/\n  useSyncRender?: boolean;\n}\n\ntype Props = React.PropsWithChildren<BaseChartProps>;\n\nconst notSpecKeys = [\n  ...REACT_PRIVATE_PROPS,\n  ...CHART_EVENTS_KEYS,\n  'skipFunctionDiff',\n  'onError',\n  'onReady',\n  'spec',\n  'container',\n  'options'\n];\n\nconst BaseChart: React.FC<Props> = React.forwardRef((props, ref) => {\n  const [updateId, setUpdateId] = useState<number>(0);\n  const chartContext = useRef<ChartContextType>({\n    specFromChildren: {}\n  });\n  useImperativeHandle(ref, () => chartContext.current?.chart);\n  const hasSpec = !!props.spec;\n  const [view, setView] = useState<IView>(null);\n  const isUnmount = useRef<boolean>(false);\n  const prevSpec = useRef(pickWithout(props, notSpecKeys));\n  const eventsBinded = React.useRef<BaseChartProps>(null);\n  const skipFunctionDiff = !!props.skipFunctionDiff;\n\n  const parseSpec = (props: Props) => {\n    if (hasSpec && props.spec) {\n      return props.spec;\n    }\n\n    return {\n      ...prevSpec.current,\n      ...chartContext.current?.specFromChildren\n    };\n  };\n\n  const createChart = (props: Props) => {\n    const cs = new props.vchartConstrouctor(parseSpec(props), {\n      ...props.options,\n      onError: props.onError,\n      autoFit: true,\n      dom: props.container\n    });\n    chartContext.current = { ...chartContext.current, chart: cs };\n  };\n\n  const handleChartRender = () => {\n    // rebind events after render\n    if (!isUnmount.current) {\n      if (!chartContext.current || !chartContext.current.chart) {\n        return;\n      }\n\n      bindEventsToChart(chartContext.current.chart, props, eventsBinded.current, CHART_EVENTS);\n\n      const newView = chartContext.current.chart.getCompiler().getVGrammarView();\n\n      setUpdateId(updateId + 1);\n      if (props.onReady) {\n        props.onReady(chartContext.current.chart, updateId === 0);\n      }\n      setView(newView);\n    }\n  };\n\n  const renderChart = () => {\n    if (chartContext.current.chart) {\n      chartContext.current.chart.renderSync({\n        reuse: false\n      });\n      handleChartRender();\n    }\n  };\n\n  useEffect(() => {\n    if (!chartContext.current?.chart) {\n      createChart(props);\n      renderChart();\n      bindEventsToChart(chartContext.current.chart, props, null, CHART_EVENTS);\n      chartContext.current = {\n        ...chartContext.current,\n        isChildrenUpdated: false\n      };\n      eventsBinded.current = props;\n      return;\n    }\n\n    if (hasSpec) {\n      if (!isEqual(eventsBinded.current.spec, props.spec, { skipFunction: skipFunctionDiff })) {\n        eventsBinded.current = props;\n        chartContext.current.chart.updateSpecSync(parseSpec(props), undefined, {\n          morph: false,\n          enableExitAnimation: false\n        });\n        handleChartRender();\n      }\n      return;\n    }\n\n    const newSpec = pickWithout(props, notSpecKeys);\n\n    if (\n      !isEqual(newSpec, prevSpec.current, { skipFunction: skipFunctionDiff }) ||\n      chartContext.current.isChildrenUpdated\n    ) {\n      prevSpec.current = newSpec;\n\n      chartContext.current.chart.updateSpecSync(parseSpec(props), undefined, {\n        morph: false,\n        enableExitAnimation: false\n      });\n      handleChartRender();\n    }\n    chartContext.current = {\n      ...chartContext.current,\n      isChildrenUpdated: false\n    };\n  }, [props]);\n\n  useEffect(() => {\n    return () => {\n      if (chartContext) {\n        if (chartContext.current.chart) {\n          chartContext.current.chart.release();\n        }\n        chartContext.current = null;\n      }\n      isUnmount.current = true;\n    };\n  }, []);\n\n  return (\n    <RootChartContext.Provider value={chartContext.current}>\n      <ViewContext.Provider value={view}>\n        {toArray(props.children).map((child, index) => {\n          return (\n            <React.Fragment key={(child as any)?.props?.id ?? (child as any)?.id ?? `child-${index}`}>\n              {React.cloneElement(child as IMarkElement, {\n                updateId: updateId\n              })}\n            </React.Fragment>\n          );\n        })}\n      </ViewContext.Provider>\n    </RootChartContext.Provider>\n  );\n});\n\nexport const createChart = <T extends Props>(\n  componentName: string,\n  defaultProps?: Partial<T>,\n  callback?: (props: T, defaultProps?: Partial<T>) => T\n) => {\n  const Com = withContainer<ContainerProps, T>(BaseChart as any, componentName, (props: T) => {\n    if (callback) {\n      return callback(props, defaultProps);\n    }\n\n    if (defaultProps) {\n      return Object.assign(props, defaultProps);\n    }\n    return props;\n  });\n  Com.displayName = componentName;\n  return Com;\n};\n"]}
+{"version":3,"sources":["../src/charts/BaseChart.tsx"],"names":[],"mappings":"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","file":"BaseChart.js","sourcesContent":["import type { IVChart, IData, IInitOption, ISpec, IVChartConstructor } from '@visactor/vchart';\nimport React, { useState, useEffect, useRef, useImperativeHandle, ReactNode } from 'react';\nimport withContainer, { ContainerProps } from '../containers/withContainer';\nimport RootChartContext, { ChartContextType } from '../context/chart';\nimport type { IView } from '@visactor/vgrammar-core';\nimport { isEqual, isNil, pickWithout } from '@visactor/vutils';\nimport ViewContext from '../context/view';\nimport { toArray } from '../util';\nimport { REACT_PRIVATE_PROPS } from '../constants';\nimport {\n  bindEventsToChart,\n  EventsProps,\n  CHART_EVENTS_KEYS,\n  CHART_EVENTS,\n  LegendEventProps,\n  ScrollBarEventProps,\n  BrushEventProps,\n  DataZoomEventProps,\n  PlayerEventProps,\n  DimensionEventProps,\n  HierarchyEventProps,\n  ChartLifeCycleEventProps\n} from '../eventsUtils';\nimport { IReactTooltipProps } from '../components/tooltip/interface';\nimport { initCustomTooltip } from '../components/tooltip/util';\n\nexport type ChartOptions = Omit<IInitOption, 'dom'>;\n\nexport interface BaseChartProps\n  extends EventsProps,\n    LegendEventProps,\n    ScrollBarEventProps,\n    BrushEventProps,\n    DataZoomEventProps,\n    PlayerEventProps,\n    DimensionEventProps,\n    HierarchyEventProps,\n    ChartLifeCycleEventProps,\n    IReactTooltipProps {\n  vchartConstrouctor?: IVChartConstructor;\n  type?: string;\n  /** 上层container */\n  container?: HTMLDivElement;\n  /**\n   * used only by <VChart />\n   */\n  spec?: ISpec;\n  /** 数据 */\n  data?: IData;\n  /** 画布宽度 */\n  width?: number;\n  /** 画布高度 */\n  height?: number;\n  /** 图表配置 */\n  options?: ChartOptions;\n  /** skip function diff when component update */\n  skipFunctionDiff?: boolean;\n  /** 图表渲染完成事件 */\n  onReady?: (instance: IVChart, isInitial: boolean) => void;\n  /** throw error when chart run into an error */\n  onError?: (err: Error) => void;\n  /**\n   * use sync render\n   *\n   * @since 1.8.3\n   * @deprecated 1.9.0\n   **/\n  useSyncRender?: boolean;\n}\n\ntype Props = React.PropsWithChildren<BaseChartProps>;\n\nconst notSpecKeys = [\n  ...REACT_PRIVATE_PROPS,\n  ...CHART_EVENTS_KEYS,\n  'vchartConstrouctor',\n  'useSyncRender',\n  'skipFunctionDiff',\n  'onError',\n  'onReady',\n  'spec',\n  'container',\n  'options'\n];\n\nconst getComponentId = (child: React.ReactNode, index: number) => {\n  const componentName = child && (child as any).type && ((child as any).type.displayName || (child as any).type.name);\n  return `${componentName}-${index}`;\n};\n\nconst parseSpecFromChildren = (props: Props) => {\n  const specFromChildren: Omit<ISpec, 'type' | 'data' | 'width' | 'height'> = {};\n\n  toArray(props.children).map((child, index) => {\n    const parseSpec = child && (child as any).type && (child as any).type.parseSpec;\n\n    if (parseSpec && (child as any).props) {\n      const childProps = isNil((child as any).props.componentId)\n        ? {\n            ...(child as any).props,\n            componentId: getComponentId(child, index)\n          }\n        : (child as any).props;\n\n      const specResult = parseSpec(childProps);\n\n      if (specResult.isSingle) {\n        specFromChildren[specResult.specName] = specResult.spec;\n      } else {\n        if (!specFromChildren[specResult.specName]) {\n          specFromChildren[specResult.specName] = [];\n        }\n\n        specFromChildren[specResult.specName].push(specResult.spec);\n      }\n    }\n  });\n\n  return specFromChildren;\n};\n\nconst BaseChart: React.FC<Props> = React.forwardRef((props, ref) => {\n  const [updateId, setUpdateId] = useState<number>(0);\n  const chartContext = useRef<ChartContextType>({});\n  useImperativeHandle(ref, () => chartContext.current?.chart);\n  const hasSpec = !!props.spec;\n  const [view, setView] = useState<IView>(null);\n  const isUnmount = useRef<boolean>(false);\n  const prevSpec = useRef(pickWithout(props, notSpecKeys));\n  const specFromChildren = useRef<Omit<ISpec, 'type' | 'data' | 'width' | 'height'>>(null);\n  const eventsBinded = React.useRef<BaseChartProps>(null);\n  const skipFunctionDiff = !!props.skipFunctionDiff;\n  const [tooltipNode, setTooltipNode] = useState<ReactNode>(null);\n\n  const parseSpec = (props: Props) => {\n    let spec: ISpec = undefined;\n\n    if (hasSpec && props.spec) {\n      spec = props.spec;\n    } else {\n      spec = {\n        ...prevSpec.current,\n        ...specFromChildren.current\n      } as ISpec;\n    }\n\n    spec.tooltip = initCustomTooltip(setTooltipNode, props, spec.tooltip);\n    return spec;\n  };\n\n  const createChart = (props: Props) => {\n    const cs = new props.vchartConstrouctor(parseSpec(props), {\n      ...props.options,\n      onError: props.onError,\n      autoFit: true,\n      dom: props.container\n    });\n    chartContext.current = { ...chartContext.current, chart: cs };\n    isUnmount.current = false;\n  };\n\n  const handleChartRender = () => {\n    // rebind events after render\n    if (!isUnmount.current) {\n      if (!chartContext.current || !chartContext.current.chart) {\n        return;\n      }\n\n      bindEventsToChart(chartContext.current.chart, props, eventsBinded.current, CHART_EVENTS);\n\n      const newView = chartContext.current.chart.getCompiler().getVGrammarView();\n\n      setUpdateId(updateId + 1);\n      if (props.onReady) {\n        props.onReady(chartContext.current.chart, updateId === 0);\n      }\n      setView(newView);\n    }\n  };\n\n  const renderChart = () => {\n    if (chartContext.current.chart) {\n      chartContext.current.chart.renderSync({\n        reuse: false\n      });\n      handleChartRender();\n    }\n  };\n\n  useEffect(() => {\n    const newSpecFromChildren = hasSpec ? null : parseSpecFromChildren(props);\n\n    if (!chartContext.current?.chart) {\n      if (!hasSpec) {\n        specFromChildren.current = newSpecFromChildren;\n      }\n\n      createChart(props);\n      renderChart();\n      eventsBinded.current = props;\n      return;\n    }\n\n    if (hasSpec) {\n      if (!isEqual(eventsBinded.current.spec, props.spec, { skipFunction: skipFunctionDiff })) {\n        eventsBinded.current = props;\n        chartContext.current.chart.updateSpecSync(parseSpec(props), undefined, {\n          morph: false,\n          enableExitAnimation: false\n        });\n        handleChartRender();\n      }\n      return;\n    }\n\n    const newSpec = pickWithout(props, notSpecKeys);\n\n    if (\n      !isEqual(newSpec, prevSpec.current, { skipFunction: skipFunctionDiff }) ||\n      !isEqual(newSpecFromChildren, specFromChildren.current)\n    ) {\n      prevSpec.current = newSpec;\n      specFromChildren.current = newSpecFromChildren;\n\n      chartContext.current.chart.updateSpecSync(parseSpec(props), undefined, {\n        morph: false,\n        enableExitAnimation: false\n      });\n      handleChartRender();\n    }\n  }, [props]);\n\n  useEffect(() => {\n    return () => {\n      if (chartContext) {\n        if (chartContext.current && chartContext.current.chart) {\n          chartContext.current.chart.release();\n          chartContext.current.chart = null;\n        }\n      }\n      eventsBinded.current = null;\n      isUnmount.current = true;\n    };\n  }, []);\n\n  return (\n    <RootChartContext.Provider value={chartContext.current}>\n      <ViewContext.Provider value={view}>\n        {toArray(props.children).map((child, index) => {\n          if (typeof child === 'string') {\n            return;\n          }\n\n          const childId = getComponentId(child, index);\n\n          return (\n            <React.Fragment key={childId}>\n              {React.cloneElement(child as React.ReactElement<any, React.JSXElementConstructor<any>>, {\n                updateId: updateId,\n                componentId: childId\n              })}\n            </React.Fragment>\n          );\n        })}\n        {tooltipNode}\n      </ViewContext.Provider>\n    </RootChartContext.Provider>\n  );\n});\n\nexport const createChart = <T extends Props>(\n  componentName: string,\n  defaultProps?: Partial<T>,\n  callback?: (props: T, defaultProps?: Partial<T>) => T\n) => {\n  const Com = withContainer<ContainerProps, T>(BaseChart as any, componentName, (props: T) => {\n    if (callback) {\n      return callback(props, defaultProps);\n    }\n\n    if (defaultProps) {\n      return Object.assign(props, defaultProps);\n    }\n    return props;\n  });\n  Com.displayName = componentName;\n  return Com;\n};\n"]}

package/cjs/charts/RoseChart.js

@@ -15,4 +15,5 @@ const vchart_1 = __importDefault(require("@visactor/vchart")), BaseChart_1 = req
 exports.RoseChart = (0, BaseChart_1.createChart)("RoseChart", {
     type: "rose",
     vchartConstrouctor: vchart_1.default
-});
+});
+//# sourceMappingURL=RoseChart.js.map

package/cjs/charts/ScatterChart.js

@@ -15,5 +15,4 @@ const vchart_1 = __importDefault(require("@visactor/vchart")), BaseChart_1 = req
 exports.ScatterChart = (0, BaseChart_1.createChart)("ScatterChart", {
     type: "scatter",
     vchartConstrouctor: vchart_1.default
-});
-//# sourceMappingURL=ScatterChart.js.map
+});

package/cjs/components/BaseComponent.d.ts

@@ -4,6 +4,7 @@ export interface BaseComponentProps {
 }
 type ComponentProps = BaseComponentProps & {
     updateId?: number;
+    componentId?: number;
 };
 export declare const createComponent: <T extends ComponentProps>(componentName: string, specName: string, supportedEvents?: Record<string, string> | null, isSingle?: boolean) => React.FC<T>;
 export {};

package/cjs/components/BaseComponent.js

@@ -33,49 +33,23 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.createComponent = void 0;
 
-const react_1 = __importStar(require("react")), vutils_1 = require("@visactor/vutils"), chart_1 = __importDefault(require("../context/chart")), eventsUtils_1 = require("../eventsUtils"), util_1 = require("../util"), createComponent = (componentName, specName, supportedEvents, isSingle) => {
-    const ignoreKeys = [ "id", "updateId" ], notSpecKeys = supportedEvents ? Object.keys(supportedEvents).concat(ignoreKeys) : ignoreKeys, Comp = props => {
-        const context = (0, react_1.useContext)(chart_1.default), id = react_1.default.useRef((0, 
-        vutils_1.isNil)(props.id) ? (0, util_1.uid)(specName) : props.id), eventsBinded = react_1.default.useRef(null), updateId = react_1.default.useRef(props.updateId), componentSpec = react_1.default.useRef();
+const react_1 = __importStar(require("react")), vutils_1 = require("@visactor/vutils"), chart_1 = __importDefault(require("../context/chart")), eventsUtils_1 = require("../eventsUtils"), createComponent = (componentName, specName, supportedEvents, isSingle) => {
+    const ignoreKeys = [ "id", "updateId", "componentId" ], notSpecKeys = supportedEvents ? Object.keys(supportedEvents).concat(ignoreKeys) : ignoreKeys, Comp = props => {
+        const context = (0, react_1.useContext)(chart_1.default), eventsBinded = react_1.default.useRef(null), updateId = react_1.default.useRef(props.updateId);
         if (props.updateId !== updateId.current) {
             updateId.current = props.updateId;
             !!supportedEvents && (0, eventsUtils_1.bindEventsToChart)(context.chart, props, eventsBinded.current, supportedEvents) && (eventsBinded.current = props);
-        } else {
-            const newComponentSpec = (0, vutils_1.pickWithout)(props, notSpecKeys);
-            (0, vutils_1.isEqual)(newComponentSpec, componentSpec.current) || (componentSpec.current = newComponentSpec, 
-            updateToContext(context, id.current, specName, isSingle, newComponentSpec));
         }
         return (0, react_1.useEffect)((() => () => {
-            supportedEvents && (0, eventsUtils_1.bindEventsToChart)(context.chart, null, eventsBinded.current, supportedEvents), 
-            deleteToContext(context, id.current, specName, isSingle);
+            supportedEvents && (0, eventsUtils_1.bindEventsToChart)(context.chart, null, eventsBinded.current, supportedEvents);
         }), []), null;
     };
-    return Comp.displayName = componentName, Comp;
+    return Comp.displayName = componentName, Comp.parseSpec = props => ({
+        spec: (0, vutils_1.pickWithout)(props, notSpecKeys),
+        specName: specName,
+        isSingle: isSingle
+    }), Comp;
 };
 
 exports.createComponent = createComponent;
-
-const updateToContext = (context, id, specName, isSingle, props) => {
-    if (context.specFromChildren) {
-        if (isSingle) context.specFromChildren[specName] = Object.assign({}, props); else {
-            context.specFromChildren[specName] || (context.specFromChildren[specName] = []);
-            const comps = context.specFromChildren[specName], index = comps.findIndex((entry => entry.id === id));
-            index >= 0 ? comps[index] = Object.assign({
-                id: id
-            }, props) : context.specFromChildren[specName].push(Object.assign({
-                id: id
-            }, props));
-        }
-        context.isChildrenUpdated = !0;
-    }
-}, deleteToContext = (context, id, specName, isSingle) => {
-    var _a;
-    if (context.specFromChildren) if (isSingle) context.specFromChildren[specName] = null; else {
-        const comps = null !== (_a = context.specFromChildren[specName]) && void 0 !== _a ? _a : [], index = comps.findIndex((entry => entry.id === id));
-        if (index >= 0) {
-            const newComps = comps.slice(0, index - 1).concat(comps.slice(index + 1));
-            context.specFromChildren[specName] = newComps, context.isChildrenUpdated = !0;
-        }
-    }
-};
 //# sourceMappingURL=BaseComponent.js.map

package/cjs/components/BaseComponent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/BaseComponent.tsx"],"names":[],"mappings":"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","file":"BaseComponent.js","sourcesContent":["import React, { useContext, useEffect } from 'react';\nimport { isEqual, isNil, pickWithout } from '@visactor/vutils';\n\nimport RootChartContext, { ChartContextType } from '../context/chart';\nimport { bindEventsToChart } from '../eventsUtils';\nimport { uid } from '../util';\n\nexport interface BaseComponentProps {\n  id?: string | number;\n}\n\ntype ComponentProps = BaseComponentProps & { updateId?: number };\n\nexport const createComponent = <T extends ComponentProps>(\n  componentName: string,\n  specName: string,\n  supportedEvents?: Record<string, string> | null,\n  isSingle?: boolean\n) => {\n  const ignoreKeys = ['id', 'updateId'];\n  const notSpecKeys = supportedEvents ? Object.keys(supportedEvents).concat(ignoreKeys) : ignoreKeys;\n\n  const Comp: React.FC<T> = (props: T) => {\n    const context = useContext(RootChartContext);\n    const id = React.useRef<string | number>(isNil(props.id) ? uid(specName) : props.id);\n\n    const eventsBinded = React.useRef<T>(null);\n    const updateId = React.useRef<number>(props.updateId);\n    const componentSpec = React.useRef<Partial<T>>();\n\n    if (props.updateId !== updateId.current) {\n      // update triggered by chart when chart is rendered\n      updateId.current = props.updateId;\n\n      // rebind events after chart render\n      const hasPrevEventsBinded = supportedEvents\n        ? bindEventsToChart(context.chart, props, eventsBinded.current, supportedEvents)\n        : false;\n      if (hasPrevEventsBinded) {\n        eventsBinded.current = props;\n      }\n    } else {\n      const newComponentSpec: Partial<T> = pickWithout<T>(props, notSpecKeys);\n\n      if (!isEqual(newComponentSpec, componentSpec.current)) {\n        componentSpec.current = newComponentSpec;\n        updateToContext(context, id.current, specName, isSingle, newComponentSpec);\n      }\n    }\n\n    useEffect(() => {\n      return () => {\n        if (supportedEvents) {\n          bindEventsToChart(context.chart, null, eventsBinded.current, supportedEvents);\n        }\n        deleteToContext(context, id.current, specName, isSingle);\n      };\n    }, []);\n\n    return null;\n  };\n\n  Comp.displayName = componentName;\n  return Comp;\n};\n\nconst updateToContext = (\n  context: ChartContextType,\n  id: string | number,\n  specName: string,\n  isSingle: boolean,\n  props: Partial<ComponentProps>\n) => {\n  if (!context.specFromChildren) {\n    return;\n  }\n\n  if (isSingle) {\n    context.specFromChildren[specName] = { ...props };\n  } else {\n    if (!context.specFromChildren[specName]) {\n      context.specFromChildren[specName] = [];\n    }\n\n    const comps = context.specFromChildren[specName];\n    const index = comps.findIndex((entry: any) => entry.id === id);\n\n    if (index >= 0) {\n      comps[index] = {\n        id,\n        ...props\n      };\n    } else {\n      context.specFromChildren[specName].push({\n        id,\n        ...props\n      });\n    }\n  }\n  context.isChildrenUpdated = true;\n};\n\nconst deleteToContext = (context: ChartContextType, id: string | number, specName: string, isSingle: boolean) => {\n  if (!context.specFromChildren) {\n    return;\n  }\n\n  if (isSingle) {\n    context.specFromChildren[specName] = null;\n  } else {\n    const comps = context.specFromChildren[specName] ?? [];\n    const index = comps.findIndex((entry: any) => entry.id === id);\n\n    if (index >= 0) {\n      const newComps = comps.slice(0, index - 1).concat(comps.slice(index + 1));\n\n      context.specFromChildren[specName] = newComps;\n      context.isChildrenUpdated = true;\n    }\n  }\n};\n"]}
+{"version":3,"sources":["../src/components/BaseComponent.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAqD;AACrD,6CAA+C;AAE/C,6DAAgD;AAChD,gDAAmD;AAQ5C,MAAM,eAAe,GAAG,CAC7B,aAAqB,EACrB,QAAgB,EAChB,eAA+C,EAC/C,QAAkB,EAClB,EAAE;IACF,MAAM,UAAU,GAAG,CAAC,IAAI,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC;IACrD,MAAM,WAAW,GAAG,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC;IAEnG,MAAM,IAAI,GAAgB,CAAC,KAAQ,EAAE,EAAE;QACrC,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,eAAgB,CAAC,CAAC;QAC7C,MAAM,YAAY,GAAG,eAAK,CAAC,MAAM,CAAI,IAAI,CAAC,CAAC;QAC3C,MAAM,QAAQ,GAAG,eAAK,CAAC,MAAM,CAAS,KAAK,CAAC,QAAQ,CAAC,CAAC;QACtD,IAAI,KAAK,CAAC,QAAQ,KAAK,QAAQ,CAAC,OAAO,EAAE;YAEvC,QAAQ,CAAC,OAAO,GAAG,KAAK,CAAC,QAAQ,CAAC;YAGlC,MAAM,mBAAmB,GAAG,eAAe;gBACzC,CAAC,CAAC,IAAA,+BAAiB,EAAC,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,YAAY,CAAC,OAAO,EAAE,eAAe,CAAC;gBAChF,CAAC,CAAC,KAAK,CAAC;YACV,IAAI,mBAAmB,EAAE;gBACvB,YAAY,CAAC,OAAO,GAAG,KAAK,CAAC;aAC9B;SACF;QAED,IAAA,iBAAS,EAAC,GAAG,EAAE;YACb,OAAO,GAAG,EAAE;gBACV,IAAI,eAAe,EAAE;oBACnB,IAAA,+BAAiB,EAAC,OAAO,CAAC,KAAK,EAAE,IAAI,EAAE,YAAY,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;iBAC/E;YACH,CAAC,CAAC;QACJ,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,IAAI,CAAC,WAAW,GAAG,aAAa,CAAC;IAChC,IAAY,CAAC,SAAS,GAAG,CAAC,KAAsD,EAAE,EAAE;QACnF,MAAM,gBAAgB,GAAe,IAAA,oBAAW,EAAI,KAAK,EAAE,WAAW,CAAC,CAAC;QAExE,OAAO;YACL,IAAI,EAAE,gBAAgB;YACtB,QAAQ;YACR,QAAQ;SACT,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAjDW,QAAA,eAAe,mBAiD1B","file":"BaseComponent.js","sourcesContent":["import React, { useContext, useEffect } from 'react';\nimport { pickWithout } from '@visactor/vutils';\n\nimport RootChartContext from '../context/chart';\nimport { bindEventsToChart } from '../eventsUtils';\n\nexport interface BaseComponentProps {\n  id?: string | number;\n}\n\ntype ComponentProps = BaseComponentProps & { updateId?: number; componentId?: number };\n\nexport const createComponent = <T extends ComponentProps>(\n  componentName: string,\n  specName: string,\n  supportedEvents?: Record<string, string> | null,\n  isSingle?: boolean\n) => {\n  const ignoreKeys = ['id', 'updateId', 'componentId'];\n  const notSpecKeys = supportedEvents ? Object.keys(supportedEvents).concat(ignoreKeys) : ignoreKeys;\n\n  const Comp: React.FC<T> = (props: T) => {\n    const context = useContext(RootChartContext);\n    const eventsBinded = React.useRef<T>(null);\n    const updateId = React.useRef<number>(props.updateId);\n    if (props.updateId !== updateId.current) {\n      // update triggered by chart when chart is rendered\n      updateId.current = props.updateId;\n\n      // rebind events after chart render\n      const hasPrevEventsBinded = supportedEvents\n        ? bindEventsToChart(context.chart, props, eventsBinded.current, supportedEvents)\n        : false;\n      if (hasPrevEventsBinded) {\n        eventsBinded.current = props;\n      }\n    }\n\n    useEffect(() => {\n      return () => {\n        if (supportedEvents) {\n          bindEventsToChart(context.chart, null, eventsBinded.current, supportedEvents);\n        }\n      };\n    }, []);\n\n    return null;\n  };\n\n  Comp.displayName = componentName;\n  (Comp as any).parseSpec = (props: T & { updateId?: number; componentId?: string }) => {\n    const newComponentSpec: Partial<T> = pickWithout<T>(props, notSpecKeys);\n\n    return {\n      spec: newComponentSpec,\n      specName,\n      isSingle\n    };\n  };\n\n  return Comp;\n};\n"]}

package/cjs/components/Mark.d.ts

@@ -1,14 +1,4 @@
-import React from 'react';
-import type { MarkSpec } from '@visactor/vgrammar-core';
-export interface MarkProps extends Omit<MarkSpec, 'name' | 'id'> {
-    id?: string | number;
-    glyphType?: string;
-}
-export interface IMarkElement extends React.ReactElement<Props, React.JSXElementConstructor<Props>> {
-    id: string | number;
-}
-type Props = MarkProps & {
-    updateId?: number;
-};
-export declare const Mark: React.FC<Props>;
-export {};
+import type { ICustomMarkSpec, EnableMarkType } from '@visactor/vchart';
+import { BaseComponentProps } from './BaseComponent';
+export type MarkProps = ICustomMarkSpec<EnableMarkType> & BaseComponentProps;
+export declare const Mark: import("react").FC<MarkProps>;

package/cjs/components/Mark.js

@@ -1,69 +1,10 @@
 "use strict";
 
-var __createBinding = this && this.__createBinding || (Object.create ? function(o, m, k, k2) {
-    void 0 === k2 && (k2 = k);
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    desc && !("get" in desc ? !m.__esModule : desc.writable || desc.configurable) || (desc = {
-        enumerable: !0,
-        get: function() {
-            return m[k];
-        }
-    }), Object.defineProperty(o, k2, desc);
-} : function(o, m, k, k2) {
-    void 0 === k2 && (k2 = k), o[k2] = m[k];
-}), __setModuleDefault = this && this.__setModuleDefault || (Object.create ? function(o, v) {
-    Object.defineProperty(o, "default", {
-        enumerable: !0,
-        value: v
-    });
-} : function(o, v) {
-    o.default = v;
-}), __importStar = this && this.__importStar || function(mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (null != mod) for (var k in mod) "default" !== k && Object.prototype.hasOwnProperty.call(mod, k) && __createBinding(result, mod, k);
-    return __setModuleDefault(result, mod), result;
-}, __rest = this && this.__rest || function(s, e) {
-    var t = {};
-    for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0 && (t[p] = s[p]);
-    if (null != s && "function" == typeof Object.getOwnPropertySymbols) {
-        var i = 0;
-        for (p = Object.getOwnPropertySymbols(s); i < p.length; i++) e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]) && (t[p[i]] = s[p[i]]);
-    }
-    return t;
-}, __importDefault = this && this.__importDefault || function(mod) {
-    return mod && mod.__esModule ? mod : {
-        default: mod
-    };
-};
-
 Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.Mark = void 0;
 
-const react_1 = __importStar(require("react")), vutils_1 = require("@visactor/vutils"), view_1 = __importDefault(require("../context/view")), util_1 = require("../util"), Mark = props => {
-    const context = (0, react_1.useContext)(view_1.default), id = react_1.default.useRef((0, 
-    vutils_1.isNil)(props.id) ? (0, util_1.uid)("mark") : props.id), updateId = react_1.default.useRef(props.updateId);
-    return props.updateId !== updateId.current && (updateId.current = props.updateId, 
-    context && addOrUpdateMark(context, id.current, props)), (0, react_1.useEffect)((() => () => {
-        context && removeMark(context, id.current);
-    }), []), null;
-};
-
-exports.Mark = Mark;
+const BaseComponent_1 = require("./BaseComponent");
 
-const addOrUpdateMark = (view, id, props) => {
-    var _a;
-    if (!view.renderer) return;
-    let mark = view.getMarkById(id);
-    const {group: group, glyphType: glyphType, updateId: updateId} = props, others = __rest(props, [ "group", "glyphType", "updateId" ]);
-    mark || (mark = view.mark(props.type, null !== (_a = props.group) && void 0 !== _a ? _a : view.rootMark, props.glyphType ? {
-        glyphType: props.glyphType
-    } : null).name(id)), mark.parse(others), view.run();
-}, removeMark = (view, id) => {
-    if (view.renderer) {
-        view.getMarkById(id);
-        view.removeGrammar(id);
-    }
-};
+exports.Mark = (0, BaseComponent_1.createComponent)("Mark", "customMark");
 //# sourceMappingURL=Mark.js.map

package/cjs/components/Mark.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Mark.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAqD;AACrD,6CAAyC;AAGzC,2DAA0C;AAC1C,kCAA8B;AAavB,MAAM,IAAI,GAAoB,CAAC,KAAY,EAAE,EAAE;IACpD,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,cAAW,CAAC,CAAC;IACxC,MAAM,EAAE,GAAG,eAAK,CAAC,MAAM,CAAkB,IAAA,cAAK,EAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAA,UAAG,EAAC,MAAM,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACnF,MAAM,QAAQ,GAAG,eAAK,CAAC,MAAM,CAAS,KAAK,CAAC,QAAQ,CAAC,CAAC;IAEtD,IAAI,KAAK,CAAC,QAAQ,KAAK,QAAQ,CAAC,OAAO,EAAE;QAEvC,QAAQ,CAAC,OAAO,GAAG,KAAK,CAAC,QAAQ,CAAC;QAClC,IAAI,OAAO,EAAE;YACX,eAAe,CAAC,OAAO,EAAE,EAAE,CAAC,OAAiB,EAAE,KAAK,CAAC,CAAC;SACvD;KACF;IAED,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,IAAI,OAAO,EAAE;gBACX,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC,OAAiB,CAAC,CAAC;aAC3C;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAtBW,QAAA,IAAI,QAsBf;AAEF,MAAM,eAAe,GAAG,CAAC,IAAW,EAAE,EAAU,EAAE,KAAY,EAAE,EAAE;;IAChE,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;QAElB,OAAO;KACR;IAED,IAAI,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;IAChC,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,KAAgB,KAAK,EAAhB,MAAM,UAAK,KAAK,EAAjD,kCAAyC,CAAQ,CAAC;IACxD,IAAI,CAAC,IAAI,EAAE;QACT,IAAI,GAAI,IAAY;aACjB,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,MAAA,KAAK,CAAC,KAAK,mCAAI,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;aACvG,IAAI,CAAC,EAAE,CAAC,CAAC;KACb;IAED,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IACnB,IAAI,CAAC,GAAG,EAAE,CAAC;AACb,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,IAAW,EAAE,EAAU,EAAE,EAAE;IAC7C,IAAI,IAAI,CAAC,QAAQ,EAAE;QACjB,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;QACjC,IAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;KACjC;AACH,CAAC,CAAC","file":"Mark.js","sourcesContent":["import React, { useContext, useEffect } from 'react';\nimport { isNil } from '@visactor/vutils';\nimport type { IView, MarkSpec } from '@visactor/vgrammar-core';\n\nimport ViewContext from '../context/view';\nimport { uid } from '../util';\n\nexport interface MarkProps extends Omit<MarkSpec, 'name' | 'id'> {\n  id?: string | number;\n  glyphType?: string;\n}\n\nexport interface IMarkElement extends React.ReactElement<Props, React.JSXElementConstructor<Props>> {\n  id: string | number;\n}\n\ntype Props = MarkProps & { updateId?: number };\n\nexport const Mark: React.FC<Props> = (props: Props) => {\n  const context = useContext(ViewContext);\n  const id = React.useRef<string | number>(isNil(props.id) ? uid('mark') : props.id);\n  const updateId = React.useRef<number>(props.updateId);\n\n  if (props.updateId !== updateId.current) {\n    // only update mark when chart finished render\n    updateId.current = props.updateId;\n    if (context) {\n      addOrUpdateMark(context, id.current as string, props);\n    }\n  }\n\n  useEffect(() => {\n    return () => {\n      if (context) {\n        removeMark(context, id.current as string);\n      }\n    };\n  }, []);\n\n  return null;\n};\n\nconst addOrUpdateMark = (view: IView, id: string, props: Props) => {\n  if (!view.renderer) {\n    // view has been released\n    return;\n  }\n\n  let mark = view.getMarkById(id);\n  const { group, glyphType, updateId, ...others } = props;\n  if (!mark) {\n    mark = (view as any)\n      .mark(props.type, props.group ?? view.rootMark, props.glyphType ? { glyphType: props.glyphType } : null)\n      .name(id);\n  }\n\n  mark.parse(others);\n  view.run();\n};\n\nconst removeMark = (view: IView, id: string) => {\n  if (view.renderer) {\n    const mark = view.getMarkById(id);\n    (view as any).removeGrammar(id);\n  }\n};\n"]}
+{"version":3,"sources":["../src/components/Mark.tsx"],"names":[],"mappings":";;;AACA,mDAAsE;AAIzD,QAAA,IAAI,GAAG,IAAA,+BAAe,EAAY,MAAM,EAAE,YAAY,CAAC,CAAC","file":"Mark.js","sourcesContent":["import type { ICustomMarkSpec, EnableMarkType } from '@visactor/vchart';\nimport { BaseComponentProps, createComponent } from './BaseComponent';\n\nexport type MarkProps = ICustomMarkSpec<EnableMarkType> & BaseComponentProps;\n\nexport const Mark = createComponent<MarkProps>('Mark', 'customMark');\n"]}

package/cjs/components/Region.js

@@ -6,4 +6,5 @@ Object.defineProperty(exports, "__esModule", {
 
 const BaseComponent_1 = require("./BaseComponent");
 
-exports.Region = (0, BaseComponent_1.createComponent)("Region", "region");
+exports.Region = (0, BaseComponent_1.createComponent)("Region", "region");
+//# sourceMappingURL=Region.js.map

package/cjs/components/Title.js

@@ -6,5 +6,4 @@ Object.defineProperty(exports, "__esModule", {
 
 const BaseComponent_1 = require("./BaseComponent");
 
-exports.Title = (0, BaseComponent_1.createComponent)("Title", "title", null, !0);
-//# sourceMappingURL=Title.js.map
+exports.Title = (0, BaseComponent_1.createComponent)("Title", "title", null, !0);

package/cjs/components/index.d.ts

@@ -9,7 +9,7 @@ export * from './MarkLine';
 export * from './MarkArea';
 export * from './MarkPoint';
 export * from './ScrollBar';
-export * from './Tooltip';
+export * from './tooltip';
 export * from './Player';
 export * from './Indicator';
 export * from './Title';

package/cjs/components/index.js

@@ -22,7 +22,7 @@ __exportStar(require("./Region"), exports), __exportStar(require("./Legend"), ex
 __exportStar(require("./Brush"), exports), __exportStar(require("./Crosshair"), exports), 
 __exportStar(require("./DataZoom"), exports), __exportStar(require("./MarkLine"), exports), 
 __exportStar(require("./MarkArea"), exports), __exportStar(require("./MarkPoint"), exports), 
-__exportStar(require("./ScrollBar"), exports), __exportStar(require("./Tooltip"), exports), 
+__exportStar(require("./ScrollBar"), exports), __exportStar(require("./tooltip"), exports), 
 __exportStar(require("./Player"), exports), __exportStar(require("./Indicator"), exports), 
 __exportStar(require("./Title"), exports);
 //# sourceMappingURL=index.js.map

package/cjs/components/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,yCAAuB;AACvB,yCAAuB;AACvB,2CAAyB;AACzB,2CAAyB;AACzB,0CAAwB;AACxB,8CAA4B;AAC5B,6CAA2B;AAC3B,6CAA2B;AAC3B,6CAA2B;AAC3B,8CAA4B;AAC5B,8CAA4B;AAC5B,4CAA0B;AAC1B,2CAAyB;AACzB,8CAA4B;AAC5B,0CAAwB","file":"index.js","sourcesContent":["export * from './Axis';\nexport * from './Mark';\nexport * from './Region';\nexport * from './Legend';\nexport * from './Brush';\nexport * from './Crosshair';\nexport * from './DataZoom';\nexport * from './MarkLine';\nexport * from './MarkArea';\nexport * from './MarkPoint';\nexport * from './ScrollBar';\nexport * from './Tooltip';\nexport * from './Player';\nexport * from './Indicator';\nexport * from './Title';\n"]}
+{"version":3,"sources":["../src/components/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,yCAAuB;AACvB,yCAAuB;AACvB,2CAAyB;AACzB,2CAAyB;AACzB,0CAAwB;AACxB,8CAA4B;AAC5B,6CAA2B;AAC3B,6CAA2B;AAC3B,6CAA2B;AAC3B,8CAA4B;AAC5B,8CAA4B;AAC5B,4CAA0B;AAC1B,2CAAyB;AACzB,8CAA4B;AAC5B,0CAAwB","file":"index.js","sourcesContent":["export * from './Axis';\nexport * from './Mark';\nexport * from './Region';\nexport * from './Legend';\nexport * from './Brush';\nexport * from './Crosshair';\nexport * from './DataZoom';\nexport * from './MarkLine';\nexport * from './MarkArea';\nexport * from './MarkPoint';\nexport * from './ScrollBar';\nexport * from './tooltip';\nexport * from './Player';\nexport * from './Indicator';\nexport * from './Title';\n"]}

package/cjs/components/tooltip/Tooltip.d.ts

@@ -0,0 +1,2 @@
+import { TooltipProps } from './interface';
+export declare const Tooltip: import("react").FC<TooltipProps>;

package/cjs/components/{Tooltip.js → tooltip/Tooltip.js}

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.Tooltip = void 0;
 
-const BaseComponent_1 = require("./BaseComponent");
+const BaseComponent_1 = require("../BaseComponent");
 
 exports.Tooltip = (0, BaseComponent_1.createComponent)("Tooltip", "tooltip", null, !0);
-//# sourceMappingURL=Tooltip.js.map
+//# sourceMappingURL=Tooltip.js.map

package/cjs/components/tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/tooltip/Tooltip.tsx"],"names":[],"mappings":";;;AAAA,oDAAmD;AAGtC,QAAA,OAAO,GAAG,IAAA,+BAAe,EAAe,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC","file":"Tooltip.js","sourcesContent":["import { createComponent } from '../BaseComponent';\nimport { TooltipProps } from './interface';\n\nexport const Tooltip = createComponent<TooltipProps>('Tooltip', 'tooltip', null, true);\n"]}

package/cjs/components/tooltip/constant.d.ts

@@ -0,0 +1 @@
+export declare const REACT_TOOLTIP_ClASS_NAME: string;

package/cjs/components/tooltip/constant.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.REACT_TOOLTIP_ClASS_NAME = void 0;
+
+const vchart_1 = require("@visactor/vchart");
+
+exports.REACT_TOOLTIP_ClASS_NAME = `${vchart_1.PREFIX}_REACT_TOOLTIP`;
+//# sourceMappingURL=constant.js.map

package/cjs/components/tooltip/constant.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/tooltip/constant.ts"],"names":[],"mappings":";;;AAAA,6CAA0C;AAE7B,QAAA,wBAAwB,GAAG,GAAG,eAAM,gBAAgB,CAAC","file":"constant.js","sourcesContent":["import { PREFIX } from '@visactor/vchart';\n\nexport const REACT_TOOLTIP_ClASS_NAME = `${PREFIX}_REACT_TOOLTIP`;\n"]}

package/cjs/components/tooltip/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Tooltip';
+export * from './interface';
+export * from './constant';

package/cjs/components/tooltip/index.js

@@ -0,0 +1,22 @@
+"use strict";
+
+var __createBinding = this && this.__createBinding || (Object.create ? function(o, m, k, k2) {
+    void 0 === k2 && (k2 = k);
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    desc && !("get" in desc ? !m.__esModule : desc.writable || desc.configurable) || (desc = {
+        enumerable: !0,
+        get: function() {
+            return m[k];
+        }
+    }), Object.defineProperty(o, k2, desc);
+} : function(o, m, k, k2) {
+    void 0 === k2 && (k2 = k), o[k2] = m[k];
+}), __exportStar = this && this.__exportStar || function(m, exports) {
+    for (var p in m) "default" === p || Object.prototype.hasOwnProperty.call(exports, p) || __createBinding(exports, m, p);
+};
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), __exportStar(require("./Tooltip"), exports), __exportStar(require("./interface"), exports), 
+__exportStar(require("./constant"), exports);
+//# sourceMappingURL=index.js.map

package/cjs/components/tooltip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/tooltip/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,4CAA0B;AAC1B,8CAA4B;AAC5B,6CAA2B","file":"index.js","sourcesContent":["export * from './Tooltip';\nexport * from './interface';\nexport * from './constant';\n"]}

package/cjs/components/tooltip/interface.d.ts

@@ -0,0 +1,14 @@
+import { PropsWithChildren, ReactNode } from 'react';
+import { BaseComponentProps } from '../BaseComponent';
+import type { ITooltipSpec, ITooltipActual, TooltipHandlerParams } from '@visactor/vchart';
+export type TooltipProps = PropsWithChildren<ITooltipSpec & IReactTooltipProps & BaseComponentProps>;
+export interface ITooltipRenderProps {
+    tooltipElement: HTMLElement;
+    actualTooltip: ITooltipActual;
+    params: TooltipHandlerParams;
+}
+export type TooltipRender = (tooltipElement: HTMLElement, actualTooltip: ITooltipActual, params: TooltipHandlerParams) => ReactNode;
+export interface IReactTooltipProps {
+    tooltipRender?: TooltipRender;
+    reserveDefaultTooltip?: boolean;
+}

package/cjs/components/tooltip/interface.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+});
+//# sourceMappingURL=interface.js.map

package/cjs/components/tooltip/interface.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/tooltip/interface.ts"],"names":[],"mappings":"","file":"interface.js","sourcesContent":["import { PropsWithChildren, ReactNode } from 'react';\nimport { BaseComponentProps } from '../BaseComponent';\nimport type { ITooltipSpec, ITooltipActual, TooltipHandlerParams } from '@visactor/vchart';\n\nexport type TooltipProps = PropsWithChildren<ITooltipSpec & IReactTooltipProps & BaseComponentProps>;\n\nexport interface ITooltipRenderProps {\n  tooltipElement: HTMLElement;\n  actualTooltip: ITooltipActual;\n  params: TooltipHandlerParams;\n}\n\nexport type TooltipRender = (\n  tooltipElement: HTMLElement,\n  actualTooltip: ITooltipActual,\n  params: TooltipHandlerParams\n) => ReactNode;\n\nexport interface IReactTooltipProps {\n  /**\n   * tooltip 自定义渲染器\n   * @since 1.10.0\n   */\n  tooltipRender?: TooltipRender;\n  /**\n   * 在应用 `tooltipRender` 配置时，是否保留默认 tooltip dom 元素的显示\n   * @since 1.10.0\n   */\n  reserveDefaultTooltip?: boolean;\n}\n"]}

package/cjs/components/tooltip/util.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { BaseChartProps } from '../../charts/BaseChart';
+import { TooltipProps } from './interface';
+import { ITooltipSpec } from '@visactor/vchart';
+export declare const initCustomTooltip: (setTooltipNode: React.Dispatch<React.SetStateAction<React.ReactNode>>, props: BaseChartProps, spec?: TooltipProps) => ITooltipSpec;