vccs 0.0.1 → 0.1.0

package/dist/es/cartesian/z-axis/ZAxis.mjs

@@ -0,0 +1,70 @@
+import { implicitZAxis as e } from "../../state/selectors/axisSelectors.mjs";
+import { useAppDispatch as t } from "../../state/hooks.mjs";
+import { addZAxis as n, removeZAxis as r } from "../../state/cartesianAxisSlice.mjs";
+import { defineComponent as i, watchEffect as a } from "vue";
+//#region src/cartesian/z-axis/ZAxis.tsx
+var o = /* @__PURE__ */ i({
+	name: "ZAxis",
+	props: {
+		zAxisId: {
+			type: [String, Number],
+			default: 0
+		},
+		dataKey: {
+			type: [
+				String,
+				Number,
+				Function
+			],
+			default: void 0
+		},
+		type: {
+			type: String,
+			default: e.type
+		},
+		range: {
+			type: Array,
+			default: () => e.range
+		},
+		domain: {
+			type: [Array, String],
+			default: void 0
+		},
+		scale: {
+			type: [String, Function],
+			default: e.scale
+		},
+		name: {
+			type: String,
+			default: void 0
+		},
+		unit: {
+			type: String,
+			default: void 0
+		}
+	},
+	setup(i) {
+		let o = t();
+		return a((t) => {
+			let a = {
+				id: i.zAxisId,
+				dataKey: i.dataKey,
+				type: i.type,
+				range: i.range,
+				domain: i.domain,
+				scale: i.scale,
+				name: i.name,
+				unit: i.unit,
+				allowDuplicatedCategory: e.allowDuplicatedCategory,
+				allowDataOverflow: e.allowDataOverflow,
+				reversed: e.reversed,
+				includeHidden: e.includeHidden
+			};
+			o(n(a)), t(() => {
+				o(r(a));
+			});
+		}), () => null;
+	}
+});
+//#endregion
+export { o as ZAxis };

package/dist/es/chart/AreaChart.mjs

@@ -0,0 +1,9 @@
+import { arrayTooltipSearcher as e } from "../state/optionsSlice.mjs";
+import { generateCategoricalChart as t } from "./generateCategoricalChart.mjs";
+//#region src/chart/AreaChart.ts
+var n = t({
+	chartName: "AreaChart",
+	tooltipPayloadSearcher: e
+});
+//#endregion
+export { n as AreaChart };

package/dist/es/chart/BarChart.mjs

@@ -0,0 +1,10 @@
+import { arrayTooltipSearcher as e } from "../state/optionsSlice.mjs";
+import { generateCategoricalChart as t } from "./generateCategoricalChart.mjs";
+var n = t({
+	chartName: "BarChart",
+	defaultTooltipEventType: "axis",
+	tooltipPayloadSearcher: e,
+	validateTooltipEventTypes: ["axis", "item"]
+});
+//#endregion
+export { n as BarChart };

package/dist/es/chart/ComposedChart.mjs

@@ -0,0 +1,10 @@
+import { arrayTooltipSearcher as e } from "../state/optionsSlice.mjs";
+import { generateCategoricalChart as t } from "./generateCategoricalChart.mjs";
+var n = t({
+	chartName: "ComposedChart",
+	defaultTooltipEventType: "axis",
+	tooltipPayloadSearcher: e,
+	validateTooltipEventTypes: ["axis"]
+});
+//#endregion
+export { n as ComposedChart };

package/dist/es/chart/LegendPortalContext.mjs

@@ -0,0 +1,5 @@
+import { createContext as e } from "../utils/createContext.mjs";
+//#region src/chart/LegendPortalContext.ts
+var [t, n] = e("LegendPortalContext");
+//#endregion
+export { n as provideLegendPortalRaw, t as useLegendPortal };

package/dist/es/chart/LineChart.mjs

@@ -0,0 +1,10 @@
+import { arrayTooltipSearcher as e } from "../state/optionsSlice.mjs";
+import { generateCategoricalChart as t } from "./generateCategoricalChart.mjs";
+var n = t({
+	chartName: "LineChart",
+	defaultTooltipEventType: "axis",
+	tooltipPayloadSearcher: e,
+	validateTooltipEventTypes: ["axis", "item"]
+});
+//#endregion
+export { n as LineChart };

