@techie_doubts/tui.chart.2026 4.6.1

package/dist/esm/store/radialAxes.js

@@ -0,0 +1,199 @@
+import { getInitAxisIntervalData, getMaxLabelSize, isLabelAxisOnYAxis, getDefaultRadialAxisData, getRadiusInfo, } from "../helpers/axes";
+import { makeLabelsFromLimit, makeTickPixelPositions } from "../helpers/calculator";
+import { getTitleFontString } from "../helpers/style";
+import { DEGREE_360, DEGREE_0 } from "../helpers/sector";
+const Y_LABEL_PADDING = 5;
+export const RADIAL_LABEL_PADDING = 25;
+export var RadialAxisType;
+(function (RadialAxisType) {
+    RadialAxisType["CIRCULAR"] = "circularAxis";
+    RadialAxisType["VERTICAL"] = "verticalAxis";
+})(RadialAxisType || (RadialAxisType = {}));
+function getYAxisLabelAlign(clockwise = true, isLabelOnVerticalAxis = false) {
+    let align = 'center';
+    if (isLabelOnVerticalAxis) {
+        align = clockwise ? 'right' : 'left';
+    }
+    return align;
+}
+function getVerticalAxisData({ labels, pointOnColumn, intervalData, isLabelOnVerticalAxis, verticalAxisLabelMargin, verticalAxisLabelFont, defaultAxisData, radiusData, }) {
+    const { clockwise, axisSize, centerX, centerY, startAngle, endAngle } = defaultAxisData;
+    const { radiusRanges, innerRadius, outerRadius } = radiusData;
+    const { labelInterval } = intervalData;
+    /*
+    return {
+      labels,
+      tickDistance: (outerRadius - innerRadius) / labels.length,
+      ...pick(defaultAxisData, 'axisSize', 'centerX', 'centerY', 'startAngle', 'endAngle'),
+      pointOnColumn,
+      radiusRanges,
+      innerRadius,
+      outerRadius,
+      labelInterval,
+      labelMargin: verticalAxisLabelMargin,
+      labelAlign: getYAxisLabelAlign(clockwise, isLabelOnVerticalAxis),
+      ...getMaxLabelSize(labels, verticalAxisLabelMargin, verticalAxisLabelFont),
+    };
+    */
+    const { maxLabelWidth, maxLabelHeight } = getMaxLabelSize(labels, verticalAxisLabelMargin, verticalAxisLabelFont);
+    return {
+        axisSize,
+        centerX,
+        centerY,
+        label: {
+            labels,
+            interval: labelInterval,
+            margin: verticalAxisLabelMargin,
+            maxWidth: maxLabelWidth,
+            maxHeight: maxLabelHeight,
+            align: getYAxisLabelAlign(clockwise, isLabelOnVerticalAxis),
+        },
+        radius: {
+            inner: innerRadius,
+            outer: outerRadius,
+            ranges: radiusRanges,
+        },
+        angle: {
+            start: startAngle,
+            end: endAngle,
+        },
+        tickDistance: (outerRadius - innerRadius) / labels.length,
+        pointOnColumn,
+    };
+}
+function getCircularAxisData({ labels, intervalData, circularAxisLabelMargin, circularAxisLabelFont, defaultAxisData, radiusData, }) {
+    const { maxLabelWidth, maxLabelHeight } = getMaxLabelSize(labels, circularAxisLabelMargin, circularAxisLabelFont);
+    const { totalAngle, clockwise, axisSize, centerX, centerY, startAngle, endAngle, drawingStartAngle, } = defaultAxisData;
+    const { tickInterval, labelInterval } = intervalData;
+    const { innerRadius, outerRadius } = radiusData;
+    const centralAngle = totalAngle / (labels.length + (totalAngle < DEGREE_360 ? -1 : DEGREE_0));
+    /*
+    return {
+      labels,
+      ...defaultAxisData,
+      centralAngle,
+      tickInterval,
+      labelInterval,
+      labelMargin: circularAxisLabelMargin,
+      maxLabelWidth,
+      maxLabelHeight,
+      innerRadius,
+      outerRadius,
+    };
+    */
+    return {
+        axisSize,
+        centerX,
+        centerY,
+        label: {
+            labels,
+            interval: labelInterval,
+            margin: circularAxisLabelMargin,
+            maxWidth: maxLabelWidth,
+            maxHeight: maxLabelHeight,
+        },
+        radius: {
+            inner: innerRadius,
+            outer: outerRadius,
+        },
+        angle: {
+            start: startAngle,
+            end: endAngle,
+            total: totalAngle,
+            central: centralAngle,
+            drawingStart: drawingStartAngle,
+        },
+        tickInterval,
+        clockwise,
+    };
+}
+function makeLabels(options, rawLabels, axisName) {
+    var _a, _b, _c;
+    const formatter = (_c = (_b = (_a = options[axisName]) === null || _a === void 0 ? void 0 : _a.label) === null || _b === void 0 ? void 0 : _b.formatter, (_c !== null && _c !== void 0 ? _c : ((value) => value)));
+    return rawLabels.map((label, index) => formatter(label, { index, labels: rawLabels, axisName }));
+}
+function getAxisLabels(isLabelOnVerticalAxis, options, categories, scale) {
+    const valueAxisName = isLabelOnVerticalAxis
+        ? RadialAxisType.CIRCULAR
+        : RadialAxisType.VERTICAL;
+    const { limit, stepSize } = scale[valueAxisName];
+    const valueLabels = makeLabels(options, makeLabelsFromLimit(limit, stepSize), valueAxisName);
+    const categoryLabels = makeLabels(options, categories, isLabelOnVerticalAxis ? RadialAxisType.VERTICAL : RadialAxisType.CIRCULAR);
+    return {
+        radialAxisLabels: isLabelOnVerticalAxis ? valueLabels : categoryLabels,
+        yAxisLabels: isLabelOnVerticalAxis ? categoryLabels : valueLabels,
+    };
+}
+function getAxisLabelMargin(isLabelOnVerticalAxis, options) {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    return {
+        verticalAxisLabelMargin: (_d = (_c = (_b = (_a = options) === null || _a === void 0 ? void 0 : _a.verticalAxis) === null || _b === void 0 ? void 0 : _b.label) === null || _c === void 0 ? void 0 : _c.margin, (_d !== null && _d !== void 0 ? _d : (isLabelOnVerticalAxis ? Y_LABEL_PADDING : 0))),
+        circularAxisLabelMargin: (_h = (_g = (_f = (_e = options) === null || _e === void 0 ? void 0 : _e.circularAxis) === null || _f === void 0 ? void 0 : _f.label) === null || _g === void 0 ? void 0 : _g.margin, (_h !== null && _h !== void 0 ? _h : RADIAL_LABEL_PADDING)),
+    };
+}
+const axes = {
+    name: 'radialAxes',
+    state: () => ({
+        radialAxes: {},
+    }),
+    action: {
+        setRadialAxesData({ state }) {
+            var _a, _b;
+            const { series, layout, scale } = state;
+            const categories = state.categories;
+            const { plot } = layout;
+            const isLabelOnVerticalAxis = isLabelAxisOnYAxis({ series, categories });
+            const options = state.options;
+            const theme = state.theme;
+            const circularAxisLabelFont = getTitleFontString(theme.circularAxis.label);
+            const verticalAxisLabelFont = getTitleFontString(theme.verticalAxis.label);
+            const { verticalAxisLabelMargin, circularAxisLabelMargin } = getAxisLabelMargin(isLabelOnVerticalAxis, options);
+            const { radialAxisLabels, yAxisLabels } = getAxisLabels(isLabelOnVerticalAxis, options, categories, scale);
+            const { maxLabelWidth, maxLabelHeight } = getMaxLabelSize(radialAxisLabels, circularAxisLabelMargin, circularAxisLabelFont);
+            const defaultAxisData = getDefaultRadialAxisData(options, plot, maxLabelWidth, maxLabelHeight + circularAxisLabelMargin, isLabelOnVerticalAxis);
+            const { axisSize } = defaultAxisData;
+            const radiusData = isLabelOnVerticalAxis
+                ? getRadiusInfo(axisSize, (_b = (_a = options) === null || _a === void 0 ? void 0 : _a.series) === null || _b === void 0 ? void 0 : _b.radiusRange, yAxisLabels.length + 1)
+                : {
+                    radiusRanges: makeTickPixelPositions(axisSize, yAxisLabels.length),
+                    innerRadius: 0,
+                    outerRadius: axisSize,
+                };
+            const verticalAxisData = getVerticalAxisData({
+                labels: yAxisLabels,
+                pointOnColumn: isLabelOnVerticalAxis,
+                isLabelOnVerticalAxis,
+                intervalData: getInitAxisIntervalData(isLabelOnVerticalAxis, {
+                    axis: options.verticalAxis,
+                    categories,
+                    layout,
+                }),
+                verticalAxisLabelMargin,
+                verticalAxisLabelFont,
+                defaultAxisData,
+                radiusData,
+            });
+            state.radialAxes = {
+                circularAxis: getCircularAxisData({
+                    labels: radialAxisLabels,
+                    intervalData: getInitAxisIntervalData(true, {
+                        axis: options.circularAxis,
+                        categories,
+                        layout,
+                    }),
+                    defaultAxisData,
+                    circularAxisLabelMargin,
+                    circularAxisLabelFont,
+                    radiusData,
+                }),
+                verticalAxis: verticalAxisData,
+            };
+        },
+    },
+    observe: {
+        updateRadialAxes() {
+            this.dispatch('setRadialAxesData');
+        },
+    },
+};
+export default axes;

