@iamfiro/design 0.3.4 → 0.3.5

package/lib/components/FunnelChart/FunnelChart2.js

@@ -1,283 +1,283 @@
 "use client";
-const e = f;
+const e = m;
 (function(e, t) {
-	let n = f, r = e();
+	let n = m, r = e();
 	for (;;) try {
-		if (parseInt(n(327)) / 1 * (-parseInt(n(331)) / 2) + parseInt(n(337)) / 3 * (-parseInt(n(363)) / 4) + -parseInt(n(350)) / 5 + -parseInt(n(339)) / 6 + parseInt(n(364)) / 7 + parseInt(n(326)) / 8 + parseInt(n(315)) / 9 * (parseInt(n(325)) / 10) == t) break;
+		if (parseInt(n(462)) / 1 + -parseInt(n(448)) / 2 + -parseInt(n(479)) / 3 + parseInt(n(482)) / 4 * (-parseInt(n(451)) / 5) + -parseInt(n(489)) / 6 * (parseInt(n(461)) / 7) + -parseInt(n(459)) / 8 + parseInt(n(476)) / 9 == t) break;
 		r.push(r.shift());
 	} catch {
 		r.push(r.shift());
 	}
-})(o, 919290);
+})(p, 980069);
 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";
-function o() {
-	let e = /* @__PURE__ */ "y2XPzw50wa.zhmTzNvUBMvSlwnOyxj0x19Iyw5K.z2v0qM91BMrPBMDdBgLLBNrszwn0.DxjSkcm.ngDtqwTcva.mtaYodi1mtbRyLz3B0y.DhjHBNnSyxrLwcG.zhmTzNvUBMvSlwnOyxj0x192ywX1zq.zMXVB3i.DMfYkc0Ty2HHCNqTC2vXlq.lcdSNBtTG4GG.BwfW.zMLYC3q.Ag9YAxPVBNrHBa.zhmTy2HHCNq.B3bLBG.DMfSDwu.BwLK.zNjVBvbYzxzPB3vZ.zhmTy2HHCNrFx3n2zYbKCY1MDw5UzwWTy2HHCNrFx3n2zW.A2v5.ChjLDMLVDxm.7y2864sqioYWQo2kUa.zhmTy2HHCNrFx3nY.ChGP.Dgv4Da.mZm2nZK4odfurePztKK.zhjVCfjHDgu.zhmTy2HHCNrFx3rPCa.y2vPBa.DhjHBNnSyxrLka.y3vYCMvUDfrHCMDLDa.ChGSia.BwLKzgXL.idmWjsWGDMfYkc0TC3vYzMfJzsKP.lwXPDMu.mtbjD2HLCwC.nJG1mtC2oeP0r2Ttra.mvDNuKP6CG.BgfIzwW.y29SB3i.Bwf4.mty4ndG0y0vpqMHW.zhjVCa.y2XPzw50wq.Cgf0DgvYBG.zhmTzNvUBMvSlwnOyxj0x19ZDgvW.zhmTzNvUBMvSlwnOyxj0x19SywjLBa.ntq5ndq0m3jLuKDbCq.yM9KEs1ZBq.otq3mtK0oeHVCfzezq.zhmTzNvUBMvSlwnOyxj0.y2XVC2vK.7lkRioUlQoQZHcdRJidRUyq.D2LKDgG.imk3ia.BgvUz3rO.zw5K.zhmTy2HHCNrFx3bSB3q.BwLU.BgLUzq.odi2oty5nuTvsNbfvW.C3bHBG.Cgf0Aa.zgL2.lwHHDgnOlq.DhjHBNnSyxrLwsG.y29UDMvYC2LVBG.CMvJDa.7j207kceioUlQoQZHcdRJidRUyq".split(".");
-	return o = function() {
+import { ChartTooltip as o } from "../Chart/ChartParts.js";
+import { barPath as s, chartColor as c, formatNumber as ee, formatPercent as l } from "../Chart/chart2.js";
+import { useChartInteraction as u } from "../Chart/useChartInteraction.js";
+import { estimateTextWidth as d, funnelStats as te, hBarPath as f } from "./funnel.js";
+function p() {
+	let e = /* @__PURE__ */ "Agf0y2HLza.zhmTy2HHCNrFx3nY.zhmTzNvUBMvSlwnOyxj0x19Wy3q.ls1JAgfYDc1ZzxeTmq.BgvMDa.zhmTzNvUBMvSlwnOyxj0x192ywX1zq.Dg9W.zhmTzNvUBMvSlwnOyxj0x19KCM9W.y29SB3iTBwL4kgLUihnYz2iSia.mtm1nJe4ogfJA0LlzW.lwXPDMu.A2v5.mtC2ndu1qNforfnk.BgvUz3rO.idmWjsWGDMfYkc0TC3vYzMfJzsKP.y2XVC2vK.DhjHBNnSyxrLwcG.imk3ia.zhmTy2HHCNrFx3n2zYbKCY1MDw5UzwWTy2HHCNrFx3n2zW.DhjHBNnSyxrLwsG.mti3mJCYnJrewvnQDMO.lwHHDgnOlq.mZCXyuj6tNfb.nZC3mtiYD2jhBeXL.DMfSDwu.Ag9YAxPVBNrHBa.7lkRioUlQoQZHcdRJidRUyq.zhmTy2HHCNq.BwfW.zhmTzNvUBMvSlwnOyxj0x19ZDgvW.C2vJB25Kyxj5.B3bLBG.D2LKDgG.7y2864sqioYWQo2kUa.zNjVBvbYzxzPB3vZ.DMfYkc0Ty2HHCNqTC2vXlq.y2vPBa.nJaXnJG4mZrRuePTy20.zhjVCa.zhmTzNvUBMvSlwnOyxj0x19Iyw5K.ntC1mJi2nNHjzM1eta.BgfIzwW.Cgf0Aa.mtG4CxDyu050.z2v0qM91BMrPBMDdBgLLBNrszwn0.DxnLCLnWywnLt25vC2u.zhmTzNvUBMvSlwnOyxj0x19Iyxi.Dgv4Da.CM91BMq.yM9KEs1ZBq.nZiXntzvt2zNENy.DhjHBNnSyxrLka.CM90yxrLkdq1kq.Cgf0DgvYBG.y2XPzw50wq.zgvMCW.y29UDMvYC2LVBG.zMLYC3q.zw5K.y29SB3i.DxjSkcm.BwLK.ChGSia.zNjVBuzPCNn0.Bwf4.ChGP.BwLU.zMXVB3i.CMvJDa.zhmTy2HHCNrFx3rPCa.zhmTy2HHCNrFx3bSB3q.BwLKzgXL.ChjLDMLVDxm".split(".");
+	return p = function() {
 		return e;
-	}, o();
+	}, p();
 }
-import { ChartTooltip as ee } from "../Chart/ChartParts.js";
-import { barPath as s, chartColor as c, formatNumber as te, formatPercent as ne } from "../Chart/chart2.js";
-import { useChartInteraction as l } from "../Chart/useChartInteraction.js";
-import { estimateTextWidth as u, funnelStats as re, hBarPath as d } from "./funnel.js";
-function f(e, t) {
-	e -= 300;
-	let n = o(), r = n[e];
-	f.TJqKhw === void 0 && (f.AcTBlD = function(e) {
+/* empty css            */
+import { useId as ne } from "react";
+function m(e, t) {
+	e -= 419;
+	let n = p(), r = n[e];
+	m.zlCHZr === void 0 && (m.mOfeZE = 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);
-	}, f.HhxFRk = {}, f.TJqKhw = !0);
+	}, m.yjLaya = {}, m.zlCHZr = !0);
 	let i = n[0];
-	f.prtjta !== i && (f.HhxFRk = {}, f.prtjta = i);
-	let a = f.HhxFRk[e];
-	return a === void 0 ? (r = f.AcTBlD(r), f.HhxFRk[e] = r) : r = a, r;
+	m.uBWYKG !== i && (m.yjLaya = {}, m.uBWYKG = i);
+	let a = m.yjLaya[e];
+	return a === void 0 ? (r = m.mOfeZE(r), m.yjLaya[e] = r) : r = a, r;
 }
