npm - @treeui/vue - Versions diffs - 0.13.0 → 0.15.0 - Mend

@treeui/vue 0.13.0 → 0.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (184) hide show

package/dist/components/TChart.vue_vue_type_script_setup_true_lang.js CHANGED Viewed

@@ -1,42 +1,42 @@
 import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, defineComponent as o, guardReactiveProps as s, normalizeClass as c, normalizeProps as l, normalizeStyle as u, onBeforeUnmount as d, onMounted as f, openBlock as p, ref as m, renderList as h, renderSlot as g, toDisplayString as _, vShow as v, withDirectives as y } from "vue";
-import { buildAreaPath as b, buildLinePath as x, linearScale as S, niceScale as C } from "@treeui/utils";
+import { buildAreaPath as b, buildLinePath as x, linearScale as S, niceScale as ee } from "@treeui/utils";
 //#region src/components/TChart.vue?vue&type=script&setup=true&lang.ts
-var ee = {
+var te = {
 	key: 0,
 	class: "t-chart__loading"
-}, te = {
+}, ne = {
 	key: 1,
 	class: "t-chart__empty"
-}, ne = [
+}, re = [
 	"width",
 	"height",
 	"viewBox"
-], re = { class: "t-chart__grid" }, ie = [
+], ie = { class: "t-chart__grid" }, ae = [
 	"x1",
 	"x2",
 	"y1",
 	"y2"
-], ae = ["x", "y"], oe = { class: "t-chart__areas" }, se = ["d"], ce = { class: "t-chart__bars" }, le = [
+], oe = ["x", "y"], se = { class: "t-chart__areas" }, ce = ["d"], le = { class: "t-chart__bars" }, ue = [
 	"x",
 	"y",
 	"width",
 	"height",
 	"rx"
-], ue = { class: "t-chart__lines" }, de = ["d"], fe = ["cx", "cy"], pe = {
+], de = { class: "t-chart__lines" }, fe = ["d"], pe = ["cx", "cy"], me = {
 	key: 0,
 	class: "t-chart__hover"
-}, me = [
+}, he = [
 	"x1",
 	"x2",
 	"y1",
 	"y2"
-], he = ["cx", "cy"], ge = {
+], ge = ["cx", "cy"], _e = {
 	key: 1,
 	class: "t-chart__x-axis"
-}, _e = ["x", "y"], ve = { class: "t-chart__tooltip-label" }, ye = { class: "t-chart__tooltip-list" }, be = { class: "t-chart__tooltip-name" }, xe = { class: "t-chart__tooltip-value" }, w = {
+}, ve = ["x", "y"], ye = { class: "t-chart__tooltip-label" }, be = { class: "t-chart__tooltip-list" }, xe = { class: "t-chart__tooltip-name" }, Se = { class: "t-chart__tooltip-value" }, C = {
 	key: 0,
 	class: "t-chart__legend"
-}, T = { class: "t-chart__a11y t-visually-hidden" }, E = { scope: "row" }, D = 24, O = 2, k = /*@__PURE__*/ o({
+}, w = { class: "t-visually-hidden" }, T = { class: "t-chart__a11y" }, E = { scope: "row" }, D = 24, O = 2, k = /*@__PURE__*/ o({
 	__name: "TChart",
 	props: {
 		type: { default: "line" },
@@ -102,16 +102,16 @@ var ee = {
 				t && (N.value = t);
 			}), P.observe(e)));
 		}), d(() => P?.disconnect());
-		let F = t(() => A.series.filter((e) => e.data.length > 0)), I = t(() => Math.max(0, ...F.value.map((e) => e.data.length))), L = t(() => Array.from({ length: I.value }, (e, t) => t)), R = t(() => F.value.length > 0 && I.value > 0), Se = t(() => A.showLegend ?? F.value.length > 1), z = (e, t) => t.color ?? `var(--tree-color-chart-${e % 8 + 1})`, B = t(() => F.value.map((e, t) => ({
+		let F = t(() => A.series.filter((e) => e.data.length > 0)), I = t(() => Math.max(0, ...F.value.map((e) => e.data.length))), L = t(() => Array.from({ length: I.value }, (e, t) => t)), R = t(() => F.value.length > 0 && I.value > 0), Ce = t(() => A.showLegend ?? F.value.length > 1), z = (e, t) => t.color ?? `var(--tree-color-chart-${e % 8 + 1})`, B = t(() => F.value.map((e, t) => ({
 			name: e.name,
 			color: z(t, e)
-		}))), V = (e) => A.valueFormat ? A.valueFormat(e) : Math.abs(e) >= 1e3 ? e.toLocaleString("en-US") : `${e}`, Ce = t(() => ({
+		}))), V = (e) => A.valueFormat ? A.valueFormat(e) : Math.abs(e) >= 1e3 ? e.toLocaleString("en-US") : `${e}`, we = t(() => ({
 			top: 12,
 			right: 12,
 			bottom: A.showXAxis && A.labels.length ? 28 : 10,
 			left: A.showYAxis ? 44 : 10
 		})), H = t(() => {
-			let { top: e, right: t, bottom: n, left: r } = Ce.value;
+			let { top: e, right: t, bottom: n, left: r } = we.value;
 			return {
 				left: r,
 				right: N.value - t,
@@ -124,9 +124,9 @@ var ee = {
 					return this.bottom - this.top;
 				}
 			};
-		}), we = t(() => !A.stacked || A.type !== "bar" ? [] : Array.from({ length: I.value }, (e, t) => F.value.reduce((e, n) => e + Math.max(0, n.data[t] ?? 0), 0))), U = t(() => {
-			let e = A.type === "bar" || A.type === "area", t = F.value.flatMap((e) => e.data), n = A.stacked && A.type === "bar" ? we.value : t, r = n.length ? Math.min(...n) : 0, i = n.length ? Math.max(...n) : 1, a = A.minY ?? (e ? Math.min(0, r) : r);
-			return C(a, A.maxY ?? Math.max(i, a + 1), A.yTicks);
+		}), Te = t(() => !A.stacked || A.type !== "bar" ? [] : Array.from({ length: I.value }, (e, t) => F.value.reduce((e, n) => e + Math.max(0, n.data[t] ?? 0), 0))), U = t(() => {
+			let e = A.type === "bar" || A.type === "area", t = F.value.flatMap((e) => e.data), n = A.stacked && A.type === "bar" ? Te.value : t, r = n.length ? Math.min(...n) : 0, i = n.length ? Math.max(...n) : 1, a = A.minY ?? (e ? Math.min(0, r) : r);
+			return ee(a, A.maxY ?? Math.max(i, a + 1), A.yTicks);
 		}), W = t(() => S([U.value.min, U.value.max], [H.value.bottom, H.value.top])), G = t(() => W.value(Math.max(U.value.min, 0))), K = (e) => {
 			let t = I.value;
 			return t <= 1 ? H.value.left + H.value.innerWidth / 2 : H.value.left + e / (t - 1) * H.value.innerWidth;
@@ -141,7 +141,7 @@ var ee = {
 				area: A.type === "area" ? b(n, H.value.bottom, A.smooth) : "",
 				points: n
 			};
-		})), Te = t(() => {
+		})), Ee = t(() => {
 			if (A.type !== "bar") return [];
 			let e = [], t = q.value, n = Math.min(t * .72, D * F.value.length + O);
 			for (let t = 0; t < I.value; t += 1) {
@@ -179,11 +179,11 @@ var ee = {
 				}
 			}
 			return e;
-		}), Ee = t(() => U.value.ticks.map((e) => ({
+		}), De = t(() => U.value.ticks.map((e) => ({
 			value: e,
 			y: W.value(e),
 			label: V(e)
-		}))), De = t(() => {
+		}))), Oe = t(() => {
 			if (!A.showXAxis) return [];
 			let e = I.value, t = Math.max(2, Math.floor(H.value.innerWidth / 52)), n = Math.max(1, Math.ceil(e / t));
 			return A.labels.slice(0, e).map((t, r) => ({
@@ -191,7 +191,7 @@ var ee = {
 				x: Y(r),
 				show: r % n === 0 || r === e - 1
 			}));
-		}), Z = m(null), Oe = (e) => {
+		}), Z = m(null), Q = (e) => {
 			let t = M.value;
 			if (!t) return null;
 			let n = e - t.getBoundingClientRect().left, r = I.value;
@@ -202,9 +202,9 @@ var ee = {
 			}
 			let i = (n - H.value.left) / Math.max(1, H.value.innerWidth);
 			return Math.min(r - 1, Math.max(0, Math.round(i * (r - 1))));
-		}, Q = (e) => {
-			!A.showTooltip || !R.value || (Z.value = Oe(e.clientX));
-		}, ke = () => {
+		}, ke = (e) => {
+			!A.showTooltip || !R.value || (Z.value = Q(e.clientX));
+		}, Ae = () => {
 			Z.value = null;
 		}, $ = t(() => {
 			let e = Z.value;
@@ -217,7 +217,7 @@ var ee = {
 					color: z(n, t)
 				}))
 			};