package/dist/esm/store/reactive.d.ts

@@ -0,0 +1,11 @@
+export declare function observe(fn: Function): Function;
+export declare function isObservable<T extends Record<string, any>>(target: T): boolean;
+export declare function observable(target: Record<string, any>, source?: Record<string, any>): Record<string, any>;
+export declare function setValue(target: Record<string, any>, key: string, source: any): Record<string, any>;
+export declare function extend(target: Record<string, any>, source: Record<string, any>): Record<string, any>;
+export declare function notify<T extends Record<string, any>, K extends keyof T>(target: T, key: K): void;
+export declare function invisibleWork(fn: Function): void;
+export declare function notifyByPath<T extends Record<string, any>>(holder: T, namePath: string): void;
+export declare function computed(target: Record<string, any>, key: string, fn: Function): void;
+export declare function watch(holder: Record<string, any>, path: string, fn: Function): Function | null;
+export declare function makeObservableObjectToNormal(obj: any): any;

package/dist/esm/store/reactive.js

@@ -0,0 +1,196 @@
+import { isNull, pickProperty } from "../helpers/utils";
+import { message } from "../message";
+let currentCollectorObserver = null;
+let currentRunningObserver = null;
+const observerCallCue = [];
+let doingInvisibleWork = false;
+export function observe(fn) {
+    const observer = () => {
+        if (currentRunningObserver === observer) {
+            return;
+        }
+        // If there is observer running or doing invisible work
+        if (doingInvisibleWork || !isNull(currentRunningObserver)) {
+            if (observerCallCue.includes(observer)) {
+                observerCallCue.splice(observerCallCue.indexOf(observer), 1);
+            }
+            // We use observer call cue because avoid nested observer call.
+            observerCallCue.push(observer);
+            // or If there are no observers running. Run the observer and run the next observer in the call queue.
+        }
+        else if (isNull(currentRunningObserver)) {
+            currentRunningObserver = observer;
+            fn();
+            currentRunningObserver = null;
+            digestObserverCallCue();
+        }
+    };
+    observer.deps = [];
+    // first observer excution for collect dependencies
+    currentCollectorObserver = observer;
+    currentCollectorObserver();
+    currentCollectorObserver = null;
+    return () => {
+        observer.deps.forEach((dep) => {
+            const index = dep.findIndex((ob) => ob === observer);
+            dep.splice(index, 1);
+        });
+        observer.deps = [];
+    };
+}
+function digestObserverCallCue() {
+    if (observerCallCue.length) {
+        const nextObserver = observerCallCue.shift();
+        if (nextObserver) {
+            nextObserver();
+        }
+    }
+}
+export function isObservable(target) {
+    return typeof target === 'object' && target.__toastUIChartOb__;
+}
+export function observable(target, source = target) {
+    if (isObservable(source)) {
+        throw new Error(message.ALREADY_OBSERVABLE_ERROR);
+    }
+    if (!isObservable(target)) {
+        Object.defineProperty(target, '__toastUIChartOb__', {
+            enumerable: false,
+        });
+    }
+    for (const key in source) {
+        if (!source.hasOwnProperty(key)) {
+            continue;
+        }
+        const obs = [];
+        let value = source[key];
+        const descriptor = Object.getOwnPropertyDescriptor(source, key);
+        const preGetter = descriptor && descriptor.get;
+        const preSetter = descriptor && descriptor.set;
+        /* eslint-disable no-loop-func */
+        Object.defineProperty(target, key, {
+            configurable: true,
+            enumerable: true,
+            get: function () {
+                // It's some kind a trick to get observable information from closure using getter for notify()
+                if (currentCollectorObserver === observableInfo) {
+                    return { target, key, value, obs };
+                }
+                if (!doingInvisibleWork &&
+                    currentCollectorObserver &&
+                    !obs.includes(currentCollectorObserver)) {
+                    // if there is collector observer in running, collect current data as dependency
+                    obs.push(currentCollectorObserver);
+                    currentCollectorObserver.deps.push(obs);
+                }
+                return value;
+            },
+            set: function (v) {
+                const prevValue = value;
+                if (preSetter) {
+                    preSetter.call(target, v);
+                    value = preGetter ? preGetter.call(target) : target[key];
+                }
+                else {
+                    value = v;
+                }
+                if (prevValue !== value) {
+                    // Run observers
+                    invokeObs(obs);
+                }
+            },
+        });
+        if (typeof target[key] === 'object' && !Array.isArray(target[key])) {
+            observable(target[key]);
+        }
+        /* eslint-enable no-loop-func */
+    }
+    return target;
+}
+export function setValue(target, key, source) {
+    return observable(target, {
+        [key]: source,
+    });
+}
+export function extend(target, source) {
+    if (isObservable(source)) {
+        throw new Error(message.ALREADY_OBSERVABLE_ERROR);
+    }
+    return observable(target, source);
+}
+export function notify(target, key) {
+    const obInfo = observableInfo(target, key);
+    if (obInfo) {
+        invokeObs(obInfo.obs);
+    }
+}
+export function invisibleWork(fn) {
+    doingInvisibleWork = true;
+    fn();
+    doingInvisibleWork = false;
+    digestObserverCallCue();
+}
+export function notifyByPath(holder, namePath) {
+    const splited = namePath.split('.');
+    const key = splited.splice(splited.length - 1, 1)[0];
+    const target = pickProperty(holder, splited);
+    if (target) {
+        notify(target, key);
+    }
+}
+function invokeObs(obs) {
+    obs.forEach((ob) => ob());
+}
+function observableInfo(target, key) {
+    currentCollectorObserver = observableInfo;
+    const obInfo = target[key];
+    currentCollectorObserver = null;
+    if (typeof obInfo === 'object' &&
+        obInfo.hasOwnProperty('target') &&
+        obInfo.hasOwnProperty('obs')) {
+        return obInfo;
+    }
+    return null;
+}
+export function computed(target, key, fn) {
+    let cachedValue;
+    const computedBox = {};
+    Object.defineProperty(computedBox, key, {
+        configurable: true,
+        enumerable: true,
+        get: () => cachedValue,
+    });
+    extend(target, computedBox);
+    observe(() => {
+        const prevValue = cachedValue;
+        cachedValue = fn();
+        if (prevValue !== cachedValue) {
+            target[key] = cachedValue;
+        }
+    });
+}
+export function watch(holder, path, fn) {
+    const splited = path.split('.');
+    const key = splited.splice(splited.length - 1, 1)[0];
+    const target = pickProperty(holder, splited);
+    if (!target) {
+        return null;
+    }
+    const obInfo = observableInfo(target, key);
+    if (!obInfo) {
+        return null;
+    }
+    const watcher = () => {
+        fn(target[key]);
+    };
+    obInfo.obs.push(watcher);
+    return () => {
+        const index = obInfo.obs.findIndex((ob) => ob === watcher);
+        if (index > -1) {
+            obInfo.obs.splice(index, 1);
+        }
+    };
+}
+export function makeObservableObjectToNormal(obj) {
+    return JSON.parse(JSON.stringify(obj));
+}

