@gusun/design-system 0.1.0

package/dist-lib/Editor-wECQz1CV.js

@@ -0,0 +1,1994 @@
+import { T as e, i as t, k as n, o as r, s as i } from "./tokens-CbcaxhkP.js";
+import { Children as a, Fragment as o, cloneElement as s, forwardRef as c, isValidElement as l, useCallback as u, useEffect as d, useId as f, useLayoutEffect as p, useMemo as m, useReducer as h, useRef as g, useState as _ } from "react";
+import { AlignCenter as v, AlignJustify as y, AlignLeft as b, AlignRight as x, Baseline as S, Bold as C, Braces as w, ChevronDown as T, ChevronRight as E, Highlighter as D, Image as O, Italic as k, Link as A, LoaderCircle as j, Minus as M, MoreHorizontal as N, Plus as P, Redo2 as F, RotateCcw as I, Search as ee, Strikethrough as te, Table as L, Type as R, Underline as z, Undo2 as B } from "lucide-react";
+import { createPortal as ne } from "react-dom";
+import { Fragment as V, jsx as H, jsxs as U } from "react/jsx-runtime";
+import { EditorContent as re, useEditor as ie } from "@tiptap/react";
+import { StarterKit as ae } from "@tiptap/starter-kit";
+import { TextStyle as oe } from "@tiptap/extension-text-style";
+import { Color as W } from "@tiptap/extension-color";
+import { Highlight as G } from "@tiptap/extension-highlight";
+import { TextAlign as se } from "@tiptap/extension-text-align";
+import { Image as ce } from "@tiptap/extension-image";
+import { Table as le, TableCell as ue, TableHeader as de, TableRow as K } from "@tiptap/extension-table";
+import { Node as q, mergeAttributes as fe } from "@tiptap/core";
+//#region src/components/Slot.tsx
+function pe(e, t) {
+	return (n) => {
+		e?.(n), t?.(n);
+	};
+}
+function me(...e) {
+	return (t) => {
+		for (let n of e) n && (typeof n == "function" ? n(t) : n.current = t);
+	};
+}
+function he(e, t) {
+	let n = { ...t };
+	for (let r in e) {
+		let i = e[r], a = t[r];
+		/^on[A-Z]/.test(r) ? n[r] = a ? pe(a, i) : i : r === "className" ? n[r] = [a, i].filter(Boolean).join(" ") : r === "style" ? n[r] = {
+			...a,
+			...i
+		} : n[r] = i === void 0 ? a : i;
+	}
+	return n;
+}
+function ge({ children: e, content: t, ref: n, ...r }) {
+	if (!l(e)) return console.warn("Slot(asChild): 유효한 단일 엘리먼트 자식 하나가 필요합니다."), null;
+	let i = e, a = i.ref, o = he(r, i.props);
+	return t !== void 0 && (o.children = t), (n || a) && (o.ref = me(n, a)), s(i, o);
+}
+//#endregion
+//#region src/components/Tooltip.tsx
+var _e = {
+	error: {
+		bg: n["error-tooltip-bg"],
+		fg: n["error-tooltip-text"]
+	},
+	normal: {
+		bg: n["normal-tooltip-bg"],
+		fg: n["normal-tooltip-text"]
+	}
+}, ve = {
+	top: "-top-spacing-2 left-spacing-5",
+	bottom: "-bottom-spacing-2 left-spacing-5"
+};
+function ye({ children: e, variant: t = "error", beak: n = "top", className: r = "" }) {
+	let i = _e[t] ?? _e.error;
+	return /* @__PURE__ */ U("div", {
+		role: "tooltip",
+		style: {
+			backgroundColor: i.bg,
+			color: i.fg
+		},
+		className: `relative inline-flex items-center rounded-round-4 px-spacing-5 py-spacing-2 drop-shadow-[0px_2px_2px_rgba(13,13,13,0.12)] ${r}`,
+		children: [n !== "none" && /* @__PURE__ */ H("span", {
+			"aria-hidden": "true",
+			style: { backgroundColor: i.bg },
+			className: `absolute h-spacing-5 w-spacing-5 rotate-45 rounded-[1px] ${ve[n] ?? ve.top}`
+		}), /* @__PURE__ */ H("p", {
+			className: "relative whitespace-nowrap text-12",
+			children: e
+		})]
+	});
+}
+//#endregion
+//#region src/components/TruncatingText.tsx
+function be({ children: e, as: t = "p", className: n = "", ...r }) {
+	let i = g(null), a = g(null), [o, s] = _(null), [c, l] = _(null);
+	return p(() => {
+		if (!o || !a.current) return;
+		let e = a.current.offsetWidth, t = a.current.offsetHeight, n = o.top - 6 - t;
+		n < 4 && (n = o.bottom + 6);
+		let r = o.left;
+		r + e > window.innerWidth - 4 && (r = window.innerWidth - e - 4), r < 4 && (r = 4), l({
+			top: n,
+			left: r
+		});
+	}, [o]), /* @__PURE__ */ U(V, { children: [/* @__PURE__ */ H(t, {
+		ref: i,
+		onMouseEnter: () => {
+			let e = i.current;
+			e && e.scrollWidth > e.clientWidth && s(e.getBoundingClientRect());
+		},
+		onMouseLeave: () => {
+			s(null), l(null);
+		},
+		className: `truncate ${n}`,
+		...r,
+		children: e
+	}), o && ne(/* @__PURE__ */ H("div", {
+		ref: a,
+		className: "pointer-events-none fixed z-[1000]",
+		style: {
+			left: c ? c.left : o.left,
+			top: c ? c.top : o.top,
+			visibility: c ? "visible" : "hidden"
+		},
+		children: /* @__PURE__ */ H(ye, {
+			variant: "normal",
+			beak: "none",
+			children: e
+		})
+	}), document.body)] });
+}
+//#endregion
+//#region src/components/useHoverTooltip.tsx
+function xe(e, { delay: t = 300 } = {}) {
+	let [n, r] = _(null), [i, a] = _(null), o = g(null), s = g(void 0), c = !!e;
+	d(() => () => clearTimeout(s.current), []);
+	let l = u((e) => {
+		if (!c) return;
+		let n = e.currentTarget;
+		clearTimeout(s.current), s.current = setTimeout(() => r(n.getBoundingClientRect()), t);
+	}, [c, t]), f = u(() => {
+		clearTimeout(s.current), r(null), a(null);
+	}, []);
+	return p(() => {
+		if (!n || !o.current) return;
+		let e = o.current.offsetWidth, t = o.current.offsetHeight, r = n.bottom + 6;
+		r + t > window.innerHeight - 4 && (r = n.top - 6 - t);
+		let i = n.left + n.width / 2 - e / 2;
+		i + e > window.innerWidth - 4 && (i = window.innerWidth - e - 4), i < 4 && (i = 4), a({
+			top: r,
+			left: i
+		});
+	}, [n]), {
+		onMouseEnter: l,
+		onMouseLeave: f,
+		tooltip: n ? ne(/* @__PURE__ */ H("div", {
+			ref: o,
+			className: "pointer-events-none fixed z-[1000]",
+			style: {
+				left: i ? i.left : n.left,
+				top: i ? i.top : n.bottom,
+				visibility: i ? "visible" : "hidden"
+			},
+			children: /* @__PURE__ */ H(ye, {
+				variant: "normal",
+				beak: "none",
+				children: e
+			})
+		}), document.body) : null
+	};
+}
+//#endregion
+//#region src/components/Button.tsx
+function J({ children: e, size: t = "32", variant: n = "fill", color: r = "black", weight: i = "normal", leftIcon: a = null, rightIcon: o = null, icon: s = null, disabled: c = !1, loading: u = !1, truncate: d = !1, width: f = "hug", showTooltip: m = !0, tooltip: h, asChild: _ = !1, onClick: v, onMouseEnter: y, onMouseLeave: b, className: x = "", ...S }) {
+	let C = c || u, w = !!s, T = xe(w && m ? h ?? S["aria-label"] : null), E = t === "18" || t === "24" ? 14 : 16, D = f === "fill" && n !== "underline", O = g(null), k = _ && l(e) ? e : null, A = k ? k.props.children : e;
+	p(() => {
+		let e = O.current;
+		if (!e || d || D) {
+			e && D && (e.style.width = "");
+			return;
+		}
+		e.style.width = "", e.style.width = e.offsetWidth + "px";
+	}, [
+		e,
+		t,
+		n,
+		a,
+		o,
+		s,
+		c,
+		u,
+		d,
+		D
+	]);
+	let M = `inline-flex items-center justify-center relative font-pretendard ${n === "underline" && i === "semibold" ? "font-semibold" : "font-normal"} whitespace-nowrap rounded-round-4 transition-colors select-none focus:outline-none`, N = d ? "min-w-0 max-w-full" : "", P = D ? "w-full" : "", F;
+	F = n === "underline" ? t === "24" ? "min-h-[24px] text-[12px] leading-5 tracking-[0px]" : "min-h-[32px] text-[14px] leading-6 tracking-[0px]" : w ? t === "18" ? "min-h-[18px] min-w-[18px] p-spacing-2" : t === "24" ? "min-h-[24px] min-w-[24px] p-spacing-2" : "min-h-[32px] min-w-[32px] p-spacing-3" : t === "24" ? "min-h-[24px] min-w-[24px] px-spacing-5 py-spacing-2 text-[12px] leading-5 tracking-[0px]" : "min-h-[32px] min-w-[32px] px-spacing-6 py-spacing-3 text-[14px] leading-6 tracking-[0px]";
+	let I;
+	if (n === "fill") I = C ? "bg-button-fill-disabled-bg text-button-fill-disabled-fg cursor-not-allowed" : "bg-button-fill-default-bg text-button-fill-default-fg cursor-pointer hover:bg-button-fill-hover-bg focus-visible:bg-button-fill-hover-bg active:bg-button-fill-default-bg";
+	else if (n === "line") I = C ? "bg-button-line-disabled-bg text-button-line-disabled-fg cursor-not-allowed" : "bg-button-line-default-bg text-button-line-default-fg ring-1 ring-inset ring-button-line-default-line cursor-pointer hover:bg-button-line-hover-bg hover:ring-button-line-hover-line focus-visible:bg-button-line-hover-bg focus-visible:ring-button-line-hover-line active:bg-button-line-default-bg active:ring-button-line-default-line";
+	else if (n === "underline") {
+		let e = {
+			black: "text-button-underline-black-fg",
+			red: "text-button-underline-red-fg",
+			blue: "text-button-underline-blue-fg",
+			green: "text-button-underline-green-fg",
+			violet: "text-button-underline-violet-fg",
+			pink: "text-button-underline-pink-fg",
+			orange: "text-button-underline-orange-fg"
+		};
+		I = C ? "bg-transparent text-font-icon-2 cursor-not-allowed" : `bg-transparent ${e[r] ?? e.black} cursor-pointer hover:underline focus-visible:underline active:no-underline`;
+	} else I = C ? "bg-transparent text-font-icon-2 cursor-not-allowed" : "bg-transparent text-button-ghost-default-fg cursor-pointer hover:bg-button-ghost-hover-bg focus-visible:bg-button-ghost-hover-bg active:bg-transparent";
+	let ee = /* @__PURE__ */ U(V, { children: [u && /* @__PURE__ */ H("span", {
+		className: "absolute inset-0 flex items-center justify-center",
+		children: /* @__PURE__ */ H(j, {
+			size: E,
+			strokeWidth: 1.8,
+			className: "animate-spin text-font-icon-3"
+		})
+	}), /* @__PURE__ */ H("span", {
+		className: `inline-flex items-center gap-spacing-3 ${d ? "min-w-0" : ""} ${u ? "opacity-0" : ""}`,
+		children: w ? /* @__PURE__ */ H(s, {
+			size: E,
+			strokeWidth: 1.8
+		}) : /* @__PURE__ */ U(V, { children: [
+			a && /* @__PURE__ */ H(a, {
+				size: E,
+				strokeWidth: 1.8,
+				className: "shrink-0"
+			}),
+			d ? /* @__PURE__ */ H(be, {
+				as: "span",
+				className: "min-w-0",
+				children: A
+			}) : A,
+			o && /* @__PURE__ */ H(o, {
+				size: E,
+				strokeWidth: 1.8,
+				className: "shrink-0"
+			})
+		] })
+	})] }), te = `${M} ${F} ${I} ${N} ${P} ${x}`, L = (e) => {
+		y?.(e), T.onMouseEnter(e);
+	}, R = (e) => {
+		b?.(e), T.onMouseLeave();
+	};
+	return /* @__PURE__ */ U(V, { children: [k ? /* @__PURE__ */ H(ge, {
+		ref: O,
+		content: ee,
+		className: te,
+		"aria-disabled": C || void 0,
+		onClick: C ? void 0 : v,
+		onMouseEnter: L,
+		onMouseLeave: R,
+		...S,
+		children: k
+	}) : /* @__PURE__ */ H("button", {
+		ref: O,
+		className: te,
+		disabled: C,
+		onClick: C ? void 0 : v,
+		onMouseEnter: L,
+		onMouseLeave: R,
+		...S,
+		children: ee
+	}), T.tooltip] });
+}
+//#endregion
+//#region src/components/Input.tsx
+var Se = "ring-inset ring-text-field-hover-line hover:ring-2 focus-within:ring-2 focus-within:ring-text-field-focused-line", Ce = {
+	32: {
+		box: "min-h-[32px] px-spacing-6 py-spacing-3",
+		text: "text-14"
+	},
+	22: {
+		box: "min-h-[22px] px-spacing-5 py-spacing-2",
+		text: "text-12 leading-18"
+	}
+};
+function Y({ value: e, defaultValue: t, onChange: n, placeholder: r = "텍스트를 입력하세요", size: i = "32", disabled: a = !1, readOnly: o = !1, error: s = !1, errorMessage: c = "", width: l = 200, className: u = "", inputProps: d = {}, ...f }) {
+	let p = !a && !o, m = typeof l == "number" ? `${l}px` : l, h = Ce[i] ?? Ce[32], g = a ? "text-text-field-disabled-text" : o ? "text-text-field-readonly-text" : "text-text-field-filled-text", _ = a ? "placeholder:text-text-field-disabled-text" : "placeholder:text-text-field-default-text";
+	return /* @__PURE__ */ U("div", {
+		style: { width: m },
+		className: `relative flex items-center gap-spacing-3 rounded-round-4 bg-text-field-default-bg transition-shadow ${h.box} ${p ? Se : "cursor-not-allowed"} ${u}`,
+		...f,
+		children: [/* @__PURE__ */ H("input", {
+			value: e,
+			defaultValue: t,
+			onChange: n,
+			placeholder: r,
+			disabled: a,
+			readOnly: o,
+			"aria-invalid": s || void 0,
+			className: `min-w-0 flex-1 bg-transparent outline-none ${h.text} ${_} disabled:cursor-not-allowed read-only:cursor-default ${g}`,
+			...d
+		}), s && c && /* @__PURE__ */ H("div", {
+			className: "absolute left-0 top-full z-10 mt-spacing-2",
+			children: /* @__PURE__ */ H(ye, {
+				variant: "error",
+				beak: "top",
+				children: c
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/components/ScrollArea.tsx
+var we = 24, X = 6, Te = 16;
+function Ee(e, t) {
+	let n = e.querySelector("[data-scroll-sticky-top]"), r = n ? n.offsetHeight : 0, i = t && e.scrollWidth > e.clientWidth + 1 ? Te : 0;
+	return {
+		topInset: r,
+		trackH: e.clientHeight - r - i - X * 2
+	};
+}
+var De = {
+	default: {
+		base: e["scroll-bar"],
+		active: e["scroll-bar-hover"]
+	},
+	light: {
+		base: e["scroll-bar-light"],
+		active: e["scroll-bar-light-hover"]
+	}
+}, Oe = "before:absolute before:-inset-spacing-2 before:content-['']";
+function ke({ orientation: e, thumb: t, active: n, colors: r, onDown: i, onEnter: a, onLeave: o }) {
+	let s = e === "vertical", c = s ? "right-spacing-3 w-spacing-4" : "bottom-spacing-3 h-spacing-4", l = s ? {
+		top: `${t.pos}px`,
+		height: `${t.size}px`
+	} : {
+		left: `${t.pos}px`,
+		width: `${t.size}px`
+	};
+	return /* @__PURE__ */ H("div", {
+		onMouseDown: i,
+		onMouseEnter: a,
+		onMouseLeave: o,
+		className: `absolute cursor-pointer rounded-round-00 ${Oe} ${c}`,
+		style: {
+			...l,
+			opacity: +!!t.visible,
+			pointerEvents: t.visible ? "auto" : "none",
+			backgroundColor: n ? r.active : r.base
+		}
+	});
+}
+function Ae({ children: e, maxHeight: t, horizontal: n = !1, variant: r = "default", onViewport: i, onScroll: a, vScrollEl: o = null, className: s = "", contentClassName: c = "", ...l }) {
+	let f = De[r] ?? De.default, m = g(null), h = g(null), v = u((e) => {
+		m.current = e, i?.(e);
+	}, [i]), y = g(!1), b = g(!1), [x, S] = _({
+		pos: 0,
+		size: 0,
+		visible: !1
+	}), [C, w] = _({
+		pos: 0,
+		size: 0,
+		visible: !1
+	}), [T, E] = _(!1), [D, O] = _(!1), k = typeof t == "number" ? `${t}px` : t, A = u(() => {
+		let e = m.current;
+		if (o) {
+			let t = h.current?.getBoundingClientRect().top ?? 0, r = o.getBoundingClientRect().top - t, i = n && e && e.scrollWidth > e.clientWidth + 1 ? Te : 0;
+			return {
+				vEl: o,
+				topInset: r,
+				sizeInset: 0,
+				trackH: o.clientHeight - i - X * 2
+			};
+		}
+		let { topInset: t, trackH: r } = Ee(e, n);
+		return {
+			vEl: e,
+			topInset: t,
+			sizeInset: t,
+			trackH: r
+		};
+	}, [o, n]), j = u(() => {
+		let e = m.current;
+		if (!e) return;
+		let { scrollWidth: t, clientWidth: r, scrollLeft: i } = e, { vEl: a, topInset: o, sizeInset: s, trackH: c } = A(), { scrollHeight: l, clientHeight: u, scrollTop: d } = a;
+		if (l <= u + 1) S((e) => e.visible ? {
+			...e,
+			visible: !1
+		} : e);
+		else {
+			let e = Math.max((u - s) / (l - s) * c, we);
+			S({
+				pos: X + o + d / (l - u) * (c - e),
+				size: e,
+				visible: !0
+			});
+		}
+		if (!n || t <= r + 1) w((e) => e.visible ? {
+			...e,
+			visible: !1
+		} : e);
+		else {
+			let e = r - X * 2, n = Math.max(r / t * e, we);
+			w({
+				pos: X + i / (t - r) * (e - n),
+				size: n,
+				visible: !0
+			});
+		}
+	}, [n, A]), M = g(0), N = u(() => {
+		M.current ||= requestAnimationFrame(() => {
+			M.current = 0, j();
+		});
+	}, [j]);
+	d(() => () => {
+		M.current &&= (cancelAnimationFrame(M.current), 0);
+	}, []), p(() => {
+		N();
+		let e = m.current;
+		if (!e) return;
+		let t = new ResizeObserver(N);
+		return t.observe(e), () => t.disconnect();
+	}, [N, e]), p(() => {
+		if (!o) return;
+		o.addEventListener("scroll", N);
+		let e = new ResizeObserver(N);
+		return e.observe(o), () => {
+			o.removeEventListener("scroll", N), e.disconnect();
+		};
+	}, [o, N]);
+	let P = g(null);
+	d(() => () => P.current?.(), []);
+	let F = (e, t) => {
+		e.preventDefault(), e.stopPropagation();
+		let n = t === "vertical", r = n ? y : b, i = n ? E : O, a = n ? A().vEl : m.current;
+		r.current = !0, i(!0);
+		let o = n ? e.clientY : e.clientX, s = n ? a.scrollTop : a.scrollLeft, c = n ? a.scrollHeight - a.clientHeight : a.scrollWidth - a.clientWidth, l = (n ? A().trackH : a.clientWidth - X * 2) - (n ? x.size : C.size), u = l > 0 ? c / l : 0, d = (e) => {
+			let t = (n ? e.clientY : e.clientX) - o;
+			n ? a.scrollTop = s + t * u : a.scrollLeft = s + t * u;
+		}, f = () => {
+			r.current = !1, i(!1), document.body.style.userSelect = "", window.removeEventListener("mousemove", d), window.removeEventListener("mouseup", f), P.current = null;
+		};
+		document.body.style.userSelect = "none", window.addEventListener("mousemove", d), window.addEventListener("mouseup", f), P.current = f;
+	};
+	return /* @__PURE__ */ U("div", {
+		ref: h,
+		className: `${/(^|\s)(absolute|fixed|relative|sticky)(\s|$)/.test(s) ? "" : "relative"} ${s}`,
+		...l,
+		children: [
+			/* @__PURE__ */ H("div", {
+				ref: v,
+				onScroll: (e) => {
+					N(), a?.(e);
+				},
+				className: `hide-native-scroll ${n ? "overflow-auto" : "overflow-y-auto"} ${c}`,
+				style: { maxHeight: k },
+				children: e
+			}),
+			/* @__PURE__ */ H(ke, {
+				orientation: "vertical",
+				thumb: x,
+				active: T,
+				colors: f,
+				onDown: (e) => F(e, "vertical"),
+				onEnter: () => E(!0),
+				onLeave: () => {
+					y.current || E(!1);
+				}
+			}),
+			n && /* @__PURE__ */ H(ke, {
+				orientation: "horizontal",
+				thumb: C,
+				active: D,
+				colors: f,
+				onDown: (e) => F(e, "horizontal"),
+				onEnter: () => O(!0),
+				onLeave: () => {
+					b.current || O(!1);
+				}
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/chipStyles.ts
+var je = {
+	gray: "text-chip-gray-default-text border-chip-gray-default-line bg-chip-gray-default-bg hover:text-chip-gray-hover-text hover:border-chip-gray-hover-line hover:bg-chip-gray-hover-bg focus-visible:text-chip-gray-hover-text focus-visible:border-chip-gray-hover-line focus-visible:bg-chip-gray-hover-bg data-[chain-focus]:text-chip-gray-hover-text data-[chain-focus]:border-chip-gray-hover-line data-[chain-focus]:bg-chip-gray-hover-bg",
+	red: "text-chip-red-default-text border-chip-red-default-line bg-chip-red-default-bg hover:text-chip-red-hover-text hover:border-chip-red-hover-line hover:bg-chip-red-hover-bg focus-visible:text-chip-red-hover-text focus-visible:border-chip-red-hover-line focus-visible:bg-chip-red-hover-bg data-[chain-focus]:text-chip-red-hover-text data-[chain-focus]:border-chip-red-hover-line data-[chain-focus]:bg-chip-red-hover-bg",
+	blue: "text-chip-blue-default-text border-chip-blue-default-line bg-chip-blue-default-bg hover:text-chip-blue-hover-text hover:border-chip-blue-hover-line hover:bg-chip-blue-hover-bg focus-visible:text-chip-blue-hover-text focus-visible:border-chip-blue-hover-line focus-visible:bg-chip-blue-hover-bg data-[chain-focus]:text-chip-blue-hover-text data-[chain-focus]:border-chip-blue-hover-line data-[chain-focus]:bg-chip-blue-hover-bg",
+	black: "text-chip-black-default-text border-chip-black-default-line bg-chip-black-default-bg hover:text-chip-black-hover-text hover:border-chip-black-hover-line hover:bg-chip-black-hover-bg focus-visible:text-chip-black-hover-text focus-visible:border-chip-black-hover-line focus-visible:bg-chip-black-hover-bg data-[chain-focus]:text-chip-black-hover-text data-[chain-focus]:border-chip-black-hover-line data-[chain-focus]:bg-chip-black-hover-bg",
+	green: "text-chip-green-default-text border-chip-green-default-line bg-chip-green-default-bg hover:text-chip-green-hover-text hover:border-chip-green-hover-line hover:bg-chip-green-hover-bg focus-visible:text-chip-green-hover-text focus-visible:border-chip-green-hover-line focus-visible:bg-chip-green-hover-bg data-[chain-focus]:text-chip-green-hover-text data-[chain-focus]:border-chip-green-hover-line data-[chain-focus]:bg-chip-green-hover-bg",
+	violet: "text-chip-violet-default-text border-chip-violet-default-line bg-chip-violet-default-bg hover:text-chip-violet-hover-text hover:border-chip-violet-hover-line hover:bg-chip-violet-hover-bg focus-visible:text-chip-violet-hover-text focus-visible:border-chip-violet-hover-line focus-visible:bg-chip-violet-hover-bg data-[chain-focus]:text-chip-violet-hover-text data-[chain-focus]:border-chip-violet-hover-line data-[chain-focus]:bg-chip-violet-hover-bg",
+	pink: "text-chip-pink-default-text border-chip-pink-default-line bg-chip-pink-default-bg hover:text-chip-pink-hover-text hover:border-chip-pink-hover-line hover:bg-chip-pink-hover-bg focus-visible:text-chip-pink-hover-text focus-visible:border-chip-pink-hover-line focus-visible:bg-chip-pink-hover-bg data-[chain-focus]:text-chip-pink-hover-text data-[chain-focus]:border-chip-pink-hover-line data-[chain-focus]:bg-chip-pink-hover-bg",
+	orange: "text-chip-orange-default-text border-chip-orange-default-line bg-chip-orange-default-bg hover:text-chip-orange-hover-text hover:border-chip-orange-hover-line hover:bg-chip-orange-hover-bg focus-visible:text-chip-orange-hover-text focus-visible:border-chip-orange-hover-line focus-visible:bg-chip-orange-hover-bg data-[chain-focus]:text-chip-orange-hover-text data-[chain-focus]:border-chip-orange-hover-line data-[chain-focus]:bg-chip-orange-hover-bg"
+}, Me = c(function({ icon: e = null, children: t, size: n = "24", open: r = !1, disabled: i = !1, readOnly: a = !1, interactive: o, maxWidth: s, fill: c = !1, className: l = "", ...u }, d) {
+	let f = o ?? (!i && !a), p = i ? "text-font-icon-2" : r ? "text-font-icon-3" : "text-font-icon-5", m = i || a ? "text-font-icon-2" : "text-font-icon-5", h = n === "20" ? "text-12" : "text-14", g = n === "20" ? 14 : 16;
+	return /* @__PURE__ */ U("span", {
+		ref: d,
+		className: `group min-w-0 select-none items-center gap-spacing-3 focus:outline-none ${c ? "flex w-full justify-between" : "inline-flex"} ${f ? "cursor-pointer" : i ? "cursor-not-allowed" : "cursor-default"} ${l}`,
+		...u,
+		children: [
+			e && /* @__PURE__ */ H(e, {
+				size: g,
+				strokeWidth: 1.8,
+				className: `shrink-0 ${m}`
+			}),
+			/* @__PURE__ */ H(be, {
+				style: s ? { maxWidth: s } : void 0,
+				className: `min-w-0 font-normal ${c ? "flex-1" : ""} ${h} ${p} ${f ? "group-hover:underline group-focus-visible:underline" : ""}`,
+				children: t
+			}),
+			/* @__PURE__ */ H(T, {
+				size: g,
+				strokeWidth: 1.8,
+				className: `pointer-events-none shrink-0 transition-transform ${m} ${r ? "rotate-180" : ""}`
+			})
+		]
+	});
+}), Ne = "ring-inset ring-text-field-hover-line hover:ring-2 focus-within:ring-2 focus-within:ring-text-field-focused-line";
+function Pe({ value: e, defaultValue: t, onChange: n, onSubmit: r, placeholder: i = "검색어를 입력하세요", disabled: a = !1, width: o = 200, className: s = "", inputProps: c = {}, ...l }) {
+	return /* @__PURE__ */ U("div", {
+		style: { width: typeof o == "number" ? `${o}px` : o },
+		className: `group relative flex min-h-[32px] items-center gap-spacing-3 rounded-round-4 bg-text-field-default-bg px-spacing-6 py-spacing-3 transition-shadow ${a ? "cursor-not-allowed" : Ne} ${s}`,
+		...l,
+		children: [/* @__PURE__ */ H(ee, {
+			size: 16,
+			strokeWidth: 1.8,
+			className: `shrink-0 ${a ? "text-text-field-disabled-icon" : "text-text-field-default-text group-focus-within:text-text-field-filled-text"}`
+		}), /* @__PURE__ */ H("input", {
+			type: "search",
+			value: e,
+			defaultValue: t,
+			onChange: n,
+			placeholder: i,
+			disabled: a,
+			className: "min-w-0 flex-1 bg-transparent text-14 text-text-field-filled-text outline-none placeholder:text-text-field-default-text disabled:cursor-not-allowed disabled:text-text-field-disabled-text disabled:placeholder:text-text-field-disabled-text [&::-webkit-search-cancel-button]:appearance-none",
+			...c,
+			onKeyDown: (e) => {
+				e.key === "Enter" && r && r(e.currentTarget.value), c?.onKeyDown?.(e);
+			}
+		})]
+	});
+}
+//#endregion
+//#region src/components/Checkbox.tsx
+var Fe = {
+	3: "gap-spacing-3",
+	4: "gap-spacing-4",
+	5: "gap-spacing-5",
+	6: "gap-spacing-6",
+	7: "gap-spacing-7"
+};
+function Ie({ className: e }) {
+	return /* @__PURE__ */ H("svg", {
+		viewBox: "0 0 8.34188 6.51667",
+		fill: "currentColor",
+		"aria-hidden": "true",
+		className: e,
+		children: /* @__PURE__ */ H("path", { d: "M2.84188 4.11667L6.64188 0.316667C6.85299 0.105556 7.08355 0 7.33355 0C7.58355 0 7.8141 0.105556 8.02521 0.316667C8.23633 0.527778 8.34188 0.761111 8.34188 1.01667C8.34188 1.27222 8.23633 1.50556 8.02521 1.71667L3.54188 6.21667C3.34188 6.41667 3.10577 6.51667 2.83355 6.51667C2.56132 6.51667 2.32521 6.41667 2.12521 6.21667L0.308547 4.4C0.0974359 4.18889 -0.00534188 3.95556 0.000213675 3.7C0.00576923 3.44444 0.114103 3.21111 0.325214 3C0.536325 2.78889 0.769658 2.68333 1.02521 2.68333C1.28077 2.68333 1.5141 2.78889 1.72521 3L2.84188 4.11667Z" })
+	});
+}
+function Le({ checked: e, defaultChecked: t = !1, onChange: n, disabled: r = !1, label: i, className: a = "", ...o }) {
+	let s = e !== void 0, [c, l] = _(t), u = s ? e : c, d = (e) => {
+		s || l(e.target.checked), n?.(e);
+	}, f = "group-hover:ring-2 group-hover:ring-offset-1", p = "peer-focus-visible:ring-2 peer-focus-visible:ring-offset-1", m;
+	m = r ? u ? "bg-checkbox-selected-disabled-bg" : "bg-checkbox-disabled-bg" : u ? `bg-checkbox-selected-bg ${f} group-hover:ring-checkbox-selected-hover-outline ${p} peer-focus-visible:ring-checkbox-selected-hover-outline` : `bg-checkbox-unselected-bg ${f} group-hover:ring-checkbox-hover-outline ${p} peer-focus-visible:ring-checkbox-hover-outline`;
+	let h = r ? "text-checkbox-disabled-check" : "text-checkbox-check", g = r ? "text-checkbox-disabled-text" : "text-checkbox-text";
+	return /* @__PURE__ */ U("label", {
+		className: `group relative inline-flex items-center gap-spacing-4 ${r ? "cursor-not-allowed" : "cursor-pointer"} ${a}`,
+		children: [
+			/* @__PURE__ */ H("input", {
+				type: "checkbox",
+				className: "peer sr-only",
+				checked: u,
+				onChange: d,
+				disabled: r,
+				...o
+			}),
+			/* @__PURE__ */ H("span", {
+				className: `flex size-[16px] shrink-0 items-center justify-center rounded-round-3 transition-shadow ${m}`,
+				children: /* @__PURE__ */ H(Ie, { className: `w-[8px] ${u ? h : "invisible"}` })
+			}),
+			i != null && /* @__PURE__ */ H("span", {
+				className: `text-14 ${g}`,
+				children: i
+			})
+		]
+	});
+}
+function Re({ items: e = [], value: t, defaultValue: n = [], onChange: r, direction: i = "vertical", gap: a = "7", disabled: o = !1, className: s = "", ...c }) {
+	let l = t !== void 0, [u, d] = _(n), f = t === void 0 ? u : t, p = (e, t) => {
+		let n = t ? [...f, e] : f.filter((t) => t !== e);
+		l || d(n), r?.(n, {
+			value: e,
+			checked: t
+		});
+	}, m = Fe[a] ?? Fe[7];
+	return /* @__PURE__ */ H("div", {
+		role: "group",
+		className: `inline-flex ${i === "horizontal" ? "flex-row items-center" : "flex-col items-start"} ${m} ${s}`,
+		...c,
+		children: e.map((e) => /* @__PURE__ */ H(Le, {
+			label: e.label,
+			checked: f.includes(e.value),
+			disabled: o || e.disabled,
+			onChange: (t) => p(e.value, t.target.checked)
+		}, e.value))
+	});
+}
+//#endregion
+//#region src/components/PopoverMenu.tsx
+function ze({ children: e, topArea: t = "none", searchValue: n, onSearchChange: r, searchPlaceholder: i = "검색어를 입력하세요", searchInputProps: a = {}, inputValue: o, onInputChange: s, inputPlaceholder: c = "텍스트를 입력하세요", inputProps: l = {}, footer: u = !1, footerStart: d = null, footerText: f = null, footerCheckbox: p = !1, footerChecked: m = !1, onFooterCheckChange: h, footerCheckLabel: g = "전체 선택", footerReset: _ = !1, onFooterReset: v, footerResetLabel: y = "초기화", footerResetIcon: b = I, cancelText: x = "취소", onCancel: S, confirmText: C = "확인", onConfirm: w, confirmVariant: T = "fill", confirmDisabled: E = !1, confirmLoading: D = !1, showCancel: O = !0, showConfirm: k = !0, footerButtonsFill: A = !1, width: j = 304, className: M = "", ...N }) {
+	let P = typeof j == "number" ? `${j}px` : j, F = null;
+	return d == null ? p ? F = /* @__PURE__ */ H(Le, {
+		label: g,
+		checked: m,
+		onChange: h
+	}) : _ ? F = /* @__PURE__ */ H(J, {
+		variant: "underline",
+		size: "32",
+		leftIcon: b,
+		onClick: v,
+		children: y
+	}) : f != null && (F = /* @__PURE__ */ H("p", {
+		className: "text-14 text-font-icon-5",
+		children: f
+	})) : F = typeof d == "string" ? /* @__PURE__ */ H("p", {
+		className: "text-14 text-font-icon-5",
+		children: d
+	}) : d, /* @__PURE__ */ U("div", {
+		style: { width: P },
+		onKeyDown: (e) => {
+			!u || !k || e.key !== "Enter" || e.defaultPrevented || E || D || (e.preventDefault(), w?.());
+		},
+		tabIndex: u && k ? -1 : void 0,
+		className: `flex flex-col gap-spacing-1 overflow-hidden rounded-round-4 outline outline-1 outline-list-popover-outline bg-list-popover-bg shadow-[0px_2px_5px_0px_rgba(13,13,13,0.12)] ${M}`,
+		...N,
+		children: [
+			t === "search" && /* @__PURE__ */ H("div", {
+				className: "w-full bg-list-group-bg p-spacing-5",
+				children: /* @__PURE__ */ H(Pe, {
+					value: n,
+					onChange: r,
+					placeholder: i,
+					width: "100%",
+					inputProps: a
+				})
+			}),
+			t === "input" && /* @__PURE__ */ H("div", {
+				className: "w-full bg-list-group-bg p-spacing-5",
+				children: /* @__PURE__ */ H(Y, {
+					value: o,
+					onChange: s,
+					placeholder: c,
+					width: "100%",
+					inputProps: l
+				})
+			}),
+			e,
+			u && /* @__PURE__ */ U("div", {
+				className: `flex w-full items-center bg-list-group-bg py-spacing-5 ${A ? "px-spacing-5" : "justify-between pl-spacing-6 pr-spacing-5"}`,
+				children: [!A && /* @__PURE__ */ H("div", {
+					className: "flex min-w-0 items-center",
+					children: F
+				}), /* @__PURE__ */ U(vt, {
+					gap: "5",
+					width: A ? "fill" : "hug",
+					className: A ? "" : "shrink-0",
+					children: [O && /* @__PURE__ */ H(J, {
+						variant: "line",
+						size: "32",
+						onClick: S,
+						children: x
+					}), k && /* @__PURE__ */ H(J, {
+						variant: T,
+						size: "32",
+						disabled: E,
+						loading: D,
+						onClick: w,
+						children: C
+					})]
+				})]
+			})
+		]
+	});
+}
+function Be({ children: e, className: t = "", ...n }) {
+	return /* @__PURE__ */ H("div", {
+		className: `flex w-full items-stretch gap-spacing-1 ${t}`,
+		...n,
+		children: e
+	});
+}
+function Ve({ children: e, className: t = "", ...n }) {
+	return /* @__PURE__ */ H("div", {
+		className: `flex min-w-0 flex-1 flex-col gap-spacing-1 ${t}`,
+		...n,
+		children: e
+	});
+}
+function He({ title: e, children: t, grow: n = !1, className: r = "", ...i }) {
+	return /* @__PURE__ */ U("div", {
+		className: `w-full bg-list-group-bg py-spacing-4 ${n ? "min-h-0 flex-1" : ""} ${r}`,
+		...i,
+		children: [e != null && /* @__PURE__ */ H("p", {
+			className: "px-spacing-6 py-spacing-2 text-12 text-font-icon-3",
+			children: e
+		}), t]
+	});
+}
+//#endregion
+//#region src/components/ListEmpty.tsx
+function Ue({ message: e = "검색 결과가 없습니다.", className: t = "", ...n }) {
+	return /* @__PURE__ */ H("div", {
+		className: `flex w-full items-center justify-center bg-list-empty-bg px-spacing-6 py-spacing-9 text-14 text-list-empty-text ${t}`,
+		...n,
+		children: e
+	});
+}
+//#endregion
+//#region src/components/ListGroup.tsx
+var We = 32, Ge = 6, Ke = {
+	2: "gap-spacing-2",
+	3: "gap-spacing-3"
+}, qe = {
+	2: 2,
+	3: 4
+};
+function Je({ children: e, maxVisible: t = 6, gap: n, empty: r = !1, emptyMessage: i, className: o = "", ...s }) {
+	let c = n ? qe[n] : 0, l = t * We + c * (t - 1) + Ge * 2, u = r || a.count(e) === 0;
+	return /* @__PURE__ */ H("div", {
+		className: `w-full bg-list-group-bg ${o}`,
+		...s,
+		children: /* @__PURE__ */ H(Ae, {
+			maxHeight: l,
+			contentClassName: `py-spacing-4 ${n ? `flex flex-col ${Ke[n]}` : ""}`,
+			children: u ? /* @__PURE__ */ H(Ue, { message: i }) : e
+		})
+	});
+}
+//#endregion
+//#region src/components/Tag.tsx
+var Ye = {
+	blue: "bg-tag-blue-bg text-tag-blue-text",
+	red: "bg-tag-red-bg text-tag-red-text",
+	gray: "bg-tag-gray-bg text-tag-gray-text",
+	black: "bg-tag-black-bg text-tag-black-text"
+};
+function Xe({ children: e = "태그", color: t = "blue", width: n = "hug", className: r = "", ...i }) {
+	let a = Ye[t] ?? Ye.blue;
+	return /* @__PURE__ */ H("span", {
+		className: `${n === "fill" ? "flex w-full" : "inline-flex shrink-0"} items-center justify-center rounded-round-4 px-spacing-4 py-spacing-1 text-12 ${a} ${r}`,
+		...i,
+		children: e
+	});
+}
+var Ze = {
+	blue: "bg-new-tag-blue-bg",
+	red: "bg-new-tag-red-bg",
+	black: "bg-new-tag-black-bg"
+};
+function Qe({ color: e = "blue", children: t = "N", className: n = "", ...r }) {
+	return /* @__PURE__ */ H("span", {
+		className: `inline-flex h-[18px] w-[18px] shrink-0 items-center justify-center rounded-round-00 text-12 font-semibold text-new-tag-title ${Ze[e] ?? Ze.blue} ${n}`,
+		...r,
+		children: t
+	});
+}
+//#endregion
+//#region src/components/Radio.tsx
+var $e = {
+	3: "gap-spacing-3",
+	4: "gap-spacing-4",
+	5: "gap-spacing-5",
+	6: "gap-spacing-6",
+	7: "gap-spacing-7"
+};
+function et({ checked: e, defaultChecked: t = !1, onChange: n, disabled: r = !1, label: i, name: a, value: o, className: s = "", ...c }) {
+	let l = e !== void 0, [u, d] = _(t), f = l ? e : u, p = (e) => {
+		l || d(e.target.checked), n?.(e);
+	}, m = "group-hover:ring-2 group-hover:ring-offset-1", h = "peer-focus-visible:ring-2 peer-focus-visible:ring-offset-1", g;
+	g = r ? f ? "bg-radio-selected-disabled-bg" : "bg-radio-disabled-bg" : f ? `bg-radio-selected-bg ${m} group-hover:ring-radio-selected-hover-outline ${h} peer-focus-visible:ring-radio-selected-hover-outline` : `bg-radio-unselected-bg ${m} group-hover:ring-radio-hover-outline ${h} peer-focus-visible:ring-radio-hover-outline`;
+	let v = r ? "bg-radio-disabled-point" : "bg-radio-point", y = r ? "text-radio-disabled-text" : "text-radio-text";
+	return /* @__PURE__ */ U("label", {
+		className: `group relative inline-flex items-center gap-spacing-4 ${r ? "cursor-not-allowed" : "cursor-pointer"} ${s}`,
+		children: [
+			/* @__PURE__ */ H("input", {
+				type: "radio",
+				className: "peer sr-only",
+				checked: f,
+				onChange: p,
+				disabled: r,
+				name: a,
+				value: o,
+				...c
+			}),
+			/* @__PURE__ */ H("span", {
+				className: `flex h-spacing-7 w-spacing-7 shrink-0 items-center justify-center rounded-round-00 transition-shadow ${g}`,
+				children: /* @__PURE__ */ H("span", { className: `h-spacing-4 w-spacing-4 rounded-round-00 ${v} ${f ? "" : "invisible"}` })
+			}),
+			i != null && /* @__PURE__ */ H("span", {
+				className: `text-14 ${y}`,
+				children: i
+			})
+		]
+	});
+}
+function tt({ items: e = [], value: t, defaultValue: n, onChange: r, name: i, direction: a = "vertical", gap: o = "7", disabled: s = !1, className: c = "", ...l }) {
+	let u = t !== void 0, [d, p] = _(n), m = t === void 0 ? d : t, h = f(), g = i ?? `radio-group-${h}`, v = (e) => {
+		u || p(e), r?.(e);
+	}, y = $e[o] ?? $e[7];
+	return /* @__PURE__ */ H("div", {
+		role: "radiogroup",
+		className: `inline-flex ${a === "horizontal" ? "flex-row items-center" : "flex-col items-start"} ${y} ${c}`,
+		...l,
+		children: e.map((e) => /* @__PURE__ */ H(et, {
+			name: i ?? g,
+			value: e.value,
+			label: e.label,
+			checked: m === e.value,
+			disabled: s || e.disabled,
+			onChange: () => v(e.value)
+		}, e.value))
+	});
+}
+//#endregion
+//#region src/components/Switch.tsx
+function nt({ checked: e, defaultChecked: t = !1, onChange: n, disabled: r = !1, label: i, className: a = "", ...o }) {
+	let s = e !== void 0, [c, l] = _(t), u = s ? e : c, d = (e) => {
+		s || l(e.target.checked), n?.(e);
+	}, f = "group-hover:ring-2 group-hover:ring-offset-1", p = "peer-focus-visible:ring-2 peer-focus-visible:ring-offset-1", m;
+	m = r ? u ? "bg-switch-selected-disabled-bg" : "bg-switch-disabled-bg" : u ? `bg-switch-selected-bg ${f} group-hover:ring-switch-selected-hover-outline ${p} peer-focus-visible:ring-switch-selected-hover-outline` : `bg-switch-unselected-bg ${f} group-hover:ring-switch-hover-outline ${p} peer-focus-visible:ring-switch-hover-outline`;
+	let h;
+	h = r ? u ? "bg-switch-disabled-thumb" : "bg-switch-disabled-thumb-off" : "bg-switch-thumb shadow";
+	let g = r ? "text-switch-disabled-text" : "text-switch-text";
+	return /* @__PURE__ */ U("label", {
+		className: `group relative inline-flex items-center gap-spacing-4 ${r ? "cursor-not-allowed" : "cursor-pointer"} ${a}`,
+		children: [
+			/* @__PURE__ */ H("input", {
+				type: "checkbox",
+				role: "switch",
+				className: "peer sr-only",
+				checked: u,
+				onChange: d,
+				disabled: r,
+				...o
+			}),
+			/* @__PURE__ */ H("span", {
+				className: `relative h-[16px] w-[28px] shrink-0 rounded-round-5 transition-[background-color,box-shadow] ${m}`,
+				children: /* @__PURE__ */ H("span", { className: `absolute left-spacing-3 top-1/2 h-[10px] w-[12px] -translate-y-1/2 rounded-round-4 transition-transform ${h} ${u ? "translate-x-spacing-5" : "translate-x-0"}` })
+			}),
+			i != null && /* @__PURE__ */ H("span", {
+				className: `text-14 ${g}`,
+				children: i
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/List.tsx
+function Z({ title: e = "list", tag: t = !1, tagText: n = "태그", icon: r = null, checkbox: i = !1, radio: a = !1, checked: o = !1, onCheckChange: s, showSwitch: c = !1, switchChecked: l = !1, onSwitchChange: u, rightButton: d = !1, rightButtonIcon: f = N, rightButtonAriaLabel: p = "더보기", endIcon: m = !1, rightSlot: h = null, selected: g = !1, highlighted: _ = !1, disabled: v = !1, onClick: y, onButtonClick: b, className: x = "", ...S }) {
+	let C = !v, w = a, T = v ? "bg-list-default-bg cursor-not-allowed" : _ && !w ? "bg-list-hover-bg cursor-pointer" : g || w ? "bg-list-default-bg cursor-pointer" : "bg-list-default-bg cursor-pointer hover:bg-list-hover-bg active:bg-list-pressed-bg", D = v ? "text-list-disabled-text" : g ? "text-list-selected-text" : "text-list-default-text", O = v ? "text-list-disabled-icon" : "text-list-default-icon", k = v ? "text-list-disabled-icon" : g ? "text-list-selected-icon" : "text-list-default-icon", A = (e) => e.stopPropagation();
+	return /* @__PURE__ */ U("div", {
+		role: "option",
+		"aria-selected": g || void 0,
+		"aria-disabled": v || void 0,
+		onClick: C ? (e) => {
+			C && (i ? s?.({ target: { checked: !o } }) : a && !o && s?.({ target: { checked: !0 } }), y?.(e));
+		} : void 0,
+		className: `flex min-h-[32px] w-full items-center justify-between px-spacing-6 ${w ? "" : "py-spacing-3"} transition-colors ${T} ${x}`,
+		...S,
+		children: [/* @__PURE__ */ U("div", {
+			className: "flex min-w-0 flex-1 items-center gap-spacing-4",
+			children: [
+				t && /* @__PURE__ */ H(Xe, { children: n }),
+				i && /* @__PURE__ */ H("span", {
+					className: "flex shrink-0 items-center",
+					onClick: A,
+					children: /* @__PURE__ */ H(Le, {
+						checked: o,
+						onChange: s,
+						disabled: v
+					})
+				}),
+				a && !i && /* @__PURE__ */ H("span", {
+					className: "flex shrink-0 items-center",
+					onClick: A,
+					children: /* @__PURE__ */ H(et, {
+						checked: o,
+						onChange: s,
+						disabled: v
+					})
+				}),
+				r && /* @__PURE__ */ H(r, {
+					size: 16,
+					strokeWidth: 1.8,
+					className: `shrink-0 ${k}`
+				}),
+				/* @__PURE__ */ H(be, {
+					className: `min-w-0 flex-1 text-14 ${D}`,
+					children: e
+				})
+			]
+		}), (h || c || d || m) && /* @__PURE__ */ U("div", {
+			className: "flex shrink-0 items-center gap-spacing-2",
+			children: [
+				h,
+				c && /* @__PURE__ */ H("span", {
+					className: "flex shrink-0 items-center",
+					onClick: A,
+					children: /* @__PURE__ */ H(nt, {
+						checked: l,
+						onChange: u,
+						disabled: v
+					})
+				}),
+				d && /* @__PURE__ */ H("button", {
+					type: "button",
+					disabled: v,
+					onClick: (e) => {
+						e.stopPropagation(), b?.(e);
+					},
+					className: "flex min-h-[24px] min-w-[24px] items-center justify-center rounded-round-4 p-spacing-2 opacity-80 transition-colors hover:bg-button-ghost-hover-bg focus:outline-none focus-visible:bg-button-ghost-hover-bg disabled:cursor-not-allowed",
+					"aria-label": p,
+					children: /* @__PURE__ */ H(f, {
+						size: 14,
+						strokeWidth: 1.8,
+						className: O
+					})
+				}),
+				m && /* @__PURE__ */ H(E, {
+					size: 16,
+					strokeWidth: 1.8,
+					className: k
+				})
+			]
+		})]
+	});
+}
+//#endregion
+//#region src/components/usePopoverPosition.ts
+var rt = parseInt(t["spacing-3"], 10);
+function it({ open: e, anchorRef: t, menuRef: n, placement: r = "auto", menuWidth: i, deps: a = [] }) {
+	let [o, s] = _(null);
+	return p(() => {
+		if (!e) {
+			s(null);
+			return;
+		}
+		let a = () => {
+			let e = t.current;
+			if (!e) return;
+			let a = e.getBoundingClientRect(), o = n.current, c = o?.offsetHeight ?? 0, l = rt, u = i == null ? a.width : typeof i == "number" ? i : o?.offsetWidth ?? a.width, d = i != null && typeof i != "number" ? i : `${u}px`, f, p;
+			if (r === "auto" ? (f = "auto", p = "auto") : [f, p] = r.split("-"), f === "auto") {
+				let e = window.innerHeight - a.bottom, t = a.top;
+				f = e < c + l && t > e ? "top" : "bottom";
+			}
+			p === "auto" && (p = a.left + u > window.innerWidth ? "right" : "left");
+			let m = f === "top" ? a.top - l - c : a.bottom + l, h = p === "right" ? a.right - u : a.left;
+			s((e) => e && e.top === m && e.left === h && e.width === d ? e : {
+				position: "fixed",
+				top: m,
+				left: h,
+				width: d
+			});
+		};
+		a();
+		let o = 0, c = () => {
+			o ||= requestAnimationFrame(() => {
+				o = 0, a();
+			});
+		};
+		return window.addEventListener("resize", c), window.addEventListener("scroll", c, !0), () => {
+			o && cancelAnimationFrame(o), window.removeEventListener("resize", c), window.removeEventListener("scroll", c, !0);
+		};
+	}, [
+		e,
+		r,
+		i,
+		...a
+	]), o;
+}
+//#endregion
+//#region src/components/useOutsideDismiss.ts
+function at({ open: e, refs: t, onDismiss: n, guard: r }) {
+	d(() => {
+		if (!e) return;
+		let i = (e) => {
+			if (t.some((t) => t.current && t.current.contains(e.target)) || r && !r(e)) return;
+			e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
+			let i = (e) => {
+				e.stopPropagation(), e.preventDefault();
+			};
+			document.addEventListener("click", i, {
+				capture: !0,
+				once: !0
+			}), setTimeout(() => document.removeEventListener("click", i, !0), 300);
+			let a = document.activeElement;
+			a instanceof HTMLElement && t.some((e) => e.current && e.current.contains(a)) && a.blur(), n(e);
+		};
+		return document.addEventListener("mousedown", i, !0), () => document.removeEventListener("mousedown", i, !0);
+	});
+}
+//#endregion
+//#region src/components/popoverLayers.ts
+var ot = [];
+function st(e) {
+	ot.push(e);
+}
+function ct(e) {
+	let t = ot.indexOf(e);
+	t >= 0 && ot.splice(t, 1);
+}
+function lt(e) {
+	return ot[ot.length - 1] === e;
+}
+function ut() {
+	return ot.length > 0;
+}
+//#endregion
+//#region src/components/Select.tsx
+var dt = "ring-inset ring-text-field-hover-line hover:ring-2 focus-visible:ring-2";
+function ft({ className: e = "" }) {
+	return /* @__PURE__ */ U("svg", {
+		viewBox: "0 0 2 7",
+		width: 2,
+		height: 7,
+		fill: "currentColor",
+		"aria-hidden": "true",
+		className: `shrink-0 ${e}`,
+		children: [/* @__PURE__ */ H("path", { d: "M2 1C2 1.55228 1.55228 2 1 2C0.447715 2 0 1.55228 0 1C0 0.447715 0.447715 0 1 0C1.55228 0 2 0.447715 2 1Z" }), /* @__PURE__ */ H("path", { d: "M2 6C2 6.55228 1.55228 7 1 7C0.447715 7 0 6.55228 0 6C0 5.44772 0.447715 5 1 5C1.55228 5 2 5.44772 2 6Z" })]
+	});
+}
+function pt({ value: e, defaultValue: t = "", onChange: n, options: r = [], multiple: i = !1, confirm: a = !1, variant: o = "box", size: s = "24", weight: c = "normal", defaultOpen: l = !1, tabOpens: f = !1, color: h = "gray", label: v = null, placeholder: y = "선택하세요", disabled: b = !1, readOnly: x = !1, error: S = !1, errorMessage: C = "", width: w = 200, maxWidth: E, menuWidth: D, placement: O = "auto", searchable: k = !1, searchPlaceholder: A = "검색어를 입력하세요", emptyMessage: j = "옵션이 없습니다.", noResultMessage: M = "검색 결과가 없습니다.", className: N = "", ...P }) {
+	let F = n, I = e !== void 0, [ee, te] = _(() => i && !Array.isArray(t) ? [] : t), L = e === void 0 ? ee : e, R = m(() => i && Array.isArray(L) ? L : [], [i, L]), [z, B] = _(l), V = i && a, [re, ie] = _([]), ae = g(null), oe = g(!1);
+	d(() => {
+		if (!z || !k) return;
+		let e = setTimeout(() => ae.current?.focus(), 0);
+		return () => clearTimeout(e);
+	}, [z, k]);
+	let [W, G] = _(-1), [se, ce] = _(""), [le, ue] = _(void 0), de = g(null), K = g(null), q = g(null), fe = o === "text", pe = o === "text" && w === "fill", me = o === "chip", he = D ?? (fe || me ? 120 : void 0), ge = i ? void 0 : r.find((e) => e.value === L), _e = i ? r.filter((e) => R.includes(e.value)).map((e) => e.label) : [], ve = i ? _e.length === 0 : !ge, xe = i ? ve ? y : _e.join(", ") : ge ? ge.label : y, J = !b && !x, Se = w === "hug" ? "fit-content" : typeof w == "number" ? `${w}px` : w, Ce = E == null ? void 0 : typeof E == "number" ? `${E}px` : E, Y = k && se.trim() ? r.filter((e) => String(e.label).toLowerCase().includes(se.trim().toLowerCase())) : r, we = u((e) => {
+		I || te(e), F?.({ target: { value: e } }), B(!1), K.current?.focus();
+	}, [I, F]), X = u((e) => {
+		if (V) {
+			ie((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
+			return;
+		}
+		let t = R.includes(e) ? R.filter((t) => t !== e) : [...R, e];
+		I || te(t), F?.({ target: { value: t } });
+	}, [
+		V,
+		I,
+		F,
+		R
+	]), Te = u((e) => {
+		I || te(e), F?.({ target: { value: e } }), B(!1), K.current?.focus();
+	}, [I, F]), Ee = V ? re : R, De = (e) => {
+		if (!e?.disabled) return i ? X(e.value) : we(e.value);
+	};
+	p(() => {
+		let e = K.current;
+		if (!e || fe || me || w === "hug") {
+			ue(void 0);
+			return;
+		}
+		let t = () => {
+			let t = getComputedStyle(e), n = parseFloat(t.paddingLeft) || 0, r = parseFloat(t.paddingRight) || 0, i = parseFloat(t.columnGap) || 0, a = e.clientWidth - n - r;
+			ue(Math.max(0, a - 16 - i));
+		};
+		t();
+		let n = new ResizeObserver(t);
+		return n.observe(e), () => n.disconnect();
+	}, [
+		w,
+		fe,
+		me
+	]), d(() => {
+		if (z) return st(q), () => ct(q);
+	}, [z]), at({
+		open: z,
+		refs: [de, q],
+		guard: () => lt(q),
+		onDismiss: () => B(!1)
+	}), d(() => {
+		if (!z) return;
+		let e = (e) => {
+			e.key === "Escape" && lt(q) && (e.stopPropagation(), B(!1), K.current?.focus());
+		};
+		return document.addEventListener("keydown", e, !0), () => document.removeEventListener("keydown", e, !0);
+	}, [z]), d(() => {
+		if (!z) return;
+		ce(""), V && ie(R);
+		let e = r.findIndex((e) => i ? R.includes(e.value) : e.value === L);
+		G(e >= 0 ? e : 0);
+	}, [z]), d(() => {
+		!z || W < 0 || (q.current?.querySelector(`[data-option-index="${W}"]`))?.scrollIntoView({ block: "nearest" });
+	}, [W, z]);
+	let Oe = it({
+		open: z,
+		anchorRef: K,
+		menuRef: q,
+		placement: O,
+		menuWidth: he,
+		deps: [Y.length, se]
+	}), ke = (e) => {
+		switch (e.key) {
+			case "Escape":
+				e.preventDefault(), B(!1), K.current?.focus();
+				break;
+			case "ArrowDown":
+				e.preventDefault(), G((e) => Math.min(e + 1, Y.length - 1));
+				break;
+			case "ArrowUp":
+				e.preventDefault(), G((e) => Math.max(e - 1, 0));
+				break;
+			case "Enter": {
+				e.preventDefault();
+				let t = Y[W];
+				t && De(t);
+				break;
+			}
+			case "Tab":
+				!e.shiftKey && W < Y.length - 1 ? (e.preventDefault(), G((e) => Math.min(e + 1, Y.length - 1))) : e.shiftKey && W > 0 ? (e.preventDefault(), G((e) => Math.max(e - 1, 0))) : (B(!1), k && (e.preventDefault(), oe.current = !0, K.current?.focus()));
+				break;
+			default: break;
+		}
+	}, Ae = (e) => {
+		if (J) {
+			if (!z) {
+				if (e.key === "Enter" || e.key === " " || e.key === "ArrowDown") e.preventDefault(), B(!0);
+				else if (f && e.key === "Tab" && !e.shiftKey) {
+					if (oe.current) {
+						oe.current = !1;
+						return;
+					}
+					e.preventDefault(), B(!0);
+				}
+				return;
+			}
+			if (!k) if (e.key === " ") {
+				e.preventDefault();
+				let t = Y[W];
+				t && De(t);
+			} else ke(e);
+		}
+	}, Ne = b ? "text-text-field-disabled-text" : x ? "text-text-field-readonly-text" : ve ? "text-text-field-default-text" : "text-text-field-filled-text", Pe = b ? "text-text-field-disabled-icon" : "text-text-field-default-text group-focus-within:text-text-field-filled-text";
+	return /* @__PURE__ */ U("div", {
+		ref: de,
+		className: `relative ${pe ? "flex w-full" : fe || me ? "inline-flex max-w-full align-middle" : ""} ${N}`,
+		style: fe || me ? void 0 : {
+			width: Se,
+			maxWidth: Ce
+		},
+		...P,
+		children: [
+			fe ? /* @__PURE__ */ H(Me, {
+				ref: K,
+				role: "combobox",
+				"aria-haspopup": "listbox",
+				"aria-expanded": z,
+				"aria-disabled": b || void 0,
+				"aria-invalid": S || void 0,
+				tabIndex: J ? 0 : -1,
+				onClick: () => J && B((e) => !e),
+				onKeyDown: Ae,
+				size: s,
+				open: z,
+				disabled: b,
+				readOnly: x,
+				interactive: J,
+				maxWidth: Ce,
+				fill: pe,
+				children: xe
+			}) : me ? /* @__PURE__ */ U("div", {
+				ref: K,
+				role: "combobox",
+				"aria-haspopup": "listbox",
+				"aria-expanded": z,
+				"aria-disabled": b || void 0,
+				"aria-invalid": S || void 0,
+				tabIndex: J ? 0 : -1,
+				onClick: () => J && B((e) => !e),
+				onKeyDown: Ae,
+				style: Ce ? { maxWidth: Ce } : void 0,
+				className: `inline-flex min-w-0 items-center gap-spacing-3 rounded-round-4 border pl-spacing-4 pr-spacing-3 py-spacing-1 font-pretendard text-12 font-normal transition-colors focus:outline-none ${je[h] ?? je.gray} ${J ? "cursor-pointer" : "cursor-not-allowed"}`,
+				children: [/* @__PURE__ */ H(be, {
+					className: `min-w-0 text-12 ${c === "semibold" ? "font-semibold" : "font-normal"}`,
+					children: xe
+				}), /* @__PURE__ */ H(T, {
+					size: 12,
+					strokeWidth: 1.8,
+					className: `pointer-events-none shrink-0 transition-transform ${z ? "rotate-180" : ""}`
+				})]
+			}) : /* @__PURE__ */ U("div", {
+				ref: K,
+				role: "combobox",
+				"aria-haspopup": "listbox",
+				"aria-expanded": z,
+				"aria-disabled": b || void 0,
+				"aria-invalid": S || void 0,
+				tabIndex: J ? 0 : -1,
+				onClick: () => J && B((e) => !e),
+				onKeyDown: Ae,
+				className: `group relative grid min-h-[32px] grid-cols-[minmax(0,1fr)_auto] items-center gap-spacing-4 rounded-round-4 bg-text-field-default-bg py-spacing-3 pl-spacing-6 pr-spacing-6 transition-shadow focus:outline-none ${J ? `cursor-pointer ${dt}` : "cursor-not-allowed"}`,
+				children: [v != null && !ve ? /* @__PURE__ */ U("div", {
+					style: le == null ? void 0 : { maxWidth: `${le}px` },
+					className: "flex min-w-0 items-center gap-spacing-3",
+					children: [
+						/* @__PURE__ */ H("span", {
+							className: `shrink-0 text-14 font-normal ${Ne}`,
+							children: v
+						}),
+						/* @__PURE__ */ H(ft, { className: "text-font-icon-3" }),
+						/* @__PURE__ */ H(be, {
+							className: `min-w-0 flex-1 text-14 font-normal ${Ne}`,
+							children: xe
+						})
+					]
+				}) : /* @__PURE__ */ H(be, {
+					style: le == null ? void 0 : { maxWidth: `${le}px` },
+					className: `text-14 font-normal ${Ne}`,
+					children: xe
+				}), /* @__PURE__ */ H(T, {
+					size: 16,
+					strokeWidth: 1.8,
+					className: `pointer-events-none shrink-0 transition-transform ${Pe} ${z ? "rotate-180" : ""}`
+				})]
+			}),
+			z && ne(/* @__PURE__ */ H("div", {
+				ref: q,
+				className: "z-[1000]",
+				style: Oe ?? {
+					position: "fixed",
+					top: 0,
+					left: 0,
+					visibility: "hidden"
+				},
+				children: /* @__PURE__ */ H(ze, {
+					width: "100%",
+					topArea: k ? "search" : "none",
+					searchValue: se,
+					onSearchChange: (e) => {
+						ce(e.target.value), G(0);
+					},
+					searchPlaceholder: A,
+					searchInputProps: k ? {
+						ref: ae,
+						onKeyDown: ke
+					} : {},
+					...V ? {
+						footer: !0,
+						footerCheckbox: !0,
+						footerChecked: r.filter((e) => !e.disabled).length > 0 && r.filter((e) => !e.disabled).every((e) => re.includes(e.value)),
+						onFooterCheckChange: () => ie((e) => {
+							let t = r.filter((e) => !e.disabled).map((e) => e.value);
+							return t.every((t) => e.includes(t)) ? [] : t;
+						}),
+						onCancel: () => {
+							B(!1), K.current?.focus();
+						},
+						onConfirm: () => Te(re)
+					} : {},
+					children: Y.length > 0 ? /* @__PURE__ */ H(Je, { children: Y.map((e, t) => i ? /* @__PURE__ */ H(Z, {
+						title: e.label,
+						checkbox: !0,
+						disabled: e.disabled,
+						checked: Ee.includes(e.value),
+						onCheckChange: e.disabled ? void 0 : () => X(e.value),
+						highlighted: !e.disabled && t === W,
+						onMouseEnter: () => !e.disabled && G(t),
+						"data-option-index": t
+					}, e.value) : /* @__PURE__ */ H(Z, {
+						title: e.label,
+						disabled: e.disabled,
+						selected: e.value === L,
+						highlighted: !e.disabled && t === W,
+						onClick: e.disabled ? void 0 : () => we(e.value),
+						onMouseEnter: () => !e.disabled && G(t),
+						"data-option-index": t
+					}, e.value)) }) : /* @__PURE__ */ H(Ue, { message: k && se.trim() ? M : j })
+				})
+			}), document.body),
+			S && C && !z && /* @__PURE__ */ H("div", {
+				className: "absolute left-0 top-full z-10 mt-spacing-2",
+				children: /* @__PURE__ */ H(ye, {
+					variant: "error",
+					beak: "top",
+					children: C
+				})
+			})
+		]
+	});
+}
+function mt(e) {
+	return /* @__PURE__ */ H(pt, {
+		variant: "chip",
+		...e
+	});
+}
+//#endregion
+//#region src/components/ButtonGroup.tsx
+var ht = {
+	3: "gap-spacing-3",
+	4: "gap-spacing-4",
+	5: "gap-spacing-5",
+	6: "gap-spacing-6",
+	7: "gap-spacing-7"
+};
+function gt(e) {
+	let t = [];
+	return a.forEach(e, (e) => {
+		l(e) && e.type === o ? t.push(...gt(e.props.children)) : e != null && typeof e != "boolean" && t.push(e);
+	}), t;
+}
+var _t = (e) => l(e) && e.type === pt;
+function vt({ children: e, direction: t = "horizontal", gap: n = "5", width: r = "hug", className: i = "", ...a }) {
+	let o = t === "vertical" ? "flex-col" : "flex-row", c = ht[n] ?? ht[5], u = r === "fill", d = gt(e), f = d.filter(_t), p = d.filter((e) => !_t(e)), m = (f.length ? [...f, ...p] : d).map((e, t) => {
+		if (!l(e)) return e;
+		let n = u && e.type === J ? { width: e.props.width ?? "fill" } : {};
+		return s(e, {
+			key: e.key ?? `bg-${t}`,
+			...n
+		});
+	});
+	return /* @__PURE__ */ H("div", {
+		className: `${u ? "flex w-full" : "inline-flex"} ${o} ${c} ${i}`,
+		...a,
+		children: m
+	});
+}
+//#endregion
+//#region src/components/Popover.tsx
+function Q({ trigger: e, children: t, placement: n = "auto", menuWidth: r, open: i, onOpenChange: a, disabled: o = !1, className: s = "", ...c }) {
+	let l = i !== void 0, [f, p] = _(!1), m = l ? i : f, h = g(null), v = g(null), y = u((e) => {
+		l || p(e), a?.(e);
+	}, [l, a]), b = u(() => y(!1), [y]);
+	d(() => {
+		if (m) return st(v), () => ct(v);
+	}, [m]), at({
+		open: m,
+		refs: [h, v],
+		guard: () => lt(v),
+		onDismiss: b
+	}), d(() => {
+		if (!m) return;
+		let e = (e) => {
+			e.key === "Escape" && lt(v) && (e.stopPropagation(), b());
+		};
+		return document.addEventListener("keydown", e, !0), () => document.removeEventListener("keydown", e, !0);
+	}, [m, b]);
+	let x = it({
+		open: m,
+		anchorRef: h,
+		menuRef: v,
+		placement: n,
+		menuWidth: r
+	});
+	return /* @__PURE__ */ U(V, { children: [/* @__PURE__ */ H("span", {
+		ref: h,
+		...c,
+		className: `inline-flex ${s}`,
+		"aria-haspopup": "menu",
+		"aria-expanded": m,
+		onClick: (e) => {
+			c.onClick?.(e), o || y(!m);
+		},
+		children: e
+	}), m && ne(/* @__PURE__ */ H("div", {
+		ref: v,
+		className: "z-[1000]",
+		style: x ?? {
+			position: "fixed",
+			top: 0,
+			left: 0,
+			visibility: "hidden"
+		},
+		children: typeof t == "function" ? t(b) : t
+	}), document.body)] });
+}
+//#endregion
+//#region src/components/EditorToolbar.tsx
+var yt = (e) => e.preventDefault();
+function $({ icon: e, label: t, active: n = !1, disabled: r = !1, onClick: i }) {
+	return /* @__PURE__ */ H(J, {
+		variant: "ghost",
+		size: "24",
+		icon: e,
+		disabled: r,
+		onClick: i,
+		onMouseDown: yt,
+		"aria-label": t,
+		"aria-pressed": n
+	});
+}
+function bt({ icon: e, label: t, ariaLabel: n }) {
+	return t ? /* @__PURE__ */ H(J, {
+		variant: "ghost",
+		size: "24",
+		leftIcon: e,
+		onMouseDown: yt,
+		children: t
+	}) : /* @__PURE__ */ H(J, {
+		variant: "ghost",
+		size: "24",
+		icon: e,
+		onMouseDown: yt,
+		title: n,
+		"aria-label": n
+	});
+}
+function xt() {
+	return /* @__PURE__ */ H("span", { className: "mx-spacing-2 self-stretch border-l border-editor-divider" });
+}
+var St = [
+	{
+		key: "paragraph",
+		label: "본문"
+	},
+	{
+		key: "h1",
+		label: "제목 1"
+	},
+	{
+		key: "h2",
+		label: "제목 2"
+	},
+	{
+		key: "h3",
+		label: "제목 3"
+	}
+];
+function Ct({ palette: e, current: t, onPick: n }) {
+	return /* @__PURE__ */ H(ze, {
+		width: 80,
+		children: /* @__PURE__ */ H("div", {
+			className: "bg-list-group-bg py-spacing-4",
+			children: e.map((e) => {
+				let r = t === e.value || e.value === null && !t, i = e.swatch ?? e.value;
+				return /* @__PURE__ */ U("button", {
+					type: "button",
+					onMouseDown: yt,
+					onClick: () => n(e.value),
+					className: `flex w-full cursor-pointer items-center gap-spacing-4 px-spacing-6 py-spacing-3 text-14 transition-colors hover:bg-list-hover-bg focus:outline-none focus-visible:bg-list-hover-bg ${r ? "text-list-selected-text" : "text-list-default-text"}`,
+					children: [/* @__PURE__ */ H("span", {
+						className: "inline-block h-[14px] w-[14px] shrink-0 rounded-round-00",
+						style: i ? { backgroundColor: i } : void 0
+					}), e.label]
+				}, e.label);
+			})
+		})
+	});
+}
+function wt({ initialUrl: e = "", placeholder: t, submitLabel: n, onSubmit: r, onRemove: i, removeLabel: a = "해제" }) {
+	let [o, s] = _(e), c = () => r(o.trim());
+	return /* @__PURE__ */ H(ze, {
+		width: 300,
+		topArea: "input",
+		inputValue: o,
+		onInputChange: (e) => s(e.target.value),
+		inputPlaceholder: t,
+		inputProps: {
+			autoFocus: !0,
+			onKeyDown: (e) => {
+				e.key === "Enter" && (e.preventDefault(), c());
+			}
+		},
+		footer: !0,
+		footerButtonsFill: !0,
+		showCancel: !!i,
+		cancelText: a,
+		onCancel: i,
+		confirmText: n,
+		onConfirm: c
+	});
+}
+function Tt({ editor: e, close: t }) {
+	return /* @__PURE__ */ H(wt, {
+		initialUrl: e.getAttributes("link").href ?? "",
+		placeholder: "https://example.com",
+		submitLabel: "적용",
+		onSubmit: (n) => {
+			let r = e.chain().focus().extendMarkRange("link");
+			n ? r.setLink({ href: n }).run() : r.unsetLink().run(), t();
+		},
+		onRemove: () => {
+			e.chain().focus().extendMarkRange("link").unsetLink().run(), t();
+		}
+	});
+}
+function Et({ editor: e, close: t }) {
+	return /* @__PURE__ */ H(wt, {
+		placeholder: "이미지 주소(URL)",
+		submitLabel: "삽입",
+		onSubmit: (n) => {
+			n && e.chain().focus().setImage({ src: n }).run(), t();
+		}
+	});
+}
+function Dt({ editor: e, mergeFields: t, close: n }) {
+	let [r, i] = _(""), a = t.map((e) => typeof e == "string" ? {
+		label: e,
+		value: e
+	} : e).filter((e) => !r || e.label.toLowerCase().includes(r.toLowerCase())), o = (t) => {
+		e.chain().focus().insertContent({
+			type: "mergeField",
+			attrs: { value: t }
+		}).run(), n();
+	};
+	return /* @__PURE__ */ H(ze, {
+		width: 180,
+		topArea: "search",
+		searchValue: r,
+		onSearchChange: (e) => i(e.target.value),
+		searchPlaceholder: "필드명 검색",
+		searchInputProps: { autoFocus: !0 },
+		children: /* @__PURE__ */ H(Je, {
+			empty: a.length === 0,
+			emptyMessage: "검색 결과 없음",
+			children: a.map((e) => /* @__PURE__ */ H(Z, {
+				icon: P,
+				title: e.label,
+				onClick: () => o(e.value)
+			}, e.value))
+		})
+	});
+}
+function Ot({ editor: e, toolbar: t, mergeFields: n = [] }) {
+	if (!e) return null;
+	let a = (e) => !t || t.includes(e), s = (t) => t(e.chain().focus()).run(), c = e.isActive("heading", { level: 1 }) ? "h1" : e.isActive("heading", { level: 2 }) ? "h2" : e.isActive("heading", { level: 3 }) ? "h3" : "paragraph", l = (e, t) => {
+		s(e === "paragraph" ? (e) => e.setParagraph() : (t) => t.toggleHeading({ level: Number(e[1]) })), t();
+	}, u = e.getAttributes("textStyle").color ?? null, d = e.getAttributes("highlight").color ?? null, f = (e) => s(e ? (t) => t.setColor(e) : (e) => e.unsetColor()), p = (e) => s(e ? (t) => t.setHighlight({ color: e }) : (e) => e.unsetHighlight()), m = e.isActive("table");
+	return /* @__PURE__ */ H("div", {
+		className: "flex min-w-0 flex-1 flex-wrap items-center gap-spacing-2",
+		children: [
+			[a("undo") && /* @__PURE__ */ H($, {
+				icon: B,
+				label: "실행 취소",
+				disabled: !e.can().undo(),
+				onClick: () => s((e) => e.undo())
+			}, "undo"), a("redo") && /* @__PURE__ */ H($, {
+				icon: F,
+				label: "다시 실행",
+				disabled: !e.can().redo(),
+				onClick: () => s((e) => e.redo())
+			}, "redo")],
+			[a("mergefield") && n.length > 0 && /* @__PURE__ */ H(Q, {
+				placement: "auto-left",
+				menuWidth: 180,
+				trigger: /* @__PURE__ */ H(bt, {
+					icon: w,
+					label: "머지필드"
+				}),
+				children: (t) => /* @__PURE__ */ H(Dt, {
+					editor: e,
+					mergeFields: n,
+					close: t
+				})
+			}, "mergefield")],
+			[a("block") && /* @__PURE__ */ H(Q, {
+				placement: "auto-left",
+				menuWidth: 80,
+				trigger: /* @__PURE__ */ H(bt, {
+					icon: R,
+					label: St.find((e) => e.key === c)?.label
+				}),
+				children: (e) => /* @__PURE__ */ H(ze, {
+					width: 80,
+					children: /* @__PURE__ */ H(Je, { children: St.map((t) => /* @__PURE__ */ H(Z, {
+						title: t.label,
+						selected: c === t.key,
+						onClick: () => l(t.key, e)
+					}, t.key)) })
+				})
+			}, "block")],
+			[
+				a("bold") && /* @__PURE__ */ H($, {
+					icon: C,
+					label: "굵게",
+					active: e.isActive("bold"),
+					onClick: () => s((e) => e.toggleBold())
+				}, "bold"),
+				a("italic") && /* @__PURE__ */ H($, {
+					icon: k,
+					label: "기울임",
+					active: e.isActive("italic"),
+					onClick: () => s((e) => e.toggleItalic())
+				}, "italic"),
+				a("underline") && /* @__PURE__ */ H($, {
+					icon: z,
+					label: "밑줄",
+					active: e.isActive("underline"),
+					onClick: () => s((e) => e.toggleUnderline())
+				}, "underline"),
+				a("strike") && /* @__PURE__ */ H($, {
+					icon: te,
+					label: "취소선",
+					active: e.isActive("strike"),
+					onClick: () => s((e) => e.toggleStrike())
+				}, "strike")
+			],
+			[a("color") && /* @__PURE__ */ H(Q, {
+				placement: "auto-left",
+				menuWidth: 80,
+				trigger: /* @__PURE__ */ H(bt, {
+					icon: S,
+					ariaLabel: "글자 색"
+				}),
+				children: () => /* @__PURE__ */ H(Ct, {
+					palette: i,
+					current: u,
+					onPick: f
+				})
+			}, "color"), a("highlight") && /* @__PURE__ */ H(Q, {
+				placement: "auto-left",
+				menuWidth: 80,
+				trigger: /* @__PURE__ */ H(bt, {
+					icon: D,
+					ariaLabel: "형광펜"
+				}),
+				children: () => /* @__PURE__ */ H(Ct, {
+					palette: r,
+					current: d,
+					onPick: p
+				})
+			}, "highlight")],
+			[
+				a("align") && /* @__PURE__ */ H($, {
+					icon: b,
+					label: "왼쪽 정렬",
+					active: e.isActive({ textAlign: "left" }),
+					onClick: () => s((e) => e.setTextAlign("left"))
+				}, "al"),
+				a("align") && /* @__PURE__ */ H($, {
+					icon: v,
+					label: "가운데 정렬",
+					active: e.isActive({ textAlign: "center" }),
+					onClick: () => s((e) => e.setTextAlign("center"))
+				}, "ac"),
+				a("align") && /* @__PURE__ */ H($, {
+					icon: x,
+					label: "오른쪽 정렬",
+					active: e.isActive({ textAlign: "right" }),
+					onClick: () => s((e) => e.setTextAlign("right"))
+				}, "ar"),
+				a("align") && /* @__PURE__ */ H($, {
+					icon: y,
+					label: "양쪽 정렬",
+					active: e.isActive({ textAlign: "justify" }),
+					onClick: () => s((e) => e.setTextAlign("justify"))
+				}, "aj")
+			],
+			[
+				a("link") && /* @__PURE__ */ H(Q, {
+					placement: "auto-left",
+					menuWidth: 300,
+					trigger: /* @__PURE__ */ H(bt, {
+						icon: A,
+						ariaLabel: "링크"
+					}),
+					children: (t) => /* @__PURE__ */ H(Tt, {
+						editor: e,
+						close: t
+					})
+				}, "link"),
+				a("table") && /* @__PURE__ */ H(Q, {
+					placement: "auto-left",
+					menuWidth: 140,
+					trigger: /* @__PURE__ */ H(bt, {
+						icon: L,
+						ariaLabel: "표"
+					}),
+					children: (e) => /* @__PURE__ */ H(ze, {
+						width: 140,
+						children: /* @__PURE__ */ U(Je, { children: [
+							/* @__PURE__ */ H(Z, {
+								title: "표 삽입 (3×3)",
+								onClick: () => {
+									s((e) => e.insertTable({
+										rows: 3,
+										cols: 3,
+										withHeaderRow: !0
+									})), e();
+								}
+							}),
+							/* @__PURE__ */ H(Z, {
+								title: "위에 행 추가",
+								disabled: !m,
+								onClick: () => {
+									s((e) => e.addRowBefore()), e();
+								}
+							}),
+							/* @__PURE__ */ H(Z, {
+								title: "아래에 행 추가",
+								disabled: !m,
+								onClick: () => {
+									s((e) => e.addRowAfter()), e();
+								}
+							}),
+							/* @__PURE__ */ H(Z, {
+								title: "행 삭제",
+								disabled: !m,
+								onClick: () => {
+									s((e) => e.deleteRow()), e();
+								}
+							}),
+							/* @__PURE__ */ H(Z, {
+								title: "왼쪽에 열 추가",
+								disabled: !m,
+								onClick: () => {
+									s((e) => e.addColumnBefore()), e();
+								}
+							}),
+							/* @__PURE__ */ H(Z, {
+								title: "오른쪽에 열 추가",
+								disabled: !m,
+								onClick: () => {
+									s((e) => e.addColumnAfter()), e();
+								}
+							}),
+							/* @__PURE__ */ H(Z, {
+								title: "열 삭제",
+								disabled: !m,
+								onClick: () => {
+									s((e) => e.deleteColumn()), e();
+								}
+							}),
+							/* @__PURE__ */ H(Z, {
+								title: "표 삭제",
+								disabled: !m,
+								onClick: () => {
+									s((e) => e.deleteTable()), e();
+								}
+							})
+						] })
+					})
+				}, "table"),
+				a("image") && /* @__PURE__ */ H(Q, {
+					placement: "auto-left",
+					menuWidth: 300,
+					trigger: /* @__PURE__ */ H(bt, {
+						icon: O,
+						ariaLabel: "이미지"
+					}),
+					children: (t) => /* @__PURE__ */ H(Et, {
+						editor: e,
+						close: t
+					})
+				}, "image"),
+				a("hr") && /* @__PURE__ */ H($, {
+					icon: M,
+					label: "구분선",
+					onClick: () => s((e) => e.setHorizontalRule())
+				}, "hr")
+			]
+		].map((e) => e.filter(Boolean)).filter((e) => e.length).map((e, t) => /* @__PURE__ */ U(o, { children: [t > 0 && /* @__PURE__ */ H(xt, {}), e] }, t))
+	});
+}
+//#endregion
+//#region src/components/SegmentControl.tsx
+var kt = {
+	3: "gap-spacing-3",
+	4: "gap-spacing-4",
+	5: "gap-spacing-5",
+	6: "gap-spacing-6",
+	7: "gap-spacing-7"
+};
+function At({ children: e, size: t = "32", selected: n = !1, disabled: r = !1, leftIcon: i = null, rightIcon: a = null, icon: o = null, onClick: s, className: c = "", ...l }) {
+	let u = !!o, d = t === "24" ? 14 : 16, f;
+	f = u ? t === "24" ? "min-h-[24px] min-w-[24px] p-spacing-2" : "min-h-[32px] min-w-[32px] px-spacing-5 py-spacing-3" : t === "24" ? "min-h-[24px] min-w-[24px] px-spacing-5 py-spacing-2 text-12" : "min-h-[32px] min-w-[32px] px-spacing-6 py-spacing-3 text-14";
+	let p;
+	return p = r ? "bg-transparent text-font-icon-2 cursor-not-allowed" : n ? "bg-button-ghost-hover-bg text-font-icon-5 cursor-pointer" : "bg-transparent text-font-icon-3 cursor-pointer hover:bg-button-ghost-hover-bg hover:text-font-icon-5 active:bg-transparent focus-visible:bg-button-ghost-hover-bg focus-visible:text-font-icon-5", /* @__PURE__ */ H("button", {
+		type: "button",
+		role: "tab",
+		"aria-selected": n,
+		className: `inline-flex items-center justify-center relative font-pretendard font-normal whitespace-nowrap rounded-round-4 transition-colors select-none focus:outline-none ${f} ${p} ${c}`,
+		disabled: r,
+		onClick: r ? void 0 : s,
+		...l,
+		children: /* @__PURE__ */ H("span", {
+			className: "inline-flex items-center gap-spacing-3",
+			children: u ? /* @__PURE__ */ H(o, {
+				size: d,
+				strokeWidth: 1.8
+			}) : /* @__PURE__ */ U(V, { children: [
+				i && /* @__PURE__ */ H(i, {
+					size: d,
+					strokeWidth: 1.8,
+					className: "shrink-0"
+				}),
+				e,
+				a && /* @__PURE__ */ H(a, {
+					size: d,
+					strokeWidth: 1.8,
+					className: "shrink-0"
+				})
+			] })
+		})
+	});
+}
+function jt({ items: e = [], value: t, defaultValue: n, onChange: r, size: i = "32", gap: a = "5", disabled: o = !1, className: s = "", ...c }) {
+	let l = t !== void 0, [u, d] = _(n), f = l ? t : u, p = (e) => {
+		l || d(e), r?.(e);
+	};
+	return /* @__PURE__ */ H("div", {
+		role: "tablist",
+		className: `inline-flex items-center ${kt[a] ?? kt[5]} ${s}`,
+		...c,
+		children: e.map((e) => /* @__PURE__ */ H(At, {
+			size: i,
+			selected: f === e.value,
+			disabled: o || e.disabled,
+			leftIcon: e.leftIcon,
+			rightIcon: e.rightIcon,
+			icon: e.icon,
+			"aria-label": e.ariaLabel,
+			onClick: () => p(e.value),
+			children: e.label
+		}, e.value))
+	});
+}
+//#endregion
+//#region src/components/MergeFieldNode.ts
+var Mt = "inline-flex items-center gap-spacing-3 rounded-round-4 border border-chip-blue-default-line bg-chip-blue-default-bg pl-spacing-4 pr-spacing-3 py-spacing-1 align-middle font-pretendard text-12 text-chip-blue-default-text transition-colors hover:border-chip-blue-hover-line hover:bg-chip-blue-hover-bg", Nt = "<svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M18 6 6 18\"/><path d=\"m6 6 12 12\"/></svg>", Pt = q.create({
+	name: "mergeField",
+	group: "inline",
+	inline: !0,
+	atom: !0,
+	selectable: !0,
+	addAttributes() {
+		return { value: {
+			default: "",
+			parseHTML: (e) => e.getAttribute("data-merge-field") || e.textContent || "",
+			renderHTML: (e) => ({ "data-merge-field": e.value })
+		} };
+	},
+	parseHTML() {
+		return [{ tag: "span[data-merge-field]" }];
+	},
+	renderHTML({ HTMLAttributes: e, node: t }) {
+		return [
+			"span",
+			fe(e),
+			t.attrs.value
+		];
+	},
+	addNodeView() {
+		return ({ node: e, editor: t, getPos: n }) => {
+			let r = document.createElement("span");
+			r.className = Mt, r.contentEditable = "false";
+			let i = document.createElement("span");
+			i.className = "whitespace-nowrap", i.textContent = e.attrs.value, r.appendChild(i);
+			let a = document.createElement("button");
+			return a.type = "button", a.className = "flex shrink-0 items-center justify-center", a.setAttribute("aria-label", "머지필드 삭제"), a.innerHTML = Nt, a.addEventListener("mousedown", (e) => e.preventDefault()), a.addEventListener("click", (r) => {
+				if (r.preventDefault(), r.stopPropagation(), typeof n != "function") return;
+				let i = n();
+				i != null && t.chain().focus().deleteRange({
+					from: i,
+					to: i + e.nodeSize
+				}).run();
+			}), r.appendChild(a), { dom: r };
+		};
+	}
+}), Ft = [
+	{
+		value: "edit",
+		label: "편집"
+	},
+	{
+		value: "source",
+		label: "HTML"
+	},
+	{
+		value: "preview",
+		label: "미리보기"
+	}
+];
+function It() {
+	return [
+		ae.configure({ link: {
+			openOnClick: !1,
+			HTMLAttributes: { rel: "noopener noreferrer nofollow" }
+		} }),
+		oe,
+		W,
+		G.configure({ multicolor: !0 }),
+		se.configure({ types: ["heading", "paragraph"] }),
+		ce,
+		le.configure({ resizable: !1 }),
+		K,
+		de,
+		ue,
+		Pt
+	];
+}
+function Lt({ mode: e, onChange: t, readOnly: n, showSource: r }) {
+	let i = n ? Ft.filter((e) => e.value !== "edit") : Ft;
+	return r || (i = i.filter((e) => e.value !== "source")), /* @__PURE__ */ H(jt, {
+		size: "24",
+		gap: "4",
+		value: e,
+		onChange: (e) => t?.(e),
+		items: i
+	});
+}
+function Rt({ value: e, defaultValue: t = "", onChange: n, mode: r, onModeChange: i, toolbar: a, mergeFields: o = [], readOnly: s = !1, showSource: c = !0, placeholder: l = "내용을 입력하세요.", minHeight: u = 240, maxHeight: f, width: m = "fill", allowSourceEdit: v = !0, className: y = "", ...b }) {
+	let x = e !== void 0, S = r !== void 0, [C, w] = _(() => s ? "preview" : "edit"), T = S ? r : C, [, E] = h((e) => e + 1, 0), [D, O] = _(""), k = g(null), A = g(n);
+	d(() => {
+		A.current = n;
+	}, [n]);
+	let j = ie({
+		editable: !s,
+		content: x ? e : t,
+		extensions: It(),
+		immediatelyRender: !1,
+		shouldRerenderOnTransaction: !0
+	});
+	d(() => {
+		if (!j) return;
+		let e = () => A.current?.(j.getHTML());
+		return j.on("update", e), () => {
+			j.off("update", e);
+		};
+	}, [j]), d(() => {
+		j?.setEditable(!s);
+	}, [j, s]), d(() => {
+		s && !S && C === "edit" && w("preview");
+	}, [
+		s,
+		S,
+		C
+	]), d(() => {
+		!c && !S && C === "source" && w("edit");
+	}, [
+		c,
+		S,
+		C
+	]), p(() => {
+		!j || !x || e !== j.getHTML() && (j.commands.setContent(e, { emitUpdate: !1 }), T === "source" && O((t) => t === e ? t : e), E());
+	}, [
+		j,
+		e,
+		x,
+		T
+	]);
+	let M = (e) => {
+		e !== T && (j && (T === "source" && (j.commands.setContent(D, { emitUpdate: !1 }), A.current?.(j.getHTML())), e === "source" && O(j.getHTML())), S || w(e), i?.(e));
+	}, N = (e) => {
+		let t = e.target.value;
+		O(t), A.current?.(t);
+	};
+	p(() => {
+		if (T !== "source") return;
+		let e = k.current;
+		e && (e.style.height = "auto", e.style.height = `${e.scrollHeight}px`);
+	}, [T, D]);
+	let P = v && !s, F = T === "preview" && j ? j.getHTML() : "", I = typeof u == "number" ? `${u}px` : u, ee = m === "fill" ? "100%" : typeof m == "number" ? `${m}px` : m, te = (e) => f == null ? e : /* @__PURE__ */ H(Ae, {
+		maxHeight: f,
+		children: e
+	}), L;
+	return T === "source" ? (L = /* @__PURE__ */ H("textarea", {
+		ref: k,
+		value: D,
+		onChange: N,
+		readOnly: !P,
+		spellCheck: !1,
+		className: "block w-full resize-none overflow-hidden bg-editor-source-bg px-spacing-7 py-spacing-6 font-mono text-13 text-editor-source-text outline-none",
+		style: { minHeight: I }
+	}), L = f == null ? L : /* @__PURE__ */ H(Ae, {
+		maxHeight: f,
+		variant: "light",
+		children: L
+	})) : L = te(T === "preview" ? /* @__PURE__ */ H("div", {
+		className: "tiptap-prose px-spacing-7 py-spacing-6",
+		style: { minHeight: I },
+		dangerouslySetInnerHTML: { __html: F }
+	}) : /* @__PURE__ */ U("div", {
+		className: "relative tiptap-prose cursor-text px-spacing-7 py-spacing-6",
+		style: { minHeight: I },
+		onMouseDown: (e) => {
+			j && !e.target.closest(".tiptap") && (e.preventDefault(), j.commands.focus("end"));
+		},
+		children: [j?.isEmpty && /* @__PURE__ */ H("p", {
+			className: "pointer-events-none absolute left-spacing-7 top-spacing-6 text-14 leading-30 text-editor-placeholder",
+			children: l
+		}), /* @__PURE__ */ H(re, { editor: j })]
+	})), /* @__PURE__ */ U("div", {
+		className: `overflow-hidden rounded-round-4 border border-editor-outline bg-white ${y}`,
+		style: { width: ee },
+		...b,
+		children: [/* @__PURE__ */ H("div", {
+			className: "border-b border-editor-divider bg-editor-toolbar-bg",
+			children: /* @__PURE__ */ U("div", {
+				className: "flex items-center justify-between gap-spacing-5 px-spacing-5 py-spacing-3",
+				children: [T === "edit" && !s ? /* @__PURE__ */ H(Ot, {
+					editor: j,
+					toolbar: a,
+					mergeFields: o
+				}) : /* @__PURE__ */ H("span", {
+					className: "text-12 text-font-icon-5",
+					children: T === "source" ? "HTML 소스" : T === "preview" ? "미리보기" : ""
+				}), /* @__PURE__ */ H("div", {
+					className: "shrink-0",
+					children: /* @__PURE__ */ H(Lt, {
+						mode: T,
+						onChange: M,
+						readOnly: s,
+						showSource: c
+					})
+				})]
+			})
+		}), L]
+	});
+}
+//#endregion
+export { Pe as A, Ue as C, He as D, Be as E, J as F, xe as I, be as L, je as M, Ae as N, Le as O, Y as P, ye as R, Je as S, Ve as T, nt as _, Ot as a, Qe as b, pt as c, lt as d, st as f, Z as g, it as h, jt as i, Me as j, Re as k, mt as l, at as m, Pt as n, Q as o, ct as p, At as r, vt as s, Rt as t, ut as u, et as v, ze as w, Xe as x, tt as y, ge as z };
+
+//# sourceMappingURL=Editor-wECQz1CV.js.map