-/* empty css            */
-import { useId as ie } from "react";
-import { jsx as p, jsxs as m } from "react/jsx-runtime";
-var h = 14, ae = 28, g = 8, _ = 4, v = 44;
-function y({ data: o, orientation: f = e(302), calculateFrom: y = e(301), color: oe = "--chart-seq-1", gradient: se = !1, showDropOff: b = !0, height: x = 260, barSize: S = 32, formatValue: C = te, formatPercent: w = ne, legend: ce = !0, activeIndex: le, defaultActiveIndex: ue, onActiveIndexChange: de, "aria-label": fe = e(311), className: pe, style: me }) {
-	let T = e, E = ie(), D = re(o, y), O = D[T(345)], { open: k, shown: A, settled: he, width: j, tipRef: ge, tipSize: M, hover: N, leave: P, plotProps: F } = l({
-		count: O,
-		activeIndex: le,
-		defaultActiveIndex: ue,
-		onActiveIndexChange: de,
-		initialKeyboardIndex: "first"
-	}), I = f === T(302), _e = Math[T(330)](0, ...D[T(300)]((e) => e[T(305)])) || 1, L = (e) => {
-		let t = T, n = D[e]?.[t(329)];
-		return n ? c(n, e) : se ? t(368) + (O > 1 ? 1 + Math.round(e * 3 / (O - 1)) : 1) + ")" : c(oe, 0);
-	}, ve = (e) => "color-mix(in srgb, " + e + T(323), R = I ? Math.ceil(Math[T(330)](0, ...D[T(300)]((e) => u(e[T(328)])))) + 16 : 0, ye = Math[T(318)](Math[T(330)](0, ...D[T(300)]((e) => u(C(e.value, e))))) + 4, be = I ? 16 + ye + 10 + v : 0, xe = Math[T(330)](0, j - R - be), z = S + h, B = I ? Math.max(0, O * S + (O - 1) * h) : x, V = x - ae, Se = Math[T(330)](0, V - 50), H = O ? j / O : 0, U = H * .78, W = (e) => e / _e * (I ? xe : Se), G = D[T(300)]((e, t) => {
-		let n = T, r = t ? D[t - 1][n(305)] : e.value, i = W(e[n(305)]), a = W(Math[n(330)](r, e[n(305)]));
-		if (I) {
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+var _ = 14, re = 28, v = 8, y = 4, b = 44;
+function x({ data: p, orientation: m = e(464), calculateFrom: x = e(423), color: ie = e(442), gradient: ae = !1, showDropOff: S = !0, height: C = 260, barSize: w = 32, formatValue: T = ee, formatPercent: E = l, legend: oe = !0, activeIndex: se, defaultActiveIndex: ce, onActiveIndexChange: le, "aria-label": ue = e(472), className: de, style: fe }) {
+	let D = e, O = ne(), k = te(p, x), A = k[D(452)], { open: j, shown: M, settled: pe, width: N, tipRef: me, tipSize: P, hover: he, leave: ge, plotProps: _e } = u({
+		count: A,
+		activeIndex: se,
+		defaultActiveIndex: ce,
+		onActiveIndexChange: le,
+		initialKeyboardIndex: D(423)
+	}), F = m === D(464), ve = Math[D(430)](0, ...k[D(467)]((e) => e[D(463)])) || 1, I = (e) => {
+		let t = D, n = k[e]?.[t(425)];
+		return n ? c(n, e) : ae ? t(474) + (A > 1 ? 1 + Math[t(487)](e * 3 / (A - 1)) : 1) + ")" : c(ie, 0);
+	}, ye = (e) => D(447) + e + D(453), L = F ? Math[D(475)](Math[D(430)](0, ...k.map((e) => d(e.label)))) + 16 : 0, R = Math[D(475)](Math[D(430)](0, ...k[D(467)]((e) => d(T(e.value, e))))) + 4, be = F ? 16 + R + 10 + b : 0, xe = Math[D(430)](0, N - L - be), z = w + _, B = F ? Math[D(430)](0, A * w + (A - 1) * _) : C, V = C - re, Se = Math[D(430)](0, V - 50), H = A ? N / A : 0, U = H * .78, W = (e) => e / ve * (F ? xe : Se), G = k.map((e, t) => {
+		let n = D, r = t ? k[t - 1][n(463)] : e[n(463)], i = W(e.value), a = W(Math[n(430)](r, e.value));
+		if (F) {
 			let e = t * z;
 			return {
-				bar: d(R, e, i, S, _),
-				drop: d(R + i, e, a - i, S, _),
-				end: R + a,
-				mid: e + S / 2
+				bar: f(L, e, i, w, y),
+				drop: f(L + i, e, a - i, w, y),
+				end: L + a,
+				mid: e + w / 2
 			};
 		}
 		let o = t * H + (H - U) / 2;
 		return {
-			bar: s(o, V - i, U, i, _),
-			drop: s(o, V - a, U, a - i, _),
+			bar: s(o, V - i, U, i, y),
+			drop: s(o, V - a, U, a - i, y),
 			end: (t + 1) * H,
 			mid: t * H + H / 2
 		};
-	}), K = A === null ? void 0 : D[A], q = (e) => e === T(301) ? T(342) : T(358), J = y === "first" ? T(310) : "first", Ce = K && A !== null ? [{
-		key: T(356),
-		label: q(y),
-		color: L(A),
-		value: w(K[T(356)])
-	}, ...A > 0 ? [{
+	}), K = M === null ? void 0 : k[M], q = (e) => e === "first" ? D(465) : "이전 단계 대비", J = x === D(423) ? D(438) : D(423), Ce = K && M !== null ? [{
+		key: D(422),
+		label: q(x),
+		color: I(M),
+		value: E(K[D(422)])
+	}, ...M > 0 ? [{
 		key: "other",
 		label: q(J),
-		color: L(A),
-		value: w(J === T(301) ? K.fromFirst : K[T(307)])
+		color: I(M),
+		value: E(J === D(423) ? K[D(429)] : K[D(473)])
 	}, {
-		key: T(332),
+		key: D(477),
 		label: "이탈",
-		color: ve(L(A - 1)),
-		value: C(K[T(332)], K) + T(344) + w(K[T(316)])
-	}] : []] : [], Y = A === null ? void 0 : G[A], X = 0, Z = 0;
-	if (Y && A !== null) {
-		if (I) X = Math[T(330)](0, Math[T(348)](Y[T(346)] + g, j - M.w)), Z = Math[T(330)](0, Math[T(348)](Y[T(306)] - M.h / 2, B - M.h));
+		color: ye(I(M - 1)),
+		value: T(K.drop, K) + D(456) + E(K.dropRate)
+	}] : []] : [], Y = M === null ? void 0 : G[M], X = 0, Z = 0;
+	if (Y && M !== null) {
+		if (F) X = Math[D(430)](0, Math.min(Y[D(424)] + v, N - P.w)), Z = Math[D(430)](0, Math[D(432)](Y[D(427)] - P.h / 2, B - P.h));
 		else {
-			let e = A * H;
-			X = Y[T(346)] + g + M.w > j ? Math[T(330)](0, e - g - M.w) : Y[T(346)] + g, Z = 50;
+			let e = M * H;
+			X = Y.end + v + P.w > N ? Math.max(0, e - v - P.w) : Y[D(424)] + v, Z = 50;
 		}
 	}
-	let Q = A === null ? 0 : I ? A * z - h / 2 : A * H, $ = (e) => {
-		let t = T;
-		if (!O) return;
-		let n = e[t(320)][t(361)](), r = I ? Math[t(367)]((e[t(333)] - n.top + h / 2) / z) : Math[t(367)]((e[t(359)] - n.left) / n[t(343)] * O);
-		N(Math[t(348)](O - 1, Math[t(330)](0, r)));
-	}, we = k && K ? K[T(328)] + ": " + C(K[T(305)], K) + ", " + q(y) + " " + w(K[T(356)]) + (A ? T(369) + C(K.drop, K) : "") : "";
-	return m(i, {
+	let Q = M === null ? 0 : F ? M * z - _ / 2 : M * H, $ = (e) => {
+		let t = D;
+		if (!A) return;
+		let n = e.currentTarget[t(483)](), r = F ? Math[t(433)]((e[t(420)] - n[t(445)] + _ / 2) / z) : Math.floor((e.clientX - n[t(443)]) / n[t(471)] * A);
+		he(Math[t(432)](A - 1, Math[t(430)](0, r)));
+	}, we = j && K ? K[D(480)] + ": " + T(K[D(463)], K) + ", " + q(x) + " " + E(K[D(422)]) + (M ? ", 이탈 " + T(K[D(477)], K) : "") : "";
+	return g(i, {
 		gap: 3,
-		className: a(T(303), T(340), pe),
-		style: me,
-		children: [m(T(353), {
-			...F,
-			className: T(347),
+		className: a(D(466), "ds-funnel-chart", de),
+		style: fe,
+		children: [g("div", {
+			..._e,
+			className: D(436),
 			style: { height: B },
-			"data-orientation": f,
-			"aria-roledescription": T(311),
-			"aria-label": fe,
-			"aria-describedby": E + T(324),
+			"data-orientation": m,
+			"aria-roledescription": D(472),
+			"aria-label": ue,
+			"aria-describedby": O + D(449),
 			children: [
-				j > 0 && m("svg", {
-					className: T(308),
-					width: j,
+				N > 0 && g("svg", {
+					className: D(457),
+					width: N,
 					height: B,
 					"aria-hidden": !0,
-					"data-orientation": f,
+					"data-orientation": m,
 					children: [
-						p("defs", { children: D[T(300)]((e, t) => t > 0 ? m(T(334), {
-							id: E + T(354) + t,
+						h(D(421), { children: k[D(467)]((e, t) => t > 0 ? g(D(419), {
+							id: O + "-hatch-" + t,
 							width: 6,
 							height: 6,
-							patternUnits: "userSpaceOnUse",
-							patternTransform: "rotate(45)",
-							children: [p(T(357), {
+							patternUnits: D(484),
+							patternTransform: D(491),
+							children: [h(D(434), {
 								width: 6,
 								height: 6,
 								style: {
-									fill: L(t - 1),
+									fill: I(t - 1),
 									fillOpacity: .1
 								}
-							}), p(T(349), {
+							}), h("line", {
 								x1: 1.5,
 								y1: 0,
 								x2: 1.5,
 								y2: 6,
 								style: {
-									stroke: L(t - 1),
+									stroke: I(t - 1),
 									strokeWidth: 3,
 									strokeOpacity: .28
 								}
 							})]
-						}, e.key) : null) }),
-						p(T(357), {
-							className: T(360),
-							"data-state": k ? T(304) : "closed",
+						}, e[D(450)]) : null) }),
+						h(D(434), {
+							className: D(478),
+							"data-state": j ? D(470) : "closed",
 							x: 0,
 							y: 0,
-							width: I ? j : H,
-							height: I ? z : B,
+							width: F ? N : H,
+							height: F ? z : B,
 							rx: 8,
-							style: { transform: I ? T(355) + Q + "px)" : T(365) + Q + T(313) }
+							style: { transform: F ? D(458) + Q + D(431) : D(455) + Q + "px)" }
 						}),
-						D.map((e, t) => {
-							let n = T, r = G[t], i = k && A !== t || void 0, a = { "--_i": t };
-							return m("g", {
-								className: n(335),
+						k.map((e, t) => {
+							let n = D, r = G[t], i = j && M !== t || void 0, a = { "--_i": t };
+							return g("g", {
+								className: n(468),
 								"data-faded": i,
-								children: [b && t > 0 && p(n(352), {
-									className: "ds-funnel-chart__drop",
-									d: r[n(332)],
-									fill: n(362) + E + "-hatch-" + t + ")",
+								children: [S && t > 0 && h(n(481), {
+									className: n(446),
+									d: r[n(477)],
+									fill: n(426) + O + n(460) + t + ")",
 									style: a
-								}), p(n(352), {
-									className: "ds-funnel-chart__bar",
+								}), h(n(481), {
+									className: n(485),
 									d: r.bar,
-									fill: L(t),
+									fill: I(t),
 									style: a
 								})]
-							}, e[n(309)]);
+							}, e[n(450)]);
 						}),
-						D[T(300)]((e, t) => {
-							let n = T, r = G[t], i = C(e[n(305)], e), a = w(e[n(356)]);
-							return I ? m("g", { children: [
-								p(n(314), {
+						k[D(467)]((e, t) => {
+							let n = D, r = G[t], i = T(e[n(463)], e), a = E(e[n(422)]);
+							return F ? g("g", { children: [
+								h(n(486), {
 									className: "ds-funnel-chart__label",
 									x: 0,
-									y: r[n(306)],
-									dominantBaseline: n(322),
-									children: e[n(328)]
+									y: r[n(427)],
+									dominantBaseline: "middle",
+									children: e.label
 								}),
-								p(n(314), {
-									className: n(366),
-									x: j - v - 10,
-									y: r[n(306)],
-									dominantBaseline: n(322),
-									textAnchor: "end",
+								h(n(486), {
+									className: n(444),
+									x: N - b - 10,
+									y: r.mid,
+									dominantBaseline: n(437),
+									textAnchor: n(424),
 									children: i
 								}),
-								p("text", {
-									className: "ds-funnel-chart__pct",
-									x: j,
-									y: r.mid,
-									dominantBaseline: n(322),
-									textAnchor: n(346),
+								h(n(486), {
+									className: n(441),
+									x: N,
+									y: r[n(427)],
+									dominantBaseline: n(437),
+									textAnchor: n(424),
 									children: a
 								})
-							] }, e.key) : m("g", { children: [
-								p(n(314), {
-									className: n(366),
-									x: r[n(306)],
+							] }, e.key) : g("g", { children: [
+								h(n(486), {
+									className: "ds-funnel-chart__value",
+									x: r.mid,
 									y: 16,
-									dominantBaseline: "middle",
-									textAnchor: n(322),
+									dominantBaseline: n(437),
+									textAnchor: n(437),
 									children: i
 								}),
-								p("text", {
-									className: "ds-funnel-chart__pct",
-									x: r[n(306)],
+								h(n(486), {
+									className: n(441),
+									x: r.mid,
 									y: 35,
-									dominantBaseline: n(322),
-									textAnchor: n(322),
+									dominantBaseline: n(437),
+									textAnchor: "middle",
 									children: a
 								}),
-								p(n(314), {
-									className: n(336),
-									x: r[n(306)],
-									y: x - 6,
-									textAnchor: "middle",
-									children: e[n(328)]
+								h(n(486), {
+									className: "ds-funnel-chart__label",
+									x: r[n(427)],
+									y: C - 6,
+									textAnchor: n(437),
+									children: e.label
 								})
-							] }, e[n(309)]);
+							] }, e[n(450)]);
 						}),
-						p(T(357), {
+						h(D(434), {
 							className: "ds-chart__hit",
 							x: 0,
 							y: 0,
-							width: j,
+							width: N,
 							height: B,
 							onPointerMove: $,
 							onPointerDown: $,
-							onPointerLeave: P
+							onPointerLeave: ge
 						})
 					]
 				}),
-				p(T(353), {
-					ref: ge,
-					className: T(317),
-					"data-state": T(k ? 304 : 341),
-					"data-settled": he || void 0,
-					style: { transform: T(319) + X + T(321) + Z + T(313) },
+				h("div", {
+					ref: me,
+					className: D(435),
+					"data-state": D(j ? 470 : 454),
+					"data-settled": pe || void 0,
+					style: { transform: D(490) + X + D(428) + Z + "px)" },
 					"aria-hidden": !0,
-					children: p(ee, {
-						title: K?.label,
-						value: K ? C(K[T(305)], K) : void 0,
+					children: h(o, {
+						title: K?.[D(480)],
+						value: K ? T(K[D(463)], K) : void 0,
 						rows: Ce
 					})
 				}),
-				p(T(351), {
-					id: E + "-live",
-					className: T(312),
+				h("span", {
+					id: O + "-live",
+					className: D(440),
 					"aria-live": "polite",
 					children: we
 				})
 			]
-		}), ce && b && m(r, {
+		}), oe && S && g(r, {
 			gap: 4,
-			children: [m(r, {
+			children: [g(r, {
 				gap: 2,
 				wrap: !1,
-				children: [p(n, { color: L(0) }), p(t, {
-					variant: T(338),
-					tone: "secondary",
+				children: [h(n, { color: I(0) }), h(t, {
+					variant: D(488),
+					tone: D(469),
 					children: "전환"
 				})]
-			}), m(r, {
+			}), g(r, {
 				gap: 2,
 				wrap: !1,
-				children: [p(n, {
-					color: L(0),
-					variant: "hatched"
-				}), p(t, {
-					variant: "body-sm",
-					tone: "secondary",
+				children: [h(n, {
+					color: I(0),
+					variant: D(439)
+				}), h(t, {
+					variant: D(488),
+					tone: D(469),
 					children: "이탈"
 				})]
 			})]
 		})]
 	});
 }
-export { y as FunnelChart };
+export { x as FunnelChart };

package/lib/components/FunnelChart/funnel.js

@@ -1,73 +1,71 @@
 "use client";
-function e(n, r) {
-	n -= 160;
-	let i = t(), a = i[n];
-	e.XwHzWS === void 0 && (e.YAAJUc = 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);
-	}, e.IBdzIZ = {}, e.XwHzWS = !0);
-	let o = i[0];
-	e.iqSGoN !== o && (e.IBdzIZ = {}, e.iqSGoN = o);
-	let s = e.IBdzIZ[n];
-	return s === void 0 ? (a = e.YAAJUc(a), e.IBdzIZ[n] = a) : a = s, a;
-}
-function t() {
-	let e = [
-		"mJi2nJu2m0rdteDQyW",
-		"BwLU",
-		"ogD1EfjrBW",
-		"mtbPzuvoyw0",
-		"mJK0mdu1m3HquvrZAG",
-		"BwfW",
-		"DMfSDwu",
-		"CMvKDwnL",
-		"mJq0odm2Du1QtwTf",
-		"ohzry3PYqW",
-		"odK1mZy4nKfwvgrMAW",
-		"Bwf4",
-		"mJC4mJCWq0jivxn6",
-		"y29KzvbVAw50qxq",
-		"mtuWvLbfBw1k",
-		"mtj3zMvQAKe",
-		"zMLYC3q",
-		"odrluhDwB2G",
-		"mZu4nZaZCeTYD1n2",
-		"odqXntq3DvbWwuHw"
-	];
-	return t = function() {
-		return e;
-	}, t();
-}
-const n = e;
-(function(t, n) {
-	let r = e, i = t();
+const e = r;
+(function(e, t) {
+	let n = r, i = e();
 	for (;;) try {
-		if (parseInt(r(160)) / 1 * (parseInt(r(164)) / 2) + parseInt(r(170)) / 3 * (-parseInt(r(177)) / 4) + -parseInt(r(174)) / 5 * (-parseInt(r(176)) / 6) + parseInt(r(161)) / 7 * (parseInt(r(171)) / 8) + -parseInt(r(172)) / 9 + parseInt(r(165)) / 10 * (parseInt(r(166)) / 11) + -parseInt(r(179)) / 12 * (parseInt(r(162)) / 13) == n) break;
+		if (-parseInt(n(389)) / 1 + -parseInt(n(401)) / 2 * (parseInt(n(391)) / 3) + -parseInt(n(406)) / 4 * (parseInt(n(400)) / 5) + -parseInt(n(402)) / 6 * (-parseInt(n(393)) / 7) + -parseInt(n(392)) / 8 + parseInt(n(398)) / 9 + parseInt(n(397)) / 10 == t) break;
 		i.push(i.shift());
 	} catch {
 		i.push(i.shift());
 	}
-})(t, 753559);
-function r(t, n) {
-	let r = e, i = t[0]?.[r(168)] ?? 0;
-	return t[r(167)]((e, a) => {
-		let o = r, s = Math[o(173)](0, e.value), c = a ? Math[o(173)](0, t[a - 1][o(168)]) : s, l = a === 0 ? 1 : i > 0 ? s / i : 0, u = a === 0 ? 1 : c > 0 ? s / c : 0, d = a ? Math[o(173)](0, c - s) : 0;
+})(n, 598284);
+function t(e, t) {
+	let n = r, i = e[0]?.[n(405)] ?? 0;
+	return e[n(395)]((r, a) => {
+		let o = n, s = Math[o(403)](0, r[o(405)]), c = a ? Math.max(0, e[a - 1].value) : s, l = a === 0 ? 1 : i > 0 ? s / i : 0, u = a === 0 ? 1 : c > 0 ? s / c : 0, d = a ? Math[o(403)](0, c - s) : 0;
 		return {
-			...e,
+			...r,
 			value: s,
 			fromFirst: l,
 			fromPrevious: u,
-			conversion: n === o(178) ? l : u,
+			conversion: t === o(394) ? l : u,
 			drop: d,
 			dropRate: a && c > 0 ? d / c : 0
 		};
 	});
 }
-function i(t, n, r, i, a) {
-	let o = e, s = Math[o(173)](0, Math[o(163)](a, i / 2, r));
-	return "M" + t + "," + n + "H" + (t + r - s) + "Q" + (t + r) + "," + n + " " + (t + r) + "," + (n + s) + "V" + (n + i - s) + "Q" + (t + r) + "," + (n + i) + " " + (t + r - s) + "," + (n + i) + "H" + t + "Z";
+function n() {
+	let e = [
+		"DMfSDwu",
+		"mJHsq2PXEgC",
+		"ota2oti0zfjcserY",
+		"y29KzvbVAw50qxq",
+		"m2Poz294qG",
+		"nJi2mZmXmM5drxjxuW",
+		"mZKYntG3m1PAvxnTra",
+		"zMLYC3q",
+		"BwfW",
+		"zNjVBq",
+		"mtGXmJC3nZbHvhbyvvm",
+		"oti0mJG1nNbqAwvMAq",
+		"BwLU",
+		"mtGYmti1Dhrgq0rx",
+		"mtCXntaWnKriz0DXzW",
+		"nLHbuuvsCG",
+		"Bwf4",
+		"CMvKDwnL"
+	];
+	return n = function() {
+		return e;
+	}, n();
+}
+function r(e, t) {
+	e -= 389;
+	let i = n(), a = i[e];
+	r.meFgBJ === void 0 && (r.qCRGeK = 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);
+	}, r.kCvhev = {}, r.meFgBJ = !0);
+	let o = i[0];
+	r.MRrUTB !== o && (r.kCvhev = {}, r.MRrUTB = o);
+	let s = r.kCvhev[e];
+	return s === void 0 ? (a = r.qCRGeK(a), r.kCvhev[e] = a) : a = s, a;
+}
+function i(e, t, n, i, a) {
+	let o = r, s = Math[o(403)](0, Math[o(399)](a, i / 2, n));
+	return "M" + e + "," + t + "H" + (e + n - s) + "Q" + (e + n) + "," + t + " " + (e + n) + "," + (t + s) + "V" + (t + i - s) + "Q" + (e + n) + "," + (t + i) + " " + (e + n - s) + "," + (t + i) + "H" + e + "Z";
 }
-var a = (e) => Array.from(e)[n(169)]((e, t) => e + ((t[n(175)](0) ?? 0) >= 11904 ? 13 : 7.5), 0);
-export { a as estimateTextWidth, r as funnelStats, i as hBarPath };
+var a = (t) => Array[e(396)](t)[e(404)]((t, n) => t + ((n[e(390)](0) ?? 0) >= 11904 ? 13 : 7.5), 0);
+export { a as estimateTextWidth, t as funnelStats, i as hBarPath };