package/dist/esm/store/root.d.ts

@@ -0,0 +1,3 @@
+import { StoreModule } from "../../types/store/store";
+declare const root: StoreModule;
+export default root;

package/dist/esm/store/root.js

@@ -0,0 +1,46 @@
+import { getInitialSize, isAutoValue } from "../helpers/utils";
+function initialSize(containerEl, { width, height }) {
+    return {
+        width: width === 0 ? containerEl.offsetWidth : width,
+        height: height === 0 ? containerEl.offsetHeight : height,
+    };
+}
+const root = {
+    name: 'root',
+    state: ({ options }) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        return ({
+            chart: Object.assign(Object.assign({}, options.chart), { width: getInitialSize((_b = (_a = options) === null || _a === void 0 ? void 0 : _a.chart) === null || _b === void 0 ? void 0 : _b.width), height: getInitialSize((_d = (_c = options) === null || _c === void 0 ? void 0 : _c.chart) === null || _d === void 0 ? void 0 : _d.height) }),
+            usingContainerSize: {
+                width: isAutoValue((_f = (_e = options) === null || _e === void 0 ? void 0 : _e.chart) === null || _f === void 0 ? void 0 : _f.width),
+                height: isAutoValue((_h = (_g = options) === null || _g === void 0 ? void 0 : _g.chart) === null || _h === void 0 ? void 0 : _h.height),
+            },
+            container: {},
+        });
+    },
+    action: {
+        setChartSize({ state }, size) {
+            state.chart.width = size.width;
+            state.chart.height = size.height;
+            this.notify(state, 'chart');
+        },
+        initChartSize({ state }, containerEl) {
+            const { width, height } = state.chart;
+            if (width === 0 || height === 0) {
+                if (containerEl.parentNode) {
+                    this.dispatch('setChartSize', initialSize(containerEl, { width, height }));
+                }
+                else {
+                    setTimeout(() => {
+                        this.dispatch('setChartSize', initialSize(containerEl, { width, height }));
+                    }, 0);
+                }
+            }
+        },
+        setUsingContainerSize({ state }, { width, height }) {
+            state.usingContainerSize.width = width;
+            state.usingContainerSize.height = height;
+        },
+    },
+};
+export default root;

