victory-tooltip 36.8.2 → 36.8.4
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/CHANGELOG.md +8 -0
- package/dist/victory-tooltip.js +123 -322
- package/dist/victory-tooltip.min.js +1 -1
- package/es/flyout.d.ts +31 -0
- package/es/flyout.js +32 -36
- package/es/index.d.ts +3 -92
- package/es/index.js +2 -2
- package/es/victory-tooltip.d.ts +169 -0
- package/es/victory-tooltip.js +32 -75
- package/lib/flyout.d.ts +31 -0
- package/lib/flyout.js +37 -36
- package/lib/index.d.ts +3 -92
- package/lib/index.js +23 -15
- package/lib/victory-tooltip.d.ts +169 -0
- package/lib/victory-tooltip.js +31 -72
- package/package.json +5 -2
- package/src/{flyout.js → flyout.tsx} +88 -36
- package/src/index.ts +2 -0
- package/src/{victory-tooltip.js → victory-tooltip.tsx} +135 -123
- package/src/index.d.ts +0 -92
- package/src/index.js +0 -2
package/es/index.d.ts
CHANGED
|
@@ -1,92 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
NumberOrCallback,
|
|
5
|
-
StringOrNumberOrCallback,
|
|
6
|
-
VictoryCommonProps,
|
|
7
|
-
VictoryLabelableProps,
|
|
8
|
-
VictoryThemeDefinition,
|
|
9
|
-
VictoryStyleObject,
|
|
10
|
-
VictoryLabelStyleObject,
|
|
11
|
-
PaddingOrCallback,
|
|
12
|
-
EventPropTypeInterface,
|
|
13
|
-
} from "victory-core";
|
|
14
|
-
|
|
15
|
-
export interface VictoryTooltipProps extends VictoryLabelableProps {
|
|
16
|
-
active?: boolean;
|
|
17
|
-
activateData?: boolean;
|
|
18
|
-
activePoints?: any[];
|
|
19
|
-
angle?: string | number;
|
|
20
|
-
center?: { x: number | undefined; y: number | undefined };
|
|
21
|
-
centerOffset?: {
|
|
22
|
-
x?: NumberOrCallback;
|
|
23
|
-
y?: NumberOrCallback;
|
|
24
|
-
};
|
|
25
|
-
constrainToVisibleArea?: boolean;
|
|
26
|
-
cornerRadius?: NumberOrCallback;
|
|
27
|
-
datum?: {};
|
|
28
|
-
data?: any[];
|
|
29
|
-
dx?: NumberOrCallback;
|
|
30
|
-
dy?: NumberOrCallback;
|
|
31
|
-
groupComponent?: React.ReactElement;
|
|
32
|
-
height?: number;
|
|
33
|
-
horizontal?: boolean;
|
|
34
|
-
events?: { [key: string]: (event: React.SyntheticEvent<any>) => void };
|
|
35
|
-
flyoutHeight?: NumberOrCallback;
|
|
36
|
-
flyoutWidth?: NumberOrCallback;
|
|
37
|
-
flyoutStyle?: VictoryStyleObject;
|
|
38
|
-
flyoutComponent?: React.ReactElement;
|
|
39
|
-
flyoutPadding?: PaddingOrCallback;
|
|
40
|
-
index?: number | string;
|
|
41
|
-
orientation?: OrientationTypes | ((...args: any[]) => OrientationTypes);
|
|
42
|
-
pointerLength?: NumberOrCallback;
|
|
43
|
-
pointerOrientation?:
|
|
44
|
-
| OrientationTypes
|
|
45
|
-
| ((...args: any[]) => OrientationTypes);
|
|
46
|
-
pointerWidth?: NumberOrCallback;
|
|
47
|
-
renderInPortal?: boolean;
|
|
48
|
-
style?: VictoryLabelStyleObject | VictoryLabelStyleObject[];
|
|
49
|
-
text?: StringOrNumberOrCallback | string[] | number[];
|
|
50
|
-
theme?: VictoryThemeDefinition;
|
|
51
|
-
width?: number;
|
|
52
|
-
x?: number;
|
|
53
|
-
y?: number;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
export interface FlyoutProps extends VictoryCommonProps {
|
|
57
|
-
active?: boolean;
|
|
58
|
-
center?: {
|
|
59
|
-
x?: number;
|
|
60
|
-
y?: number;
|
|
61
|
-
};
|
|
62
|
-
className?: string;
|
|
63
|
-
cornerRadius?: number;
|
|
64
|
-
data?: any[];
|
|
65
|
-
datum?: object;
|
|
66
|
-
dx?: number;
|
|
67
|
-
dy?: number;
|
|
68
|
-
events?: object;
|
|
69
|
-
height?: number;
|
|
70
|
-
id?: string | number;
|
|
71
|
-
index?: number;
|
|
72
|
-
orientation?: OrientationTypes;
|
|
73
|
-
pathComponent?: React.ReactElement;
|
|
74
|
-
pointerLength?: number;
|
|
75
|
-
pointerWidth?: number;
|
|
76
|
-
role?: string;
|
|
77
|
-
shapeRendering?: string;
|
|
78
|
-
style?: VictoryStyleObject;
|
|
79
|
-
transform?: string;
|
|
80
|
-
width?: number;
|
|
81
|
-
x?: number;
|
|
82
|
-
y?: number;
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
export class Flyout extends React.Component<FlyoutProps, any> {}
|
|
86
|
-
|
|
87
|
-
export class VictoryTooltip extends React.Component<VictoryTooltipProps, any> {
|
|
88
|
-
static defaultEvents: EventPropTypeInterface<
|
|
89
|
-
string,
|
|
90
|
-
StringOrNumberOrCallback
|
|
91
|
-
>[];
|
|
92
|
-
}
|
|
1
|
+
export * from "./victory-tooltip";
|
|
2
|
+
export * from "./flyout";
|
|
3
|
+
//# sourceMappingURL=index.d.ts.map
|
package/es/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
1
|
+
export * from "./victory-tooltip";
|
|
2
|
+
export * from "./flyout";
|
|
@@ -0,0 +1,169 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { VictoryLabelableProps, VictoryLabelProps, VictoryLabelStyleObject, NumberOrCallback, PaddingOrCallback, VictoryStyleObject, OrientationTypes, VictoryThemeDefinition } from "victory-core";
|
|
3
|
+
export interface VictoryTooltipProps extends VictoryLabelableProps, VictoryLabelProps {
|
|
4
|
+
activateData?: boolean;
|
|
5
|
+
active?: boolean;
|
|
6
|
+
activePoints?: any[];
|
|
7
|
+
angle?: number;
|
|
8
|
+
center?: {
|
|
9
|
+
x?: number;
|
|
10
|
+
y?: number;
|
|
11
|
+
};
|
|
12
|
+
centerOffset?: {
|
|
13
|
+
x?: NumberOrCallback;
|
|
14
|
+
y?: NumberOrCallback;
|
|
15
|
+
};
|
|
16
|
+
constrainToVisibleArea?: boolean;
|
|
17
|
+
cornerRadius?: NumberOrCallback;
|
|
18
|
+
events?: any;
|
|
19
|
+
height?: number;
|
|
20
|
+
horizontal?: boolean;
|
|
21
|
+
flyoutComponent?: React.ReactElement;
|
|
22
|
+
flyoutHeight?: NumberOrCallback;
|
|
23
|
+
flyoutPadding?: PaddingOrCallback;
|
|
24
|
+
flyoutStyle?: VictoryStyleObject;
|
|
25
|
+
flyoutWidth?: NumberOrCallback;
|
|
26
|
+
id?: number | string;
|
|
27
|
+
index?: number | string;
|
|
28
|
+
orientation?: OrientationTypes | ((...args: any[]) => OrientationTypes);
|
|
29
|
+
pointerLength?: NumberOrCallback;
|
|
30
|
+
pointerOrientation?: OrientationTypes | ((...args: any[]) => OrientationTypes);
|
|
31
|
+
pointerWidth?: NumberOrCallback;
|
|
32
|
+
style?: (VictoryLabelStyleObject & {
|
|
33
|
+
angle?: number;
|
|
34
|
+
}) | VictoryLabelStyleObject[];
|
|
35
|
+
theme?: VictoryThemeDefinition;
|
|
36
|
+
width?: number;
|
|
37
|
+
}
|
|
38
|
+
declare type InternalEvaluatedProps = VictoryTooltipProps & {
|
|
39
|
+
centerOffset: {
|
|
40
|
+
x: number;
|
|
41
|
+
y: number;
|
|
42
|
+
};
|
|
43
|
+
cornerRadius?: number;
|
|
44
|
+
dx?: string | number;
|
|
45
|
+
dy?: string | number;
|
|
46
|
+
flyoutHeight: number;
|
|
47
|
+
flyoutPadding: {
|
|
48
|
+
top: number;
|
|
49
|
+
bottom: number;
|
|
50
|
+
left: number;
|
|
51
|
+
right: number;
|
|
52
|
+
};
|
|
53
|
+
flyoutWidth: number;
|
|
54
|
+
orientation: OrientationTypes;
|
|
55
|
+
pointerLength?: number;
|
|
56
|
+
pointerWidth?: number;
|
|
57
|
+
style: any;
|
|
58
|
+
text: string | string[];
|
|
59
|
+
};
|
|
60
|
+
export declare class VictoryTooltip extends React.Component<VictoryTooltipProps> {
|
|
61
|
+
static displayName: string;
|
|
62
|
+
static role: string;
|
|
63
|
+
static defaultProps: {
|
|
64
|
+
active: boolean;
|
|
65
|
+
renderInPortal: boolean;
|
|
66
|
+
labelComponent: JSX.Element;
|
|
67
|
+
flyoutComponent: JSX.Element;
|
|
68
|
+
groupComponent: JSX.Element;
|
|
69
|
+
};
|
|
70
|
+
static defaultEvents: (props: VictoryTooltipProps) => {
|
|
71
|
+
target: string;
|
|
72
|
+
eventHandlers: {
|
|
73
|
+
onMouseOver: () => {
|
|
74
|
+
target: string;
|
|
75
|
+
mutation: () => {
|
|
76
|
+
active: boolean;
|
|
77
|
+
};
|
|
78
|
+
}[];
|
|
79
|
+
onFocus: () => {
|
|
80
|
+
target: string;
|
|
81
|
+
mutation: () => {
|
|
82
|
+
active: boolean;
|
|
83
|
+
};
|
|
84
|
+
}[];
|
|
85
|
+
onTouchStart: () => {
|
|
86
|
+
target: string;
|
|
87
|
+
mutation: () => {
|
|
88
|
+
active: boolean;
|
|
89
|
+
};
|
|
90
|
+
}[];
|
|
91
|
+
onMouseOut: () => {
|
|
92
|
+
target: string;
|
|
93
|
+
mutation: () => {
|
|
94
|
+
active: undefined;
|
|
95
|
+
};
|
|
96
|
+
}[];
|
|
97
|
+
onBlur: () => {
|
|
98
|
+
target: string;
|
|
99
|
+
mutation: () => {
|
|
100
|
+
active: undefined;
|
|
101
|
+
};
|
|
102
|
+
}[];
|
|
103
|
+
onTouchEnd: () => {
|
|
104
|
+
target: string;
|
|
105
|
+
mutation: () => {
|
|
106
|
+
active: undefined;
|
|
107
|
+
};
|
|
108
|
+
}[];
|
|
109
|
+
};
|
|
110
|
+
}[];
|
|
111
|
+
id: string | number;
|
|
112
|
+
constructor(props: VictoryTooltipProps);
|
|
113
|
+
getDefaultOrientation(props: VictoryTooltipProps): OrientationTypes;
|
|
114
|
+
getPolarOrientation(props: VictoryTooltipProps): OrientationTypes;
|
|
115
|
+
getVerticalOrientations(degrees: number): OrientationTypes;
|
|
116
|
+
getStyles(props: any): {
|
|
117
|
+
style: any;
|
|
118
|
+
flyoutStyle: any;
|
|
119
|
+
};
|
|
120
|
+
getEvaluatedProps(props: VictoryTooltipProps): InternalEvaluatedProps;
|
|
121
|
+
getCalculatedValues(props: InternalEvaluatedProps): {
|
|
122
|
+
style: any;
|
|
123
|
+
flyoutStyle?: VictoryStyleObject;
|
|
124
|
+
labelSize: {
|
|
125
|
+
width: number;
|
|
126
|
+
height: number;
|
|
127
|
+
};
|
|
128
|
+
flyoutDimensions: {
|
|
129
|
+
height: number;
|
|
130
|
+
width: number;
|
|
131
|
+
};
|
|
132
|
+
flyoutCenter: {
|
|
133
|
+
x: number;
|
|
134
|
+
y: number;
|
|
135
|
+
};
|
|
136
|
+
transform?: string;
|
|
137
|
+
};
|
|
138
|
+
getTransform(props: any): string | undefined;
|
|
139
|
+
getDefaultAngle(props: any): number;
|
|
140
|
+
constrainTooltip(center: any, props: any, dimensions: any): {
|
|
141
|
+
x: number;
|
|
142
|
+
y: number;
|
|
143
|
+
};
|
|
144
|
+
getFlyoutCenter(props: any, dimensions: any): {
|
|
145
|
+
x: any;
|
|
146
|
+
y: any;
|
|
147
|
+
};
|
|
148
|
+
getLabelPadding(style: any): number;
|
|
149
|
+
getDimensions(props: any, labelSize: any): {
|
|
150
|
+
flyoutHeight: any;
|
|
151
|
+
flyoutWidth: any;
|
|
152
|
+
};
|
|
153
|
+
getLabelProps(props: InternalEvaluatedProps, calculatedValues: any): any;
|
|
154
|
+
getPointerOrientation(point: {
|
|
155
|
+
x: number;
|
|
156
|
+
y: number;
|
|
157
|
+
}, center: {
|
|
158
|
+
x: number;
|
|
159
|
+
y: number;
|
|
160
|
+
}, flyoutDimensions: {
|
|
161
|
+
height: number;
|
|
162
|
+
width: number;
|
|
163
|
+
}): string;
|
|
164
|
+
getFlyoutProps(props: InternalEvaluatedProps, calculatedValues: any): any;
|
|
165
|
+
renderTooltip(props: VictoryTooltipProps): React.ReactElement | null;
|
|
166
|
+
render(): React.ReactElement | null;
|
|
167
|
+
}
|
|
168
|
+
export {};
|
|
169
|
+
//# sourceMappingURL=victory-tooltip.d.ts.map
|
package/es/victory-tooltip.js
CHANGED
|
@@ -16,6 +16,12 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
|
|
|
16
16
|
|
|
17
17
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
18
18
|
|
|
19
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
20
|
+
|
|
21
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
22
|
+
|
|
23
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
24
|
+
|
|
19
25
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
20
26
|
|
|
21
27
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
@@ -36,17 +42,16 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
|
|
|
36
42
|
|
|
37
43
|
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
|
38
44
|
|
|
45
|
+
/* eslint-disable react/prop-types */
|
|
39
46
|
import React from "react";
|
|
40
|
-
import
|
|
41
|
-
import {
|
|
42
|
-
import Flyout from "./flyout";
|
|
47
|
+
import { TextSize, Helpers, LabelHelpers, VictoryLabel, VictoryTheme, VictoryPortal } from "victory-core";
|
|
48
|
+
import { Flyout } from "./flyout";
|
|
43
49
|
var fallbackProps = {
|
|
44
50
|
cornerRadius: 5,
|
|
45
51
|
pointerLength: 10,
|
|
46
52
|
pointerWidth: 10
|
|
47
53
|
};
|
|
48
|
-
|
|
49
|
-
var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
54
|
+
export var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
50
55
|
_inherits(VictoryTooltip, _React$Component);
|
|
51
56
|
|
|
52
57
|
var _super = _createSuper(VictoryTooltip);
|
|
@@ -57,6 +62,7 @@ var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
|
57
62
|
_classCallCheck(this, VictoryTooltip);
|
|
58
63
|
|
|
59
64
|
_this = _super.call(this, props);
|
|
65
|
+
_this.id = void 0;
|
|
60
66
|
_this.id = props.id === undefined ? _uniqueId("tooltip-") : props.id;
|
|
61
67
|
return _this;
|
|
62
68
|
}
|
|
@@ -74,15 +80,15 @@ var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
|
74
80
|
return datum && datum.y < 0 ? negative : positive;
|
|
75
81
|
}
|
|
76
82
|
|
|
77
|
-
return this.getPolarOrientation(props
|
|
83
|
+
return this.getPolarOrientation(props);
|
|
78
84
|
}
|
|
79
85
|
}, {
|
|
80
86
|
key: "getPolarOrientation",
|
|
81
|
-
value: function getPolarOrientation(props
|
|
82
|
-
var degrees = LabelHelpers.getDegrees(props, datum);
|
|
87
|
+
value: function getPolarOrientation(props) {
|
|
88
|
+
var degrees = LabelHelpers.getDegrees(props, props.datum);
|
|
83
89
|
var placement = props.labelPlacement || "vertical";
|
|
84
90
|
|
|
85
|
-
if (placement === "
|
|
91
|
+
if (placement === "vertical") {
|
|
86
92
|
return this.getVerticalOrientations(degrees);
|
|
87
93
|
} else if (placement === "parallel") {
|
|
88
94
|
return degrees < 90 || degrees > 270 ? "right" : "left";
|
|
@@ -137,6 +143,14 @@ var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
|
137
143
|
active: active
|
|
138
144
|
}));
|
|
139
145
|
|
|
146
|
+
if (text === undefined || text === null) {
|
|
147
|
+
text = "";
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
if (typeof text === "number") {
|
|
151
|
+
text = text.toString();
|
|
152
|
+
}
|
|
153
|
+
|
|
140
154
|
var _this$getStyles = this.getStyles(_assign({}, props, {
|
|
141
155
|
active: active,
|
|
142
156
|
text: text
|
|
@@ -202,9 +216,9 @@ var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
|
202
216
|
pointerLength: pointerLength
|
|
203
217
|
});
|
|
204
218
|
|
|
205
|
-
var offsetX = _isPlainObject(centerOffset) && centerOffset.x !== undefined ? Helpers.evaluateProp(centerOffset.x, evaluatedProps) : 0;
|
|
206
|
-
var offsetY = _isPlainObject(centerOffset) && centerOffset.y !== undefined ? Helpers.evaluateProp(centerOffset.y, evaluatedProps) : 0;
|
|
207
|
-
return
|
|
219
|
+
var offsetX = _isPlainObject(centerOffset) && (centerOffset === null || centerOffset === void 0 ? void 0 : centerOffset.x) !== undefined ? Helpers.evaluateProp(centerOffset.x, evaluatedProps) : 0;
|
|
220
|
+
var offsetY = _isPlainObject(centerOffset) && (centerOffset === null || centerOffset === void 0 ? void 0 : centerOffset.y) !== undefined ? Helpers.evaluateProp(centerOffset.y, evaluatedProps) : 0;
|
|
221
|
+
return _objectSpread(_objectSpread({}, evaluatedProps), {}, {
|
|
208
222
|
centerOffset: {
|
|
209
223
|
x: offsetX,
|
|
210
224
|
y: offsetY
|
|
@@ -247,8 +261,7 @@ var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
|
247
261
|
var labelStyle = style || {};
|
|
248
262
|
var angle = labelStyle.angle || props.angle || this.getDefaultAngle(props);
|
|
249
263
|
return angle ? "rotate(".concat(angle, " ").concat(x, " ").concat(y, ")") : undefined;
|
|
250
|
-
}
|
|
251
|
-
|
|
264
|
+
}
|
|
252
265
|
}, {
|
|
253
266
|
key: "getDefaultAngle",
|
|
254
267
|
value: function getDefaultAngle(props) {
|
|
@@ -264,7 +277,7 @@ var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
|
264
277
|
var degrees = LabelHelpers.getDegrees(props, datum);
|
|
265
278
|
var sign = degrees > 90 && degrees < 180 || degrees > 270 ? 1 : -1;
|
|
266
279
|
var labelRotation = labelPlacement === "perpendicular" ? 0 : 90;
|
|
267
|
-
var angle;
|
|
280
|
+
var angle = 0;
|
|
268
281
|
|
|
269
282
|
if (degrees === 0 || degrees === 180) {
|
|
270
283
|
angle = orientation === "top" && degrees === 180 ? 270 : 90;
|
|
@@ -366,8 +379,8 @@ var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
|
366
379
|
};
|
|
367
380
|
|
|
368
381
|
return {
|
|
369
|
-
flyoutHeight: flyoutHeight ? Helpers.evaluateProp(flyoutHeight, props) : getHeight(
|
|
370
|
-
flyoutWidth: flyoutWidth ? Helpers.evaluateProp(flyoutWidth, props) : getWidth(
|
|
382
|
+
flyoutHeight: flyoutHeight ? Helpers.evaluateProp(flyoutHeight, props) : getHeight(),
|
|
383
|
+
flyoutWidth: flyoutWidth ? Helpers.evaluateProp(flyoutWidth, props) : getWidth()
|
|
371
384
|
};
|
|
372
385
|
}
|
|
373
386
|
}, {
|
|
@@ -486,7 +499,7 @@ var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
|
486
499
|
var renderInPortal = props.renderInPortal;
|
|
487
500
|
|
|
488
501
|
if (!active) {
|
|
489
|
-
return renderInPortal ? /*#__PURE__*/React.createElement(VictoryPortal, null
|
|
502
|
+
return renderInPortal ? /*#__PURE__*/React.createElement(VictoryPortal, null) : null;
|
|
490
503
|
}
|
|
491
504
|
|
|
492
505
|
var evaluatedProps = this.getEvaluatedProps(props);
|
|
@@ -511,62 +524,8 @@ var VictoryTooltip = /*#__PURE__*/function (_React$Component) {
|
|
|
511
524
|
|
|
512
525
|
return VictoryTooltip;
|
|
513
526
|
}(React.Component);
|
|
514
|
-
|
|
515
527
|
VictoryTooltip.displayName = "VictoryTooltip";
|
|
516
528
|
VictoryTooltip.role = "tooltip";
|
|
517
|
-
VictoryTooltip.propTypes = {
|
|
518
|
-
activateData: PropTypes.bool,
|
|
519
|
-
active: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),
|
|
520
|
-
activePoints: PropTypes.array,
|
|
521
|
-
angle: PropTypes.number,
|
|
522
|
-
center: PropTypes.shape({
|
|
523
|
-
x: CustomPropTypes.nonNegative,
|
|
524
|
-
y: CustomPropTypes.nonNegative
|
|
525
|
-
}),
|
|
526
|
-
centerOffset: PropTypes.shape({
|
|
527
|
-
x: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
|
|
528
|
-
y: PropTypes.oneOfType([PropTypes.number, PropTypes.func])
|
|
529
|
-
}),
|
|
530
|
-
constrainToVisibleArea: PropTypes.bool,
|
|
531
|
-
cornerRadius: PropTypes.oneOfType([CustomPropTypes.nonNegative, PropTypes.func]),
|
|
532
|
-
data: PropTypes.array,
|
|
533
|
-
datum: PropTypes.object,
|
|
534
|
-
dx: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
|
|
535
|
-
dy: PropTypes.oneOfType([PropTypes.number, PropTypes.func]),
|
|
536
|
-
events: PropTypes.object,
|
|
537
|
-
flyoutComponent: PropTypes.element,
|
|
538
|
-
flyoutHeight: PropTypes.oneOfType([CustomPropTypes.nonNegative, PropTypes.func]),
|
|
539
|
-
flyoutPadding: PropTypes.oneOfType([PropTypes.func, PropTypes.number, PropTypes.shape({
|
|
540
|
-
top: PropTypes.number,
|
|
541
|
-
bottom: PropTypes.number,
|
|
542
|
-
left: PropTypes.number,
|
|
543
|
-
right: PropTypes.number
|
|
544
|
-
})]),
|
|
545
|
-
flyoutStyle: PropTypes.object,
|
|
546
|
-
flyoutWidth: PropTypes.oneOfType([CustomPropTypes.nonNegative, PropTypes.func]),
|
|
547
|
-
groupComponent: PropTypes.element,
|
|
548
|
-
height: PropTypes.number,
|
|
549
|
-
horizontal: PropTypes.bool,
|
|
550
|
-
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
551
|
-
index: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
552
|
-
labelComponent: PropTypes.element,
|
|
553
|
-
orientation: PropTypes.oneOfType([PropTypes.oneOf(["top", "bottom", "left", "right"]), PropTypes.func]),
|
|
554
|
-
pointerLength: PropTypes.oneOfType([CustomPropTypes.nonNegative, PropTypes.func]),
|
|
555
|
-
pointerOrientation: PropTypes.oneOfType([PropTypes.oneOf(["top", "bottom", "left", "right"]), PropTypes.func]),
|
|
556
|
-
pointerWidth: PropTypes.oneOfType([CustomPropTypes.nonNegative, PropTypes.func]),
|
|
557
|
-
polar: PropTypes.bool,
|
|
558
|
-
renderInPortal: PropTypes.bool,
|
|
559
|
-
scale: PropTypes.shape({
|
|
560
|
-
x: CustomPropTypes.scale,
|
|
561
|
-
y: CustomPropTypes.scale
|
|
562
|
-
}),
|
|
563
|
-
style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
|
|
564
|
-
text: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.func, PropTypes.array]),
|
|
565
|
-
theme: PropTypes.object,
|
|
566
|
-
width: PropTypes.number,
|
|
567
|
-
x: PropTypes.number,
|
|
568
|
-
y: PropTypes.number
|
|
569
|
-
};
|
|
570
529
|
VictoryTooltip.defaultProps = {
|
|
571
530
|
active: false,
|
|
572
531
|
renderInPortal: true,
|
|
@@ -643,6 +602,4 @@ VictoryTooltip.defaultEvents = function (props) {
|
|
|
643
602
|
}
|
|
644
603
|
}
|
|
645
604
|
}];
|
|
646
|
-
};
|
|
647
|
-
|
|
648
|
-
export { VictoryTooltip as default };
|
|
605
|
+
};
|
package/lib/flyout.d.ts
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { VictoryCommonProps, OrientationTypes, VictoryStyleObject, StringOrNumberOrCallback } from "victory-core";
|
|
3
|
+
export interface FlyoutProps extends VictoryCommonProps {
|
|
4
|
+
active?: boolean;
|
|
5
|
+
center?: {
|
|
6
|
+
x: number;
|
|
7
|
+
y: number;
|
|
8
|
+
};
|
|
9
|
+
className?: string;
|
|
10
|
+
clipPath?: string;
|
|
11
|
+
cornerRadius?: number;
|
|
12
|
+
data?: any[];
|
|
13
|
+
datum?: object;
|
|
14
|
+
dx?: number;
|
|
15
|
+
dy?: number;
|
|
16
|
+
events?: object;
|
|
17
|
+
id?: StringOrNumberOrCallback;
|
|
18
|
+
index?: number;
|
|
19
|
+
orientation?: OrientationTypes;
|
|
20
|
+
pathComponent?: React.ReactElement;
|
|
21
|
+
pointerLength?: number;
|
|
22
|
+
pointerWidth?: number;
|
|
23
|
+
role?: string;
|
|
24
|
+
shapeRendering?: string;
|
|
25
|
+
style?: VictoryStyleObject;
|
|
26
|
+
transform?: string;
|
|
27
|
+
x?: number;
|
|
28
|
+
y?: number;
|
|
29
|
+
}
|
|
30
|
+
export declare const Flyout: React.FC<FlyoutProps>;
|
|
31
|
+
//# sourceMappingURL=flyout.d.ts.map
|
package/lib/flyout.js
CHANGED
|
@@ -3,16 +3,10 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
7
|
-
|
|
8
|
-
var _assign2 = _interopRequireDefault(require("lodash/assign"));
|
|
9
|
-
|
|
10
|
-
var _isPlainObject2 = _interopRequireDefault(require("lodash/isPlainObject"));
|
|
6
|
+
exports.Flyout = void 0;
|
|
11
7
|
|
|
12
8
|
var _react = _interopRequireDefault(require("react"));
|
|
13
9
|
|
|
14
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
15
|
-
|
|
16
10
|
var _victoryCore = require("victory-core");
|
|
17
11
|
|
|
18
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -33,8 +27,8 @@ var getVerticalPath = function (props) {
|
|
|
33
27
|
var sign = orientation === "bottom" ? 1 : -1;
|
|
34
28
|
var x = props.x + (props.dx || 0);
|
|
35
29
|
var y = props.y + (props.dy || 0);
|
|
36
|
-
var centerX =
|
|
37
|
-
var centerY =
|
|
30
|
+
var centerX = center.x;
|
|
31
|
+
var centerY = center.y;
|
|
38
32
|
var pointerEdge = centerY + sign * (height / 2);
|
|
39
33
|
var oppositeEdge = centerY - sign * (height / 2);
|
|
40
34
|
var rightEdge = centerX + width / 2;
|
|
@@ -55,8 +49,8 @@ var getHorizontalPath = function (props) {
|
|
|
55
49
|
var sign = orientation === "left" ? 1 : -1;
|
|
56
50
|
var x = props.x + (props.dx || 0);
|
|
57
51
|
var y = props.y + (props.dy || 0);
|
|
58
|
-
var centerX =
|
|
59
|
-
var centerY =
|
|
52
|
+
var centerX = center.x;
|
|
53
|
+
var centerY = center.y;
|
|
60
54
|
var pointerEdge = centerX - sign * (width / 2);
|
|
61
55
|
var oppositeEdge = centerX + sign * (width / 2);
|
|
62
56
|
var bottomEdge = centerY + height / 2;
|
|
@@ -82,7 +76,7 @@ var evaluateProps = function (props) {
|
|
|
82
76
|
|
|
83
77
|
var style = _victoryCore.Helpers.evaluateStyle(props.style, props);
|
|
84
78
|
|
|
85
|
-
return (
|
|
79
|
+
return _objectSpread(_objectSpread({}, props), {}, {
|
|
86
80
|
id: id,
|
|
87
81
|
style: style
|
|
88
82
|
});
|
|
@@ -94,14 +88,40 @@ var defaultProps = {
|
|
|
94
88
|
shapeRendering: "auto"
|
|
95
89
|
};
|
|
96
90
|
|
|
97
|
-
var Flyout = function (
|
|
98
|
-
props = evaluateProps(_objectSpread(_objectSpread({}, defaultProps),
|
|
91
|
+
var Flyout = function (initialProps) {
|
|
92
|
+
var props = evaluateProps(_objectSpread(_objectSpread({}, defaultProps), initialProps));
|
|
93
|
+
|
|
94
|
+
var userProps = _victoryCore.UserProps.getSafeUserProps(props); // check for required props for this subcomponent
|
|
95
|
+
// they should be passed in from the wrapper
|
|
96
|
+
|
|
99
97
|
|
|
100
|
-
|
|
98
|
+
_victoryCore.UserProps.assert(props.height, "Flyout props[height] is undefined");
|
|
101
99
|
|
|
100
|
+
_victoryCore.UserProps.assert(props.width, "Flyout props[width] is undefined");
|
|
101
|
+
|
|
102
|
+
_victoryCore.UserProps.assert(props.x, "Flyout props[x] is undefined");
|
|
103
|
+
|
|
104
|
+
_victoryCore.UserProps.assert(props.y, "Flyout props[y] is undefined");
|
|
105
|
+
|
|
106
|
+
var flyoutPathProps = {
|
|
107
|
+
center: props.center || {
|
|
108
|
+
x: 0,
|
|
109
|
+
y: 0
|
|
110
|
+
},
|
|
111
|
+
cornerRadius: props.cornerRadius || 0,
|
|
112
|
+
dx: props.dx,
|
|
113
|
+
dy: props.dy,
|
|
114
|
+
height: props.height,
|
|
115
|
+
orientation: props.orientation || "top",
|
|
116
|
+
pointerLength: props.pointerLength || 0,
|
|
117
|
+
pointerWidth: props.pointerWidth || 0,
|
|
118
|
+
width: props.width,
|
|
119
|
+
x: props.x,
|
|
120
|
+
y: props.y
|
|
121
|
+
};
|
|
102
122
|
return /*#__PURE__*/_react.default.cloneElement(props.pathComponent, _objectSpread(_objectSpread(_objectSpread({}, props.events), userProps), {}, {
|
|
103
123
|
style: props.style,
|
|
104
|
-
d: getFlyoutPath(
|
|
124
|
+
d: getFlyoutPath(flyoutPathProps),
|
|
105
125
|
className: props.className,
|
|
106
126
|
shapeRendering: props.shapeRendering,
|
|
107
127
|
role: props.role,
|
|
@@ -110,23 +130,4 @@ var Flyout = function (props) {
|
|
|
110
130
|
}));
|
|
111
131
|
};
|
|
112
132
|
|
|
113
|
-
Flyout
|
|
114
|
-
center: _propTypes.default.shape({
|
|
115
|
-
x: _propTypes.default.number,
|
|
116
|
-
y: _propTypes.default.number
|
|
117
|
-
}),
|
|
118
|
-
cornerRadius: _propTypes.default.number,
|
|
119
|
-
datum: _propTypes.default.object,
|
|
120
|
-
dx: _propTypes.default.number,
|
|
121
|
-
dy: _propTypes.default.number,
|
|
122
|
-
height: _propTypes.default.number,
|
|
123
|
-
orientation: _propTypes.default.oneOf(["top", "bottom", "left", "right"]),
|
|
124
|
-
pathComponent: _propTypes.default.element,
|
|
125
|
-
pointerLength: _propTypes.default.number,
|
|
126
|
-
pointerWidth: _propTypes.default.number,
|
|
127
|
-
width: _propTypes.default.number,
|
|
128
|
-
x: _propTypes.default.number,
|
|
129
|
-
y: _propTypes.default.number
|
|
130
|
-
});
|
|
131
|
-
var _default = Flyout;
|
|
132
|
-
exports.default = _default;
|
|
133
|
+
exports.Flyout = Flyout;
|