react-plot/lib/components/Axis/VerticalAxis.js

Library of React components to render SVG 2D plots.

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useContext } from 'react';
import { useBBoxObserver } from 'react-d3-utils';
import { bboxContext } from '../../contexts/bboxContext.js';
import { Ticks } from './Ticks.js';
import VerticalAxisGridLines from './VerticalAxisGridLines.js';
import VerticalAxisLabel from './VerticalAxisLabel.js';
import VerticalAxisLine from './VerticalAxisLine.js';
export default function VerticalAxis(props) {
    const { primaryTickStyle, primaryTickLength, tickPosition, hiddenTicks, primaryGridLineStyle, lineStyle, hiddenLine, hidden, plotWidth, plotHeight, displayPrimaryGridLines, displaySecondaryGridLines, secondaryGridLineStyle, label, labelStyle, axisRef, primaryTicks, position, tickLabelStyle, innerOffset, secondaryTickLength, scale, secondaryTickStyle, } = props;
    const isRight = position === 'right';
    const textOffset = 3;
    const transform = isRight ? `translate(${plotWidth}, 0)` : undefined;
    const ticks = useBBoxObserver();
    function getTickPosition(value, secondary = false) {
        const { x1, x2, textPosition } = getTickX(secondary);
        return {
            line: {
                y1: value,
                y2: value,
                x1,
                x2,
            },
            text: { y1: value, x1: isRight ? textPosition : -textPosition },
        };
    }
    function getTickX(secondary = false) {
        const tickLength = secondary ? secondaryTickLength : primaryTickLength;
        const x = isRight ? tickLength : -tickLength;
        switch (tickPosition) {
            case 'center':
                return {
                    x1: x / 2,
                    x2: -x / 2,
                    textPosition: textOffset + tickLength / 2,
                };
            case 'inner':
                return {
                    x1: 0,
                    x2: -x,
                    textPosition: textOffset,
                };
            case 'outer':
                return {
                    x1: 0,
                    x2: x,
                    textPosition: textOffset + tickLength,
                };
            case undefined:
                return {
                    x1: 0,
                    x2: 0,
                    textPosition: 3,
                };
            default:
                throw new Error(`Invalid tick position ${String(tickPosition)}`);
        }
    }
    const gridLinesElement = displayPrimaryGridLines || displaySecondaryGridLines ? (_jsx(VerticalAxisGridLines, { position: position, plotWidth: plotWidth, primaryTicks: primaryTicks, style: primaryGridLineStyle, primaryGrid: displayPrimaryGridLines, secondaryGrid: displaySecondaryGridLines, secondaryStyle: secondaryGridLineStyle, scale: scale })) : null;
    const primaryTicksElement = !hidden && !hiddenTicks ? (_jsx(Ticks, { anchor: isRight ? 'start' : 'end', primaryTicks: primaryTicks, getPositions: getTickPosition, labelStyle: tickLabelStyle, style: primaryTickStyle, secondaryTickLength: secondaryTickLength, scale: scale, secondaryTickStyle: secondaryTickStyle })) : null;
    const axisLineElement = !hidden && !hiddenLine ? (_jsx(VerticalAxisLine, { style: lineStyle, plotHeight: plotHeight })) : null;
    const labelElement = !hidden && label ? (_jsx(VerticalAxisLabel, { plotHeight: plotHeight, label: label, labelStyle: labelStyle, horizontalAlign: isRight ? 'start' : 'end' })) : null;
    const bboxRef = useContext(bboxContext);
    return (_jsxs("g", { transform: transform, children: [gridLinesElement, _jsxs("g", { ref: bboxRef, children: [_jsx("g", { ref: ticks.ref, children: primaryTicksElement }), _jsx("g", { ref: axisRef, children: axisLineElement }), _jsx("g", { transform: `translate(${(ticks.width - innerOffset) * (isRight ? 1 : -1)}, 0)`, children: labelElement })] })] }));
}
//# sourceMappingURL=VerticalAxis.js.map