package/dist/esm/store/scale.d.ts

@@ -0,0 +1,3 @@
+import { StoreModule } from "../../types/store/store";
+declare const scale: StoreModule;
+export default scale;

package/dist/esm/store/scale.js

@@ -0,0 +1,102 @@
+import { getAxisName, getSizeKey, isLabelAxisOnYAxis, getYAxisOption, getValueAxisNames, isSeriesUsingRadialAxes, } from "../helpers/axes";
+import { calculateCoordinateScale, calculateXAxisScaleForCoordinateLineType, getStackScaleData, } from "../scale/coordinateScaleCalculator";
+import { calculateDatetimeScale } from "../scale/datetimeScaleCalculator";
+import { isCoordinateSeries } from "../helpers/coordinate";
+import { hasPercentStackSeries } from "./stackSeriesData";
+import { isExist } from "../helpers/utils";
+const MIN_OFFSET_SIZE = 1;
+function getLabelScaleData(state, labelAxisOnYAxis, scaleOptions, labelAxisName) {
+    var _a, _b;
+    const { dataRange, layout, series, options } = state;
+    const categories = state.categories;
+    const rawCategories = state.rawCategories;
+    const { labelSizeKey } = getSizeKey(labelAxisOnYAxis);
+    const dateTypeLabel = isExist((_a = options.xAxis) === null || _a === void 0 ? void 0 : _a.date);
+    const labelOptions = {
+        dataRange: dataRange[labelAxisName],
+        offsetSize: Math.max(layout.plot[labelSizeKey], MIN_OFFSET_SIZE),
+        scaleOption: scaleOptions[labelAxisName],
+        rawCategoriesSize: rawCategories.length,
+    };
+    let result;
+    if (dataRange[labelAxisName]) {
+        result = dateTypeLabel
+            ? calculateDatetimeScale(labelOptions)
+            : calculateCoordinateScale(labelOptions);
+    }
+    if (series.line && categories && !((_b = options.xAxis) === null || _b === void 0 ? void 0 : _b.pointOnColumn)) {
+        result = calculateXAxisScaleForCoordinateLineType(result, options, categories);
+    }
+    return result;
+}
+function getValueScaleData(state, labelAxisOnYAxis, scaleOptions, valueAxisName, isCoordinateTypeChart) {
+    const { dataRange, layout, series, stackSeries } = state;
+    const { valueSizeKey } = getSizeKey(labelAxisOnYAxis);
+    let result;
+    if (hasPercentStackSeries(stackSeries)) {
+        Object.keys(series).forEach((seriesName) => {
+            result = getStackScaleData(stackSeries[seriesName].scaleType);
+        });
+    }
+    else if (isCoordinateTypeChart) {
+        const valueOptions = {
+            dataRange: dataRange[valueAxisName],
+            offsetSize: Math.max(layout.plot[valueSizeKey], MIN_OFFSET_SIZE),
+            scaleOption: scaleOptions[valueAxisName],
+        };
+        result = calculateCoordinateScale(valueOptions);
+    }
+    else {
+        result = calculateCoordinateScale({
+            dataRange: dataRange[valueAxisName],
+            offsetSize: Math.max(layout.plot[valueSizeKey], MIN_OFFSET_SIZE),
+            scaleOption: scaleOptions[valueAxisName],
+        });
+    }
+    return result;
+}
+function getScaleOptions(options, series, valueAxisName) {
+    var _a, _b, _c, _d, _e, _f;
+    const scaleOptions = {};
+    if (isSeriesUsingRadialAxes(series)) {
+        scaleOptions[valueAxisName] = (_b = (_a = options) === null || _a === void 0 ? void 0 : _a[valueAxisName]) === null || _b === void 0 ? void 0 : _b.scale;
+    }
+    else {
+        const { yAxis, secondaryYAxis } = getYAxisOption(options);
+        scaleOptions.xAxis = (_d = (_c = options) === null || _c === void 0 ? void 0 : _c.xAxis) === null || _d === void 0 ? void 0 : _d.scale;
+        scaleOptions.yAxis = (_e = yAxis) === null || _e === void 0 ? void 0 : _e.scale;
+        if (secondaryYAxis) {
+            scaleOptions.secondaryYAxis = (_f = secondaryYAxis) === null || _f === void 0 ? void 0 : _f.scale;
+        }
+    }
+    return scaleOptions;
+}
+const scale = {
+    name: 'scale',
+    state: () => ({
+        scale: {},
+    }),
+    action: {
+        setScale({ state, initStoreState }) {
+            const { series, options, categories } = state;
+            const labelAxisOnYAxis = isLabelAxisOnYAxis({ series, options, categories });
+            const { labelAxisName, valueAxisName } = getAxisName(labelAxisOnYAxis, series);
+            const scaleOptions = getScaleOptions(options, series, valueAxisName);
+            const isCoordinateTypeChart = isCoordinateSeries(initStoreState.series);
+            const scaleData = {};
+            getValueAxisNames(options, valueAxisName).forEach((axisName) => {
+                scaleData[axisName] = getValueScaleData(state, labelAxisOnYAxis, scaleOptions, axisName, isCoordinateTypeChart);
+            });
+            if (isCoordinateTypeChart) {
+                scaleData[labelAxisName] = getLabelScaleData(state, labelAxisOnYAxis, scaleOptions, labelAxisName);
+            }
+            state.scale = scaleData;
+        },
+    },
+    observe: {
+        updateScale() {
+            this.dispatch('setScale');
+        },
+    },
+};
+export default scale;

package/dist/esm/store/seriesData.d.ts

@@ -0,0 +1,3 @@
+import { StoreModule } from "../../types/store/store";
+declare const seriesData: StoreModule;
+export default seriesData;