@oiij/v-charts/dist/index.cjs

A Vue Composable for VCharts

//#region rolldown:runtime
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __copyProps = (to, from, except, desc) => {
	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
		key = keys[i];
		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
			get: ((k) => from[k]).bind(null, key),
			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
		});
	}
	return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
	value: mod,
	enumerable: true
}) : target, mod));

//#endregion
const __visactor_vchart = __toESM(require("@visactor/vchart"));
const __vueuse_core = __toESM(require("@vueuse/core"));
const vue = __toESM(require("vue"));

//#region src/index.ts
const registerBase = [
	__visactor_vchart.registerDiscreteLegend,
	__visactor_vchart.registerContinuousLegend,
	__visactor_vchart.registerCustomMark,
	__visactor_vchart.registerAllMarks,
	__visactor_vchart.registerTitle,
	__visactor_vchart.registerTooltip,
	__visactor_vchart.registerDomTooltipHandler
];
const registerPolar = [
	__visactor_vchart.registerPolarLinearAxis,
	__visactor_vchart.registerPolarBandAxis,
	__visactor_vchart.registerPolarCrossHair,
	__visactor_vchart.registerBrush,
	__visactor_vchart.registerDataZoom,
	...registerBase
];
const registerCartesian = [
	__visactor_vchart.registerCartesianLinearAxis,
	__visactor_vchart.registerCartesianBandAxis,
	__visactor_vchart.registerCartesianTimeAxis,
	__visactor_vchart.registerCartesianLogAxis,
	__visactor_vchart.registerCartesianCrossHair,
	__visactor_vchart.registerBrush,
	__visactor_vchart.registerDataZoom,
	__visactor_vchart.registerMarkArea,
	__visactor_vchart.registerMarkLine,
	__visactor_vchart.registerMarkPoint,
	__visactor_vchart.registerScrollBar,
	...registerBase
];
const baseChat = [
	__visactor_vchart.registerLineChart,
	__visactor_vchart.registerAreaChart,
	__visactor_vchart.registerBarChart,
	__visactor_vchart.registerPieChart
];
__visactor_vchart.VChart.useRegisters([
	...registerCartesian,
	...baseChat,
	__visactor_vchart.registerAnimate
]);
function register(comps) {
	__visactor_vchart.VChart.useRegisters(comps);
}
function useVCharts(options, darkMode, initOptions) {
	const domRef = (0, vue.ref)();
	const vChart = (0, vue.shallowRef)(null);
	const optionsRef = (0, vue.ref)((0, vue.toValue)(options));
	(0, vue.watchEffect)(() => {
		optionsRef.value = (0, vue.toValue)(options);
	});
	const { width, height } = (0, __vueuse_core.useElementSize)(domRef);
	const onRenderEvent = (0, __vueuse_core.createEventHook)();
	const onUpdateEvent = (0, __vueuse_core.createEventHook)();
	const onResizeEvent = (0, __vueuse_core.createEventHook)();
	const onDisposeEvent = (0, __vueuse_core.createEventHook)();
	function setOption(spec) {
		if (vChart.value) {
			vChart.value.updateSpec(spec);
			onUpdateEvent.trigger(spec);
		}
	}
	function render() {
		if (domRef.value) {
			if (vChart.value) {
				resize();
				return;
			}
			const theme = darkMode?.value ? "dark" : "light";
			if (optionsRef.value) {
				vChart.value = new __visactor_vchart.VChart(optionsRef.value, {
					dom: domRef.value,
					theme,
					...initOptions
				});
				vChart.value.renderSync();
				onRenderEvent.trigger(vChart.value);
			}
		}
	}
	const renderDebounce = (0, __vueuse_core.useDebounceFn)(render, 100);
	function resize() {
		vChart.value?.resizeSync(width.value, height.value);
		onResizeEvent.trigger({
			width: width.value,
			height: height.value
		});
	}
	const resizeDebounce = (0, __vueuse_core.useDebounceFn)(resize, 100);
	function destroy() {
		vChart.value?.release();
		vChart.value = null;
		onDisposeEvent.trigger();
	}
	(0, vue.watch)([width, height], ([width$1, height$1]) => {
		if (width$1 > 0 && height$1 > 0) if (vChart.value) resizeDebounce();
		else renderDebounce();
	});
	(0, vue.watch)(optionsRef, (v) => {
		if (v) if (vChart.value) setOption(v);
		else render();
	});
	(0, vue.watchEffect)(() => {
		destroy();
		render();
	});
	(0, vue.onUnmounted)(() => {
		destroy();
	});
	return {
		domRef,
		vChart,
		options: optionsRef,
		onRender: onRenderEvent.on,
		onUpdate: onUpdateEvent.on,
		onResize: onResizeEvent.on,
		onDispose: onDisposeEvent.on
	};
}

//#endregion
exports.baseChat = baseChat;
exports.register = register;
exports.registerBase = registerBase;
exports.registerCartesian = registerCartesian;
exports.registerPolar = registerPolar;
exports.useVCharts = useVCharts;