package/dist/es/chart/PieChart.mjs

@@ -0,0 +1,16 @@
+import { arrayTooltipSearcher as e } from "../state/optionsSlice.mjs";
+import { generateCategoricalChart as t } from "./generateCategoricalChart.mjs";
+//#region src/chart/PieChart.ts
+var n = t({
+	chartName: "PieChart",
+	defaultProps: {
+		layout: "centric",
+		startAngle: 0,
+		endAngle: 360
+	},
+	defaultTooltipEventType: "item",
+	validateTooltipEventTypes: ["item"],
+	tooltipPayloadSearcher: e
+});
+//#endregion
+export { n as PieChart };

package/dist/es/chart/RadarChart.mjs

@@ -0,0 +1,16 @@
+import { arrayTooltipSearcher as e } from "../state/optionsSlice.mjs";
+import { generateCategoricalChart as t } from "./generateCategoricalChart.mjs";
+//#region src/chart/RadarChart.ts
+var n = t({
+	chartName: "RadarChart",
+	defaultProps: {
+		layout: "centric",
+		startAngle: 90,
+		endAngle: -270
+	},
+	defaultTooltipEventType: "axis",
+	validateTooltipEventTypes: ["axis"],
+	tooltipPayloadSearcher: e
+});
+//#endregion
+export { n as RadarChart };

package/dist/es/chart/RadialBarChart.mjs

@@ -0,0 +1,16 @@
+import { arrayTooltipSearcher as e } from "../state/optionsSlice.mjs";
+import { generateCategoricalChart as t } from "./generateCategoricalChart.mjs";
+//#region src/chart/RadialBarChart.ts
+var n = t({
+	chartName: "RadialBarChart",
+	defaultProps: {
+		layout: "radial",
+		startAngle: 0,
+		endAngle: 360
+	},
+	defaultTooltipEventType: "axis",
+	validateTooltipEventTypes: ["axis", "item"],
+	tooltipPayloadSearcher: e
+});
+//#endregion
+export { n as RadialBarChart };

package/dist/es/chart/RechartsWrapper.mjs

@@ -0,0 +1,137 @@
+import { getChartPointer as e } from "../utils/chart.mjs";
+import { mouseLeaveChart as t } from "../state/tooltipSlice.mjs";
+import { useAppDispatch as n } from "../state/hooks.mjs";
+import { mouseClickAction as r, mouseMoveAction as i } from "../state/mouseEventsMiddleware.mjs";
+import { focusAction as a, keyDownAction as o } from "../state/keyboardEventsMiddleware.mjs";
+import { externalEventAction as s } from "../state/externalEventsMiddleware.mjs";
+import { touchEventAction as c } from "../state/touchEventsMiddleware.mjs";
+import { useSynchronisedEventsFromOtherCharts as l } from "../events/useChartSynchronisation.mjs";
+import { useReportScale as u } from "../state/utils/useReportScale.mjs";
+import { providePortalRaw as d } from "./TooltipPortalContext.mjs";
+import { provideLegendPortalRaw as f } from "./LegendPortalContext.mjs";
+import { createVNode as p, defineComponent as m, ref as h } from "vue";
+//#region src/chart/RechartsWrapper.tsx
+var g = /* @__PURE__ */ m({
+	name: "RechartsWrapper",
+	props: {
+		class: { type: String },
+		height: {
+			type: Number,
+			required: !0
+		},
+		onClick: { type: Function },
+		onContextMenu: { type: Function },
+		onDoubleClick: { type: Function },
+		onMouseDown: { type: Function },
+		onMouseEnter: { type: Function },
+		onMouseLeave: { type: Function },
+		onMouseMove: { type: Function },
+		onMouseUp: { type: Function },
+		onTouchEnd: { type: Function },
+		onTouchMove: { type: Function },
+		onTouchStart: { type: Function },
+		style: { type: Object },
+		width: {
+			type: Number,
+			required: !0
+		}
+	},
+	setup(m, { slots: g }) {
+		let _ = n();
+		l();
+		let v = u(), y = h(null), b = h(null);
+		d(y), f(b);
+		let x = (e) => {
+			v.value = e, y.value = e, b.value = e;
+		}, S = (t) => {
+			let n = e(t);
+			n && _(r(n)), _(s({
+				handler: m.onClick,
+				event: t
+			}));
+		}, C = (t) => {
+			let n = e(t);
+			n && _(i(n)), _(s({
+				handler: m.onMouseEnter,
+				event: t
+			}));
+		}, w = (e) => {
+			_(t()), _(s({
+				handler: m.onMouseLeave,
+				event: e
+			}));
+		}, T = (t) => {
+			let n = e(t);
+			n && _(i(n)), _(s({
+				handler: m.onMouseMove,
+				event: t
+			}));
+		}, E = () => {
+			_(a());
+		}, D = (e) => {
+			_(o(e.key));
+		}, O = (e) => {
+			_(s({
+				handler: m.onContextMenu,
+				event: e
+			}));
+		}, k = (e) => {
+			_(s({
+				handler: m.onDoubleClick,
+				event: e
+			}));
+		}, A = (e) => {
+			_(s({
+				handler: m.onMouseDown,
+				event: e
+			}));
+		}, j = (e) => {
+			_(s({
+				handler: m.onMouseUp,
+				event: e
+			}));
+		}, M = (e) => {
+			_(s({
+				handler: m.onTouchStart,
+				event: e
+			}));
+		}, N = (e) => {
+			_(c(e)), _(s({
+				handler: m.onTouchMove,
+				event: e
+			}));
+		}, P = (e) => {
+			_(s({
+				handler: m.onTouchEnd,
+				event: e
+			}));
+		};
+		return () => p("div", {
+			class: ["v-charts-wrapper", m.class],
+			style: {
+				position: "relative",
+				cursor: "default",
+				width: `${m.width}px`,
+				height: `${m.height}px`,
+				...m.style
+			},
+			role: "application",
+			onClick: S,
+			onContextmenu: O,
+			onDblclick: k,
+			onFocus: E,
+			onKeydown: D,
+			onMousedown: A,
+			onMouseenter: C,
+			onMouseleave: w,
+			onMousemove: T,
+			onMouseup: j,
+			onTouchend: P,
+			onTouchmove: N,
+			onTouchstart: M,
+			ref: x
+		}, [g.default?.()]);
+	}
+});
+//#endregion
+export { g as RechartsWrapper };

