victory-native
Version:
A charting library for React Native with a focus on performance and customization.
128 lines (127 loc) • 5.68 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.useCandlestickPaths = void 0;
const React = __importStar(require("react"));
const react_native_skia_1 = require("@shopify/react-native-skia");
const getBarWidth_1 = require("../utils/getBarWidth");
const getCandlestickGeometry_1 = require("../utils/getCandlestickGeometry");
const resolveCandlestickPathOptions_1 = require("../utils/resolveCandlestickPathOptions");
const DEFAULT_CANDLE_COLORS = {
positive: "#26a69a",
negative: "#ef5350",
neutral: "#737375",
};
const clampCandleRatio = (candleRatio) => Math.max(0, Math.min(1, candleRatio));
const getOptionsContext = (geometry) => (Object.assign(Object.assign({}, geometry), { isPositive: geometry.status === "positive", isNegative: geometry.status === "negative", isNeutral: geometry.status === "neutral" }));
const getStatusColor = (status, candleColors) => { var _a; return (_a = candleColors === null || candleColors === void 0 ? void 0 : candleColors[status]) !== null && _a !== void 0 ? _a : DEFAULT_CANDLE_COLORS[status]; };
const addGeometryToPaths = (geometry, bodyPath, wickPath) => {
wickPath.moveTo(geometry.wick.x, geometry.wick.y1);
wickPath.lineTo(geometry.wick.x, geometry.wick.y2);
if (geometry.body.width <= 0 || geometry.body.height <= 0)
return;
bodyPath.addRect(react_native_skia_1.Skia.XYWHRect(geometry.body.x, geometry.body.y, geometry.body.width, geometry.body.height));
};
const makeEmptyGroups = (candleColors, wickStrokeWidth = 1) => ["positive", "negative", "neutral"].map((status) => {
const color = getStatusColor(status, candleColors);
return {
key: status,
status,
bodyPath: react_native_skia_1.Skia.Path.Make(),
wickPath: react_native_skia_1.Skia.Path.Make(),
bodyOptions: { color },
wickOptions: { color, strokeWidth: wickStrokeWidth },
};
});
const useCandlestickPaths = ({ openPoints, highPoints, lowPoints, closePoints, chartBounds, candleWidth: customCandleWidth, candleRatio = 0.6, candleCount, minBodyHeight = 1, candleColors, wickStrokeWidth = 1, candleOptions, }) => {
const normalizedCandleRatio = clampCandleRatio(candleRatio);
const candleWidth = (0, getBarWidth_1.getBarWidth)({
points: openPoints,
chartBounds,
innerPadding: 1 - normalizedCandleRatio,
customBarWidth: customCandleWidth,
barCount: candleCount,
});
const geometry = React.useMemo(() => (0, getCandlestickGeometry_1.getCandlestickGeometry)({
openPoints,
highPoints,
lowPoints,
closePoints,
candleWidth,
minBodyHeight,
}), [
candleWidth,
closePoints,
highPoints,
lowPoints,
minBodyHeight,
openPoints,
]);
return React.useMemo(() => {
if (candleOptions) {
return {
mode: "custom",
candleWidth,
geometry,
candles: geometry.map((candle) => {
const color = getStatusColor(candle.status, candleColors);
const options = candleOptions(getOptionsContext(candle));
const bodyPath = react_native_skia_1.Skia.Path.Make();
const wickPath = react_native_skia_1.Skia.Path.Make();
addGeometryToPaths(candle, bodyPath, wickPath);
const { bodyOptions, wickOptions } = (0, resolveCandlestickPathOptions_1.resolveCandlestickPathOptions)({
color,
wickStrokeWidth,
options,
});
return {
key: `candlestick-${candle.datumIndex}`,
geometry: candle,
bodyPath,
wickPath,
bodyOptions,
wickOptions,
};
}),
};
}
const groups = makeEmptyGroups(candleColors, wickStrokeWidth);
const groupByStatus = groups.reduce((acc, group) => {
acc[group.status] = group;
return acc;
}, {});
geometry.forEach((candle) => {
const group = groupByStatus[candle.status];
addGeometryToPaths(candle, group.bodyPath, group.wickPath);
});
return {
mode: "grouped",
candleWidth,
geometry,
groups,
};
}, [candleColors, candleOptions, candleWidth, geometry, wickStrokeWidth]);
};
exports.useCandlestickPaths = useCandlestickPaths;