vccs 0.1.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +151 -0
- package/dist/animation/Animate.d.ts +1 -1
- package/dist/cartesian/area/type.d.ts +3 -3
- package/dist/cartesian/bar/type.d.ts +1 -13
- package/dist/cartesian/brush/components/Slide.d.ts +1 -1
- package/dist/cartesian/brush/components/TravellerLayer.d.ts +1 -1
- package/dist/cartesian/brush/type.d.ts +2 -1
- package/dist/cartesian/cartesian-axis/CartesianAxis.d.ts +2 -1
- package/dist/cartesian/funnel/Funnel.d.ts +2 -0
- package/dist/cartesian/funnel/index.d.ts +2 -0
- package/dist/cartesian/funnel/type.d.ts +74 -6
- package/dist/cartesian/index.d.ts +2 -0
- package/dist/cartesian/line/Line.d.ts +7 -13
- package/dist/cartesian/line/type.d.ts +4 -17
- package/dist/cartesian/reference-area/ReferenceArea.d.ts +16 -16
- package/dist/cartesian/reference-dot/ReferenceDot.d.ts +143 -0
- package/dist/cartesian/reference-dot/index.d.ts +2 -0
- package/dist/cartesian/reference-line/ReferenceLine.d.ts +8 -8
- package/dist/cartesian/scatter/Scatter.d.ts +1 -1
- package/dist/chart/FunnelChart.d.ts +1 -0
- package/dist/chart/RechartsWrapper.d.ts +7 -3
- package/dist/chart/Surface.d.ts +2 -1
- package/dist/chart/Treemap.d.ts +237 -0
- package/dist/chart/generateCategoricalChart.d.ts +2 -1
- package/dist/chart/index.d.ts +2 -0
- package/dist/chart/treemapUtils.d.ts +22 -0
- package/dist/components/Customized.d.ts +23 -0
- package/dist/components/Text.d.ts +4 -4
- package/dist/components/Tooltip.d.ts +1 -1
- package/dist/components/index.d.ts +2 -0
- package/dist/components/label/Label.d.ts +3 -3
- package/dist/components/label/types.d.ts +1 -1
- package/dist/container/Surface.d.ts +3 -2
- package/dist/es/animation/Animate.mjs +48 -22
- package/dist/es/cartesian/GraphicalItemClipPath.mjs +16 -15
- package/dist/es/cartesian/area/ActivePoints.mjs +44 -40
- package/dist/es/cartesian/area/Area.mjs +42 -31
- package/dist/es/cartesian/area/ClipRect.mjs +79 -58
- package/dist/es/cartesian/area/RenderArea.mjs +142 -108
- package/dist/es/cartesian/area/hooks/useArea.mjs +71 -47
- package/dist/es/cartesian/area/type.mjs +13 -15
- package/dist/es/cartesian/area/utils.mjs +69 -49
- package/dist/es/cartesian/axis/XAxis.mjs +87 -73
- package/dist/es/cartesian/axis/YAxis.mjs +67 -56
- package/dist/es/cartesian/bar/Bar.mjs +78 -71
- package/dist/es/cartesian/bar/components/BarBackground.mjs +22 -19
- package/dist/es/cartesian/bar/components/BarRectangles.mjs +117 -80
- package/dist/es/cartesian/bar/hooks/useBar.mjs +49 -37
- package/dist/es/cartesian/bar/type.mjs +11 -25
- package/dist/es/cartesian/bar/utils.mjs +97 -70
- package/dist/es/cartesian/cartesian-axis/CartesianAxis.mjs +165 -115
- package/dist/es/cartesian/cartesian-grid/Background.mjs +19 -16
- package/dist/es/cartesian/cartesian-grid/CartesianGrid.mjs +116 -97
- package/dist/es/cartesian/cartesian-grid/HorizontalGridLines.mjs +24 -23
- package/dist/es/cartesian/cartesian-grid/HorizontalStripes.mjs +24 -24
- package/dist/es/cartesian/cartesian-grid/VerticalGridLines.mjs +23 -22
- package/dist/es/cartesian/cartesian-grid/VerticalStripes.mjs +24 -24
- package/dist/es/cartesian/cartesian-grid/const.mjs +317 -10
- package/dist/es/cartesian/cartesian-grid/utils.mjs +18 -13
- package/dist/es/cartesian/error-bar/ErrorBar.mjs +111 -83
- package/dist/es/cartesian/error-bar/ErrorBarContext.mjs +13 -12
- package/dist/es/cartesian/funnel/Funnel.mjs +162 -0
- package/dist/es/cartesian/funnel/type.mjs +78 -0
- package/dist/es/cartesian/funnel/utils.mjs +102 -0
- package/dist/es/cartesian/line/ActivePoints.mjs +45 -41
- package/dist/es/cartesian/line/Line.mjs +41 -37
- package/dist/es/cartesian/line/StaticLine.mjs +191 -122
- package/dist/es/cartesian/line/hooks/useLine.mjs +60 -44
- package/dist/es/cartesian/line/type.mjs +13 -18
- package/dist/es/cartesian/line/utils.mjs +27 -26
- package/dist/es/cartesian/reference-area/ReferenceArea.mjs +79 -78
- package/dist/es/cartesian/reference-dot/ReferenceDot.mjs +134 -0
- package/dist/es/cartesian/reference-line/ReferenceLine.mjs +93 -84
- package/dist/es/cartesian/scatter/Scatter.mjs +168 -140
- package/dist/es/cartesian/scatter/hooks/useScatter.mjs +18 -14
- package/dist/es/cartesian/useNeedsClip.mjs +18 -9
- package/dist/es/cartesian/utils/get-ticks.mjs +103 -68
- package/dist/es/cartesian/z-axis/ZAxis.mjs +30 -28
- package/dist/es/chart/AreaChart.mjs +5 -5
- package/dist/es/chart/BarChart.mjs +5 -5
- package/dist/es/chart/ComposedChart.mjs +5 -5
- package/dist/es/chart/FunnelChart.mjs +11 -0
- package/dist/es/chart/LegendPortalContext.mjs +3 -3
- package/dist/es/chart/LineChart.mjs +5 -5
- package/dist/es/chart/PieChart.mjs +5 -5
- package/dist/es/chart/RadarChart.mjs +5 -5
- package/dist/es/chart/RadialBarChart.mjs +5 -5
- package/dist/es/chart/RechartsWrapper.mjs +113 -89
- package/dist/es/chart/ScatterChart.mjs +5 -5
- package/dist/es/chart/Surface.mjs +3 -3
- package/dist/es/chart/Surface.vue_vue_type_script_setup_true_lang.mjs +51 -45
- package/dist/es/chart/TooltipPortalContext.mjs +3 -3
- package/dist/es/chart/Treemap.mjs +379 -0
- package/dist/es/chart/const.mjs +2 -2
- package/dist/es/chart/generateCategoricalChart.mjs +99 -89
- package/dist/es/chart/provideClipPathId.mjs +12 -7
- package/dist/es/chart/treemapUtils.mjs +32 -0
- package/dist/es/components/Cell.mjs +16 -4
- package/dist/es/components/Customized.mjs +43 -0
- package/dist/es/components/Text.mjs +3 -3
- package/dist/es/components/Text.vue_vue_type_script_setup_true_lang.mjs +106 -69
- package/dist/es/components/Tooltip.mjs +274 -199
- package/dist/es/components/label/Label.mjs +30 -26
- package/dist/es/components/label/LabelList.mjs +45 -39
- package/dist/es/components/label/types.mjs +10 -6
- package/dist/es/components/label/utils.mjs +194 -162
- package/dist/es/components/legend/Legend.mjs +82 -71
- package/dist/es/components/legend/LegendSymbol.mjs +40 -38
- package/dist/es/components/legend/hooks/useLegend.mjs +71 -46
- package/dist/es/components/legend/hooks/useLegendContent.mjs +52 -31
- package/dist/es/components/legend/type.mjs +2 -2
- package/dist/es/components/legend/utils.mjs +19 -11
- package/dist/es/components/utils.mjs +35 -22
- package/dist/es/container/ClipPath.mjs +14 -14
- package/dist/es/container/Layer.mjs +9 -7
- package/dist/es/container/ResponsiveContainer.mjs +3 -3
- package/dist/es/container/ResponsiveContainer.vue_vue_type_script_setup_true_lang.mjs +109 -77
- package/dist/es/container/Surface.mjs +25 -23
- package/dist/es/container/useSizeContext.mjs +3 -3
- package/dist/es/context/ChartDataContextProvider.mjs +19 -13
- package/dist/es/context/PanoramaContextProvider.mjs +15 -10
- package/dist/es/context/accessibilityContext.mjs +3 -3
- package/dist/es/context/cartesianLabelListContext.mjs +3 -3
- package/dist/es/context/chartLayoutContext.mjs +33 -30
- package/dist/es/context/cursorLayerContext.mjs +3 -3
- package/dist/es/context/graphicalLayerContext.mjs +3 -3
- package/dist/es/context/labelLayerContext.mjs +3 -3
- package/dist/es/context/polarLabelViewBoxContext.mjs +5 -5
- package/dist/es/context/useTooltipAxis.mjs +14 -12
- package/dist/es/events/useChartSynchronisation.mjs +91 -66
- package/dist/es/hooks/publicHooks.mjs +207 -0
- package/dist/es/hooks/useIsAnimating.mjs +28 -0
- package/dist/es/hooks/useSetupGraphicalItem.mjs +52 -43
- package/dist/es/index.mjs +54 -42
- package/dist/es/polar/pie/Pie.mjs +131 -115
- package/dist/es/polar/pie/type.mjs +8 -10
- package/dist/es/polar/radar/PolarAngleAxis.mjs +103 -84
- package/dist/es/polar/radar/PolarGrid.mjs +72 -59
- package/dist/es/polar/radar/PolarRadiusAxis.mjs +90 -65
- package/dist/es/polar/radar/Radar.mjs +181 -145
- package/dist/es/polar/radial-bar/RadialBar.mjs +161 -140
- package/dist/es/polar/radial-bar/type.mjs +9 -9
- package/dist/es/shape/Cross.mjs +11 -10
- package/dist/es/shape/Curve.mjs +71 -44
- package/dist/es/shape/Dot.mjs +12 -11
- package/dist/es/shape/Polygon.mjs +19 -0
- package/dist/es/shape/Rectangle.mjs +41 -30
- package/dist/es/shape/Sector.mjs +105 -79
- package/dist/es/shape/Symbols.mjs +45 -34
- package/dist/es/shape/Trapezoid.mjs +50 -0
- package/dist/es/state/ReportChartProps.mjs +23 -24
- package/dist/es/state/ReportMainChartProps.mjs +26 -21
- package/dist/es/state/ReportPolarOptions.mjs +23 -22
- package/dist/es/state/SetGraphicalItem.mjs +42 -27
- package/dist/es/state/SetLegendPayload.mjs +17 -13
- package/dist/es/state/SetTooltipEntrySettings.mjs +14 -12
- package/dist/es/state/brushSlice.mjs +12 -8
- package/dist/es/state/cartesianAxisSlice.mjs +23 -17
- package/dist/es/state/chartDataSlice.mjs +18 -13
- package/dist/es/state/externalEventsMiddleware.mjs +25 -15
- package/dist/es/state/graphicalItemsSlice.mjs +29 -25
- package/dist/es/state/hooks.mjs +24 -3
- package/dist/es/state/keyboardEventsMiddleware.mjs +50 -42
- package/dist/es/state/layoutSlice.mjs +18 -12
- package/dist/es/state/legendSlice.mjs +19 -14
- package/dist/es/state/mouseEventsMiddleware.mjs +31 -24
- package/dist/es/state/optionsSlice.mjs +14 -11
- package/dist/es/state/polarAxisSlice.mjs +15 -13
- package/dist/es/state/polarOptionsSlice.mjs +8 -6
- package/dist/es/state/reduxDevtoolsJsonStringifyReplacer.mjs +5 -3
- package/dist/es/state/referenceElementsSlice.mjs +21 -19
- package/dist/es/state/rootPropsSlice.mjs +20 -9
- package/dist/es/state/selectors/areaSelectors.mjs +65 -55
- package/dist/es/state/selectors/axisSelectors.mjs +784 -569
- package/dist/es/state/selectors/barSelectors.mjs +225 -162
- package/dist/es/state/selectors/brushSelectors.mjs +15 -14
- package/dist/es/state/selectors/combiners/combineActiveLabel.mjs +6 -5
- package/dist/es/state/selectors/combiners/combineActiveTooltipIndex.mjs +36 -27
- package/dist/es/state/selectors/combiners/combineAxisRangeWithReverse.mjs +5 -3
- package/dist/es/state/selectors/combiners/combineCoordinateForDefaultIndex.mjs +13 -11
- package/dist/es/state/selectors/combiners/combineTooltipInteractionState.mjs +26 -21
- package/dist/es/state/selectors/combiners/combineTooltipPayloadConfigurations.mjs +10 -6
- package/dist/es/state/selectors/common.mjs +2 -2
- package/dist/es/state/selectors/containerSelectors.mjs +5 -2
- package/dist/es/state/selectors/dataSelectors.mjs +28 -9
- package/dist/es/state/selectors/funnelSelectors.mjs +38 -0
- package/dist/es/state/selectors/legendSelectors.mjs +7 -6
- package/dist/es/state/selectors/lineSelectors.mjs +54 -47
- package/dist/es/state/selectors/pickAxisId.mjs +2 -2
- package/dist/es/state/selectors/pickAxisType.mjs +2 -2
- package/dist/es/state/selectors/pieSelectors.mjs +116 -81
- package/dist/es/state/selectors/polarAxisSelectors.mjs +113 -94
- package/dist/es/state/selectors/polarGridSelectors.mjs +13 -11
- package/dist/es/state/selectors/polarScaleSelectors.mjs +49 -46
- package/dist/es/state/selectors/polarSelectors.mjs +79 -62
- package/dist/es/state/selectors/radarSelectors.mjs +111 -91
- package/dist/es/state/selectors/radialBarSelectors.mjs +230 -183
- package/dist/es/state/selectors/rootPropsSelectors.mjs +11 -5
- package/dist/es/state/selectors/scatterSelectors.mjs +111 -95
- package/dist/es/state/selectors/selectActivePropsFromChartPointer.mjs +19 -17
- package/dist/es/state/selectors/selectAllAxes.mjs +8 -3
- package/dist/es/state/selectors/selectChartOffset.mjs +59 -50
- package/dist/es/state/selectors/selectChartOffsetInternal.mjs +55 -44
- package/dist/es/state/selectors/selectTooltipEventType.mjs +15 -14
- package/dist/es/state/selectors/selectTooltipPayloadSearcher.mjs +3 -3
- package/dist/es/state/selectors/selectTooltipSettings.mjs +2 -2
- package/dist/es/state/selectors/selectTooltipState.mjs +2 -2
- package/dist/es/state/selectors/selectors.mjs +94 -75
- package/dist/es/state/selectors/tooltipSelectors.mjs +253 -204
- package/dist/es/state/selectors/touchSelectors.mjs +17 -14
- package/dist/es/state/store.mjs +46 -46
- package/dist/es/state/tooltipSlice.mjs +64 -37
- package/dist/es/state/touchEventsMiddleware.mjs +35 -29
- package/dist/es/state/utils/useReportScale.mjs +16 -13
- package/dist/es/synchronisation/syncSelectors.mjs +3 -3
- package/dist/es/synchronisation/useChartSynchronisation.mjs +33 -19
- package/dist/es/types/common.mjs +12 -0
- package/dist/es/types/event.mjs +164 -2
- package/dist/es/utils/ReduceCSSCalc.mjs +81 -49
- package/dist/es/utils/VueUtils.mjs +35 -14
- package/dist/es/utils/attrs.mjs +43 -26
- package/dist/es/utils/cartesian.mjs +47 -15
- package/dist/es/utils/cell.mjs +28 -0
- package/dist/es/utils/chart.mjs +298 -197
- package/dist/es/utils/const.mjs +30 -2
- package/dist/es/utils/createCategoricalInverse.mjs +46 -0
- package/dist/es/utils/createContext.mjs +28 -9
- package/dist/es/utils/data-utils.mjs +9 -8
- package/dist/es/utils/data.mjs +35 -21
- package/dist/es/utils/events.mjs +5 -3
- package/dist/es/utils/getLinearRegression.mjs +28 -11
- package/dist/es/utils/grid.mjs +20 -5
- package/dist/es/utils/isDomainSpecifiedByUser.mjs +105 -54
- package/dist/es/utils/legend.mjs +13 -12
- package/dist/es/utils/log.mjs +10 -7
- package/dist/es/utils/payload/getUniqPayload.mjs +6 -4
- package/dist/es/utils/polar.mjs +37 -30
- package/dist/es/utils/props.mjs +16 -10
- package/dist/es/utils/resolveDefaultProps.mjs +23 -4
- package/dist/es/utils/scale/getNiceTickValues.mjs +127 -49
- package/dist/es/utils/scale/utils/arithmetic.mjs +49 -19
- package/dist/es/utils/scale/utils/utils.mjs +43 -24
- package/dist/es/utils/scale.mjs +46 -0
- package/dist/es/utils/style.mjs +24 -13
- package/dist/es/utils/tick.mjs +34 -23
- package/dist/es/utils/tooltip/translate.mjs +63 -49
- package/dist/es/utils/validate.mjs +40 -29
- package/dist/hooks/publicHooks.d.ts +143 -0
- package/dist/hooks/useIsAnimating.d.ts +14 -0
- package/dist/index.d.ts +1 -0
- package/dist/polar/pie/type.d.ts +2 -2
- package/dist/polar/radar/Radar.d.ts +4 -4
- package/dist/shape/Curve.d.ts +2 -1
- package/dist/shape/Polygon.d.ts +9 -0
- package/dist/shape/Rectangle.d.ts +0 -4
- package/dist/shape/Sector.d.ts +2 -2
- package/dist/shape/Symbols.d.ts +2 -1
- package/dist/shape/Trapezoid.d.ts +30 -0
- package/dist/shape/index.d.ts +2 -0
- package/dist/shape/types.d.ts +4 -5
- package/dist/state/ReportChartProps.d.ts +3 -3
- package/dist/state/graphicalItemsSlice.d.ts +1 -1
- package/dist/state/rootPropsSlice.d.ts +2 -2
- package/dist/state/selectors/axisSelectors.d.ts +5 -0
- package/dist/types/axis.d.ts +2 -2
- package/dist/types/bar.d.ts +2 -6
- package/dist/types/categorical.d.ts +2 -2
- package/dist/types/common.d.ts +7 -1
- package/dist/types/tooltip.d.ts +2 -2
- package/dist/utils/cell.d.ts +11 -0
- package/dist/utils/createCategoricalInverse.d.ts +16 -0
- package/dist/utils/scale.d.ts +23 -0
- package/package.json +2 -1
|
@@ -1,25 +1,26 @@
|
|
|
1
|
-
import { createSlice
|
|
2
|
-
import { castDraft
|
|
1
|
+
import { createSlice, current } from "@reduxjs/toolkit";
|
|
2
|
+
import { castDraft } from "immer";
|
|
3
3
|
//#region src/state/tooltipSlice.ts
|
|
4
|
-
var
|
|
5
|
-
active:
|
|
4
|
+
var noInteraction = {
|
|
5
|
+
active: false,
|
|
6
6
|
index: null,
|
|
7
7
|
dataKey: void 0,
|
|
8
8
|
coordinate: void 0
|
|
9
|
-
}
|
|
9
|
+
};
|
|
10
|
+
var tooltipSlice = createSlice({
|
|
10
11
|
name: "tooltip",
|
|
11
12
|
initialState: {
|
|
12
13
|
itemInteraction: {
|
|
13
|
-
click:
|
|
14
|
-
hover:
|
|
14
|
+
click: noInteraction,
|
|
15
|
+
hover: noInteraction
|
|
15
16
|
},
|
|
16
17
|
axisInteraction: {
|
|
17
|
-
click:
|
|
18
|
-
hover:
|
|
18
|
+
click: noInteraction,
|
|
19
|
+
hover: noInteraction
|
|
19
20
|
},
|
|
20
|
-
keyboardInteraction:
|
|
21
|
+
keyboardInteraction: noInteraction,
|
|
21
22
|
syncInteraction: {
|
|
22
|
-
active:
|
|
23
|
+
active: false,
|
|
23
24
|
index: null,
|
|
24
25
|
dataKey: void 0,
|
|
25
26
|
label: void 0,
|
|
@@ -30,46 +31,72 @@ var r = {
|
|
|
30
31
|
shared: void 0,
|
|
31
32
|
trigger: "hover",
|
|
32
33
|
axisId: 0,
|
|
33
|
-
active:
|
|
34
|
+
active: false,
|
|
34
35
|
defaultIndex: void 0
|
|
35
36
|
}
|
|
36
37
|
},
|
|
37
38
|
reducers: {
|
|
38
|
-
addTooltipEntrySettings(
|
|
39
|
-
|
|
39
|
+
addTooltipEntrySettings(state, action) {
|
|
40
|
+
state.tooltipItemPayloads.push(castDraft(action.payload));
|
|
40
41
|
},
|
|
41
|
-
removeTooltipEntrySettings(
|
|
42
|
-
|
|
43
|
-
|
|
42
|
+
removeTooltipEntrySettings(state, action) {
|
|
43
|
+
const index = current(state).tooltipItemPayloads.indexOf(castDraft(action.payload));
|
|
44
|
+
if (index > -1) state.tooltipItemPayloads.splice(index, 1);
|
|
44
45
|
},
|
|
45
|
-
setTooltipSettingsState(
|
|
46
|
-
|
|
46
|
+
setTooltipSettingsState(state, action) {
|
|
47
|
+
state.settings = action.payload;
|
|
47
48
|
},
|
|
48
|
-
setActiveMouseOverItemIndex(
|
|
49
|
-
|
|
49
|
+
setActiveMouseOverItemIndex(state, action) {
|
|
50
|
+
state.syncInteraction.active = false;
|
|
51
|
+
state.keyboardInteraction.active = false;
|
|
52
|
+
state.itemInteraction.hover.active = true;
|
|
53
|
+
state.itemInteraction.hover.index = action.payload.activeIndex;
|
|
54
|
+
state.itemInteraction.hover.dataKey = action.payload.activeDataKey;
|
|
55
|
+
state.itemInteraction.hover.coordinate = action.payload.activeCoordinate;
|
|
50
56
|
},
|
|
51
|
-
mouseLeaveChart(
|
|
52
|
-
|
|
57
|
+
mouseLeaveChart(state) {
|
|
58
|
+
state.itemInteraction.hover.active = false;
|
|
59
|
+
state.axisInteraction.hover.active = false;
|
|
53
60
|
},
|
|
54
|
-
mouseLeaveItem(
|
|
55
|
-
|
|
61
|
+
mouseLeaveItem(state) {
|
|
62
|
+
state.itemInteraction.hover.active = false;
|
|
56
63
|
},
|
|
57
|
-
setActiveClickItemIndex(
|
|
58
|
-
|
|
64
|
+
setActiveClickItemIndex(state, action) {
|
|
65
|
+
state.syncInteraction.active = false;
|
|
66
|
+
state.itemInteraction.click.active = true;
|
|
67
|
+
state.keyboardInteraction.active = false;
|
|
68
|
+
state.itemInteraction.click.index = action.payload.activeIndex;
|
|
69
|
+
state.itemInteraction.click.dataKey = action.payload.activeDataKey;
|
|
70
|
+
state.itemInteraction.click.coordinate = action.payload.activeCoordinate;
|
|
59
71
|
},
|
|
60
|
-
setMouseOverAxisIndex(
|
|
61
|
-
|
|
72
|
+
setMouseOverAxisIndex(state, action) {
|
|
73
|
+
state.syncInteraction.active = false;
|
|
74
|
+
state.axisInteraction.hover.active = true;
|
|
75
|
+
state.keyboardInteraction.active = false;
|
|
76
|
+
state.axisInteraction.hover.index = action.payload.activeIndex;
|
|
77
|
+
state.axisInteraction.hover.dataKey = action.payload.activeDataKey;
|
|
78
|
+
state.axisInteraction.hover.coordinate = action.payload.activeCoordinate;
|
|
62
79
|
},
|
|
63
|
-
setMouseClickAxisIndex(
|
|
64
|
-
|
|
80
|
+
setMouseClickAxisIndex(state, action) {
|
|
81
|
+
state.syncInteraction.active = false;
|
|
82
|
+
state.keyboardInteraction.active = false;
|
|
83
|
+
state.axisInteraction.click.active = true;
|
|
84
|
+
state.axisInteraction.click.index = action.payload.activeIndex;
|
|
85
|
+
state.axisInteraction.click.dataKey = action.payload.activeDataKey;
|
|
86
|
+
state.axisInteraction.click.coordinate = action.payload.activeCoordinate;
|
|
65
87
|
},
|
|
66
|
-
setSyncInteraction(
|
|
67
|
-
|
|
88
|
+
setSyncInteraction(state, action) {
|
|
89
|
+
state.syncInteraction = action.payload;
|
|
68
90
|
},
|
|
69
|
-
setKeyboardInteraction(
|
|
70
|
-
|
|
91
|
+
setKeyboardInteraction(state, action) {
|
|
92
|
+
state.keyboardInteraction.active = action.payload.active;
|
|
93
|
+
state.keyboardInteraction.index = action.payload.activeIndex;
|
|
94
|
+
state.keyboardInteraction.coordinate = action.payload.activeCoordinate;
|
|
95
|
+
state.keyboardInteraction.dataKey = action.payload.activeDataKey;
|
|
71
96
|
}
|
|
72
97
|
}
|
|
73
|
-
})
|
|
98
|
+
});
|
|
99
|
+
var { addTooltipEntrySettings, removeTooltipEntrySettings, setTooltipSettingsState, setActiveMouseOverItemIndex, mouseLeaveItem, mouseLeaveChart, setActiveClickItemIndex, setMouseOverAxisIndex, setMouseClickAxisIndex, setSyncInteraction, setKeyboardInteraction } = tooltipSlice.actions;
|
|
100
|
+
var tooltipReducer = tooltipSlice.reducer;
|
|
74
101
|
//#endregion
|
|
75
|
-
export {
|
|
102
|
+
export { addTooltipEntrySettings, mouseLeaveChart, mouseLeaveItem, noInteraction, removeTooltipEntrySettings, setActiveClickItemIndex, setActiveMouseOverItemIndex, setKeyboardInteraction, setMouseClickAxisIndex, setMouseOverAxisIndex, setSyncInteraction, setTooltipSettingsState, tooltipReducer };
|
|
@@ -1,38 +1,44 @@
|
|
|
1
|
-
import { getChartPointer
|
|
2
|
-
import { selectTooltipEventType
|
|
3
|
-
import { setActiveMouseOverItemIndex
|
|
4
|
-
import { DATA_ITEM_DATAKEY_ATTRIBUTE_NAME
|
|
5
|
-
import { selectActivePropsFromChartPointer
|
|
6
|
-
import { selectTooltipCoordinate
|
|
7
|
-
import { createAction
|
|
1
|
+
import { getChartPointer } from "../utils/chart.mjs";
|
|
2
|
+
import { selectTooltipEventType } from "./selectors/selectTooltipEventType.mjs";
|
|
3
|
+
import { setActiveMouseOverItemIndex, setMouseOverAxisIndex } from "./tooltipSlice.mjs";
|
|
4
|
+
import { DATA_ITEM_DATAKEY_ATTRIBUTE_NAME, DATA_ITEM_INDEX_ATTRIBUTE_NAME } from "../utils/const.mjs";
|
|
5
|
+
import { selectActivePropsFromChartPointer } from "./selectors/selectActivePropsFromChartPointer.mjs";
|
|
6
|
+
import { selectTooltipCoordinate } from "./selectors/touchSelectors.mjs";
|
|
7
|
+
import { createAction, createListenerMiddleware } from "@reduxjs/toolkit";
|
|
8
8
|
//#region src/state/touchEventsMiddleware.ts
|
|
9
|
-
var
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
9
|
+
var touchEventAction = createAction("touchMove");
|
|
10
|
+
var touchEventMiddleware = createListenerMiddleware();
|
|
11
|
+
touchEventMiddleware.startListening({
|
|
12
|
+
actionCreator: touchEventAction,
|
|
13
|
+
effect: (action, listenerApi) => {
|
|
14
|
+
const touchEvent = action.payload;
|
|
15
|
+
const state = listenerApi.getState();
|
|
16
|
+
const tooltipEventType = selectTooltipEventType(state, state.tooltip.settings.shared);
|
|
17
|
+
if (tooltipEventType === "axis") {
|
|
18
|
+
const activeProps = selectActivePropsFromChartPointer(state, getChartPointer({
|
|
19
|
+
clientX: touchEvent.touches[0].clientX,
|
|
20
|
+
clientY: touchEvent.touches[0].clientY,
|
|
21
|
+
currentTarget: touchEvent.target
|
|
19
22
|
}));
|
|
20
|
-
|
|
21
|
-
activeIndex:
|
|
23
|
+
if (activeProps?.activeIndex != null) listenerApi.dispatch(setMouseOverAxisIndex({
|
|
24
|
+
activeIndex: activeProps.activeIndex,
|
|
22
25
|
activeDataKey: void 0,
|
|
23
|
-
activeCoordinate:
|
|
26
|
+
activeCoordinate: activeProps.activeCoordinate
|
|
24
27
|
}));
|
|
25
|
-
} else if (
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
28
|
+
} else if (tooltipEventType === "item") {
|
|
29
|
+
const touch = touchEvent.touches[0];
|
|
30
|
+
const target = document.elementFromPoint(touch.clientX, touch.clientY);
|
|
31
|
+
if (!target || !target.getAttribute) return;
|
|
32
|
+
const itemIndex = target.getAttribute(DATA_ITEM_INDEX_ATTRIBUTE_NAME);
|
|
33
|
+
const dataKey = target.getAttribute(DATA_ITEM_DATAKEY_ATTRIBUTE_NAME);
|
|
34
|
+
const coordinate = selectTooltipCoordinate(listenerApi.getState(), itemIndex, dataKey);
|
|
35
|
+
listenerApi.dispatch(setActiveMouseOverItemIndex({
|
|
36
|
+
activeDataKey: dataKey,
|
|
37
|
+
activeIndex: itemIndex,
|
|
38
|
+
activeCoordinate: coordinate
|
|
33
39
|
}));
|
|
34
40
|
}
|
|
35
41
|
}
|
|
36
42
|
});
|
|
37
43
|
//#endregion
|
|
38
|
-
export {
|
|
44
|
+
export { touchEventAction, touchEventMiddleware };
|
|
@@ -1,16 +1,19 @@
|
|
|
1
|
-
import { isWellBehavedNumber
|
|
2
|
-
import { selectContainerScale
|
|
3
|
-
import { useAppDispatch
|
|
4
|
-
import { setScale
|
|
5
|
-
import { ref
|
|
1
|
+
import { isWellBehavedNumber } from "../../utils/validate.mjs";
|
|
2
|
+
import { selectContainerScale } from "../selectors/containerSelectors.mjs";
|
|
3
|
+
import { useAppDispatch, useAppSelector } from "../hooks.mjs";
|
|
4
|
+
import { setScale } from "../layoutSlice.mjs";
|
|
5
|
+
import { ref, watch } from "vue";
|
|
6
6
|
//#region src/state/utils/useReportScale.ts
|
|
7
|
-
function
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
7
|
+
function useReportScale() {
|
|
8
|
+
const dispatch = useAppDispatch();
|
|
9
|
+
const domRef = ref(null);
|
|
10
|
+
const scale = useAppSelector(selectContainerScale);
|
|
11
|
+
watch([domRef, scale], () => {
|
|
12
|
+
if (domRef.value == null) return;
|
|
13
|
+
const newScale = domRef.value.getBoundingClientRect().width / domRef.value.offsetWidth;
|
|
14
|
+
if (isWellBehavedNumber(newScale) && newScale !== scale.value) dispatch(setScale(newScale));
|
|
15
|
+
});
|
|
16
|
+
return domRef;
|
|
14
17
|
}
|
|
15
18
|
//#endregion
|
|
16
|
-
export {
|
|
19
|
+
export { useReportScale };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
//#region src/synchronisation/syncSelectors.ts
|
|
2
|
-
function
|
|
3
|
-
return
|
|
2
|
+
function selectSynchronisedTooltipState(state) {
|
|
3
|
+
return state.tooltip.syncInteraction;
|
|
4
4
|
}
|
|
5
5
|
//#endregion
|
|
6
|
-
export {
|
|
6
|
+
export { selectSynchronisedTooltipState };
|
|
@@ -1,24 +1,38 @@
|
|
|
1
|
-
import { selectEventEmitter
|
|
2
|
-
import { setSyncInteraction
|
|
3
|
-
import { useAppSelector
|
|
4
|
-
import { selectTooltipDataKey
|
|
5
|
-
import { TOOLTIP_SYNC_EVENT
|
|
6
|
-
import { selectSynchronisedTooltipState
|
|
7
|
-
import { computed
|
|
1
|
+
import { selectEventEmitter, selectSyncId } from "../state/selectors/rootPropsSelectors.mjs";
|
|
2
|
+
import { setSyncInteraction } from "../state/tooltipSlice.mjs";
|
|
3
|
+
import { useAppSelector } from "../state/hooks.mjs";
|
|
4
|
+
import { selectTooltipDataKey } from "../state/selectors/selectors.mjs";
|
|
5
|
+
import { TOOLTIP_SYNC_EVENT, eventCenter } from "../utils/events.mjs";
|
|
6
|
+
import { selectSynchronisedTooltipState } from "./syncSelectors.mjs";
|
|
7
|
+
import { computed, watchEffect } from "vue";
|
|
8
8
|
//#region src/synchronisation/useChartSynchronisation.tsx
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
9
|
+
/**
|
|
10
|
+
* Emits tooltip sync events to other charts (Vue version).
|
|
11
|
+
* No events if syncId is undefined.
|
|
12
|
+
* Ignores syncMethod (handled on receiver).
|
|
13
|
+
*
|
|
14
|
+
* @param tooltipParams computed object containing tooltip parameters
|
|
15
|
+
* @returns void
|
|
16
|
+
*/
|
|
17
|
+
function useTooltipChartSynchronisation({ tooltipEventType, trigger, activeCoordinate, activeLabel, activeIndex, isTooltipActive }) {
|
|
18
|
+
const activeDataKey = useAppSelector((state) => selectTooltipDataKey(state, tooltipEventType.value, trigger));
|
|
19
|
+
const eventEmitterSymbol = useAppSelector(selectEventEmitter);
|
|
20
|
+
const syncId = useAppSelector(selectSyncId);
|
|
21
|
+
const tooltipState = useAppSelector(selectSynchronisedTooltipState);
|
|
22
|
+
const isReceivingSynchronisation = computed(() => tooltipState.value?.active);
|
|
23
|
+
watchEffect(() => {
|
|
24
|
+
if (isReceivingSynchronisation.value) return;
|
|
25
|
+
if (syncId.value == null) return;
|
|
26
|
+
if (eventEmitterSymbol.value == null) return;
|
|
27
|
+
const syncAction = setSyncInteraction({
|
|
28
|
+
active: isTooltipActive.value,
|
|
29
|
+
coordinate: activeCoordinate.value,
|
|
30
|
+
dataKey: activeDataKey.value,
|
|
31
|
+
index: activeIndex.value,
|
|
32
|
+
label: typeof activeLabel.value === "number" ? String(activeLabel.value) : activeLabel.value
|
|
19
33
|
});
|
|
20
|
-
|
|
34
|
+
eventCenter.emit(TOOLTIP_SYNC_EVENT, syncId.value, syncAction, eventEmitterSymbol.value);
|
|
21
35
|
});
|
|
22
36
|
}
|
|
23
37
|
//#endregion
|
|
24
|
-
export {
|
|
38
|
+
export { useTooltipChartSynchronisation };
|
package/dist/es/types/event.mjs
CHANGED
|
@@ -1,4 +1,166 @@
|
|
|
1
1
|
//#region src/types/event.ts
|
|
2
|
-
var
|
|
2
|
+
var EventKeys = [
|
|
3
|
+
"dangerouslySetInnerHTML",
|
|
4
|
+
"onCopy",
|
|
5
|
+
"onCopyCapture",
|
|
6
|
+
"onCut",
|
|
7
|
+
"onCutCapture",
|
|
8
|
+
"onPaste",
|
|
9
|
+
"onPasteCapture",
|
|
10
|
+
"onCompositionEnd",
|
|
11
|
+
"onCompositionEndCapture",
|
|
12
|
+
"onCompositionStart",
|
|
13
|
+
"onCompositionStartCapture",
|
|
14
|
+
"onCompositionUpdate",
|
|
15
|
+
"onCompositionUpdateCapture",
|
|
16
|
+
"onFocus",
|
|
17
|
+
"onFocusCapture",
|
|
18
|
+
"onBlur",
|
|
19
|
+
"onBlurCapture",
|
|
20
|
+
"onChange",
|
|
21
|
+
"onChangeCapture",
|
|
22
|
+
"onBeforeInput",
|
|
23
|
+
"onBeforeInputCapture",
|
|
24
|
+
"onInput",
|
|
25
|
+
"onInputCapture",
|
|
26
|
+
"onReset",
|
|
27
|
+
"onResetCapture",
|
|
28
|
+
"onSubmit",
|
|
29
|
+
"onSubmitCapture",
|
|
30
|
+
"onInvalid",
|
|
31
|
+
"onInvalidCapture",
|
|
32
|
+
"onLoad",
|
|
33
|
+
"onLoadCapture",
|
|
34
|
+
"onError",
|
|
35
|
+
"onErrorCapture",
|
|
36
|
+
"onKeyDown",
|
|
37
|
+
"onKeyDownCapture",
|
|
38
|
+
"onKeyPress",
|
|
39
|
+
"onKeyPressCapture",
|
|
40
|
+
"onKeyUp",
|
|
41
|
+
"onKeyUpCapture",
|
|
42
|
+
"onAbort",
|
|
43
|
+
"onAbortCapture",
|
|
44
|
+
"onCanPlay",
|
|
45
|
+
"onCanPlayCapture",
|
|
46
|
+
"onCanPlayThrough",
|
|
47
|
+
"onCanPlayThroughCapture",
|
|
48
|
+
"onDurationChange",
|
|
49
|
+
"onDurationChangeCapture",
|
|
50
|
+
"onEmptied",
|
|
51
|
+
"onEmptiedCapture",
|
|
52
|
+
"onEncrypted",
|
|
53
|
+
"onEncryptedCapture",
|
|
54
|
+
"onEnded",
|
|
55
|
+
"onEndedCapture",
|
|
56
|
+
"onLoadedData",
|
|
57
|
+
"onLoadedDataCapture",
|
|
58
|
+
"onLoadedMetadata",
|
|
59
|
+
"onLoadedMetadataCapture",
|
|
60
|
+
"onLoadStart",
|
|
61
|
+
"onLoadStartCapture",
|
|
62
|
+
"onPause",
|
|
63
|
+
"onPauseCapture",
|
|
64
|
+
"onPlay",
|
|
65
|
+
"onPlayCapture",
|
|
66
|
+
"onPlaying",
|
|
67
|
+
"onPlayingCapture",
|
|
68
|
+
"onProgress",
|
|
69
|
+
"onProgressCapture",
|
|
70
|
+
"onRateChange",
|
|
71
|
+
"onRateChangeCapture",
|
|
72
|
+
"onSeeked",
|
|
73
|
+
"onSeekedCapture",
|
|
74
|
+
"onSeeking",
|
|
75
|
+
"onSeekingCapture",
|
|
76
|
+
"onStalled",
|
|
77
|
+
"onStalledCapture",
|
|
78
|
+
"onSuspend",
|
|
79
|
+
"onSuspendCapture",
|
|
80
|
+
"onTimeUpdate",
|
|
81
|
+
"onTimeUpdateCapture",
|
|
82
|
+
"onVolumeChange",
|
|
83
|
+
"onVolumeChangeCapture",
|
|
84
|
+
"onWaiting",
|
|
85
|
+
"onWaitingCapture",
|
|
86
|
+
"onAuxClick",
|
|
87
|
+
"onAuxClickCapture",
|
|
88
|
+
"onClick",
|
|
89
|
+
"onClickCapture",
|
|
90
|
+
"onContextMenu",
|
|
91
|
+
"onContextMenuCapture",
|
|
92
|
+
"onDoubleClick",
|
|
93
|
+
"onDoubleClickCapture",
|
|
94
|
+
"onDrag",
|
|
95
|
+
"onDragCapture",
|
|
96
|
+
"onDragEnd",
|
|
97
|
+
"onDragEndCapture",
|
|
98
|
+
"onDragEnter",
|
|
99
|
+
"onDragEnterCapture",
|
|
100
|
+
"onDragExit",
|
|
101
|
+
"onDragExitCapture",
|
|
102
|
+
"onDragLeave",
|
|
103
|
+
"onDragLeaveCapture",
|
|
104
|
+
"onDragOver",
|
|
105
|
+
"onDragOverCapture",
|
|
106
|
+
"onDragStart",
|
|
107
|
+
"onDragStartCapture",
|
|
108
|
+
"onDrop",
|
|
109
|
+
"onDropCapture",
|
|
110
|
+
"onMouseDown",
|
|
111
|
+
"onMouseDownCapture",
|
|
112
|
+
"onMouseEnter",
|
|
113
|
+
"onMouseLeave",
|
|
114
|
+
"onMouseMove",
|
|
115
|
+
"onMouseMoveCapture",
|
|
116
|
+
"onMouseOut",
|
|
117
|
+
"onMouseOutCapture",
|
|
118
|
+
"onMouseOver",
|
|
119
|
+
"onMouseOverCapture",
|
|
120
|
+
"onMouseUp",
|
|
121
|
+
"onMouseUpCapture",
|
|
122
|
+
"onSelect",
|
|
123
|
+
"onSelectCapture",
|
|
124
|
+
"onTouchCancel",
|
|
125
|
+
"onTouchCancelCapture",
|
|
126
|
+
"onTouchEnd",
|
|
127
|
+
"onTouchEndCapture",
|
|
128
|
+
"onTouchMove",
|
|
129
|
+
"onTouchMoveCapture",
|
|
130
|
+
"onTouchStart",
|
|
131
|
+
"onTouchStartCapture",
|
|
132
|
+
"onPointerDown",
|
|
133
|
+
"onPointerDownCapture",
|
|
134
|
+
"onPointerMove",
|
|
135
|
+
"onPointerMoveCapture",
|
|
136
|
+
"onPointerUp",
|
|
137
|
+
"onPointerUpCapture",
|
|
138
|
+
"onPointerCancel",
|
|
139
|
+
"onPointerCancelCapture",
|
|
140
|
+
"onPointerEnter",
|
|
141
|
+
"onPointerEnterCapture",
|
|
142
|
+
"onPointerLeave",
|
|
143
|
+
"onPointerLeaveCapture",
|
|
144
|
+
"onPointerOver",
|
|
145
|
+
"onPointerOverCapture",
|
|
146
|
+
"onPointerOut",
|
|
147
|
+
"onPointerOutCapture",
|
|
148
|
+
"onGotPointerCapture",
|
|
149
|
+
"onGotPointerCaptureCapture",
|
|
150
|
+
"onLostPointerCapture",
|
|
151
|
+
"onLostPointerCaptureCapture",
|
|
152
|
+
"onScroll",
|
|
153
|
+
"onScrollCapture",
|
|
154
|
+
"onWheel",
|
|
155
|
+
"onWheelCapture",
|
|
156
|
+
"onAnimationStart",
|
|
157
|
+
"onAnimationStartCapture",
|
|
158
|
+
"onAnimationEnd",
|
|
159
|
+
"onAnimationEndCapture",
|
|
160
|
+
"onAnimationIteration",
|
|
161
|
+
"onAnimationIterationCapture",
|
|
162
|
+
"onTransitionEnd",
|
|
163
|
+
"onTransitionEndCapture"
|
|
164
|
+
];
|
|
3
165
|
//#endregion
|
|
4
|
-
export {
|
|
166
|
+
export { EventKeys };
|