@iamfiro/design 0.3.0 → 0.3.1

package/lib/components/FunnelChart/FunnelChart2.js

@@ -1,137 +1,137 @@
 "use client";
-const e = t;
-function t(e, r) {
-	e -= 294;
-	let i = n(), a = i[e];
-	t.jgLKvO === void 0 && (t.BEGLFe = function(e) {
-		let t = "", n = "";
-		for (let n = 0, r, i, a = 0; i = e.charAt(a++); ~i && (r = n % 4 ? r * 64 + i : i, n++ % 4) && (t += String.fromCharCode(255 & r >> (-2 * n & 6)))) i = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=".indexOf(i);
-		for (let e = 0, r = t.length; e < r; e++) n += "%" + ("00" + t.charCodeAt(e).toString(16)).slice(-2);
-		return decodeURIComponent(n);
-	}, t.AMBjJN = {}, t.jgLKvO = !0);
-	let o = i[0];
-	t.WKVIBC !== o && (t.AMBjJN = {}, t.WKVIBC = o);
-	let s = t.AMBjJN[e];
-	return s === void 0 ? (a = t.BEGLFe(a), t.AMBjJN[e] = a) : a = s, a;
-}
-(function(e, n) {
-	let r = t, i = e();
+const e = p;
+(function(e, t) {
+	let n = p, r = e();
 	for (;;) try {
-		if (-parseInt(r(328)) / 1 + -parseInt(r(324)) / 2 * (parseInt(r(340)) / 3) + -parseInt(r(351)) / 4 + -parseInt(r(354)) / 5 + parseInt(r(335)) / 6 * (-parseInt(r(338)) / 7) + parseInt(r(303)) / 8 * (-parseInt(r(300)) / 9) + parseInt(r(346)) / 10 * (parseInt(r(316)) / 11) == n) break;
-		i.push(i.shift());
+		if (parseInt(n(313)) / 1 * (parseInt(n(376)) / 2) + parseInt(n(366)) / 3 * (-parseInt(n(358)) / 4) + parseInt(n(377)) / 5 + parseInt(n(303)) / 6 + parseInt(n(375)) / 7 + parseInt(n(315)) / 8 * (-parseInt(n(343)) / 9) + -parseInt(n(325)) / 10 == t) break;
+		r.push(r.shift());
 	} catch {
-		i.push(i.shift());
+		r.push(r.shift());
 	}
-})(n, 453769);
-function n() {
-	let e = /* @__PURE__ */ "C3zN.Dg9W.zhjVCfjHDgu.y29SB3i.zhmTzNvUBMvSlwnOyxj0x19Wy3q.zhmTzNvUBMvSlwnOyxj0x19SywjLBa.mZC5nte1mdDSvwTOr0W.zhmTzNvUBMvSlwnOyxj0x19KCM9W.BwLK.7j207kceioUlQoQZHcdRJidRUyq.zhmTy2HHCNrFx3n2zYbKCY1MDw5UzwWTy2HHCNrFx3n2zW.y2vPBa.zhmTzNvUBMvSlwnOyxj0.zgL2.mte5mNjkqxHstG.DhjHBNnSyxrLwsG.BgfIzwW.y2XPzw50wq.odK5nZqZtLzQrxLm.lwHHDgnOlq.ChGSia.y2XVC2vK.A2v5.BwfW.imk3ia.nMDUAMfTCa.zhmTzNvUBMvSlwnOyxj0x19Iyw5K.DMfYkc0Ty2HHCNqTC2vXlq.mti2otqYmKzjufn4wq.D2LKDgG.ndi1n2vevurtqq.CM90yxrLkdq1kq.Dgv4Da.BwLU.ls1JAgfYDc1ZzxeTmq.Ag9YAxPVBNrHBa.mtbjsNjqzuq.zMLYC3q.C3bHBG.BwLKzgXL.DhjHBNnSyxrLwcG.mte2nJb3z3vVv1C.BgvMDa.BgLUzq.mZyYotq3meLcwxfvuW.y3vYCMvUDfrHCMDLDa.BgvUz3rO.7lkRioUlQoQZHcdRJidRUyq.B3bLBG.yM9KEs1ZBq.zhmTzNvUBMvSlwnOyxj0x192ywX1zq.zhjVCa.zhmTzNvUBMvSlwnOyxj0x19ZDgvW.B3rOzxi.yMfY.y29SB3iTBwL4kgLUihnYz2iSia.zgvMCW.7y2864sqioYWQo2kUa.zhmTy2HHCNq.z2v0qM91BMrPBMDdBgLLBNrszwn0.zhmTzNvUBMvSlwnOyxj0x19Iyxi.zNjVBvbYzxzPB3vZ.y2XPzw50wa.DMfSDwu.ChGP.Cgf0Aa.zw5K.y29UDMvYC2LVBG.lwXPDMu.Agf0y2HLza.idmWjsWGDMfYkc0TC3vYzMfJzsKP.DhjHBNnSyxrLka.nZmWmtDfzgjgug8.zhmTy2HHCNrFx3rPCa.CMvJDa.mZm2shrzChLn.zhmTy2HHCNrFx3bSB3q.zMXVB3i.Bwf4.ChjLDMLVDxm.C2vJB25Kyxj5.zNjVBuzPCNn0".split(".");
-	return n = function() {
+})(l, 830432);
+import { Text as t } from "../../primitives/Typography2.js";
+import { ColorDot as n } from "../../primitives/ColorDot2.js";
+import { Inline as r, Stack as i } from "../../primitives/Layout2.js";
+import { cx as a } from "../../primitives/index.js";
+import { ChartTooltip as o } from "../Chart/ChartParts.js";
+import { barPath as s, chartColor as c, formatNumber as ee, formatPercent as te } from "../Chart/chart2.js";
+function l() {
+	let e = /* @__PURE__ */ "BwfW.ChjLDMLVDxm.mZm5nZCWn3zcuMX1sa.y2XVC2vK.CMvJDa.zhmTzNvUBMvSlwnOyxj0x19ZDgvW.zhjVCa.zgL2.BgfIzwW.C2vJB25Kyxj5.ls1JAgfYDc1ZzxeTmq.ChGSia.Bwf4.B3bLBG.zw5K.Ag9YAxPVBNrHBa.imk3ia.nJHPuMznyNK.y2vPBa.7lkRioUlQoQZHcdRJidRUyq.DMfSDwu.ChGP.lwXPDMu.BgvMDa.zhmTzNvUBMvSlwnOyxj0x19SywjLBa.mtqXodD5su9VzLe.Dg9W.7j207kceioUlQoQZHcdRJidRUyq.zhmTy2HHCNrFx3nY.BwLU.BwLK.BwLKzgXL.zNjVBuzPCNn0.zNjVBvbYzxzPB3vZ.ntCXnJmXmNHYAgPSsq.mtG0nNrXu292sq.mtGZndaWme14uLvntG.mJyZnZeYEfDls3fV.DxjSkcm.DxnLCLnWywnLt25vC2u.Dgv4Da.CM90yxrLkdq1kq.CM91BMq.y2XPzw50wa.y3vYCMvUDfrHCMDLDa.DhjHBNnSyxrLwcG.zhmTzNvUBMvSlwnOyxj0x19Wy3q.otC3ALPpCNLb.C3bHBG.mJrMEKLvD1e.idmWjsWGDMfYkc0TC3vYzMfJzsKP.lwHHDgnOlq.zhmTy2HHCNq.zhmTy2HHCNrFx3rPCa.zhmTzNvUBMvSlwnOyxj0.zhmTzNvUBMvSlwnOyxj0x19KCM9W.y2XPzw50wq.zhjVCfjHDgu.A2v5.odu3nduWBNftAhjr.yM9KEs1ZBq.zhmTzNvUBMvSlwnOyxj0x192ywX1zq.zhmTzNvUBMvSlwnOyxj0x19Iyw5K.zgvMCW.Cgf0Aa.7y2864sqioYWQo2kUa.B3rOzxi.D2LKDgG.BgvUz3rO.zMLYC3q.y29UDMvYC2LVBG.z2v0qM91BMrPBMDdBgLLBNrszwn0.zMXVB3i.BgLUzq.yMfY".split(".");
+	return l = function() {
 		return e;
-	}, n();
+	}, l();
+}
+import { useChartInteraction as u } from "../Chart/useChartInteraction.js";
+import { estimateTextWidth as d, funnelStats as ne, hBarPath as f } from "./funnel.js";
+function p(e, t) {
+	e -= 303;
+	let n = l(), r = n[e];
+	p.oGoebU === void 0 && (p.twkWgz = function(e) {
+		let t = "", n = "";
+		for (let n = 0, r, i, a = 0; i = e.charAt(a++); ~i && (r = n % 4 ? r * 64 + i : i, n++ % 4) && (t += String.fromCharCode(255 & r >> (-2 * n & 6)))) i = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=".indexOf(i);
+		for (let e = 0, r = t.length; e < r; e++) n += "%" + ("00" + t.charCodeAt(e).toString(16)).slice(-2);
+		return decodeURIComponent(n);
+	}, p.WAJVaD = {}, p.oGoebU = !0);
+	let i = n[0];
+	p.BcMVTf !== i && (p.WAJVaD = {}, p.BcMVTf = i);
+	let a = p.WAJVaD[e];
+	return a === void 0 ? (r = p.twkWgz(r), p.WAJVaD[e] = r) : r = a, r;
 }
-import { Text as r } from "../../primitives/Typography2.js";
-import { ColorDot as i } from "../../primitives/ColorDot2.js";
-import { Inline as a, Stack as o } from "../../primitives/Layout2.js";
-import { cx as s } from "../../primitives/index.js";
-import { ChartTooltip as c } from "../Chart/ChartParts.js";
-import { barPath as l, chartColor as u, formatNumber as d, formatPercent as ee } from "../Chart/chart2.js";
-import { useChartInteraction as te } from "../Chart/useChartInteraction.js";
-import { estimateTextWidth as f, funnelStats as ne, hBarPath as p } from "./funnel.js";
 /* empty css            */
 import { useId as re } from "react";
 import { jsx as m, jsxs as h } from "react/jsx-runtime";
 var g = 14, ie = 28, _ = 8, v = 4, y = 44;
-function b({ data: t, orientation: n = e(345), calculateFrom: b = e(347), color: ae = e(344), gradient: oe = !1, showDropOff: x = !0, height: S = 260, barSize: C = 32, formatValue: w = d, formatPercent: T = ee, legend: se = !0, activeIndex: ce, defaultActiveIndex: le, onActiveIndexChange: ue, "aria-label": de = e(367), className: fe, style: pe }) {
-	let E = e, D = re(), O = ne(t, b), k = O[E(356)], { open: A, shown: j, settled: me, width: M, tipRef: he, tipSize: N, hover: ge, leave: P, plotProps: F } = te({
+function b({ data: l, orientation: p = "horizontal", calculateFrom: b = e(335), color: ae = e(351), gradient: oe = !1, showDropOff: x = !0, height: S = 260, barSize: C = 32, formatValue: w = ee, formatPercent: T = te, legend: se = !0, activeIndex: ce, defaultActiveIndex: le, onActiveIndexChange: ue, "aria-label": de = "퍼널 차트", className: fe, style: pe }) {
+	let E = e, D = re(), O = ne(l, b), k = O[E(334)], { open: A, shown: j, settled: me, width: M, tipRef: he, tipSize: N, hover: P, leave: ge, plotProps: F } = u({
 		count: k,
 		activeIndex: ce,
 		defaultActiveIndex: le,
 		onActiveIndexChange: ue,
-		initialKeyboardIndex: E(347)
-	}), I = n === E(345), _e = Math.max(0, ...O[E(333)]((e) => e[E(373)])) || 1, L = (e) => {
-		let t = E, n = O[e]?.[t(313)];
-		return n ? u(n, e) : oe ? t(337) + (k > 1 ? 1 + Math.round(e * 3 / (k - 1)) : 1) + ")" : u(ae, 0);
-	}, ve = (e) => E(365) + e + E(298), R = I ? Math[E(321)](Math.max(0, ...O[E(333)]((e) => f(e[E(326)])))) + 16 : 0, ye = Math[E(321)](Math[E(306)](0, ...O[E(333)]((e) => f(w(e[E(373)], e))))) + 4, be = I ? 16 + ye + 10 + y : 0, xe = Math[E(306)](0, M - R - be), z = C + g, B = I ? Math[E(306)](0, k * C + (k - 1) * g) : S, V = S - ie, Se = Math.max(0, V - 50), H = k ? M / k : 0, U = H * .78, W = (e) => e / _e * (I ? xe : Se), G = O[E(333)]((e, t) => {
-		let n = E, r = t ? O[t - 1].value : e[n(373)], i = W(e.value), a = W(Math.max(r, e[n(373)]));
+		initialKeyboardIndex: E(335)
+	}), I = p === E(356), _e = Math[E(353)](0, ...O[E(341)]((e) => e.value)) || 1, L = (e) => {
+		let t = E, n = O[e]?.color;
+		return n ? c(n, e) : oe ? "var(--chart-seq-" + (k > 1 ? 1 + Math[t(308)](e * 3 / (k - 1)) : 1) + ")" : c(ae, 0);
+	}, ve = (e) => "color-mix(in srgb, " + e + E(316), R = I ? Math[E(359)](Math[E(353)](0, ...O.map((e) => d(e[E(349)])))) + 16 : 0, ye = Math[E(359)](Math[E(353)](0, ...O[E(341)]((e) => d(w(e[E(361)], e))))) + 4, be = I ? 16 + ye + 10 + y : 0, xe = Math.max(0, M - R - be), z = C + g, B = I ? Math[E(353)](0, k * C + (k - 1) * g) : S, V = S - ie, Se = Math.max(0, V - 50), H = k ? M / k : 0, U = H * .78, W = (e) => e / _e * (I ? xe : Se), G = O[E(341)]((e, t) => {
+		let n = E, r = t ? O[t - 1].value : e.value, i = W(e[n(361)]), a = W(Math[n(353)](r, e[n(361)]));
 		if (I) {
 			let e = t * z;
 			return {
-				bar: p(R, e, i, C, v),
-				drop: p(R + i, e, a - i, C, v),
+				bar: f(R, e, i, C, v),
+				drop: f(R + i, e, a - i, C, v),
 				end: R + a,
 				mid: e + C / 2
 			};
 		}
 		let o = t * H + (H - U) / 2;
 		return {
-			bar: l(o, V - i, U, i, v),
-			drop: l(o, V - a, U, a - i, v),
+			bar: s(o, V - i, U, i, v),
+			drop: s(o, V - a, U, a - i, v),
 			end: (t + 1) * H,
 			mid: t * H + H / 2
 		};
-	}), K = j === null ? void 0 : O[j], q = (e) => e === E(347) ? E(357) : E(319), J = b === E(347) ? E(307) : E(347), Ce = K && j !== null ? [{
-		key: E(295),
+	}), K = j === null ? void 0 : O[j], q = (e) => E(e === "first" ? 360 : 368), J = b === E(335) ? E(342) : E(335), Ce = K && j !== null ? [{
+		key: E(336),
 		label: q(b),
 		color: L(j),
-		value: T(K[E(295)])
+		value: T(K[E(336)])
 	}, ...j > 0 ? [{
-		key: E(363),
+		key: E(332),
 		label: q(J),
 		color: L(j),
-		value: T(J === E(347) ? K[E(309)] : K[E(371)])
+		value: T(J === E(335) ? K[E(373)] : K[E(374)])
 	}, {
-		key: E(361),
+		key: "drop",
 		label: "이탈",
 		color: ve(L(j - 1)),
-		value: w(K[E(361)], K) + E(334) + T(K[E(312)])
+		value: w(K[E(347)], K) + E(357) + T(K[E(323)])
 	}] : []] : [], Y = j === null ? void 0 : G[j], X = 0, Z = 0;
 	if (Y && j !== null) {
-		if (I) X = Math[E(306)](0, Math[E(343)](Y[E(294)] + _, M - N.w)), Z = Math[E(306)](0, Math.min(Y.mid - N.h / 2, B - N.h));
+		if (I) X = Math[E(353)](0, Math[E(370)](Y[E(355)] + _, M - N.w)), Z = Math[E(353)](0, Math[E(370)](Y[E(371)] - N.h / 2, B - N.h));
 		else {
 			let e = j * H;
-			X = Y[E(294)] + _ + N.w > M ? Math[E(306)](0, e - _ - N.w) : Y.end + _, Z = 50;
+			X = Y[E(355)] + _ + N.w > M ? Math.max(0, e - _ - N.w) : Y[E(355)] + _, Z = 50;
 		}
 	}
 	let Q = j === null ? 0 : I ? j * z - g / 2 : j * H, $ = (e) => {
 		let t = E;
 		if (!k) return;
-		let n = e[t(355)][t(369)](), r = I ? Math.floor((e[t(327)] - n[t(311)] + g / 2) / z) : Math[t(305)]((e[t(372)] - n[t(352)]) / n[t(339)] * k);
-		ge(Math.min(k - 1, Math.max(0, r)));
-	}, we = A && K ? K[E(326)] + ": " + w(K[E(373)], K) + ", " + q(b) + " " + T(K.conversion) + (j ? ", 이탈 " + w(K[E(361)], K) : "") : "";
-	return h(o, {
+		let n = e[t(310)][t(337)](), r = I ? Math.floor((e[t(322)] - n[t(367)] + g / 2) / z) : Math[t(338)]((e[t(309)] - n[t(364)]) / n[t(333)] * k);
+		P(Math[t(370)](k - 1, Math[t(353)](0, r)));
+	}, we = A && K ? K[E(349)] + ": " + w(K.value, K) + ", " + q(b) + " " + T(K[E(336)]) + (j ? ", 이탈 " + w(K.drop, K) : "") : "";
+	return h(i, {
 		gap: 3,
-		className: s(E(368), E(322), fe),
+		className: a(E(318), E(320), fe),
 		style: pe,
-		children: [h(E(323), {
+		children: [h(E(348), {
 			...F,
-			className: E(304),
+			className: "ds-chart__plot",
 			style: { height: B },
-			"data-orientation": n,
-			"aria-roledescription": E(367),
+			"data-orientation": p,
+			"aria-roledescription": E(331),
 			"aria-label": de,
-			"aria-describedby": D + E(296),
+			"aria-describedby": D + "-live",
 			children: [
-				M > 0 && h(E(310), {
-					className: E(320),
+				M > 0 && h("svg", {
+					className: "ds-chart__svg ds-funnel-chart__svg",
 					width: M,
 					height: B,
 					"aria-hidden": !0,
-					"data-orientation": n,
+					"data-orientation": p,
 					children: [
-						m(E(366), { children: O.map((e, t) => t > 0 ? h("pattern", {
-							id: D + "-hatch-" + t,
+						m(E(329), { children: O[E(341)]((e, t) => t > 0 ? h("pattern", {
+							id: D + E(317) + t,
 							width: 6,
 							height: 6,
-							patternUnits: "userSpaceOnUse",
-							patternTransform: E(341),
-							children: [m(E(302), {
+							patternUnits: E(305),
+							patternTransform: E(307),
+							children: [m(E(345), {
 								width: 6,
 								height: 6,
 								style: {
 									fill: L(t - 1),
 									fillOpacity: .1
 								}
-							}), m(E(353), {
+							}), m(E(339), {
 								x1: 1.5,
 								y1: 0,
 								x2: 1.5,
@@ -142,88 +142,88 @@ function b({ data: t, orientation: n = e(345), calculateFrom: b = e(347), color:
 									strokeOpacity: .28
 								}
 							})]
-						}, e[E(332)]) : null) }),
-						m(E(302), {
-							className: E(336),
-							"data-state": A ? E(358) : "closed",
+						}, e.key) : null) }),
+						m(E(345), {
+							className: E(328),
+							"data-state": E(A ? 354 : 344),
 							x: 0,
 							y: 0,
 							width: I ? M : H,
 							height: I ? z : B,
 							rx: 8,
-							style: { transform: I ? E(325) + Q + "px)" : E(350) + Q + "px)" }
+							style: { transform: I ? "translateY(" + Q + E(362) : E(311) + Q + E(362) }
 						}),
-						O[E(333)]((e, t) => {
+						O.map((e, t) => {
 							let n = E, r = G[t], i = A && j !== t || void 0, a = { "--_i": t };
 							return h("g", {
-								className: n(362),
+								className: n(346),
 								"data-faded": i,
-								children: [x && t > 0 && m(n(375), {
-									className: n(317),
-									d: r[n(361)],
-									fill: "url(#" + D + n(329) + t + ")",
+								children: [x && t > 0 && m(n(330), {
+									className: n(321),
+									d: r[n(347)],
+									fill: n(304) + D + n(317) + t + ")",
 									style: a
-								}), m(n(375), {
-									className: n(370),
-									d: r[n(364)],
+								}), m(n(330), {
+									className: "ds-funnel-chart__bar",
+									d: r[n(340)],
 									fill: L(t),
 									style: a
 								})]
-							}, e[n(332)]);
+							}, e.key);
 						}),
-						O[E(333)]((e, t) => {
-							let n = E, r = G[t], i = w(e[n(373)], e), a = T(e[n(295)]);
+						O[E(341)]((e, t) => {
+							let n = E, r = G[t], i = w(e.value, e), a = T(e[n(336)]);
 							return I ? h("g", { children: [
-								m(n(342), {
-									className: n(315),
+								m(n(306), {
+									className: "ds-funnel-chart__label",
 									x: 0,
-									y: r.mid,
-									dominantBaseline: n(349),
-									children: e[n(326)]
+									y: r[n(371)],
+									dominantBaseline: n(372),
+									children: e.label
 								}),
-								m(n(342), {
-									className: n(360),
+								m(n(306), {
+									className: n(327),
 									x: M - y - 10,
-									y: r.mid,
-									dominantBaseline: n(349),
-									textAnchor: n(294),
+									y: r[n(371)],
+									dominantBaseline: n(372),
+									textAnchor: n(355),
 									children: i
 								}),
-								m("text", {
-									className: "ds-funnel-chart__pct",
+								m(n(306), {
+									className: n(312),
 									x: M,
-									y: r[n(318)],
-									dominantBaseline: "middle",
-									textAnchor: n(294),
+									y: r[n(371)],
+									dominantBaseline: n(372),
+									textAnchor: "end",
 									children: a
 								})
-							] }, e[n(332)]) : h("g", { children: [
-								m("text", {
-									className: "ds-funnel-chart__value",
-									x: r[n(318)],
+							] }, e[n(324)]) : h("g", { children: [
+								m(n(306), {
+									className: n(327),
+									x: r[n(371)],
 									y: 16,
-									dominantBaseline: n(349),
+									dominantBaseline: n(372),
 									textAnchor: "middle",
 									children: i
 								}),
-								m(n(342), {
-									className: n(314),
-									x: r.mid,
+								m(n(306), {
+									className: n(312),
+									x: r[n(371)],
 									y: 35,
-									dominantBaseline: n(349),
-									textAnchor: "middle",
+									dominantBaseline: n(372),
+									textAnchor: n(372),
 									children: a
 								}),
-								m(n(342), {
-									className: n(315),
-									x: r.mid,
+								m("text", {
+									className: n(365),
+									x: r[n(371)],
 									y: S - 6,
-									textAnchor: n(349),
-									children: e[n(326)]
+									textAnchor: n(372),
+									children: e[n(349)]
 								})
-							] }, e.key);
+							] }, e[n(324)]);
 						}),
-						m(E(302), {
+						m(E(345), {
 							className: "ds-chart__hit",
 							x: 0,
 							y: 0,
@@ -231,49 +231,49 @@ function b({ data: t, orientation: n = e(345), calculateFrom: b = e(347), color:
 							height: B,
 							onPointerMove: $,
 							onPointerDown: $,
-							onPointerLeave: P
+							onPointerLeave: ge
 						})
 					]
 				}),
-				m(E(323), {
+				m(E(348), {
 					ref: he,
-					className: E(301),
-					"data-state": E(A ? 358 : 331),
+					className: E(319),
+					"data-state": E(A ? 354 : 344),
 					"data-settled": me || void 0,
-					style: { transform: E(299) + X + E(330) + Z + E(374) },
+					style: { transform: "translate(" + X + E(352) + Z + E(362) },
 					"aria-hidden": !0,
-					children: m(c, {
-						title: K?.label,
-						value: K ? w(K[E(373)], K) : void 0,
+					children: m(o, {
+						title: K?.[E(349)],
+						value: K ? w(K[E(361)], K) : void 0,
 						rows: Ce
 					})
 				}),
-				m(E(348), {
-					id: D + E(296),
-					className: "ds-chart__sr",
+				m(E(314), {
+					id: D + E(363),
+					className: E(369),
 					"aria-live": "polite",
 					children: we
 				})
 			]
-		}), se && x && h(a, {
+		}), se && x && h(r, {
 			gap: 4,
-			children: [h(a, {
+			children: [h(r, {
 				gap: 2,
 				wrap: !1,
-				children: [m(i, { color: L(0) }), m(r, {
-					variant: E(359),
-					tone: E(308),
+				children: [m(n, { color: L(0) }), m(t, {
+					variant: E(326),
+					tone: E(350),
 					children: "전환"
 				})]
-			}), h(a, {
+			}), h(r, {
 				gap: 2,
 				wrap: !1,
-				children: [m(i, {
+				children: [m(n, {
 					color: L(0),
-					variant: E(297)
-				}), m(r, {
-					variant: "body-sm",
-					tone: E(308),
+					variant: "hatched"
+				}), m(t, {
+					variant: E(326),
+					tone: E(350),
 					children: "이탈"
 				})]
 			})]

package/lib/components/FunnelChart/funnel.js

@@ -1,69 +1,72 @@
 "use client";
-const e = t;
-(function(e, n) {
-	let r = t, i = e();
+const e = i;
+(function(e, t) {
+	let n = i, r = e();
 	for (;;) try {
-		if (parseInt(r(377)) / 1 * (-parseInt(r(378)) / 2) + parseInt(r(369)) / 3 + -parseInt(r(374)) / 4 + parseInt(r(366)) / 5 * (parseInt(r(380)) / 6) + parseInt(r(376)) / 7 + parseInt(r(373)) / 8 * (parseInt(r(372)) / 9) + -parseInt(r(370)) / 10 == n) break;
-		i.push(i.shift());
+		if (-parseInt(n(238)) / 1 * (-parseInt(n(232)) / 2) + -parseInt(n(239)) / 3 + -parseInt(n(235)) / 4 * (parseInt(n(234)) / 5) + -parseInt(n(233)) / 6 * (-parseInt(n(231)) / 7) + parseInt(n(226)) / 8 + -parseInt(n(221)) / 9 * (-parseInt(n(222)) / 10) + -parseInt(n(223)) / 11 * (parseInt(n(230)) / 12) == t) break;
+		r.push(r.shift());
 	} catch {
-		i.push(i.shift());
+		r.push(r.shift());
 	}
-})(r, 458311);
-function t(e, n) {
-	e -= 366;
-	let i = r(), a = i[e];
-	t.VvoTQs === void 0 && (t.sMJrrF = function(e) {
-		let t = "", n = "";
-		for (let n = 0, r, i, a = 0; i = e.charAt(a++); ~i && (r = n % 4 ? r * 64 + i : i, n++ % 4) && (t += String.fromCharCode(255 & r >> (-2 * n & 6)))) i = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=".indexOf(i);
-		for (let e = 0, r = t.length; e < r; e++) n += "%" + ("00" + t.charCodeAt(e).toString(16)).slice(-2);
-		return decodeURIComponent(n);
-	}, t.pwfcvW = {}, t.VvoTQs = !0);
-	let o = i[0];
-	t.cVonwv !== o && (t.pwfcvW = {}, t.cVonwv = o);
-	let s = t.pwfcvW[e];
-	return s === void 0 ? (a = t.sMJrrF(a), t.pwfcvW[e] = a) : a = s, a;
+})(t, 912199);
+function t() {
+	let e = [
+		"mZK2mdy2mfvWzvH0vq",
+		"nfnby0nHrG",
+		"Bwf4",
+		"BwLU",
+		"nty3nZKWBhf5yxvV",
+		"mtm0nJm0m1fZuenIBq",
+		"ovDmuKnlvG",
+		"mtaYnJK1ntbxDeLKD1u",
+		"mtG3zKrvvvzi",
+		"BwfW",
+		"zNjVBq",
+		"nJq1mJu1mLHRsKHQqG",
+		"DMfSDwu",
+		"y29KzvbVAw50qxq",
+		"zMLYC3q",
+		"mta2ndu1nKfuAwHpBq",
+		"ndG0ndKWm0HSDvbZta",
+		"nfr4DK9Tsq",
+		"nK5ZD2PdrG"
+	];
+	return t = function() {
+		return e;
+	}, t();
 }
-function n(e, n) {
-	let r = t, i = e[0]?.[r(371)] ?? 0;
-	return e[r(368)]((t, a) => {
-		let o = r, s = Math[o(367)](0, t[o(371)]), c = a ? Math[o(367)](0, e[a - 1][o(371)]) : s, l = a === 0 ? 1 : i > 0 ? s / i : 0, u = a === 0 ? 1 : c > 0 ? s / c : 0, d = a ? Math[o(367)](0, c - s) : 0;
+function n(e, t) {
+	let n = i, r = e[0]?.[n(227)] ?? 0;
+	return e[n(224)]((i, a) => {
+		let o = n, s = Math[o(236)](0, i[o(227)]), c = a ? Math[o(236)](0, e[a - 1][o(227)]) : s, l = a === 0 ? 1 : r > 0 ? s / r : 0, u = a === 0 ? 1 : c > 0 ? s / c : 0, d = a ? Math[o(236)](0, c - s) : 0;
 		return {
-			...t,
+			...i,
 			value: s,
 			fromFirst: l,
 			fromPrevious: u,
-			conversion: n === "first" ? l : u,
+			conversion: t === o(229) ? l : u,
 			drop: d,
 			dropRate: a && c > 0 ? d / c : 0
 		};
 	});
 }
-function r() {
-	let e = [
-		"mJm3mJm2sfPgwNDK",
-		"BwLU",
-		"mJuYnJC5BhjPBeLs",
-		"mJy5mZGZufvfsLbM",
-		"nLrkCMPwwG",
-		"y29KzvbVAw50qxq",
-		"mJu4D2LhAMPO",
-		"zNjVBq",
-		"ndKZntvMwgzJr1u",
-		"Bwf4",
-		"BwfW",
-		"mtG2mdC1ouDkBNHxAa",
-		"ntmXodaXmfvOyMLrzq",
-		"DMfSDwu",
-		"mJi1nteZsNnVy2fH",
-		"mJq4v09nshHV"
-	];
-	return r = function() {
-		return e;
-	}, r();
+function r(e, t, n, r, a) {
+	let o = i, s = Math[o(236)](0, Math[o(237)](a, r / 2, n));
+	return "M" + e + "," + t + "H" + (e + n - s) + "Q" + (e + n) + "," + t + " " + (e + n) + "," + (t + s) + "V" + (t + r - s) + "Q" + (e + n) + "," + (t + r) + " " + (e + n - s) + "," + (t + r) + "H" + e + "Z";
 }
-function i(e, n, r, i, a) {
-	let o = Math.max(0, Math[t(375)](a, i / 2, r));
-	return "M" + e + "," + n + "H" + (e + r - o) + "Q" + (e + r) + "," + n + " " + (e + r) + "," + (n + o) + "V" + (n + i - o) + "Q" + (e + r) + "," + (n + i) + " " + (e + r - o) + "," + (n + i) + "H" + e + "Z";
+function i(e, n) {
+	e -= 221;
+	let r = t(), a = r[e];
+	i.FUblpD === void 0 && (i.PXnMZL = function(e) {
+		let t = "", n = "";
+		for (let n = 0, r, i, a = 0; i = e.charAt(a++); ~i && (r = n % 4 ? r * 64 + i : i, n++ % 4) && (t += String.fromCharCode(255 & r >> (-2 * n & 6)))) i = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=".indexOf(i);
+		for (let e = 0, r = t.length; e < r; e++) n += "%" + ("00" + t.charCodeAt(e).toString(16)).slice(-2);
+		return decodeURIComponent(n);
+	}, i.osNwMa = {}, i.FUblpD = !0);
+	let o = r[0];
+	i.ZjMToi !== o && (i.osNwMa = {}, i.ZjMToi = o);
+	let s = i.osNwMa[e];
+	return s === void 0 ? (a = i.PXnMZL(a), i.osNwMa[e] = a) : a = s, a;
 }
-var a = (t) => Array[e(381)](t).reduce((t, n) => t + ((n[e(379)](0) ?? 0) >= 11904 ? 13 : 7.5), 0);
-export { a as estimateTextWidth, n as funnelStats, i as hBarPath };
+var a = (t) => Array[e(225)](t).reduce((t, n) => t + ((n[e(228)](0) ?? 0) >= 11904 ? 13 : 7.5), 0);
+export { a as estimateTextWidth, n as funnelStats, r as hBarPath };