-		}), Ae = t(() => {
+		}), je = t(() => {
 			let e = Z.value;
 			if (e === null) return {};
 			let t = Y(e);
@@ -225,16 +225,16 @@ var ee = {
 				left: `${Math.min(Math.max(t, 64), N.value - 64)}px`,
 				top: `${H.value.top}px`
 			};
-		}), je = t(() => {
+		}), Me = t(() => {
 			let e = Z.value;
 			return e === null || A.type === "bar" ? [] : X.value.map((t) => ({
 				x: t.points[e]?.x ?? 0,
 				y: t.points[e]?.y ?? 0,
 				color: t.color
 			}));
-		}), Me = () => {
+		}), Ne = () => {
 			$.value && j("point-click", $.value);
-		}, Ne = t(() => A.ariaLabel ?? `${A.type} chart with ${F.value.length} series`), Pe = t(() => [
+		}, Pe = t(() => A.ariaLabel ?? `${A.type} chart with ${F.value.length} series`), Fe = t(() => [
 			"t-chart",
 			`t-chart--${A.type}`,
 			{
@@ -242,13 +242,13 @@ var ee = {
 				"is-loading": A.loading
 			}
 		]);
-		return (t, d) => (p(), r("div", { class: c(Pe.value) }, [
+		return (t, d) => (p(), r("div", { class: c(Fe.value) }, [
 			i("div", {
 				ref_key: "canvasRef",
 				ref: M,
 				class: "t-chart__canvas",
 				style: u({ height: `${o.height}px` })
-			}, [o.loading ? (p(), r("div", ee, [(p(), r(e, null, h(5, (e) => i("span", {
+			}, [o.loading ? (p(), r("div", te, [(p(), r(e, null, h(5, (e) => i("span", {
 				key: e,
 				class: "t-chart__loading-bar",
 				style: u({ height: `${30 + e * 37 % 60}%` })
@@ -258,30 +258,30 @@ var ee = {
 				height: o.height,
 				viewBox: `0 0 ${N.value} ${o.height}`,
 				"aria-hidden": "true",
-				onPointermove: Q,
-				onPointerleave: ke,
-				onClick: Me
+				onPointermove: ke,
+				onPointerleave: Ae,
+				onClick: Ne
 			}, [
-				i("g", re, [(p(!0), r(e, null, h(Ee.value, (t) => (p(), r(e, { key: t.value }, [o.showGrid ? (p(), r("line", {
+				i("g", ie, [(p(!0), r(e, null, h(De.value, (t) => (p(), r(e, { key: t.value }, [o.showGrid ? (p(), r("line", {
 					key: 0,
 					class: "t-chart__gridline",
 					x1: H.value.left,
 					x2: H.value.right,
 					y1: t.y,
 					y2: t.y
-				}, null, 8, ie)) : n("", !0), o.showYAxis ? (p(), r("text", {
+				}, null, 8, ae)) : n("", !0), o.showYAxis ? (p(), r("text", {
 					key: 1,
 					class: "t-chart__axis-label t-chart__axis-label--y",
 					x: H.value.left - 8,
 					y: t.y
-				}, _(t.label), 9, ae)) : n("", !0)], 64))), 128))]),
-				i("g", oe, [(p(!0), r(e, null, h(X.value, (e, t) => y((p(), r("path", {
+				}, _(t.label), 9, oe)) : n("", !0)], 64))), 128))]),
+				i("g", se, [(p(!0), r(e, null, h(X.value, (e, t) => y((p(), r("path", {
 					key: `area-${t}`,
 					class: "t-chart__area",
 					d: e.area,
 					style: u({ color: e.color })
-				}, null, 12, se)), [[v, o.type === "area"]])), 128))]),
-				i("g", ce, [(p(!0), r(e, null, h(Te.value, (e, t) => (p(), r("rect", {
+				}, null, 12, ce)), [[v, o.type === "area"]])), 128))]),
+				i("g", le, [(p(!0), r(e, null, h(Ee.value, (e, t) => (p(), r("rect", {
 					key: `bar-${t}`,
 					class: c(["t-chart__bar", { "is-active": Z.value === e.index }]),
 					x: e.x,
@@ -293,47 +293,47 @@ var ee = {
 						color: e.color,
 						animationDelay: `${e.index * 40}ms`
 					})
-				}, null, 14, le))), 128))]),
-				i("g", ue, [(p(!0), r(e, null, h(X.value, (t, i) => (p(), r(e, { key: `line-${i}` }, [o.type === "bar" ? n("", !0) : (p(), r("path", {
+				}, null, 14, ue))), 128))]),
+				i("g", de, [(p(!0), r(e, null, h(X.value, (t, i) => (p(), r(e, { key: `line-${i}` }, [o.type === "bar" ? n("", !0) : (p(), r("path", {
 					key: 0,
 					class: "t-chart__line",
 					d: t.line,
 					"path-length": "1",
 					style: u({ color: t.color })
-				}, null, 12, de)), o.showPoints && o.type !== "bar" ? (p(!0), r(e, { key: 1 }, h(t.points, (e, n) => (p(), r("circle", {
+				}, null, 12, fe)), o.showPoints && o.type !== "bar" ? (p(!0), r(e, { key: 1 }, h(t.points, (e, n) => (p(), r("circle", {
 					key: `point-${i}-${n}`,
 					class: "t-chart__point",
 					cx: e.x,
 					cy: e.y,
 					r: "3",
 					style: u({ color: t.color })
-				}, null, 12, fe))), 128)) : n("", !0)], 64))), 128))]),
-				Z.value !== null && o.showTooltip ? (p(), r("g", pe, [i("line", {
+				}, null, 12, pe))), 128)) : n("", !0)], 64))), 128))]),
+				Z.value !== null && o.showTooltip ? (p(), r("g", me, [i("line", {
 					class: "t-chart__crosshair",
 					x1: Y(Z.value),
 					x2: Y(Z.value),
 					y1: H.value.top,
 					y2: H.value.bottom
-				}, null, 8, me), (p(!0), r(e, null, h(je.value, (e, t) => (p(), r("circle", {
+				}, null, 8, he), (p(!0), r(e, null, h(Me.value, (e, t) => (p(), r("circle", {
 					key: `marker-${t}`,
 					class: "t-chart__marker",
 					cx: e.x,
 					cy: e.y,
 					r: "4",
 					style: u({ color: e.color })
-				}, null, 12, he))), 128))])) : n("", !0),
-				o.showXAxis ? (p(), r("g", ge, [(p(!0), r(e, null, h(De.value, (e, t) => y((p(), r("text", {
+				}, null, 12, ge))), 128))])) : n("", !0),
+				o.showXAxis ? (p(), r("g", _e, [(p(!0), r(e, null, h(Oe.value, (e, t) => y((p(), r("text", {
 					key: `x-${t}`,
 					class: "t-chart__axis-label t-chart__axis-label--x",
 					x: e.x,
 					y: o.height - 8
-				}, _(e.label), 9, _e)), [[v, e.show]])), 128))])) : n("", !0)
-			], 40, ne)), o.showTooltip && $.value ? (p(), r("div", {
+				}, _(e.label), 9, ve)), [[v, e.show]])), 128))])) : n("", !0)
+			], 40, re)), o.showTooltip && $.value ? (p(), r("div", {
 				key: 0,
 				class: "t-chart__tooltip",
-				style: u(Ae.value),
+				style: u(je.value),
 				role: "presentation"
-			}, [g(t.$slots, "tooltip", l(s($.value)), () => [i("p", ve, _($.value.label), 1), i("ul", ye, [(p(!0), r(e, null, h($.value.values, (e, t) => (p(), r("li", {
+			}, [g(t.$slots, "tooltip", l(s($.value)), () => [i("p", ye, _($.value.label), 1), i("ul", be, [(p(!0), r(e, null, h($.value.values, (e, t) => (p(), r("li", {
 				key: t,
 				class: "t-chart__tooltip-item"
 			}, [
@@ -342,10 +342,10 @@ var ee = {
 					style: u({ background: e.color }),
 					"aria-hidden": "true"
 				}, null, 4),
-				i("span", be, _(e.name), 1),
-				i("span", xe, _(V(e.value)), 1)
-			]))), 128))])])], 4)) : n("", !0)], 64)) : (p(), r("div", te, [g(t.$slots, "empty", {}, () => [d[0] ||= a(" No data to display ", -1)])]))], 4),
-			Se.value && R.value ? (p(), r("div", w, [g(t.$slots, "legend", { series: B.value }, () => [(p(!0), r(e, null, h(B.value, (e, t) => (p(), r("span", {
+				i("span", xe, _(e.name), 1),
+				i("span", Se, _(V(e.value)), 1)
+			]))), 128))])])], 4)) : n("", !0)], 64)) : (p(), r("div", ne, [g(t.$slots, "empty", {}, () => [d[0] ||= a(" No data to display ", -1)])]))], 4),
+			Ce.value && R.value ? (p(), r("div", C, [g(t.$slots, "legend", { series: B.value }, () => [(p(!0), r(e, null, h(B.value, (e, t) => (p(), r("span", {
 				key: t,
 				class: "t-chart__legend-item"
 			}, [i("span", {
@@ -353,14 +353,14 @@ var ee = {
 				style: u({ background: e.color }),
 				"aria-hidden": "true"
 			}, null, 4), a(" " + _(e.name), 1)]))), 128))])])) : n("", !0),
-			i("table", T, [
-				i("caption", null, _(Ne.value), 1),
+			i("div", w, [i("table", T, [
+				i("caption", null, _(Pe.value), 1),
 				i("thead", null, [i("tr", null, [d[1] ||= i("th", { scope: "col" }, " Series ", -1), (p(!0), r(e, null, h(L.value, (e) => (p(), r("th", {
 					key: e,
 					scope: "col"
 				}, _(o.labels[e] ?? ""), 1))), 128))])]),
 				i("tbody", null, [(p(!0), r(e, null, h(F.value, (t, n) => (p(), r("tr", { key: n }, [i("th", E, _(t.name), 1), (p(!0), r(e, null, h(L.value, (e) => (p(), r("td", { key: e }, _(t.data[e] === void 0 ? "" : V(t.data[e])), 1))), 128))]))), 128))])
-			])
+			])])
 		], 2));
 	}
 });

package/dist/components/TChart.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TChart.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/TChart.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref } from 'vue';\nimport {\n buildAreaPath,\n buildLinePath,\n linearScale,\n niceScale,\n type ChartPoint,\n} from '@treeui/utils';\n\nexport type TChartType = 'line' \| 'area' \| 'bar';\n\nexport interface TChartSeries {\n /** Legend/tooltip name for the series. /\n name: string;\n /* One value per category, aligned to `labels`. /\n data: number[];\n /* Override the series color; defaults to a chart palette token. /\n color?: string;\n}\n\nexport interface TChartActivePayload {\n index: number;\n label: string;\n values: Array<{ name: string; value: number; color: string }>;\n}\n\nconst props = withDefaults(\n defineProps<{\n /* Visual form of the plot. /\n type?: TChartType;\n /* One or more data series. /\n series?: TChartSeries[];\n /* Category labels for the x-axis, aligned to each series' data. /\n labels?: string[];\n /* Plot height in px (width is fluid). /\n height?: number;\n /* Smooth (curved) line/area. /\n smooth?: boolean;\n /\n Stack bar series on top of each other instead of grouping side by side.\n * Negative values are clamped to 0 in stacked mode (grouped mode renders them).\n /\n stacked?: boolean;\n /* Draw horizontal gridlines. /\n showGrid?: boolean;\n /* Show the legend. Defaults to on when there is more than one series. /\n showLegend?: boolean;\n /* Show x-axis category labels. /\n showXAxis?: boolean;\n /* Show y-axis value ticks. /\n showYAxis?: boolean;\n /* Show the hover crosshair + tooltip. /\n showTooltip?: boolean;\n /* Always render markers on line/area points (not just on hover). /\n showPoints?: boolean;\n /* Target number of y-axis ticks. /\n yTicks?: number;\n /* Format axis + tooltip values. /\n valueFormat?: (value: number) => string;\n /* Force the low end of the y domain. /\n minY?: number;\n /* Force the high end of the y domain. /\n maxY?: number;\n /* Animate marks on first render (respects prefers-reduced-motion). /\n animated?: boolean;\n /* Render skeleton placeholders instead of the plot. /\n loading?: boolean;\n /* Accessible summary of the chart. /\n ariaLabel?: string;\n }>(),\n {\n type: 'line',\n series: () => [],\n labels: () => [],\n height: 260,\n smooth: false,\n stacked: false,\n showGrid: true,\n showLegend: undefined,\n showXAxis: true,\n showYAxis: true,\n showTooltip: true,\n showPoints: false,\n yTicks: 5,\n valueFormat: undefined,\n minY: undefined,\n maxY: undefined,\n animated: true,\n loading: false,\n ariaLabel: undefined,\n },\n);\n\nconst emit = defineEmits<{\n 'point-click': [payload: TChartActivePayload];\n}>();\n\ndefineSlots<{\n legend?: (props: { series: Array<{ name: string; color: string }> }) => unknown;\n tooltip?: (props: TChartActivePayload) => unknown;\n empty?: () => unknown;\n}>();\n\n// --- measurement ----------------------------------------------------------\nconst canvasRef = ref<HTMLElement \| null>(null);\nconst width = ref(640);\nlet observer: ResizeObserver \| null = null;\n\nonMounted(() => {\n const element = canvasRef.value;\n if (!element) return;\n width.value = element.clientWidth \|\| width.value;\n\n if (typeof ResizeObserver !== 'undefined') {\n observer = new ResizeObserver((entries) => {\n const measured = entries[0]?.contentRect.width;\n if (measured) width.value = measured;\n });\n observer.observe(element);\n }\n});\n\nonBeforeUnmount(() => observer?.disconnect());\n\n// --- derived data ---------------------------------------------------------\nconst validSeries = computed(() => props.series.filter((item) => item.data.length > 0));\n\nconst categoryCount = computed(() =>\n Math.max(0, ...validSeries.value.map((item) => item.data.length)),\n);\n\n// Shared category index range, so the a11y table stays rectangular even when\n// series have different lengths.\nconst axisIndices = computed(() =>\n Array.from({ length: categoryCount.value }, (_, index) => index),\n);\n\nconst hasData = computed(() => validSeries.value.length > 0 && categoryCount.value > 0);\n\nconst resolvedShowLegend = computed(() =>\n props.showLegend ?? validSeries.value.length > 1,\n);\n\nconst colorFor = (index: number, series: TChartSeries) =>\n series.color ?? `var(--tree-color-chart-${(index % 8) + 1})`;\n\nconst legendItems = computed(() =>\n validSeries.value.map((series, index) => ({\n name: series.name,\n color: colorFor(index, series),\n })),\n);\n\nconst formatValue = (value: number) => {\n if (props.valueFormat) return props.valueFormat(value);\n if (Math.abs(value) >= 1000) return value.toLocaleString('en-US');\n return `${value}`;\n};\n\n// --- layout ---------------------------------------------------------------\nconst margin = computed(() => ({\n top: 12,\n right: 12,\n bottom: props.showXAxis && props.labels.length ? 28 : 10,\n left: props.showYAxis ? 44 : 10,\n}));\n\nconst plot = computed(() => {\n const { top, right, bottom, left } = margin.value;\n return {\n left,\n right: width.value - right,\n top,\n bottom: props.height - bottom,\n get innerWidth() {\n return this.right - this.left;\n },\n get innerHeight() {\n return this.bottom - this.top;\n },\n };\n});\n\nconst stackedTotals = computed(() => {\n if (!props.stacked \|\| props.type !== 'bar') return [];\n return Array.from({ length: categoryCount.value }, (_, index) =>\n validSeries.value.reduce((sum, series) => sum + Math.max(0, series.data[index] ?? 0), 0),\n );\n});\n\nconst scale = computed(() => {\n const baselineZero = props.type === 'bar' \|\| props.type === 'area';\n const flat = validSeries.value.flatMap((series) => series.data);\n\n const source = props.stacked && props.type === 'bar' ? stackedTotals.value : flat;\n const rawMin = source.length ? Math.min(...source) : 0;\n const rawMax = source.length ? Math.max(...source) : 1;\n\n const min = props.minY ?? (baselineZero ? Math.min(0, rawMin) : rawMin);\n const max = props.maxY ?? Math.max(rawMax, min + 1);\n\n return niceScale(min, max, props.yTicks);\n});\n\nconst yScale = computed(() =>\n linearScale([scale.value.min, scale.value.max], [plot.value.bottom, plot.value.top]),\n);\n\nconst baselineY = computed(() => yScale.value(Math.max(scale.value.min, 0)));\n\n// x-position helpers -------------------------------------------------------\nconst pointX = (index: number) => {\n const count = categoryCount.value;\n if (count <= 1) return plot.value.left + plot.value.innerWidth / 2;\n return plot.value.left + (index / (count - 1)) plot.value.innerWidth;\n};\n\nconst band = computed(() => plot.value.innerWidth / Math.max(1, categoryCount.value));\nconst bandCenter = (index: number) => plot.value.left + band.value * (index + 0.5);\n\n// active category (for line/area points and axis labels)\nconst activeX = (index: number) =>\n props.type === 'bar' ? bandCenter(index) : pointX(index);\n\n// --- line / area geometry -------------------------------------------------\nconst linePaths = computed(() =>\n props.type === 'bar'\n ? []\n : validSeries.value.map((series, seriesIndex) => {\n const points: ChartPoint[] = series.data.map((value, index) => ({\n x: pointX(index),\n y: yScale.value(value),\n }));\n return {\n color: colorFor(seriesIndex, series),\n line: buildLinePath(points, props.smooth),\n area: props.type === 'area' ? buildAreaPath(points, plot.value.bottom, props.smooth) : '',\n points,\n };\n }),\n);\n\n// --- bar geometry ---------------------------------------------------------\nconst BAR_MAX = 24;\nconst BAR_GAP = 2;\n\nconst bars = computed(() => {\n if (props.type !== 'bar') return [];\n const output: Array<{\n x: number;\n y: number;\n width: number;\n height: number;\n color: string;\n seriesIndex: number;\n index: number;\n }> = [];\n\n const bandWidth = band.value;\n const groupWidth = Math.min(bandWidth * 0.72, BAR_MAX * validSeries.value.length + BAR_GAP);\n\n for (let index = 0; index < categoryCount.value; index += 1) {\n const center = bandCenter(index);\n\n if (props.stacked) {\n const barWidth = Math.min(groupWidth, BAR_MAX);\n let cursorBottom = baselineY.value;\n validSeries.value.forEach((series, seriesIndex) => {\n const value = Math.max(0, series.data[index] ?? 0);\n // Pixel height is proportional to the segment's own value.\n const segmentHeight = baselineY.value - yScale.value(value);\n if (segmentHeight <= 0) return;\n const top = cursorBottom - segmentHeight;\n output.push({\n x: center - barWidth / 2,\n y: top,\n // Trim 2px off each segment for a surface gap between stacked marks.\n height: Math.max(0, segmentHeight - BAR_GAP),\n width: barWidth,\n color: colorFor(seriesIndex, series),\n seriesIndex,\n index,\n });\n cursorBottom = top;\n });\n } else {\n const barWidth = Math.max(1, (groupWidth - BAR_GAP * (validSeries.value.length - 1)) / validSeries.value.length);\n validSeries.value.forEach((series, seriesIndex) => {\n const value = series.data[index] ?? 0;\n const top = yScale.value(value);\n const start = center - groupWidth / 2 + seriesIndex * (barWidth + BAR_GAP);\n output.push({\n x: start,\n y: Math.min(top, baselineY.value),\n width: barWidth,\n height: Math.abs(baselineY.value - top),\n color: colorFor(seriesIndex, series),\n seriesIndex,\n index,\n });\n });\n }\n }\n\n return output;\n});\n\n// --- gridlines & axes -----------------------------------------------------\nconst gridLines = computed(() =>\n scale.value.ticks.map((tick) => ({\n value: tick,\n y: yScale.value(tick),\n label: formatValue(tick),\n })),\n);\n\nconst xLabels = computed(() => {\n if (!props.showXAxis) return [];\n const count = categoryCount.value;\n const maxLabels = Math.max(2, Math.floor(plot.value.innerWidth / 52));\n const step = Math.max(1, Math.ceil(count / maxLabels));\n return props.labels.slice(0, count).map((label, index) => ({\n label,\n x: activeX(index),\n show: index % step === 0 \|\| index === count - 1,\n }));\n});\n\n// --- interaction ----------------------------------------------------------\nconst activeIndex = ref<number \| null>(null);\n\nconst pointerToIndex = (clientX: number) => {\n const element = canvasRef.value;\n if (!element) return null;\n const rect = element.getBoundingClientRect();\n const x = clientX - rect.left;\n const count = categoryCount.value;\n if (count === 0) return null;\n\n if (props.type === 'bar') {\n const index = Math.floor((x - plot.value.left) / band.value);\n return Math.min(count - 1, Math.max(0, index));\n }\n\n const ratio = (x - plot.value.left) / Math.max(1, plot.value.innerWidth);\n return Math.min(count - 1, Math.max(0, Math.round(ratio * (count - 1))));\n};\n\nconst onPointerMove = (event: PointerEvent) => {\n if (!props.showTooltip \|\| !hasData.value) return;\n activeIndex.value = pointerToIndex(event.clientX);\n};\n\nconst onPointerLeave = () => {\n activeIndex.value = null;\n};\n\nconst activePayload = computed<TChartActivePayload \| null>(() => {\n const index = activeIndex.value;\n if (index === null) return null;\n return {\n index,\n label: props.labels[index] ?? `#${index + 1}`,\n values: validSeries.value.map((series, seriesIndex) => ({\n name: series.name,\n value: series.data[index] ?? 0,\n color: colorFor(seriesIndex, series),\n })),\n };\n});\n\nconst tooltipStyle = computed(() => {\n const index = activeIndex.value;\n if (index === null) return {};\n const x = activeX(index);\n const clamped = Math.min(Math.max(x, 64), width.value - 64);\n return { left: `${clamped}px`, top: `${plot.value.top}px` };\n});\n\nconst activeMarkers = computed(() => {\n const index = activeIndex.value;\n if (index === null \|\| props.type === 'bar') return [];\n return linePaths.value.map((path) => ({\n x: path.points[index]?.x ?? 0,\n y: path.points[index]?.y ?? 0,\n color: path.color,\n }));\n});\n\nconst onClick = () => {\n if (activePayload.value) emit('point-click', activePayload.value);\n};\n\nconst resolvedLabel = computed(\n () => props.ariaLabel ?? `${props.type} chart with ${validSeries.value.length} series`,\n);\n\nconst rootClasses = computed(() => [\n 't-chart',\n `t-chart--${props.type}`,\n {\n 'is-animated': props.animated,\n 'is-loading': props.loading,\n },\n]);\n</script>\n\n<template>\n <div :class=\"rootClasses\">\n <div\n ref=\"canvasRef\"\n class=\"t-chart__canvas\"\n :style=\"{ height: `${height}px` }\"\n >\n <div\n v-if=\"loading\"\n class=\"t-chart__loading\"\n >\n <span\n v-for=\"n in 5\"\n :key=\"n\"\n class=\"t-chart__loading-bar\"\n :style=\"{ height: `${30 + ((n * 37) % 60)}%` }\"\n />\n </div>\n\n <div\n v-else-if=\"!hasData\"\n class=\"t-chart__empty\"\n >\n <slot name=\"empty\">\n No data to display\n </slot>\n </div>\n\n <template v-else>\n <svg\n class=\"t-chart__svg\"\n :width=\"width\"\n :height=\"height\"\n :viewBox=\"`0 0 ${width} ${height}`\"\n aria-hidden=\"true\"\n @pointermove=\"onPointerMove\"\n @pointerleave=\"onPointerLeave\"\n @click=\"onClick\"\n >\n <!-- gridlines + y ticks -->\n <g class=\"t-chart__grid\">\n <template\n v-for=\"line in gridLines\"\n :key=\"line.value\"\n >\n <line\n v-if=\"showGrid\"\n class=\"t-chart__gridline\"\n :x1=\"plot.left\"\n :x2=\"plot.right\"\n :y1=\"line.y\"\n :y2=\"line.y\"\n />\n <text\n v-if=\"showYAxis\"\n class=\"t-chart__axis-label t-chart__axis-label--y\"\n :x=\"plot.left - 8\"\n :y=\"line.y\"\n >\n {{ line.label }}\n </text>\n </template>\n </g>\n\n <!-- area fills -->\n <g class=\"t-chart__areas\">\n <path\n v-for=\"(path, index) in linePaths\"\n v-show=\"type === 'area'\"\n :key=\"`area-${index}`\"\n class=\"t-chart__area\"\n :d=\"path.area\"\n :style=\"{ color: path.color }\"\n />\n </g>\n\n <!-- bars -->\n <g class=\"t-chart__bars\">\n <rect\n v-for=\"(bar, index) in bars\"\n :key=\"`bar-${index}`\"\n class=\"t-chart__bar\"\n :x=\"bar.x\"\n :y=\"bar.y\"\n :width=\"bar.width\"\n :height=\"bar.height\"\n :rx=\"Math.min(4, bar.width / 2)\"\n :style=\"{ color: bar.color, animationDelay: `${bar.index * 40}ms` }\"\n :class=\"{ 'is-active': activeIndex === bar.index }\"\n />\n </g>\n\n <!-- lines + optional static points -->\n <g class=\"t-chart__lines\">\n <template\n v-for=\"(path, index) in linePaths\"\n :key=\"`line-${index}`\"\n >\n <path\n v-if=\"type !== 'bar'\"\n class=\"t-chart__line\"\n :d=\"path.line\"\n path-length=\"1\"\n :style=\"{ color: path.color }\"\n />\n <template v-if=\"showPoints && type !== 'bar'\">\n <circle\n v-for=\"(point, pointIndex) in path.points\"\n :key=\"`point-${index}-${pointIndex}`\"\n class=\"t-chart__point\"\n :cx=\"point.x\"\n :cy=\"point.y\"\n r=\"3\"\n :style=\"{ color: path.color }\"\n />\n </template>\n </template>\n </g>\n\n <!-- hover crosshair + active markers -->\n <g\n v-if=\"activeIndex !== null && showTooltip\"\n class=\"t-chart__hover\"\n >\n <line\n class=\"t-chart__crosshair\"\n :x1=\"activeX(activeIndex)\"\n :x2=\"activeX(activeIndex)\"\n :y1=\"plot.top\"\n :y2=\"plot.bottom\"\n />\n <circle\n v-for=\"(marker, index) in activeMarkers\"\n :key=\"`marker-${index}`\"\n class=\"t-chart__marker\"\n :cx=\"marker.x\"\n :cy=\"marker.y\"\n r=\"4\"\n :style=\"{ color: marker.color }\"\n />\n </g>\n\n <!-- x-axis labels -->\n <g\n v-if=\"showXAxis\"\n class=\"t-chart__x-axis\"\n >\n <text\n v-for=\"(item, index) in xLabels\"\n v-show=\"item.show\"\n :key=\"`x-${index}`\"\n class=\"t-chart__axis-label t-chart__axis-label--x\"\n :x=\"item.x\"\n :y=\"height - 8\"\n >\n {{ item.label }}\n </text>\n </g>\n </svg>\n\n <div\n v-if=\"showTooltip && activePayload\"\n class=\"t-chart__tooltip\"\n :style=\"tooltipStyle\"\n role=\"presentation\"\n >\n <slot\n name=\"tooltip\"\n v-bind=\"activePayload\"\n >\n <p class=\"t-chart__tooltip-label\">\n {{ activePayload.label }}\n </p>\n <ul class=\"t-chart__tooltip-list\">\n <li\n v-for=\"(item, index) in activePayload.values\"\n :key=\"index\"\n class=\"t-chart__tooltip-item\"\n >\n <span\n class=\"t-chart__tooltip-dot\"\n :style=\"{ background: item.color }\"\n aria-hidden=\"true\"\n />\n <span class=\"t-chart__tooltip-name\">{{ item.name }}</span>\n <span class=\"t-chart__tooltip-value\">{{ formatValue(item.value) }}</span>\n </li>\n </ul>\n </slot>\n </div>\n </template>\n </div>\n\n <div\n v-if=\"resolvedShowLegend && hasData\"\n class=\"t-chart__legend\"\n >\n <slot\n name=\"legend\"\n :series=\"legendItems\"\n >\n <span\n v-for=\"(item, index) in legendItems\"\n :key=\"index\"\n class=\"t-chart__legend-item\"\n >\n <span\n class=\"t-chart__legend-swatch\"\n :style=\"{ background: item.color }\"\n aria-hidden=\"true\"\n />\n {{ item.name }}\n </span>\n </slot>\n </div>\n\n <!-- Accessible data table: the chart's data as text for assistive tech. -->\n <table class=\"t-chart__a11y t-visually-hidden\">\n <caption>{{ resolvedLabel }}</caption>\n <thead>\n <tr>\n <th scope=\"col\">\n Series\n </th>\n <th\n v-for=\"index in axisIndices\"\n :key=\"index\"\n scope=\"col\"\n >\n {{ labels[index] ?? '' }}\n </th>\n </tr>\n </thead>\n <tbody>\n <tr\n v-for=\"(row, rowIndex) in validSeries\"\n :key=\"rowIndex\"\n >\n <th scope=\"row\">\n {{ row.name }}\n </th>\n <td\n v-for=\"index in axisIndices\"\n :key=\"index\"\n >\n {{ row.data[index] === undefined ? '' : formatValue(row.data[index]) }}\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n</template>\n"],"mappings":"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"}
1	+ {"version":3,"file":"TChart.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/TChart.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref } from 'vue';\nimport {\n buildAreaPath,\n buildLinePath,\n linearScale,\n niceScale,\n type ChartPoint,\n} from '@treeui/utils';\n\nexport type TChartType = 'line' \| 'area' \| 'bar';\n\nexport interface TChartSeries {\n /** Legend/tooltip name for the series. /\n name: string;\n /* One value per category, aligned to `labels`. /\n data: number[];\n /* Override the series color; defaults to a chart palette token. /\n color?: string;\n}\n\nexport interface TChartActivePayload {\n index: number;\n label: string;\n values: Array<{ name: string; value: number; color: string }>;\n}\n\nconst props = withDefaults(\n defineProps<{\n /* Visual form of the plot. /\n type?: TChartType;\n /* One or more data series. /\n series?: TChartSeries[];\n /* Category labels for the x-axis, aligned to each series' data. /\n labels?: string[];\n /* Plot height in px (width is fluid). /\n height?: number;\n /* Smooth (curved) line/area. /\n smooth?: boolean;\n /\n Stack bar series on top of each other instead of grouping side by side.\n * Negative values are clamped to 0 in stacked mode (grouped mode renders them).\n /\n stacked?: boolean;\n /* Draw horizontal gridlines. /\n showGrid?: boolean;\n /* Show the legend. Defaults to on when there is more than one series. /\n showLegend?: boolean;\n /* Show x-axis category labels. /\n showXAxis?: boolean;\n /* Show y-axis value ticks. /\n showYAxis?: boolean;\n /* Show the hover crosshair + tooltip. /\n showTooltip?: boolean;\n /* Always render markers on line/area points (not just on hover). /\n showPoints?: boolean;\n /* Target number of y-axis ticks. /\n yTicks?: number;\n /* Format axis + tooltip values. /\n valueFormat?: (value: number) => string;\n /* Force the low end of the y domain. /\n minY?: number;\n /* Force the high end of the y domain. /\n maxY?: number;\n /* Animate marks on first render (respects prefers-reduced-motion). /\n animated?: boolean;\n /* Render skeleton placeholders instead of the plot. /\n loading?: boolean;\n /* Accessible summary of the chart. /\n ariaLabel?: string;\n }>(),\n {\n type: 'line',\n series: () => [],\n labels: () => [],\n height: 260,\n smooth: false,\n stacked: false,\n showGrid: true,\n showLegend: undefined,\n showXAxis: true,\n showYAxis: true,\n showTooltip: true,\n showPoints: false,\n yTicks: 5,\n valueFormat: undefined,\n minY: undefined,\n maxY: undefined,\n animated: true,\n loading: false,\n ariaLabel: undefined,\n },\n);\n\nconst emit = defineEmits<{\n 'point-click': [payload: TChartActivePayload];\n}>();\n\ndefineSlots<{\n legend?: (props: { series: Array<{ name: string; color: string }> }) => unknown;\n tooltip?: (props: TChartActivePayload) => unknown;\n empty?: () => unknown;\n}>();\n\n// --- measurement ----------------------------------------------------------\nconst canvasRef = ref<HTMLElement \| null>(null);\nconst width = ref(640);\nlet observer: ResizeObserver \| null = null;\n\nonMounted(() => {\n const element = canvasRef.value;\n if (!element) return;\n width.value = element.clientWidth \|\| width.value;\n\n if (typeof ResizeObserver !== 'undefined') {\n observer = new ResizeObserver((entries) => {\n const measured = entries[0]?.contentRect.width;\n if (measured) width.value = measured;\n });\n observer.observe(element);\n }\n});\n\nonBeforeUnmount(() => observer?.disconnect());\n\n// --- derived data ---------------------------------------------------------\nconst validSeries = computed(() => props.series.filter((item) => item.data.length > 0));\n\nconst categoryCount = computed(() =>\n Math.max(0, ...validSeries.value.map((item) => item.data.length)),\n);\n\n// Shared category index range, so the a11y table stays rectangular even when\n// series have different lengths.\nconst axisIndices = computed(() =>\n Array.from({ length: categoryCount.value }, (_, index) => index),\n);\n\nconst hasData = computed(() => validSeries.value.length > 0 && categoryCount.value > 0);\n\nconst resolvedShowLegend = computed(() =>\n props.showLegend ?? validSeries.value.length > 1,\n);\n\nconst colorFor = (index: number, series: TChartSeries) =>\n series.color ?? `var(--tree-color-chart-${(index % 8) + 1})`;\n\nconst legendItems = computed(() =>\n validSeries.value.map((series, index) => ({\n name: series.name,\n color: colorFor(index, series),\n })),\n);\n\nconst formatValue = (value: number) => {\n if (props.valueFormat) return props.valueFormat(value);\n if (Math.abs(value) >= 1000) return value.toLocaleString('en-US');\n return `${value}`;\n};\n\n// --- layout ---------------------------------------------------------------\nconst margin = computed(() => ({\n top: 12,\n right: 12,\n bottom: props.showXAxis && props.labels.length ? 28 : 10,\n left: props.showYAxis ? 44 : 10,\n}));\n\nconst plot = computed(() => {\n const { top, right, bottom, left } = margin.value;\n return {\n left,\n right: width.value - right,\n top,\n bottom: props.height - bottom,\n get innerWidth() {\n return this.right - this.left;\n },\n get innerHeight() {\n return this.bottom - this.top;\n },\n };\n});\n\nconst stackedTotals = computed(() => {\n if (!props.stacked \|\| props.type !== 'bar') return [];\n return Array.from({ length: categoryCount.value }, (_, index) =>\n validSeries.value.reduce((sum, series) => sum + Math.max(0, series.data[index] ?? 0), 0),\n );\n});\n\nconst scale = computed(() => {\n const baselineZero = props.type === 'bar' \|\| props.type === 'area';\n const flat = validSeries.value.flatMap((series) => series.data);\n\n const source = props.stacked && props.type === 'bar' ? stackedTotals.value : flat;\n const rawMin = source.length ? Math.min(...source) : 0;\n const rawMax = source.length ? Math.max(...source) : 1;\n\n const min = props.minY ?? (baselineZero ? Math.min(0, rawMin) : rawMin);\n const max = props.maxY ?? Math.max(rawMax, min + 1);\n\n return niceScale(min, max, props.yTicks);\n});\n\nconst yScale = computed(() =>\n linearScale([scale.value.min, scale.value.max], [plot.value.bottom, plot.value.top]),\n);\n\nconst baselineY = computed(() => yScale.value(Math.max(scale.value.min, 0)));\n\n// x-position helpers -------------------------------------------------------\nconst pointX = (index: number) => {\n const count = categoryCount.value;\n if (count <= 1) return plot.value.left + plot.value.innerWidth / 2;\n return plot.value.left + (index / (count - 1)) plot.value.innerWidth;\n};\n\nconst band = computed(() => plot.value.innerWidth / Math.max(1, categoryCount.value));\nconst bandCenter = (index: number) => plot.value.left + band.value * (index + 0.5);\n\n// active category (for line/area points and axis labels)\nconst activeX = (index: number) =>\n props.type === 'bar' ? bandCenter(index) : pointX(index);\n\n// --- line / area geometry -------------------------------------------------\nconst linePaths = computed(() =>\n props.type === 'bar'\n ? []\n : validSeries.value.map((series, seriesIndex) => {\n const points: ChartPoint[] = series.data.map((value, index) => ({\n x: pointX(index),\n y: yScale.value(value),\n }));\n return {\n color: colorFor(seriesIndex, series),\n line: buildLinePath(points, props.smooth),\n area: props.type === 'area' ? buildAreaPath(points, plot.value.bottom, props.smooth) : '',\n points,\n };\n }),\n);\n\n// --- bar geometry ---------------------------------------------------------\nconst BAR_MAX = 24;\nconst BAR_GAP = 2;\n\nconst bars = computed(() => {\n if (props.type !== 'bar') return [];\n const output: Array<{\n x: number;\n y: number;\n width: number;\n height: number;\n color: string;\n seriesIndex: number;\n index: number;\n }> = [];\n\n const bandWidth = band.value;\n const groupWidth = Math.min(bandWidth * 0.72, BAR_MAX * validSeries.value.length + BAR_GAP);\n\n for (let index = 0; index < categoryCount.value; index += 1) {\n const center = bandCenter(index);\n\n if (props.stacked) {\n const barWidth = Math.min(groupWidth, BAR_MAX);\n let cursorBottom = baselineY.value;\n validSeries.value.forEach((series, seriesIndex) => {\n const value = Math.max(0, series.data[index] ?? 0);\n // Pixel height is proportional to the segment's own value.\n const segmentHeight = baselineY.value - yScale.value(value);\n if (segmentHeight <= 0) return;\n const top = cursorBottom - segmentHeight;\n output.push({\n x: center - barWidth / 2,\n y: top,\n // Trim 2px off each segment for a surface gap between stacked marks.\n height: Math.max(0, segmentHeight - BAR_GAP),\n width: barWidth,\n color: colorFor(seriesIndex, series),\n seriesIndex,\n index,\n });\n cursorBottom = top;\n });\n } else {\n const barWidth = Math.max(1, (groupWidth - BAR_GAP * (validSeries.value.length - 1)) / validSeries.value.length);\n validSeries.value.forEach((series, seriesIndex) => {\n const value = series.data[index] ?? 0;\n const top = yScale.value(value);\n const start = center - groupWidth / 2 + seriesIndex * (barWidth + BAR_GAP);\n output.push({\n x: start,\n y: Math.min(top, baselineY.value),\n width: barWidth,\n height: Math.abs(baselineY.value - top),\n color: colorFor(seriesIndex, series),\n seriesIndex,\n index,\n });\n });\n }\n }\n\n return output;\n});\n\n// --- gridlines & axes -----------------------------------------------------\nconst gridLines = computed(() =>\n scale.value.ticks.map((tick) => ({\n value: tick,\n y: yScale.value(tick),\n label: formatValue(tick),\n })),\n);\n\nconst xLabels = computed(() => {\n if (!props.showXAxis) return [];\n const count = categoryCount.value;\n const maxLabels = Math.max(2, Math.floor(plot.value.innerWidth / 52));\n const step = Math.max(1, Math.ceil(count / maxLabels));\n return props.labels.slice(0, count).map((label, index) => ({\n label,\n x: activeX(index),\n show: index % step === 0 \|\| index === count - 1,\n }));\n});\n\n// --- interaction ----------------------------------------------------------\nconst activeIndex = ref<number \| null>(null);\n\nconst pointerToIndex = (clientX: number) => {\n const element = canvasRef.value;\n if (!element) return null;\n const rect = element.getBoundingClientRect();\n const x = clientX - rect.left;\n const count = categoryCount.value;\n if (count === 0) return null;\n\n if (props.type === 'bar') {\n const index = Math.floor((x - plot.value.left) / band.value);\n return Math.min(count - 1, Math.max(0, index));\n }\n\n const ratio = (x - plot.value.left) / Math.max(1, plot.value.innerWidth);\n return Math.min(count - 1, Math.max(0, Math.round(ratio * (count - 1))));\n};\n\nconst onPointerMove = (event: PointerEvent) => {\n if (!props.showTooltip \|\| !hasData.value) return;\n activeIndex.value = pointerToIndex(event.clientX);\n};\n\nconst onPointerLeave = () => {\n activeIndex.value = null;\n};\n\nconst activePayload = computed<TChartActivePayload \| null>(() => {\n const index = activeIndex.value;\n if (index === null) return null;\n return {\n index,\n label: props.labels[index] ?? `#${index + 1}`,\n values: validSeries.value.map((series, seriesIndex) => ({\n name: series.name,\n value: series.data[index] ?? 0,\n color: colorFor(seriesIndex, series),\n })),\n };\n});\n\nconst tooltipStyle = computed(() => {\n const index = activeIndex.value;\n if (index === null) return {};\n const x = activeX(index);\n const clamped = Math.min(Math.max(x, 64), width.value - 64);\n return { left: `${clamped}px`, top: `${plot.value.top}px` };\n});\n\nconst activeMarkers = computed(() => {\n const index = activeIndex.value;\n if (index === null \|\| props.type === 'bar') return [];\n return linePaths.value.map((path) => ({\n x: path.points[index]?.x ?? 0,\n y: path.points[index]?.y ?? 0,\n color: path.color,\n }));\n});\n\nconst onClick = () => {\n if (activePayload.value) emit('point-click', activePayload.value);\n};\n\nconst resolvedLabel = computed(\n () => props.ariaLabel ?? `${props.type} chart with ${validSeries.value.length} series`,\n);\n\nconst rootClasses = computed(() => [\n 't-chart',\n `t-chart--${props.type}`,\n {\n 'is-animated': props.animated,\n 'is-loading': props.loading,\n },\n]);\n</script>\n\n<template>\n <div :class=\"rootClasses\">\n <div\n ref=\"canvasRef\"\n class=\"t-chart__canvas\"\n :style=\"{ height: `${height}px` }\"\n >\n <div\n v-if=\"loading\"\n class=\"t-chart__loading\"\n >\n <span\n v-for=\"n in 5\"\n :key=\"n\"\n class=\"t-chart__loading-bar\"\n :style=\"{ height: `${30 + ((n * 37) % 60)}%` }\"\n />\n </div>\n\n <div\n v-else-if=\"!hasData\"\n class=\"t-chart__empty\"\n >\n <slot name=\"empty\">\n No data to display\n </slot>\n </div>\n\n <template v-else>\n <svg\n class=\"t-chart__svg\"\n :width=\"width\"\n :height=\"height\"\n :viewBox=\"`0 0 ${width} ${height}`\"\n aria-hidden=\"true\"\n @pointermove=\"onPointerMove\"\n @pointerleave=\"onPointerLeave\"\n @click=\"onClick\"\n >\n <!-- gridlines + y ticks -->\n <g class=\"t-chart__grid\">\n <template\n v-for=\"line in gridLines\"\n :key=\"line.value\"\n >\n <line\n v-if=\"showGrid\"\n class=\"t-chart__gridline\"\n :x1=\"plot.left\"\n :x2=\"plot.right\"\n :y1=\"line.y\"\n :y2=\"line.y\"\n />\n <text\n v-if=\"showYAxis\"\n class=\"t-chart__axis-label t-chart__axis-label--y\"\n :x=\"plot.left - 8\"\n :y=\"line.y\"\n >\n {{ line.label }}\n </text>\n </template>\n </g>\n\n <!-- area fills -->\n <g class=\"t-chart__areas\">\n <path\n v-for=\"(path, index) in linePaths\"\n v-show=\"type === 'area'\"\n :key=\"`area-${index}`\"\n class=\"t-chart__area\"\n :d=\"path.area\"\n :style=\"{ color: path.color }\"\n />\n </g>\n\n <!-- bars -->\n <g class=\"t-chart__bars\">\n <rect\n v-for=\"(bar, index) in bars\"\n :key=\"`bar-${index}`\"\n class=\"t-chart__bar\"\n :x=\"bar.x\"\n :y=\"bar.y\"\n :width=\"bar.width\"\n :height=\"bar.height\"\n :rx=\"Math.min(4, bar.width / 2)\"\n :style=\"{ color: bar.color, animationDelay: `${bar.index * 40}ms` }\"\n :class=\"{ 'is-active': activeIndex === bar.index }\"\n />\n </g>\n\n <!-- lines + optional static points -->\n <g class=\"t-chart__lines\">\n <template\n v-for=\"(path, index) in linePaths\"\n :key=\"`line-${index}`\"\n >\n <path\n v-if=\"type !== 'bar'\"\n class=\"t-chart__line\"\n :d=\"path.line\"\n path-length=\"1\"\n :style=\"{ color: path.color }\"\n />\n <template v-if=\"showPoints && type !== 'bar'\">\n <circle\n v-for=\"(point, pointIndex) in path.points\"\n :key=\"`point-${index}-${pointIndex}`\"\n class=\"t-chart__point\"\n :cx=\"point.x\"\n :cy=\"point.y\"\n r=\"3\"\n :style=\"{ color: path.color }\"\n />\n </template>\n </template>\n </g>\n\n <!-- hover crosshair + active markers -->\n <g\n v-if=\"activeIndex !== null && showTooltip\"\n class=\"t-chart__hover\"\n >\n <line\n class=\"t-chart__crosshair\"\n :x1=\"activeX(activeIndex)\"\n :x2=\"activeX(activeIndex)\"\n :y1=\"plot.top\"\n :y2=\"plot.bottom\"\n />\n <circle\n v-for=\"(marker, index) in activeMarkers\"\n :key=\"`marker-${index}`\"\n class=\"t-chart__marker\"\n :cx=\"marker.x\"\n :cy=\"marker.y\"\n r=\"4\"\n :style=\"{ color: marker.color }\"\n />\n </g>\n\n <!-- x-axis labels -->\n <g\n v-if=\"showXAxis\"\n class=\"t-chart__x-axis\"\n >\n <text\n v-for=\"(item, index) in xLabels\"\n v-show=\"item.show\"\n :key=\"`x-${index}`\"\n class=\"t-chart__axis-label t-chart__axis-label--x\"\n :x=\"item.x\"\n :y=\"height - 8\"\n >\n {{ item.label }}\n </text>\n </g>\n </svg>\n\n <div\n v-if=\"showTooltip && activePayload\"\n class=\"t-chart__tooltip\"\n :style=\"tooltipStyle\"\n role=\"presentation\"\n >\n <slot\n name=\"tooltip\"\n v-bind=\"activePayload\"\n >\n <p class=\"t-chart__tooltip-label\">\n {{ activePayload.label }}\n </p>\n <ul class=\"t-chart__tooltip-list\">\n <li\n v-for=\"(item, index) in activePayload.values\"\n :key=\"index\"\n class=\"t-chart__tooltip-item\"\n >\n <span\n class=\"t-chart__tooltip-dot\"\n :style=\"{ background: item.color }\"\n aria-hidden=\"true\"\n />\n <span class=\"t-chart__tooltip-name\">{{ item.name }}</span>\n <span class=\"t-chart__tooltip-value\">{{ formatValue(item.value) }}</span>\n </li>\n </ul>\n </slot>\n </div>\n </template>\n </div>\n\n <div\n v-if=\"resolvedShowLegend && hasData\"\n class=\"t-chart__legend\"\n >\n <slot\n name=\"legend\"\n :series=\"legendItems\"\n >\n <span\n v-for=\"(item, index) in legendItems\"\n :key=\"index\"\n class=\"t-chart__legend-item\"\n >\n <span\n class=\"t-chart__legend-swatch\"\n :style=\"{ background: item.color }\"\n aria-hidden=\"true\"\n />\n {{ item.name }}\n </span>\n </slot>\n </div>\n\n <!--\n Accessible data table: the chart's data as text for assistive tech.\n The visually-hidden class goes on a wrapper, not the table: a <table>\n ignores a width below its min-content, so hiding it directly leaves a\n full-width box that pushes the page's scroll width.\n -->\n <div class=\"t-visually-hidden\">\n <table class=\"t-chart__a11y\">\n <caption>{{ resolvedLabel }}</caption>\n <thead>\n <tr>\n <th scope=\"col\">\n Series\n </th>\n <th\n v-for=\"index in axisIndices\"\n :key=\"index\"\n scope=\"col\"\n >\n {{ labels[index] ?? '' }}\n </th>\n </tr>\n </thead>\n <tbody>\n <tr\n v-for=\"(row, rowIndex) in validSeries\"\n :key=\"rowIndex\"\n >\n <th scope=\"row\">\n {{ row.name }}\n </th>\n <td\n v-for=\"index in axisIndices\"\n :key=\"index\"\n >\n {{ row.data[index] === undefined ? '' : formatValue(row.data[index]) }}\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n</template>\n"],"mappings":"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"}

package/dist/components/TColorSwatch.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ var e=require("./TColorSwatch.vue_vue_type_script_setup_true_lang.cjs").default;exports.default=e;
2	+ //# sourceMappingURL=TColorSwatch.cjs.map

package/dist/components/TColorSwatch.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TColorSwatch.cjs","names":[],"sources":["../../src/components/TColorSwatch.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport type { TSize } from '../types/contracts';\n\nexport interface TColorSwatchOption {\n label: string;\n value: string;\n}\n\nconst props = withDefaults(\n defineProps<{\n modelValue?: string;\n /** Preset colors offered as swatches. */\n options?: TColorSwatchOption[];\n /** Append a native colour input for an arbitrary value. */\n allowCustom?: boolean;\n size?: TSize;\n /** Accessible label for the swatch group. */\n label?: string;\n /** Accessible label for the custom colour input. */\n customLabel?: string;\n disabled?: boolean;\n }>(),\n {\n modelValue: undefined,\n options: () => [],\n allowCustom: false,\n size: 'md',\n label: 'Color',\n customLabel: 'Custom color',\n disabled: false,\n },\n);\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string];\n}>();\n\nconst classes = computed(() => ['t-color-swatch', `t-color-swatch--${props.size}`]);\n\nconst isSelected = (value: string) =>\n Boolean(props.modelValue) && props.modelValue?.toLowerCase() === value.toLowerCase();\n\nconst select = (value: string) => {\n if (props.disabled) {\n return;\n }\n emit('update:modelValue', value);\n};\n\nconst onCustomInput = (event: Event) => {\n emit('update:modelValue', (event.target as HTMLInputElement).value);\n};\n</script>\n\n<template>\n <div\n :class=\"classes\"\n role=\"group\"\n :aria-label=\"label\"\n >\n <button\n v-for=\"option in options\"\n :key=\"option.value\"\n type=\"button\"\n class=\"t-color-swatch__option\"\n :class=\"{ 'is-selected': isSelected(option.value) }\"\n :style=\"{ background: option.value }\"\n :aria-label=\"option.label\"\n :aria-pressed=\"isSelected(option.value)\"\n :disabled=\"disabled\"\n @click=\"select(option.value)\"\n />\n\n <input\n v-if=\"allowCustom\"\n class=\"t-color-swatch__custom\"\n type=\"color\"\n :value=\"modelValue\"\n :aria-label=\"customLabel\"\n :disabled=\"disabled\"\n @input=\"onCustomInput\"\n >\n </div>\n</template>\n"],"mappings":""}

package/dist/components/TColorSwatch.js ADDED Viewed

@@ -0,0 +1,7 @@
+import e from "./TColorSwatch.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/TColorSwatch.vue
+var t = e;
+//#endregion
+export { t as default };
+//# sourceMappingURL=TColorSwatch.js.map

package/dist/components/TColorSwatch.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TColorSwatch.js","names":[],"sources":["../../src/components/TColorSwatch.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport type { TSize } from '../types/contracts';\n\nexport interface TColorSwatchOption {\n label: string;\n value: string;\n}\n\nconst props = withDefaults(\n defineProps<{\n modelValue?: string;\n /** Preset colors offered as swatches. */\n options?: TColorSwatchOption[];\n /** Append a native colour input for an arbitrary value. */\n allowCustom?: boolean;\n size?: TSize;\n /** Accessible label for the swatch group. */\n label?: string;\n /** Accessible label for the custom colour input. */\n customLabel?: string;\n disabled?: boolean;\n }>(),\n {\n modelValue: undefined,\n options: () => [],\n allowCustom: false,\n size: 'md',\n label: 'Color',\n customLabel: 'Custom color',\n disabled: false,\n },\n);\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string];\n}>();\n\nconst classes = computed(() => ['t-color-swatch', `t-color-swatch--${props.size}`]);\n\nconst isSelected = (value: string) =>\n Boolean(props.modelValue) && props.modelValue?.toLowerCase() === value.toLowerCase();\n\nconst select = (value: string) => {\n if (props.disabled) {\n return;\n }\n emit('update:modelValue', value);\n};\n\nconst onCustomInput = (event: Event) => {\n emit('update:modelValue', (event.target as HTMLInputElement).value);\n};\n</script>\n\n<template>\n <div\n :class=\"classes\"\n role=\"group\"\n :aria-label=\"label\"\n >\n <button\n v-for=\"option in options\"\n :key=\"option.value\"\n type=\"button\"\n class=\"t-color-swatch__option\"\n :class=\"{ 'is-selected': isSelected(option.value) }\"\n :style=\"{ background: option.value }\"\n :aria-label=\"option.label\"\n :aria-pressed=\"isSelected(option.value)\"\n :disabled=\"disabled\"\n @click=\"select(option.value)\"\n />\n\n <input\n v-if=\"allowCustom\"\n class=\"t-color-swatch__custom\"\n type=\"color\"\n :value=\"modelValue\"\n :aria-label=\"customLabel\"\n :disabled=\"disabled\"\n @input=\"onCustomInput\"\n >\n </div>\n</template>\n"],"mappings":""}

package/dist/components/TColorSwatch.vue.d.ts ADDED Viewed

@@ -0,0 +1,33 @@
+import { TSize } from '../types/contracts';
+export interface TColorSwatchOption {
+    label: string;
+    value: string;
+}
+type __VLS_Props = {
+    modelValue?: string;
+    /** Preset colors offered as swatches. */
+    options?: TColorSwatchOption[];
+    /** Append a native colour input for an arbitrary value. */
+    allowCustom?: boolean;
+    size?: TSize;
+    /** Accessible label for the swatch group. */
+    label?: string;
+    /** Accessible label for the custom colour input. */
+    customLabel?: string;
+    disabled?: boolean;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+    modelValue: string;
+    disabled: boolean;
+    size: TSize;
+    label: string;
+    options: TColorSwatchOption[];
+    allowCustom: boolean;
+    customLabel: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=TColorSwatch.vue.d.ts.map

package/dist/components/TColorSwatch.vue.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TColorSwatch.vue.d.ts","sourceRoot":"","sources":["../../src/components/TColorSwatch.vue"],"names":[],"mappings":"AAwFA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAEhD,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,KAAK,WAAW,GAAG;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yCAAyC;IACzC,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAC/B,2DAA2D;IAC3D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;;;;;;gBAXa,MAAM;cAUR,OAAO;UALX,KAAK;WAEJ,MAAM;aALJ,kBAAkB,EAAE;iBAEhB,OAAO;iBAKP,MAAM;;AAoHxB,wBASG"}

package/dist/components/TColorSwatch.vue_vue_type_script_setup_true_lang.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ let e=require("vue");var t=[`aria-label`],n=[`aria-label`,`aria-pressed`,`disabled`,`onClick`],r=[`value`,`aria-label`,`disabled`],i=(0,e.defineComponent)({__name:`TColorSwatch`,props:{modelValue:{default:void 0},options:{default:()=>[]},allowCustom:{type:Boolean,default:!1},size:{default:`md`},label:{default:`Color`},customLabel:{default:`Custom color`},disabled:{type:Boolean,default:!1}},emits:[`update:modelValue`],setup(i,{emit:a}){let o=i,s=a,c=(0,e.computed)(()=>[`t-color-swatch`,`t-color-swatch--${o.size}`]),l=e=>!!o.modelValue&&o.modelValue?.toLowerCase()===e.toLowerCase(),u=e=>{o.disabled\|\|s(`update:modelValue`,e)},d=e=>{s(`update:modelValue`,e.target.value)};return(a,o)=>((0,e.openBlock)(),(0,e.createElementBlock)(`div`,{class:(0,e.normalizeClass)(c.value),role:`group`,"aria-label":i.label},[((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(i.options,t=>((0,e.openBlock)(),(0,e.createElementBlock)(`button`,{key:t.value,type:`button`,class:(0,e.normalizeClass)([`t-color-swatch__option`,{"is-selected":l(t.value)}]),style:(0,e.normalizeStyle)({background:t.value}),"aria-label":t.label,"aria-pressed":l(t.value),disabled:i.disabled,onClick:e=>u(t.value)},null,14,n))),128)),i.allowCustom?((0,e.openBlock)(),(0,e.createElementBlock)(`input`,{key:0,class:`t-color-swatch__custom`,type:`color`,value:i.modelValue,"aria-label":i.customLabel,disabled:i.disabled,onInput:d},null,40,r)):(0,e.createCommentVNode)(``,!0)],10,t))}});exports.default=i;
2	+ //# sourceMappingURL=TColorSwatch.vue_vue_type_script_setup_true_lang.cjs.map

package/dist/components/TColorSwatch.vue_vue_type_script_setup_true_lang.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TColorSwatch.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TColorSwatch.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport type { TSize } from '../types/contracts';\n\nexport interface TColorSwatchOption {\n label: string;\n value: string;\n}\n\nconst props = withDefaults(\n defineProps<{\n modelValue?: string;\n /** Preset colors offered as swatches. */\n options?: TColorSwatchOption[];\n /** Append a native colour input for an arbitrary value. */\n allowCustom?: boolean;\n size?: TSize;\n /** Accessible label for the swatch group. */\n label?: string;\n /** Accessible label for the custom colour input. */\n customLabel?: string;\n disabled?: boolean;\n }>(),\n {\n modelValue: undefined,\n options: () => [],\n allowCustom: false,\n size: 'md',\n label: 'Color',\n customLabel: 'Custom color',\n disabled: false,\n },\n);\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string];\n}>();\n\nconst classes = computed(() => ['t-color-swatch', `t-color-swatch--${props.size}`]);\n\nconst isSelected = (value: string) =>\n Boolean(props.modelValue) && props.modelValue?.toLowerCase() === value.toLowerCase();\n\nconst select = (value: string) => {\n if (props.disabled) {\n return;\n }\n emit('update:modelValue', value);\n};\n\nconst onCustomInput = (event: Event) => {\n emit('update:modelValue', (event.target as HTMLInputElement).value);\n};\n</script>\n\n<template>\n <div\n :class=\"classes\"\n role=\"group\"\n :aria-label=\"label\"\n >\n <button\n v-for=\"option in options\"\n :key=\"option.value\"\n type=\"button\"\n class=\"t-color-swatch__option\"\n :class=\"{ 'is-selected': isSelected(option.value) }\"\n :style=\"{ background: option.value }\"\n :aria-label=\"option.label\"\n :aria-pressed=\"isSelected(option.value)\"\n :disabled=\"disabled\"\n @click=\"select(option.value)\"\n />\n\n <input\n v-if=\"allowCustom\"\n class=\"t-color-swatch__custom\"\n type=\"color\"\n :value=\"modelValue\"\n :aria-label=\"customLabel\"\n :disabled=\"disabled\"\n @input=\"onCustomInput\"\n >\n </div>\n</template>\n"],"mappings":"ubASA,IAAM,EAAQ,EAyBR,EAAO,EAIP,GAAA,EAAA,EAAA,SAAA,KAAyB,CAAC,iBAAkB,mBAAmB,EAAM,MAAM,CAAC,EAE5E,EAAc,GAClB,EAAQ,EAAM,YAAe,EAAM,YAAY,YAAY,IAAM,EAAM,YAAY,EAE/E,EAAU,GAAkB,CAC5B,EAAM,UAGV,EAAK,oBAAqB,CAAK,CACjC,EAEM,EAAiB,GAAiB,CACtC,EAAK,oBAAsB,EAAM,OAA4B,KAAK,CACpE,2DA+BQ,MAAA,CA1BH,OAAA,EAAA,EAAA,eAAA,CAAO,EAAA,KAAO,EACf,KAAK,QACJ,aAAY,EAAA,sDAaX,EAAA,SAAA,MAAA,EAAA,EAAA,WAAA,CAViB,EAAA,QAAV,+CAUP,SAAA,CATC,IAAK,EAAO,MACb,KAAK,SACL,OAAA,EAAA,EAAA,eAAA,CAAK,CAAC,yBAAwB,CAAA,cACL,EAAW,EAAO,KAAK,CAAA,CAAA,CAAA,EAC/C,OAAA,EAAA,EAAA,eAAA,CAAK,CAAA,WAAgB,EAAO,KAAK,CAAA,EACjC,aAAY,EAAO,MACnB,eAAc,EAAW,EAAO,KAAK,EACrC,SAAU,EAAA,SACV,QAAK,GAAE,EAAO,EAAO,KAAK,sBAIrB,EAAA,cAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAOP,QAAA,OANC,MAAM,yBACN,KAAK,QACJ,MAAO,EAAA,WACP,aAAY,EAAA,YACZ,SAAU,EAAA,SACV,QAAO"}

package/dist/components/TColorSwatch.vue_vue_type_script_setup_true_lang.js ADDED Viewed

@@ -0,0 +1,63 @@
+import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, defineComponent as i, normalizeClass as a, normalizeStyle as o, openBlock as s, renderList as c } from "vue";
+//#region src/components/TColorSwatch.vue?vue&type=script&setup=true&lang.ts
+var l = ["aria-label"], u = [
+	"aria-label",
+	"aria-pressed",
+	"disabled",
+	"onClick"
+], d = [
+	"value",
+	"aria-label",
+	"disabled"
+], f = /*@__PURE__*/ i({
+	__name: "TColorSwatch",
+	props: {
+		modelValue: { default: void 0 },
+		options: { default: () => [] },
+		allowCustom: {
+			type: Boolean,
+			default: !1
+		},
+		size: { default: "md" },
+		label: { default: "Color" },
+		customLabel: { default: "Custom color" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(i, { emit: f }) {
+		let p = i, m = f, h = t(() => ["t-color-swatch", `t-color-swatch--${p.size}`]), g = (e) => !!p.modelValue && p.modelValue?.toLowerCase() === e.toLowerCase(), _ = (e) => {
+			p.disabled || m("update:modelValue", e);
+		}, v = (e) => {
+			m("update:modelValue", e.target.value);
+		};
+		return (t, f) => (s(), r("div", {
+			class: a(h.value),
+			role: "group",
+			"aria-label": i.label
+		}, [(s(!0), r(e, null, c(i.options, (e) => (s(), r("button", {
+			key: e.value,
+			type: "button",
+			class: a(["t-color-swatch__option", { "is-selected": g(e.value) }]),
+			style: o({ background: e.value }),
+			"aria-label": e.label,
+			"aria-pressed": g(e.value),
+			disabled: i.disabled,
+			onClick: (t) => _(e.value)
+		}, null, 14, u))), 128)), i.allowCustom ? (s(), r("input", {
+			key: 0,
+			class: "t-color-swatch__custom",
+			type: "color",
+			value: i.modelValue,
+			"aria-label": i.customLabel,
+			disabled: i.disabled,
+			onInput: v
+		}, null, 40, d)) : n("", !0)], 10, l));
+	}
+});
+//#endregion
+export { f as default };
+//# sourceMappingURL=TColorSwatch.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/TColorSwatch.vue_vue_type_script_setup_true_lang.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TColorSwatch.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/TColorSwatch.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport type { TSize } from '../types/contracts';\n\nexport interface TColorSwatchOption {\n label: string;\n value: string;\n}\n\nconst props = withDefaults(\n defineProps<{\n modelValue?: string;\n /** Preset colors offered as swatches. */\n options?: TColorSwatchOption[];\n /** Append a native colour input for an arbitrary value. */\n allowCustom?: boolean;\n size?: TSize;\n /** Accessible label for the swatch group. */\n label?: string;\n /** Accessible label for the custom colour input. */\n customLabel?: string;\n disabled?: boolean;\n }>(),\n {\n modelValue: undefined,\n options: () => [],\n allowCustom: false,\n size: 'md',\n label: 'Color',\n customLabel: 'Custom color',\n disabled: false,\n },\n);\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string];\n}>();\n\nconst classes = computed(() => ['t-color-swatch', `t-color-swatch--${props.size}`]);\n\nconst isSelected = (value: string) =>\n Boolean(props.modelValue) && props.modelValue?.toLowerCase() === value.toLowerCase();\n\nconst select = (value: string) => {\n if (props.disabled) {\n return;\n }\n emit('update:modelValue', value);\n};\n\nconst onCustomInput = (event: Event) => {\n emit('update:modelValue', (event.target as HTMLInputElement).value);\n};\n</script>\n\n<template>\n <div\n :class=\"classes\"\n role=\"group\"\n :aria-label=\"label\"\n >\n <button\n v-for=\"option in options\"\n :key=\"option.value\"\n type=\"button\"\n class=\"t-color-swatch__option\"\n :class=\"{ 'is-selected': isSelected(option.value) }\"\n :style=\"{ background: option.value }\"\n :aria-label=\"option.label\"\n :aria-pressed=\"isSelected(option.value)\"\n :disabled=\"disabled\"\n @click=\"select(option.value)\"\n />\n\n <input\n v-if=\"allowCustom\"\n class=\"t-color-swatch__custom\"\n type=\"color\"\n :value=\"modelValue\"\n :aria-label=\"customLabel\"\n :disabled=\"disabled\"\n @input=\"onCustomInput\"\n >\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASA,IAAM,IAAQ,GAyBR,IAAO,GAIP,IAAU,QAAe,CAAC,kBAAkB,mBAAmB,EAAM,MAAM,CAAC,GAE5E,KAAc,MAClB,EAAQ,EAAM,cAAe,EAAM,YAAY,YAAY,MAAM,EAAM,YAAY,GAE/E,KAAU,MAAkB;GAC5B,EAAM,YAGV,EAAK,qBAAqB,CAAK;EACjC,GAEM,KAAiB,MAAiB;GACtC,EAAK,qBAAsB,EAAM,OAA4B,KAAK;EACpE;yBAIE,EA2BM,OAAA;GA1BH,OAAK,EAAE,EAAA,KAAO;GACf,MAAK;GACJ,cAAY,EAAA;cAEb,EAWE,GAAA,MAAA,EAViB,EAAA,UAAV,YADT,EAWE,UAAA;GATC,KAAK,EAAO;GACb,MAAK;GACL,OAAK,EAAA,CAAC,0BAAwB,EAAA,eACL,EAAW,EAAO,KAAK,EAAA,CAAA,CAAA;GAC/C,OAAK,EAAA,EAAA,YAAgB,EAAO,MAAK,CAAA;GACjC,cAAY,EAAO;GACnB,gBAAc,EAAW,EAAO,KAAK;GACrC,UAAU,EAAA;GACV,UAAK,MAAE,EAAO,EAAO,KAAK;4BAIrB,EAAA,eAAA,EAAA,GADR,EAQC,SAAA;;GANC,OAAM;GACN,MAAK;GACJ,OAAO,EAAA;GACP,cAAY,EAAA;GACZ,UAAU,EAAA;GACV,SAAO"}