package/dist/es/chart/ScatterChart.mjs

@@ -0,0 +1,10 @@
+import { arrayTooltipSearcher as e } from "../state/optionsSlice.mjs";
+import { generateCategoricalChart as t } from "./generateCategoricalChart.mjs";
+var n = t({
+	chartName: "ScatterChart",
+	defaultTooltipEventType: "item",
+	tooltipPayloadSearcher: e,
+	validateTooltipEventTypes: ["axis", "item"]
+});
+//#endregion
+export { n as ScatterChart };

package/dist/es/chart/Surface.mjs

@@ -0,0 +1,5 @@
+import e from "./Surface.vue_vue_type_script_setup_true_lang.mjs";
+//#region src/chart/Surface.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/es/chart/Surface.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,66 @@
+import { provideLabelLayerRef as e } from "../context/labelLayerContext.mjs";
+import { provideGraphicalLayerRef as t } from "../context/graphicalLayerContext.mjs";
+import { provideCursorLayerRef as n } from "../context/cursorLayerContext.mjs";
+import { computed as r, createElementBlock as i, createElementVNode as a, defineComponent as o, mergeProps as s, openBlock as c, ref as l, renderSlot as u, toDisplayString as d } from "vue";
+//#region src/chart/Surface.vue?vue&type=script&setup=true&lang.ts
+var f = [
+	"width",
+	"height",
+	"viewBox"
+], p = /* @__PURE__ */ o({
+	name: "ChartsSurface",
+	inheritAttrs: !1,
+	__name: "Surface",
+	props: {
+		width: {},
+		height: {},
+		viewBox: {},
+		class: {},
+		style: {},
+		title: {},
+		desc: {}
+	},
+	setup(o) {
+		let p = o, m = r(() => {
+			let e = p.viewBox || {
+				width: p.width,
+				height: p.height,
+				x: 0,
+				y: 0
+			};
+			return `${e.x} ${e.y} ${e.width} ${e.height}`;
+		}), h = l(null);
+		n(h);
+		let g = l(null);
+		t(g);
+		let _ = l(null);
+		return e(_), (e, t) => (c(), i("svg", s(e.$attrs, {
+			class: ["vcharts-surface", [p.class]],
+			width: e.width,
+			height: e.height,
+			style: e.style,
+			viewBox: m.value
+		}), [
+			a("title", null, d(e.title), 1),
+			a("desc", null, d(e.desc), 1),
+			u(e.$slots, "default"),
+			a("g", {
+				ref_key: "cursorLayerRef",
+				ref: h,
+				class: "v-charts-cursor-layer"
+			}, null, 512),
+			a("g", {
+				ref_key: "graphicalLayerRef",
+				ref: g,
+				class: "v-charts-graphical-layer"
+			}, null, 512),
+			a("g", {
+				ref_key: "labelLayerRef",
+				ref: _,
+				class: "v-charts-label-layer"
+			}, null, 512)
+		], 16, f));
+	}
+});
+//#endregion
+export { p as default };

package/dist/es/chart/TooltipPortalContext.mjs

@@ -0,0 +1,5 @@
+import { createContext as e } from "../utils/createContext.mjs";
+//#region src/chart/TooltipPortalContext.ts
+var [t, n] = e("PortalContext");
+//#endregion
+export { n as providePortalRaw, t as usePortal };

package/dist/es/chart/const.mjs

@@ -0,0 +1,7 @@
+//#region src/chart/const.ts
+var e = {
+	width: "100%",
+	height: "100%"
+};
+//#endregion
+export { e as FULL_WIDTH_AND_HEIGHT };

package/dist/es/chart/generateCategoricalChart.mjs

@@ -0,0 +1,166 @@
+import { validateWidthHeight as e } from "../utils/validate.mjs";
+import { provideClipPathId as t } from "./provideClipPathId.mjs";
+import { createRechartsStore as n } from "../state/store.mjs";
+import r from "./Surface.mjs";
+import { ChartDataContextProvider as i } from "../context/ChartDataContextProvider.mjs";
+import a from "../container/ClipPath.mjs";
+import { RechartsWrapper as o } from "./RechartsWrapper.mjs";
+import { FULL_WIDTH_AND_HEIGHT as s } from "./const.mjs";
+import { ReportMainChartProps as c } from "../state/ReportMainChartProps.mjs";
+import l from "../state/ReportChartProps.mjs";
+import { applyDefaultProps as u } from "../utils/props.mjs";
+import { ReportPolarOptions as d } from "../state/ReportPolarOptions.mjs";
+import { Fragment as f, createVNode as p, defineComponent as m, mergeProps as h } from "vue";
+import { provideStore as g } from "@reduxjs/vue-redux";
+//#region src/chart/generateCategoricalChart.tsx
+var _ = "horizontal", v = {
+	top: 5,
+	right: 5,
+	bottom: 5,
+	left: 5
+}, y = {
+	accessibilityLayer: {
+		type: Boolean,
+		default: !0
+	},
+	barCategoryGap: {
+		type: [Number, String],
+		default: "10%"
+	},
+	barGap: {
+		type: [Number, String],
+		default: 4
+	},
+	barSize: { type: [Number, String] },
+	class: { type: String },
+	compact: { type: Boolean },
+	cx: { type: [Number, String] },
+	cy: { type: [Number, String] },
+	data: {
+		type: Array,
+		default: () => []
+	},
+	dataKey: { type: [
+		String,
+		Number,
+		Function
+	] },
+	desc: { type: String },
+	endAngle: { type: Number },
+	height: { type: Number },
+	id: { type: String },
+	innerRadius: { type: [Number, String] },
+	layout: {
+		type: String,
+		default: _
+	},
+	margin: {
+		type: Object,
+		default: () => v
+	},
+	maxBarSize: { type: Number },
+	outerRadius: { type: [Number, String] },
+	reverseStackOrder: {
+		type: Boolean,
+		default: !1
+	},
+	role: { type: String },
+	stackOffset: {
+		type: String,
+		default: "none"
+	},
+	startAngle: { type: Number },
+	style: { type: Object },
+	syncId: { type: [Number, String] },
+	syncMethod: {
+		type: [String, Function],
+		default: "index"
+	},
+	tabIndex: { type: Number },
+	throttleDelay: { type: Number },
+	title: { type: String },
+	width: { type: Number },
+	to: { type: [String, Object] }
+};
+function b({ chartName: b, defaultProps: x = {}, defaultTooltipEventType: S = "axis", validateTooltipEventTypes: C = ["axis"], tooltipPayloadSearcher: w }) {
+	return /* @__PURE__ */ m({
+		name: b,
+		props: u(y, x),
+		setup(u, { attrs: m, slots: y }) {
+			g({ store: n({ options: {
+				chartName: b,
+				defaultTooltipEventType: S,
+				validateTooltipEventTypes: C,
+				tooltipPayloadSearcher: w,
+				eventEmitter: void 0
+			} }, u.id ?? b) });
+			let T = t(u);
+			return () => {
+				let { compact: t, width: n, height: g, title: b, desc: S, ...C } = u, w = { ...m };
+				if (!e({
+					width: n,
+					height: g
+				})) return null;
+				let E = u.layout ?? x.layout ?? _, D = E === "centric" || E === "radial";
+				if (t) return p(f, null, [
+					p(i, { chartData: u.data }, null),
+					p(c, {
+						width: n,
+						height: g,
+						layout: E,
+						margin: u.margin ?? v
+					}, null),
+					D && p(d, {
+						cx: u.cx ?? "50%",
+						cy: u.cy ?? "50%",
+						startAngle: u.startAngle ?? x.startAngle ?? 90,
+						endAngle: u.endAngle ?? x.endAngle ?? -270,
+						innerRadius: u.innerRadius ?? 0,
+						outerRadius: u.outerRadius ?? "80%"
+					}, null),
+					p(r, h(m, C, {
+						width: n,
+						height: g,
+						title: b,
+						desc: S
+					}), { default: () => [p(a, { clipPathId: T }, null), y.default?.()] })
+				]);
+				u.accessibilityLayer && (w.tabIndex = u.tabIndex ?? 0, w.role = u.role ?? "application");
+				let O = {}, k = {};
+				for (let [e, t] of Object.entries(w)) e.startsWith("on") && typeof t == "function" ? O[e] = t : k[e] = t;
+				return p(f, null, [
+					p(i, { chartData: u.data }, null),
+					p(c, {
+						width: n,
+						height: g,
+						layout: E,
+						margin: u.margin ?? v
+					}, null),
+					D && p(d, {
+						cx: u.cx ?? "50%",
+						cy: u.cy ?? "50%",
+						startAngle: u.startAngle ?? x.startAngle ?? 90,
+						endAngle: u.endAngle ?? x.endAngle ?? -270,
+						innerRadius: u.innerRadius ?? 0,
+						outerRadius: u.outerRadius ?? "80%"
+					}, null),
+					p(o, h({
+						style: u.style,
+						class: u.class,
+						width: n,
+						height: g
+					}, O), { default: () => [p(r, h(k, {
+						width: n,
+						height: g,
+						title: b,
+						desc: S,
+						style: s
+					}), { default: () => [p(a, { clipPathId: T }, null), y.default?.()] }), y.tooltip?.()] }),
+					p(l, u, null)
+				]);
+			};
+		}
+	});
+}
+//#endregion
+export { b as generateCategoricalChart };

package/dist/es/chart/provideClipPathId.mjs

@@ -0,0 +1,10 @@
+import { uniqueId as e } from "../utils/data-utils.mjs";
+import { createContext as t } from "../utils/createContext.mjs";
+//#region src/chart/provideClipPathId.ts
+var [n, r] = t("clipPathId");
+function i(t) {
+	let n = `${t.id ?? e("v-charts")}-clip`;
+	return r(n), n;
+}
+//#endregion
+export { i as provideClipPathId, n as useClipPathId };

package/dist/es/components/Cell.mjs

@@ -0,0 +1,11 @@
+import { defineComponent as e } from "vue";
+//#region src/components/Cell.tsx
+var t = /* @__PURE__ */ e({
+	name: "Cell",
+	inheritAttrs: !1,
+	setup() {
+		return () => null;
+	}
+});
+//#endregion
+export { t as Cell };

package/dist/es/components/Text.mjs

@@ -0,0 +1,5 @@
+import e from "./Text.vue_vue_type_script_setup_true_lang.mjs";
+//#region src/components/Text.vue
+var t = e;
+//#endregion
+export { t as default };