legal-doc-editor 0.3.0 → 0.4.0

package/README.md

@@ -10,6 +10,7 @@
   - 저장은 `.docx`와 `.hwpx`예요. `.hwpx`는 한글 2014 이상에서 열리고, 한글에서 `.hwp`로 다시 저장할 수 있어요
   - 파일 변환 라이브러리는 필요할 때만 불러와서 에디터 본체 번들은 가벼워요
 - **판례·법령 인용 링크**: 본문의 `민법 제750조`, `대법원 2016. 4. 28. 선고 2015다12345 판결`, `2024가단157033` 같은 인용을 알아보고 [국가법령정보센터](https://www.law.go.kr) 링크를 붙여요 (API 키가 필요 없어요)
+- **조항 라이브러리**: 비밀유지·계약해지·관할법원 같은 자주 쓰는 조항을 골라 커서 위치에 넣어요. 조 번호는 알아서 다시 매겨져요
 - **문서 템플릿**: 소장(대여금)·고소장(사기)·내용증명·지급명령 신청서를 `{{변수}}` 빈칸이 들어간 상태로 바로 시작해요
 - **금액 표기**: 선택한 숫자를 `금 37,200,000원`이나 `금 삼천칠백이십만 원정(₩37,200,000)`으로 바꿔요
 - **인쇄·PDF**: 비어 있는 변수는 손으로 쓰는 밑줄 칸으로 인쇄돼요
@@ -67,6 +68,20 @@ export default function Page() {
 
 날짜(`2026. 9. 2.`), 전화번호, 계좌번호는 인용으로 보지 않아요. 다만 인용 인식은 글자 모양만 보는 것이라 놓치거나 잘못 잡을 수 있고, 링크가 가리키는 조문이 실제로 맞는지는 직접 확인해 주세요.
 
+### 조항 라이브러리
+
+`clauses`를 넘기면 오른쪽 패널에 조항 목록이 생겨요. 검색칸에서 제목이나 분류로 찾고, 누르면 커서 위치에 조항이 들어가요. 조항 안의 `{{변수}}`는 입력칸에 바로 나타나고 뒤쪽 조 번호는 알아서 밀려요.
+
+```tsx
+import { LegalEditor, clauses } from 'legal-doc-editor'
+
+<LegalEditor clauses={clauses} />
+// 내 조항 더하기
+<LegalEditor clauses={[...clauses, { id: 'my-sla', title: '서비스 수준', category: '의무', html: '<h2>(서비스 수준)</h2><p>…</p>' }]} />
+```
+
+기본 조항: 목적, 계약기간(자동 연장), 비밀유지, 손해배상, 계약의 해제·해지, 불가항력, 권리·의무의 양도 금지, 통지, 분쟁 해결(관할법원), 완전합의 및 계약의 변경, 계약의 해석. 일반적인 경우를 위한 예시 문장이니 계약에 맞게 고쳐 쓰세요.
+
 ### 판례 검색
 
 `searchCases`에 검색 함수를 넘기면 오른쪽 패널에 **판례 검색** 칸이 생겨요. 결과를 누르면 커서 위치에 `대법원 2016. 4. 28. 선고 2015다12345 판결` 같은 인용 문구가 들어가고, 인용 링크도 자동으로 붙어요.
@@ -108,7 +123,8 @@ export default function Page() {
 
 | 이름 | 설명 |
 | --- | --- |
-| `<LegalEditor content values onChange onValuesChange editable autoFees searchCases />` | 에디터 컴포넌트 |
+| `<LegalEditor content values onChange onValuesChange editable autoFees searchCases clauses />` | 에디터 컴포넌트 |
+| `clauses` | 기본 조항 목록 `{ id, title, category, html }[]` |
 | `formatCaseCitation(result)` | 판례 검색 결과 → `대법원 2016. 4. 28. 선고 2015다12345 판결` |
 | `calcStampFee(소가, { electronic })` | 소장 인지액(원) |
 | `calcPaymentOrderStampFee(청구금액)` | 지급명령 신청서 인지대(원) — 종이 신청 기준 |

package/dist/LegalEditor.d.ts

@@ -1,5 +1,6 @@
 import { type Values } from './variable';
 import { type CaseResult } from './citation';
+import type { Clause } from './clauses';
 import { type CourtFeeOptions } from './fees';
 import './legal.css';
 export interface LegalEditorProps {
@@ -14,5 +15,7 @@ export interface LegalEditorProps {
     autoFees?: boolean | CourtFeeOptions;
     /** 판례 검색 함수. 넘기면 오른쪽에 판례 검색 칸이 생기고, 결과를 누르면 인용 문구가 커서 위치에 들어감 */
     searchCases?: (query: string) => Promise<CaseResult[]>;
+    /** 조항 목록. 넘기면 오른쪽에 조항 라이브러리가 생기고, 누르면 커서 위치에 조항이 들어감 (기본 제공 목록: `clauses`) */
+    clauses?: Clause[];
 }
-export declare function LegalEditor({ content, values: initial, onChange, onValuesChange, editable, autoFees, searchCases }: LegalEditorProps): import("react").JSX.Element;
+export declare function LegalEditor({ content, values: initial, onChange, onValuesChange, editable, autoFees, searchCases, clauses }: LegalEditorProps): import("react").JSX.Element;

package/dist/clauses.d.ts

@@ -0,0 +1,8 @@
+export interface Clause {
+    id: string;
+    title: string;
+    category: string;
+    /** 조 하나: h2(조 제목) + 본문(p) 또는 항(ol) · 호(중첩 ol). 조 번호는 자동으로 매겨지므로 적지 않는다 */
+    html: string;
+}
+export declare const clauses: Clause[];

package/dist/index.d.ts

@@ -8,6 +8,8 @@ export { calcStampFee, calcPaymentOrderStampFee, calcServiceFee, withCourtFees,
 export type { CourtFeeOptions, Procedure } from './fees';
 export { toKoreanAmount, formatAmount, parseAmount } from './amount';
 export { templates } from './templates';
+export { clauses } from './clauses';
+export type { Clause } from './clauses';
 export type { Template } from './templates';
 export type { Values } from './variable';
 export { toDocx, toHwpx, toPlainHtml, fromDocx, fromHwp, fromFile, normalizeLegalHtml } from './io';

package/dist/index.js

@@ -7,7 +7,7 @@ import { Plugin as u, PluginKey as d } from "@tiptap/pm/state";
 import { Decoration as f, DecorationSet as p } from "@tiptap/pm/view";
 import { jsx as m, jsxs as h } from "react/jsx-runtime";
 //#region src/variable.ts
-var ee = s.create({
+var g = s.create({
 	name: "variable",
 	group: "inline",
 	inline: !0,
@@ -61,9 +61,9 @@ var ee = s.create({
 			getAttributes: (e) => ({ name: e[0].slice(2, -2).trim() })
 		})];
 	}
-}), g = (e) => e.replace(/\{\{([^{}<>"]+)\}\}/g, (e, t) => `<span data-var="${t.trim().replace(/&/g, "&amp;")}"></span>`);
-function _(e, t) {
-	let n = new DOMParser().parseFromString(g(e), "text/html");
+}), _ = (e) => e.replace(/\{\{([^{}<>"]+)\}\}/g, (e, t) => `<span data-var="${t.trim().replace(/&/g, "&amp;")}"></span>`);
+function v(e, t) {
+	let n = new DOMParser().parseFromString(_(e), "text/html");
 	return n.querySelectorAll("span[data-var]").forEach((e) => {
 		let n = e.getAttribute("data-var");
 		e.replaceWith(t[n] || `[${n}]`);
@@ -71,7 +71,7 @@ function _(e, t) {
 }
 //#endregion
 //#region src/numbering.ts
-var v = 4, y = o.create({
+var y = 4, b = o.create({
 	name: "numbering",
 	priority: 1e3,
 	addGlobalAttributes() {
@@ -81,7 +81,7 @@ var v = 4, y = o.create({
 				default: null,
 				parseHTML: (e) => {
 					let t = Number(e.getAttribute("data-num"));
-					return t >= 1 && t <= v ? t : null;
+					return t >= 1 && t <= y ? t : null;
 				},
 				renderHTML: (e) => e.num ? { "data-num": e.num } : {}
 			} }
@@ -93,7 +93,7 @@ var v = 4, y = o.create({
 	addKeyboardShortcuts() {
 		let e = () => this.editor.getAttributes("paragraph").num, t = (t) => () => {
 			let n = e();
-			return !!n && this.editor.commands.setNumbering(Math.min(v, Math.max(1, n + t)));
+			return !!n && this.editor.commands.setNumbering(Math.min(y, Math.max(1, n + t)));
 		};
 		return {
 			Tab: t(1),
@@ -105,7 +105,7 @@ var v = 4, y = o.create({
 			Enter: () => !!e() && this.editor.state.selection.$from.parent.content.size === 0 && this.editor.commands.setNumbering(null)
 		};
 	}
-}), b = String.raw`(?<!\d)\d{4}(?![만억천년월일원])[가-힣]{1,3}\d{1,6}(?!\d)`, x = String.raw`(?:[가-힣]{0,6}법원(?:\s*[가-힣]{2,6}지원)?|헌법재판소)`, S = String.raw`\d{4}\.\s*\d{1,2}\.\s*\d{1,2}\.`, C = String.raw`${x}\s*${S}\s*(?:선고|자)\s*(?<caseNo>${b})(?:\s*[,·]\s*${b})*\s*(?:전원합의체\s*)?(?:판결|결정|명령)`, w = String.raw`(?:[가-힣]+(?<![은는이가을를와과로며고여하한된])\s+){0,4}[가-힣]+에\s*관한\s*[가-힣]*법률?|[가-힣]+법률?`, T = String.raw`(?<lawName>${w})\s*제\s*(?<jo>\d+)\s*조(?:\s*의\s*(?<ui>\d+))?(?:\s*제\s*\d+\s*(?:항|호))*`, E = new RegExp(String.raw`${C}|${T}|(?<bare>${b})`, "g"), D = /^[방불합위적탈편문어용수요기비사입공]법$/, O = (...e) => `https://www.law.go.kr/${e.map(encodeURIComponent).join("/")}`;
+}), x = String.raw`(?<!\d)\d{4}(?![만억천년월일원])[가-힣]{1,3}\d{1,6}(?!\d)`, S = String.raw`(?:[가-힣]{0,6}법원(?:\s*[가-힣]{2,6}지원)?|헌법재판소)`, C = String.raw`\d{4}\.\s*\d{1,2}\.\s*\d{1,2}\.`, ee = String.raw`${S}\s*${C}\s*(?:선고|자)\s*(?<caseNo>${x})(?:\s*[,·]\s*${x})*\s*(?:전원합의체\s*)?(?:판결|결정|명령)`, w = String.raw`(?:[가-힣]+(?<![은는이가을를와과로며고여하한된])\s+){0,4}[가-힣]+에\s*관한\s*[가-힣]*법률?|[가-힣]+법률?`, T = String.raw`(?<lawName>${w})\s*제\s*(?<jo>\d+)\s*조(?:\s*의\s*(?<ui>\d+))?(?:\s*제\s*\d+\s*(?:항|호))*`, E = new RegExp(String.raw`${ee}|${T}|(?<bare>${x})`, "g"), D = /^[방불합위적탈편문어용수요기비사입공]법$/, O = (...e) => `https://www.law.go.kr/${e.map(encodeURIComponent).join("/")}`;
 function k(e) {
 	let t = [];
 	for (let n of e.matchAll(E)) {
@@ -138,7 +138,7 @@ var j = new d("citation"), M = (e) => {
 			rel: "noopener noreferrer"
 		}));
 	}), p.create(e, t);
-}, te = o.create({
+}, N = o.create({
 	name: "citationLink",
 	addProseMirrorPlugins() {
 		return [new u({
@@ -159,21 +159,21 @@ var j = new d("citation"), M = (e) => {
 });
 //#endregion
 //#region src/fees.ts
-function N(e, t = {}) {
+function P(e, t = {}) {
 	if (!(e > 0)) return 0;
-	let n = P(e);
+	let n = F(e);
 	return t.electronic ? n < 1e7 ? 900 : Math.floor(n * 9 / 1e7) * 100 : n < 1e7 ? 1e3 : Math.floor(n / 1e6) * 100;
 }
-function P(e) {
+function F(e) {
 	let [t, n] = e < 1e7 ? [50, 0] : e < 1e8 ? [45, 5e3] : e < 1e9 ? [40, 55e3] : [35, 555e3];
 	return e * t + n * 1e4;
 }
-function F(e) {
+function I(e) {
 	if (!(e > 0)) return 0;
-	let t = P(e);
+	let t = F(e);
 	return t < 1e8 ? 1e3 : Math.floor(t / 1e7) * 100;
 }
-var I = {
+var L = {
 	소액: 10,
 	단독: 15,
 	합의: 15,
@@ -181,23 +181,23 @@ var I = {
 	상고: 8,
 	조정: 5,
 	독촉: 6
-}, L = 5500;
-function R({ parties: e, procedure: t, unitFee: n = L }) {
-	return e * I[t] * n;
+}, R = 5500;
+function z({ parties: e, procedure: t, unitFee: n = R }) {
+	return e * L[t] * n;
 }
-var ne = 3e7, re = (e) => `${e.toLocaleString("ko-KR")}원`, ie = (e = "") => Number(e.replace(/[^\d]/g, "")) || 0;
-function ae(e, t, n = {}) {
-	let r = (n) => ie(t[e.find((e) => n.test(e)) ?? ""]), i = { ...t }, a = (n, r) => {
-		for (let a of e) n.test(a) && !t[a]?.trim() && (i[a] = re(r));
+var te = 3e7, B = (e) => `${e.toLocaleString("ko-KR")}원`, ne = (e = "") => Number(e.replace(/[^\d]/g, "")) || 0;
+function re(e, t, n = {}) {
+	let r = (n) => ne(t[e.find((e) => n.test(e)) ?? ""]), i = { ...t }, a = (n, r) => {
+		for (let a of e) n.test(a) && !t[a]?.trim() && (i[a] = B(r));
 	}, o = n.parties ?? 2, s = r(/^(소가|소송목적의\s*값)/);
-	s && (a(/^인지(액|대)/, N(s, n)), a(/^송달료/, R({
+	s && (a(/^인지(액|대)/, P(s, n)), a(/^송달료/, z({
 		parties: o,
 		procedure: s <= 3e7 ? "소액" : "단독",
 		unitFee: n.unitFee
 	})));
 	let c = r(/^청구금액/);
 	if (c && e.some((e) => /^독촉절차/.test(e))) {
-		let e = /^독촉절차\s*인지(액|대)/, t = /^독촉절차\s*송달료/, i = F(c), s = R({
+		let e = /^독촉절차\s*인지(액|대)/, t = /^독촉절차\s*송달료/, i = I(c), s = z({
 			parties: o,
 			procedure: "독촉",
 			unitFee: n.unitFee
@@ -208,50 +208,50 @@ function ae(e, t, n = {}) {
 }
 //#endregion
 //#region src/amount.ts
-var oe = "영일이삼사오육칠팔구", se = [
+var ie = "영일이삼사오육칠팔구", ae = [
 	"천",
 	"백",
 	"십",
 	""
-], ce = [
+], oe = [
 	"",
 	"만",
 	"억",
 	"조",
 	"경"
 ];
-function z(e) {
+function V(e) {
 	if (!Number.isSafeInteger(e)) throw RangeError(`금액은 정수여야 해요: ${e}`);
 	if (e === 0) return "영";
-	if (e < 0) return `마이너스 ${z(-e)}`;
+	if (e < 0) return `마이너스 ${V(-e)}`;
 	let t = "", n = String(e).padStart(Math.ceil(String(e).length / 4) * 4, "0");
 	for (let e = 0; e < n.length / 4; e++) {
 		let r = n.slice(e * 4, e * 4 + 4);
 		if (r !== "0000") {
-			for (let e = 0; e < 4; e++) r[e] !== "0" && (t += oe[+r[e]] + se[e]);
-			t += ce[n.length / 4 - 1 - e];
+			for (let e = 0; e < 4; e++) r[e] !== "0" && (t += ie[+r[e]] + ae[e]);
+			t += oe[n.length / 4 - 1 - e];
 		}
 	}
 	return t;
 }
-var B = (e) => Number(e.replace(/[^\d]/g, "")) || 0;
-function V(e, t = "소장") {
+var H = (e) => Number(e.replace(/[^\d]/g, "")) || 0;
+function U(e, t = "소장") {
 	let n = e.toLocaleString("ko-KR");
-	return t === "소장" ? `금 ${n}원` : `금 ${z(e)} 원정(₩${n})`;
+	return t === "소장" ? `금 ${n}원` : `금 ${V(e)} 원정(₩${n})`;
 }
 //#endregion
 //#region src/io.ts
-var le = (e) => e < 20 ? String.fromCharCode(9312 + e) : `${e + 1}.`, H = "가나다라마바사아자차카타파하", U = (e) => {
+var se = (e) => e < 20 ? String.fromCharCode(9312 + e) : `${e + 1}.`, W = "가나다라마바사아자차카타파하", G = (e) => {
 	let t = "";
-	for (; e > 0; e = Math.floor(e / 14)) t = H[--e % 14] + t;
+	for (; e > 0; e = Math.floor(e / 14)) t = W[--e % 14] + t;
 	return t;
-}, ue = (e, t) => [
+}, ce = (e, t) => [
 	`${t}.`,
-	`${U(t)}.`,
+	`${G(t)}.`,
 	`(${t})`,
-	`(${U(t)})`
+	`(${G(t)})`
 ][e - 1];
-function W(e, t) {
+function K(e, t) {
 	let n = [], r = 0, i = (e = []) => e.map((e) => {
 		if (e.type === "hardBreak") return {
 			text: "",
@@ -271,7 +271,7 @@ function W(e, t) {
 		bold: !0
 	})), o = (e, t) => e.content?.forEach((r, a) => r.content?.forEach((r, s) => {
 		if (r.type === "orderedList" || r.type === "bulletList") return o(r, t + 1);
-		let c = a + (e.attrs?.start ?? 1), l = s > 0 ? "" : e.type === "bulletList" ? "•" : t === 0 ? le(c - 1) : `${c}.`;
+		let c = a + (e.attrs?.start ?? 1), l = s > 0 ? "" : e.type === "bulletList" ? "•" : t === 0 ? se(c - 1) : `${c}.`;
 		n.push({
 			kind: "para",
 			label: l,
@@ -304,7 +304,7 @@ function W(e, t) {
 				runs: a(i(t.content))
 			}) : t.type === "orderedList" || t.type === "bulletList" ? o(t, 0) : l ? (s[l]++, s.fill(0, l + 1), n.push({
 				kind: "para",
-				label: ue(l, s[l]),
+				label: ce(l, s[l]),
 				depth: l,
 				runs: i(t.content)
 			})) : t.type === "paragraph" ? n.push({
@@ -327,26 +327,26 @@ function W(e, t) {
 	};
 	return c(e.content), n;
 }
-var de = (e) => e.replace(/[&<>"]/g, (e) => `&#${e.charCodeAt(0)};`), G = (e) => e.map((e) => {
+var le = (e) => e.replace(/[&<>"]/g, (e) => `&#${e.charCodeAt(0)};`), q = (e) => e.map((e) => {
 	if (e.br) return "<br>";
-	let t = de(e.text);
+	let t = le(e.text);
 	return e.bold && (t = `<b>${t}</b>`), e.italics && (t = `<i>${t}</i>`), e.underline && (t = `<u>${t}</u>`), e.strike && (t = `<s>${t}</s>`), t;
 }).join("");
-function K(e, t) {
-	return W(e, t).map((e) => {
+function ue(e, t) {
+	return K(e, t).map((e) => {
 		if (e.kind === "table") {
-			let t = (e) => `<td${e.colspan > 1 ? ` colspan="${e.colspan}"` : ""}${e.rowspan > 1 ? ` rowspan="${e.rowspan}"` : ""}>${G(e.runs)}</td>`;
+			let t = (e) => `<td${e.colspan > 1 ? ` colspan="${e.colspan}"` : ""}${e.rowspan > 1 ? ` rowspan="${e.rowspan}"` : ""}>${q(e.runs)}</td>`;
 			return `<table>${e.rows.map((e) => `<tr>${e.map(t).join("")}</tr>`).join("")}</table>`;
 		}
-		let t = (e.label ? e.kind === "article" ? `<b>${e.label}</b> ` : `${e.label} ` : "") + G(e.runs);
+		let t = (e.label ? e.kind === "article" ? `<b>${e.label}</b> ` : `${e.label} ` : "") + q(e.runs);
 		if (e.kind === "title") return `<h1>${t}</h1>`;
 		if (e.kind === "section") return `<h3>${t}</h3>`;
 		let n = e.label ? e.depth - 1 : e.depth;
 		return n > 0 ? `<p style="margin-left:${n * 2}em">${t}</p>` : `<p>${t}</p>`;
 	}).join("\n");
 }
-function q(e, t) {
-	for (let n of W(e, t)) if (n.kind === "title") return n.runs.map((e) => e.text).join("").trim() || "문서";
+function de(e, t) {
+	for (let n of K(e, t)) if (n.kind === "title") return n.runs.map((e) => e.text).join("").trim() || "문서";
 	return "문서";
 }
 async function fe(e, t) {
@@ -357,7 +357,7 @@ async function fe(e, t) {
 		italics: e.italics,
 		strike: e.strike,
 		underline: e.underline ? {} : void 0
-	}), p = W(e, t).map((e) => e.kind === "table" ? new s({
+	}), p = K(e, t).map((e) => e.kind === "table" ? new s({
 		width: {
 			size: 100,
 			type: d.PERCENTAGE
@@ -381,7 +381,7 @@ async function fe(e, t) {
 		})] : [], ...e.runs.map(f)]
 	}));
 	return a.toBlob(new r({
-		title: q(e, t),
+		title: de(e, t),
 		styles: {
 			default: { document: { run: {
 				font: "바탕",
@@ -407,14 +407,14 @@ async function fe(e, t) {
 	}));
 }
 async function pe(e, t) {
-	let { htmlToHwpx: n } = await import("hwp-convert"), r = await n(K(e, t), { title: q(e, t) });
+	let { htmlToHwpx: n } = await import("hwp-convert"), r = await n(ue(e, t), { title: de(e, t) });
 	return new Blob([r], { type: "application/hwp+zip" });
 }
 var J = /^\s*제\s*\d+\s*조(?:의\s*\d+)?\s*/, me = /^\s*[①-⑳]\s*/, Y = /^\s*(\d+)\.\s*/, he = /^(청구취지|청구원인|신청취지|신청이유|고소취지|고소이유|고발취지|고발이유|입증방법|증명방법|증거방법|증거서류|첨부서류|당사자관계|사건개요|고소인|피고소인|범죄사실|증거자료|관련사건의수사및재판여부|기타)$/, ge = (e) => e.length <= 20 && (/^[가-힣](\s+[가-힣]){3,7}$/.test(e) || he.test(e.replace(/\s/g, ""))), _e = /\[\s*([^[\]{}<>"\d=]{1,20}?)\s*\]/g, ve = [
 	[/^\s*(\d{1,2})\.(?!\d)\s*/, Number],
-	[/^\s*([가나다라마바사아자차카타파하])\.\s*/, (e) => H.indexOf(e) + 1],
+	[/^\s*([가나다라마바사아자차카타파하])\.\s*/, (e) => W.indexOf(e) + 1],
 	[/^\s*\((\d{1,2})\)\s*/, Number],
-	[/^\s*\(([가나다라마바사아자차카타파하])\)\s*/, (e) => H.indexOf(e) + 1]
+	[/^\s*\(([가나다라마바사아자차카타파하])\)\s*/, (e) => W.indexOf(e) + 1]
 ];
 function ye(e) {
 	for (let [t, [n, r]] of ve.entries()) {
@@ -516,8 +516,8 @@ function Ce(e, t) {
 	let n = document.createElement("a");
 	n.href = URL.createObjectURL(e), n.download = t, n.click(), setTimeout(() => URL.revokeObjectURL(n.href), 1e3);
 }
-function we({ content: o = "", values: s = {}, onChange: c, onValuesChange: l, editable: u = !0, autoFees: d, searchCases: f }) {
-	let [p, _] = t(s), [v, b] = t([]), [x, S] = t(""), [C, w] = t(null), [T, E] = t(""), D = d ? ae(v, p, d === !0 ? {} : d) : p, O = r({
+function we({ content: o = "", values: s = {}, onChange: c, onValuesChange: l, editable: u = !0, autoFees: d, searchCases: f, clauses: p }) {
+	let [v, y] = t(s), [x, S] = t([]), [C, ee] = t(""), [w, T] = t(null), [E, D] = t(""), [O, k] = t(""), j = d ? re(x, v, d === !0 ? {} : d) : v, M = r({
 		extensions: [
 			i.configure({ heading: { levels: [
 				1,
@@ -525,81 +525,81 @@ function we({ content: o = "", values: s = {}, onChange: c, onValuesChange: l, e
 				3
 			] } }),
 			a,
-			ee,
-			y,
-			te
+			g,
+			b,
+			N
 		],
-		content: g(o),
+		content: _(o),
 		editable: u,
 		immediatelyRender: !1,
 		editorProps: { attributes: { class: "legal-doc" } },
-		onCreate: ({ editor: e }) => b($(e)),
+		onCreate: ({ editor: e }) => S($(e)),
 		onUpdate: ({ editor: e }) => {
-			b($(e)), c?.(e.getHTML());
+			S($(e)), c?.(e.getHTML());
 		}
 	});
 	e(() => {
-		O && (O.storage.variable.values = D, O.storage.variable.views.forEach((e) => e()));
-	}, [O, D]);
-	let k = (e, t) => {
+		M && (M.storage.variable.values = j, M.storage.variable.views.forEach((e) => e()));
+	}, [M, j]);
+	let P = (e, t) => {
 		let n = {
-			...p,
+			...v,
 			[e]: t
 		};
-		_(n), l?.(n);
-	}, j = () => {
+		y(n), l?.(n);
+	}, F = () => {
 		let e = window.prompt("변수 이름 (예: 갑, 계약일)")?.replace(/[{}<>"]/g, "").trim();
-		e && O?.chain().focus().insertContent({
+		e && M?.chain().focus().insertContent({
 			type: "variable",
 			attrs: { name: e }
 		}).run();
-	}, M = async (e) => {
+	}, I = async (e) => {
 		let t = e.target.files?.[0];
-		if (e.target.value = "", t && O) try {
-			O.commands.setContent(g(await Q(t)), { emitUpdate: !0 });
+		if (e.target.value = "", t && M) try {
+			M.commands.setContent(_(await Q(t)), { emitUpdate: !0 });
 		} catch (e) {
 			window.alert(`파일을 열 수 없어요: ${e.message}`);
 		}
-	}, N = async (e, t) => {
-		let n = O.state.doc.firstChild?.textContent.trim() || "문서";
-		Ce(await e(O.getJSON(), D), `${n}.${t}`);
-	}, P = async () => {
-		let e = x.trim();
+	}, L = async (e, t) => {
+		let n = M.state.doc.firstChild?.textContent.trim() || "문서";
+		Ce(await e(M.getJSON(), j), `${n}.${t}`);
+	}, R = async () => {
+		let e = C.trim();
 		if (f && e) {
-			E("검색 중…");
+			D("검색 중…");
 			try {
-				w(await f(e)), E("");
+				T(await f(e)), D("");
 			} catch (e) {
-				w(null), E(`검색하지 못했어요: ${e.message}`);
+				T(null), D(`검색하지 못했어요: ${e.message}`);
 			}
 		}
-	}, F = () => O.chain().focus(), I = (e) => F().setNumbering(O.getAttributes("paragraph").num === e ? null : e).run(), L = (e) => {
-		let { from: t, to: n } = O.state.selection, r = B(O.state.doc.textBetween(t, n));
-		r && F().insertContentAt({
+	}, z = () => M.chain().focus(), te = (e) => z().setNumbering(M.getAttributes("paragraph").num === e ? null : e).run(), B = (e) => {
+		let { from: t, to: n } = M.state.selection, r = H(M.state.doc.textBetween(t, n));
+		r && z().insertContentAt({
 			from: t,
 			to: n
-		}, V(r, e)).run();
+		}, U(r, e)).run();
 	};
 	return /* @__PURE__ */ h("div", {
 		className: "le-root",
 		children: [/* @__PURE__ */ h("div", {
 			className: "le-main",
-			children: [u && O && /* @__PURE__ */ h("div", {
+			children: [u && M && /* @__PURE__ */ h("div", {
 				className: "le-toolbar",
 				children: [
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => F().toggleHeading({ level: 1 }).run(),
+						onClick: () => z().toggleHeading({ level: 1 }).run(),
 						children: "제목"
 					}),
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => F().toggleHeading({ level: 3 }).run(),
+						onClick: () => z().toggleHeading({ level: 3 }).run(),
 						children: "소제목"
 					}),
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => F().toggleHeading({ level: 2 }).run(),
+						onClick: () => z().toggleHeading({ level: 2 }).run(),
 						children: "조"
 					}),
 					[
@@ -610,37 +610,37 @@ function we({ content: o = "", values: s = {}, onChange: c, onValuesChange: l, e
 					].map((e, t) => /* @__PURE__ */ m("button", {
 						type: "button",
 						title: "번호 문단 — Tab·Shift+Tab 단계 변경, 맨 앞 Backspace 해제",
-						onClick: () => I(t + 1),
+						onClick: () => te(t + 1),
 						children: e
 					}, e)),
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => F().toggleOrderedList().run(),
+						onClick: () => z().toggleOrderedList().run(),
 						children: "항"
 					}),
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => F().sinkListItem("listItem").run(),
+						onClick: () => z().sinkListItem("listItem").run(),
 						children: "호 →"
 					}),
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => F().liftListItem("listItem").run(),
+						onClick: () => z().liftListItem("listItem").run(),
 						children: "← 내어쓰기"
 					}),
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => F().toggleBold().run(),
+						onClick: () => z().toggleBold().run(),
 						children: /* @__PURE__ */ m("b", { children: "B" })
 					}),
 					/* @__PURE__ */ h("button", {
 						type: "button",
-						onClick: j,
+						onClick: F,
 						children: ["{{ }}", " 변수"]
 					}),
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => F().insertTable({
+						onClick: () => z().insertTable({
 							rows: 3,
 							cols: 3,
 							withHeaderRow: !1
@@ -650,13 +650,13 @@ function we({ content: o = "", values: s = {}, onChange: c, onValuesChange: l, e
 					/* @__PURE__ */ m("button", {
 						type: "button",
 						title: "선택한 금액 → 금 37,200,000원",
-						onClick: () => L("소장"),
+						onClick: () => B("소장"),
 						children: "금액"
 					}),
 					/* @__PURE__ */ m("button", {
 						type: "button",
 						title: "선택한 금액 → 금 삼천칠백이십만 원정(₩37,200,000)",
-						onClick: () => L("계약서"),
+						onClick: () => B("계약서"),
 						children: "금액(한글)"
 					}),
 					/* @__PURE__ */ m("span", { className: "le-spacer" }),
@@ -666,17 +666,17 @@ function we({ content: o = "", values: s = {}, onChange: c, onValuesChange: l, e
 							type: "file",
 							accept: ".docx,.hwp,.hwpx",
 							hidden: !0,
-							onChange: M
+							onChange: I
 						})]
 					}),
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => N(fe, "docx"),
+						onClick: () => L(fe, "docx"),
 						children: "Word 저장"
 					}),
 					/* @__PURE__ */ m("button", {
 						type: "button",
-						onClick: () => N(pe, "hwpx"),
+						onClick: () => L(pe, "hwpx"),
 						children: "한글 저장"
 					}),
 					/* @__PURE__ */ m("button", {
@@ -685,12 +685,12 @@ function we({ content: o = "", values: s = {}, onChange: c, onValuesChange: l, e
 						children: "인쇄 · PDF"
 					})
 				]
-			}), /* @__PURE__ */ m(n, { editor: O })]
+			}), /* @__PURE__ */ m(n, { editor: M })]
 		}), /* @__PURE__ */ h("aside", {
 			className: "le-panel",
 			children: [
 				/* @__PURE__ */ m("h3", { children: "입력값" }),
-				v.length === 0 && /* @__PURE__ */ h("p", {
+				x.length === 0 && /* @__PURE__ */ h("p", {
 					className: "le-hint",
 					children: [
 						"본문에 ",
@@ -698,11 +698,32 @@ function we({ content: o = "", values: s = {}, onChange: c, onValuesChange: l, e
 						"처럼 입력하면 변수가 생겨요."
 					]
 				}),
-				v.map((e) => /* @__PURE__ */ h("label", { children: [e, /* @__PURE__ */ m("input", {
-					value: p[e] ?? "",
-					placeholder: p[e] ? void 0 : D[e],
-					onChange: (t) => k(e, t.target.value)
+				x.map((e) => /* @__PURE__ */ h("label", { children: [e, /* @__PURE__ */ m("input", {
+					value: v[e] ?? "",
+					placeholder: v[e] ? void 0 : j[e],
+					onChange: (t) => P(e, t.target.value)
 				})] }, e)),
+				p && /* @__PURE__ */ h("section", {
+					className: "le-clauses",
+					children: [
+						/* @__PURE__ */ m("h3", { children: "조항 라이브러리" }),
+						/* @__PURE__ */ m("input", {
+							value: O,
+							placeholder: "조항 찾기 (예: 해지)",
+							onChange: (e) => k(e.target.value)
+						}),
+						/* @__PURE__ */ m("ul", {
+							className: "le-clause-list",
+							children: p.filter((e) => `${e.category} ${e.title}`.includes(O.trim())).map((e) => /* @__PURE__ */ m("li", { children: /* @__PURE__ */ h("button", {
+								type: "button",
+								disabled: !u,
+								title: "커서 위치에 조항 넣기",
+								onClick: () => M?.chain().focus().insertContent(_(e.html), { parseOptions: { preserveWhitespace: !1 } }).run(),
+								children: [/* @__PURE__ */ m("small", { children: e.category }), e.title]
+							}) }, e.id))
+						})
+					]
+				}),
 				f && /* @__PURE__ */ h("section", {
 					className: "le-cases",
 					children: [
@@ -710,33 +731,33 @@ function we({ content: o = "", values: s = {}, onChange: c, onValuesChange: l, e
 						/* @__PURE__ */ h("div", {
 							className: "le-cases-bar",
 							children: [/* @__PURE__ */ m("input", {
-								value: x,
+								value: C,
 								placeholder: "사건명·사건번호·키워드",
-								onChange: (e) => S(e.target.value),
+								onChange: (e) => ee(e.target.value),
 								onKeyDown: (e) => {
-									e.key === "Enter" && !e.nativeEvent.isComposing && (e.preventDefault(), P());
+									e.key === "Enter" && !e.nativeEvent.isComposing && (e.preventDefault(), R());
 								}
 							}), /* @__PURE__ */ m("button", {
 								type: "button",
-								onClick: P,
+								onClick: R,
 								children: "검색"
 							})]
 						}),
-						T && /* @__PURE__ */ m("p", {
+						E && /* @__PURE__ */ m("p", {
 							className: "le-hint",
-							children: T
+							children: E
 						}),
-						!T && C?.length === 0 && /* @__PURE__ */ m("p", {
+						!E && w?.length === 0 && /* @__PURE__ */ m("p", {
 							className: "le-hint",
 							children: "결과가 없어요."
 						}),
 						/* @__PURE__ */ m("ul", {
 							className: "le-case-list",
-							children: C?.map((e) => /* @__PURE__ */ h("li", { children: [/* @__PURE__ */ h("button", {
+							children: w?.map((e) => /* @__PURE__ */ h("li", { children: [/* @__PURE__ */ h("button", {
 								type: "button",
 								disabled: !u,
 								title: "커서 위치에 인용 넣기",
-								onClick: () => O?.chain().focus().insertContent(A(e)).run(),
+								onClick: () => M?.chain().focus().insertContent(A(e)).run(),
 								children: [
 									/* @__PURE__ */ m("strong", { children: e.title }),
 									/* @__PURE__ */ m("span", { children: A(e) }),
@@ -782,6 +803,73 @@ var Te = [
 		description: "재판 없이 법원의 지급명령을 받는 독촉절차 신청서. 인지대는 소장의 10분의 1, 송달료는 당사자 수 × 6회분",
 		html: "\n<h1>지 급 명 령 신 청 서</h1>\n<p>채 권 자 {{채권자 이름}}</p>\n<p>주소 {{채권자 주소}}</p>\n<p>연락처 {{채권자 연락처}}</p>\n<p>채 무 자 {{채무자 이름}}</p>\n<p>주소 {{채무자 주소}}</p>\n<p>대여금 청구 독촉사건</p>\n<p>청구금액 {{청구금액}}</p>\n<h3>신 청 취 지</h3>\n<p>채무자는 채권자에게 아래 청구금액 및 독촉절차비용을 지급하라는 명령을 구합니다.</p>\n<p data-num=\"1\">{{청구금액}}</p>\n<p data-num=\"1\">위 금액에 대하여 {{변제기 다음 날}}부터 이 사건 지급명령정본을 송달받은 날까지는 연 5%의, 그 다음 날부터 다 갚는 날까지는 연 12%의 각 비율로 계산한 돈</p>\n<p data-num=\"1\">독촉절차비용 {{독촉절차비용}} (인지대 {{독촉절차 인지대}}, 송달료 {{독촉절차 송달료}})</p>\n<h3>신 청 이 유</h3>\n<p data-num=\"1\">채권자는 {{대여일}} 채무자에게 {{청구금액}}을 변제기 {{변제기}}로 정하여 빌려주었습니다.</p>\n<p data-num=\"1\">그러나 채무자는 변제기가 지났는데도 위 돈을 갚지 않고 있습니다.</p>\n<p data-num=\"1\">따라서 채권자는 채무자에게 위 청구금액과 지연손해금 및 독촉절차비용의 지급을 구하기 위하여 이 신청에 이르렀습니다.</p>\n<h3>첨 부 서 류</h3>\n<p data-num=\"1\">차용증 사본 1통</p>\n<p data-num=\"1\">송달료 납부서 1통</p>\n<p>{{작성일}}</p>\n<p>채권자 {{채권자 이름}} (서명 또는 날인)</p>\n<p>{{관할 법원}} 귀중</p>\n"
 	}
+], Ee = [
+	{
+		id: "purpose",
+		title: "목적",
+		category: "일반",
+		html: "<h2>(목적)</h2>\n<p>이 계약은 {{갑}}과 {{을}} 사이의 {{계약 대상}}에 관한 권리와 의무를 정하는 것을 목적으로 한다.</p>"
+	},
+	{
+		id: "term",
+		title: "계약기간",
+		category: "기간",
+		html: "<h2>(계약기간)</h2>\n<ol>\n  <li><p>이 계약의 기간은 {{시작일}}부터 {{종료일}}까지로 한다.</p></li>\n  <li><p>기간 만료 {{통지 기한}} 전까지 어느 당사자도 서면으로 종료 의사를 알리지 않으면, 이 계약은 같은 조건으로 {{연장 기간}} 연장된 것으로 본다.</p></li>\n</ol>"
+	},
+	{
+		id: "confidentiality",
+		title: "비밀유지",
+		category: "의무",
+		html: "<h2>(비밀유지)</h2>\n<ol>\n  <li><p>각 당사자는 이 계약과 관련하여 알게 된 상대방의 기술상·경영상 정보를 상대방의 사전 서면 동의 없이 제3자에게 공개하거나 이 계약의 목적 외에 사용하지 아니한다.</p></li>\n  <li><p>제1항의 의무는 이 계약이 끝난 뒤에도 {{비밀유지 기간}} 동안 유지된다.</p></li>\n</ol>"
+	},
+	{
+		id: "damages",
+		title: "손해배상",
+		category: "책임",
+		html: "<h2>(손해배상)</h2>\n<p>어느 당사자가 이 계약을 위반하여 상대방에게 손해를 입힌 경우 그 손해를 배상하여야 한다.</p>"
+	},
+	{
+		id: "termination",
+		title: "계약의 해제·해지",
+		category: "종료",
+		html: "<h2>(계약의 해제·해지)</h2>\n<ol>\n  <li><p>어느 당사자가 이 계약을 위반한 경우 상대방은 {{시정 기간}} 이상의 기간을 정하여 서면으로 시정을 요구하고, 그 기간 안에 시정되지 않으면 이 계약을 해제 또는 해지할 수 있다.</p></li>\n  <li><p>다음 각 호의 어느 하나에 해당하면 상대방은 최고 없이 이 계약을 해제 또는 해지할 수 있다.</p>\n    <ol>\n      <li><p>어음·수표가 부도 처리되거나 파산·회생절차 개시 신청이 있는 경우</p></li>\n      <li><p>강제집행, 가압류 또는 가처분을 받아 이 계약을 이행하기 어려운 경우</p></li>\n    </ol>\n  </li>\n  <li><p>제1항 및 제2항에 따른 해제 또는 해지는 손해배상 청구에 영향을 미치지 아니한다.</p></li>\n</ol>"
+	},
+	{
+		id: "force-majeure",
+		title: "불가항력",
+		category: "책임",
+		html: "<h2>(불가항력)</h2>\n<p>천재지변, 전쟁, 감염병 확산, 정부의 조치 등 당사자가 통제할 수 없는 사유로 이 계약을 이행하지 못한 경우 그 당사자는 이행 지체나 불이행에 대한 책임을 지지 아니한다. 다만, 그 사유가 생긴 사실을 지체 없이 상대방에게 알려야 한다.</p>"
+	},
+	{
+		id: "no-assignment",
+		title: "권리·의무의 양도 금지",
+		category: "일반",
+		html: "<h2>(권리·의무의 양도 금지)</h2>\n<p>어느 당사자도 상대방의 사전 서면 동의 없이 이 계약상의 권리나 의무의 전부 또는 일부를 제3자에게 양도하거나 담보로 제공할 수 없다.</p>"
+	},
+	{
+		id: "notice",
+		title: "통지",
+		category: "일반",
+		html: "<h2>(통지)</h2>\n<ol>\n  <li><p>이 계약에 따른 통지는 서면으로 하며, 각 당사자가 이 계약서에 적은 주소나 {{통지 받을 이메일}}로 보내어 상대방에게 도달한 때에 효력이 생긴다.</p></li>\n  <li><p>주소나 연락처가 바뀐 당사자는 지체 없이 상대방에게 알려야 한다.</p></li>\n</ol>"
+	},
+	{
+		id: "dispute",
+		title: "분쟁 해결 (관할법원)",
+		category: "분쟁",
+		html: "<h2>(분쟁 해결)</h2>\n<ol>\n  <li><p>이 계약과 관련하여 분쟁이 생기면 당사자는 먼저 성실히 협의하여 해결한다.</p></li>\n  <li><p>협의로 해결되지 않은 분쟁에 관한 소송은 {{관할 법원}}을 제1심 관할법원으로 한다.</p></li>\n</ol>"
+	},
+	{
+		id: "entire-agreement",
+		title: "완전합의 및 계약의 변경",
+		category: "일반",
+		html: "<h2>(완전합의 및 계약의 변경)</h2>\n<ol>\n  <li><p>이 계약은 계약 대상에 관한 당사자 사이의 완전한 합의이며, 이 계약 전에 있었던 구두 또는 서면의 합의보다 우선한다.</p></li>\n  <li><p>이 계약의 변경은 당사자가 서명 또는 날인한 서면으로만 할 수 있다.</p></li>\n</ol>"
+	},
+	{
+		id: "interpretation",
+		title: "계약의 해석",
+		category: "일반",
+		html: "<h2>(계약의 해석)</h2>\n<p>이 계약에서 정하지 않은 사항이나 해석에 다툼이 있는 사항은 당사자가 서로 협의하여 정하고, 협의가 되지 않으면 관계 법령과 일반 거래 관행에 따른다.</p>"
+	}
 ];
 //#endregion
-export { te as CitationLink, we as LegalEditor, y as Numbering, I as SERVICE_ROUNDS, L as SERVICE_UNIT_FEE, ne as SMALL_CLAIM_LIMIT, ee as Variable, F as calcPaymentOrderStampFee, R as calcServiceFee, N as calcStampFee, _ as fillTemplate, k as findCitations, V as formatAmount, A as formatCaseCitation, be as fromDocx, Q as fromFile, xe as fromHwp, Z as normalizeLegalHtml, B as parseAmount, Te as templates, g as toChips, fe as toDocx, pe as toHwpx, z as toKoreanAmount, K as toPlainHtml, ae as withCourtFees };
+export { N as CitationLink, we as LegalEditor, b as Numbering, L as SERVICE_ROUNDS, R as SERVICE_UNIT_FEE, te as SMALL_CLAIM_LIMIT, g as Variable, I as calcPaymentOrderStampFee, z as calcServiceFee, P as calcStampFee, Ee as clauses, v as fillTemplate, k as findCitations, U as formatAmount, A as formatCaseCitation, be as fromDocx, Q as fromFile, xe as fromHwp, Z as normalizeLegalHtml, H as parseAmount, Te as templates, _ as toChips, fe as toDocx, pe as toHwpx, V as toKoreanAmount, ue as toPlainHtml, re as withCourtFees };

package/dist/style.css

@@ -1,2 +1,2 @@
-@counter-style le-circled{system:fixed;symbols:"①" "②" "③" "④" "⑤" "⑥" "⑦" "⑧" "⑨" "⑩" "⑪" "⑫" "⑬" "⑭" "⑮" "⑯" "⑰" "⑱" "⑲" "⑳";suffix:" "}.legal-doc{counter-reset:le-article le-n1 le-n2 le-n3 le-n4;color:#111;background:#fff;outline:none;max-width:760px;margin:0 auto;padding:56px 64px;font-family:Noto Serif KR,Nanum Myeongjo,Batang,serif;font-size:15px;line-height:1.85}.legal-doc h1{text-align:center;letter-spacing:.25em;margin:0 0 1.6em;font-size:1.6em}.legal-doc h2{counter-increment:le-article;margin:1.6em 0 .3em;font-size:1em}.legal-doc h2:before{content:"제" counter(le-article) "조 "}.legal-doc p{margin:0 0 .4em}.legal-doc ol{margin:0 0 .4em;padding-left:1.8em;list-style:le-circled}.legal-doc ol ol{list-style:decimal}.legal-doc li p{margin:0}.legal-doc h3{text-align:center;letter-spacing:.3em;margin:1.8em 0 .8em;font-size:1.05em}.legal-doc>h1,.legal-doc>h2,.legal-doc>h3{counter-set:le-n1 le-n2 le-n3 le-n4}.legal-doc>p[data-num]{padding-left:calc(var(--le-num-indent,0em) + 2em);text-indent:-2em}.legal-doc>p[data-num]:before{text-indent:0;min-width:2em;display:inline-block}.legal-doc>p[data-num="1"]{counter-increment:le-n1;counter-set:le-n2 le-n3 le-n4}.legal-doc>p[data-num="2"]{counter-increment:le-n2;counter-set:le-n3 le-n4;--le-num-indent:1.2em}.legal-doc>p[data-num="3"]{counter-increment:le-n3;counter-set:le-n4;--le-num-indent:2.4em}.legal-doc>p[data-num="4"]{counter-increment:le-n4;--le-num-indent:3.6em}.legal-doc>p[data-num="1"]:before{content:counter(le-n1) "."}.legal-doc>p[data-num="2"]:before{content:counter(le-n2, hangul) "."}.legal-doc>p[data-num="3"]:before{content:"(" counter(le-n3) ")"}.legal-doc>p[data-num="4"]:before{content:"(" counter(le-n4, hangul) ")"}.legal-doc .le-cite{color:inherit;text-underline-offset:3px;cursor:pointer;-webkit-text-decoration:underline dotted #3a56b4;text-decoration:underline dotted #3a56b4}.legal-doc .le-cite:hover{background:#eef2ff}.legal-doc .tableWrapper{overflow-x:auto}.legal-doc table{border-collapse:collapse;width:100%;margin:.6em 0;font-size:.93em}.legal-doc td,.legal-doc th{vertical-align:top;border:1px solid #555;padding:3px 6px}.legal-doc td p,.legal-doc th p{margin:0}.legal-doc .selectedCell{background:#e5edff}.le-root{background:#eef0f3;grid-template-columns:minmax(0,1fr) 260px;gap:16px;padding:16px;font:14px/1.5 system-ui,sans-serif;display:grid}.le-main{min-width:0}.le-toolbar{z-index:1;background:#fff;border-radius:8px;flex-wrap:wrap;gap:4px;max-width:760px;margin:0 auto 8px;padding:6px;display:flex;position:sticky;top:0;box-shadow:0 1px 2px #0001}.le-toolbar button,.le-toolbar .le-btn{cursor:pointer;font:inherit;background:#fff;border:1px solid #d0d4da;border-radius:6px;padding:4px 10px}.le-toolbar button:hover{background:#f3f5f8}.le-spacer{flex:1}.le-main .legal-doc{min-height:900px;box-shadow:0 1px 4px #0002}.le-var{color:#1d3f94;background:#e5edff;border-radius:3px;padding:0 3px}.le-var--empty{color:#8a5a00;background:#fff1c2}.le-panel{background:#fff;border-radius:8px;align-self:start;padding:14px;position:sticky;top:16px;box-shadow:0 1px 2px #0001}.le-panel h3{margin:0 0 10px;font-size:14px}.le-panel label{color:#444;gap:3px;margin-bottom:10px;font-size:13px;display:grid}.le-panel input{font:inherit;border:1px solid #d0d4da;border-radius:6px;padding:6px 8px}.le-hint{color:#777;margin:0;font-size:13px}.le-cases{border-top:1px solid #e3e6ea;margin-top:16px;padding-top:12px}.le-cases-bar{gap:4px;margin-bottom:8px;display:flex}.le-cases-bar input{flex:1;min-width:0}.le-cases-bar button,.le-case-list button{cursor:pointer;font:inherit;background:#fff;border:1px solid #d0d4da;border-radius:6px;padding:4px 8px}.le-case-list{gap:6px;margin:8px 0 0;padding:0;list-style:none;display:grid}.le-case-list li{gap:2px;display:grid}.le-case-list button{text-align:left;gap:2px;font-size:12px;display:grid}.le-case-list button:hover:not(:disabled){background:#f3f5f8}.le-case-list span,.le-case-list small{color:#555}.le-case-list a{color:#3a56b4;justify-self:end;font-size:12px}@media (width<=800px){.le-root{grid-template-columns:1fr}.legal-doc{padding:32px 24px}}@media print{.le-printing body *{visibility:hidden}.le-printing .legal-doc,.le-printing .legal-doc *{visibility:visible}.le-printing .legal-doc{width:100%;max-width:none;box-shadow:none;padding:0;position:absolute;top:0;left:0}.le-printing .le-var{color:inherit;background:0 0;padding:0}.le-printing .le-cite{background:0 0;text-decoration:none}.le-printing .le-var--empty{color:#0000;border-bottom:1px solid #000}}
+@counter-style le-circled{system:fixed;symbols:"①" "②" "③" "④" "⑤" "⑥" "⑦" "⑧" "⑨" "⑩" "⑪" "⑫" "⑬" "⑭" "⑮" "⑯" "⑰" "⑱" "⑲" "⑳";suffix:" "}.legal-doc{counter-reset:le-article le-n1 le-n2 le-n3 le-n4;color:#111;background:#fff;outline:none;max-width:760px;margin:0 auto;padding:56px 64px;font-family:Noto Serif KR,Nanum Myeongjo,Batang,serif;font-size:15px;line-height:1.85}.legal-doc h1{text-align:center;letter-spacing:.25em;margin:0 0 1.6em;font-size:1.6em}.legal-doc h2{counter-increment:le-article;margin:1.6em 0 .3em;font-size:1em}.legal-doc h2:before{content:"제" counter(le-article) "조 "}.legal-doc p{margin:0 0 .4em}.legal-doc ol{margin:0 0 .4em;padding-left:1.8em;list-style:le-circled}.legal-doc ol ol{list-style:decimal}.legal-doc li p{margin:0}.legal-doc h3{text-align:center;letter-spacing:.3em;margin:1.8em 0 .8em;font-size:1.05em}.legal-doc>h1,.legal-doc>h2,.legal-doc>h3{counter-set:le-n1 le-n2 le-n3 le-n4}.legal-doc>p[data-num]{padding-left:calc(var(--le-num-indent,0em) + 2em);text-indent:-2em}.legal-doc>p[data-num]:before{text-indent:0;min-width:2em;display:inline-block}.legal-doc>p[data-num="1"]{counter-increment:le-n1;counter-set:le-n2 le-n3 le-n4}.legal-doc>p[data-num="2"]{counter-increment:le-n2;counter-set:le-n3 le-n4;--le-num-indent:1.2em}.legal-doc>p[data-num="3"]{counter-increment:le-n3;counter-set:le-n4;--le-num-indent:2.4em}.legal-doc>p[data-num="4"]{counter-increment:le-n4;--le-num-indent:3.6em}.legal-doc>p[data-num="1"]:before{content:counter(le-n1) "."}.legal-doc>p[data-num="2"]:before{content:counter(le-n2, hangul) "."}.legal-doc>p[data-num="3"]:before{content:"(" counter(le-n3) ")"}.legal-doc>p[data-num="4"]:before{content:"(" counter(le-n4, hangul) ")"}.legal-doc .le-cite{color:inherit;text-underline-offset:3px;cursor:pointer;-webkit-text-decoration:underline dotted #3a56b4;text-decoration:underline dotted #3a56b4}.legal-doc .le-cite:hover{background:#eef2ff}.legal-doc .tableWrapper{overflow-x:auto}.legal-doc table{border-collapse:collapse;width:100%;margin:.6em 0;font-size:.93em}.legal-doc td,.legal-doc th{vertical-align:top;border:1px solid #555;padding:3px 6px}.legal-doc td p,.legal-doc th p{margin:0}.legal-doc .selectedCell{background:#e5edff}.le-root{background:#eef0f3;grid-template-columns:minmax(0,1fr) 260px;gap:16px;padding:16px;font:14px/1.5 system-ui,sans-serif;display:grid}.le-main{min-width:0}.le-toolbar{z-index:1;background:#fff;border-radius:8px;flex-wrap:wrap;gap:4px;max-width:760px;margin:0 auto 8px;padding:6px;display:flex;position:sticky;top:0;box-shadow:0 1px 2px #0001}.le-toolbar button,.le-toolbar .le-btn{cursor:pointer;font:inherit;background:#fff;border:1px solid #d0d4da;border-radius:6px;padding:4px 10px}.le-toolbar button:hover{background:#f3f5f8}.le-spacer{flex:1}.le-main .legal-doc{min-height:900px;box-shadow:0 1px 4px #0002}.le-var{color:#1d3f94;background:#e5edff;border-radius:3px;padding:0 3px}.le-var--empty{color:#8a5a00;background:#fff1c2}.le-panel{background:#fff;border-radius:8px;align-self:start;padding:14px;position:sticky;top:16px;box-shadow:0 1px 2px #0001}.le-panel h3{margin:0 0 10px;font-size:14px}.le-panel label{color:#444;gap:3px;margin-bottom:10px;font-size:13px;display:grid}.le-panel input{font:inherit;border:1px solid #d0d4da;border-radius:6px;padding:6px 8px}.le-hint{color:#777;margin:0;font-size:13px}.le-cases{border-top:1px solid #e3e6ea;margin-top:16px;padding-top:12px}.le-cases-bar{gap:4px;margin-bottom:8px;display:flex}.le-cases-bar input{flex:1;min-width:0}.le-cases-bar button,.le-case-list button{cursor:pointer;font:inherit;background:#fff;border:1px solid #d0d4da;border-radius:6px;padding:4px 8px}.le-case-list{gap:6px;margin:8px 0 0;padding:0;list-style:none;display:grid}.le-case-list li{gap:2px;display:grid}.le-case-list button{text-align:left;gap:2px;font-size:12px;display:grid}.le-case-list button:hover:not(:disabled){background:#f3f5f8}.le-case-list span,.le-case-list small{color:#555}.le-case-list a{color:#3a56b4;justify-self:end;font-size:12px}.le-clauses{border-top:1px solid #e3e6ea;margin-top:16px;padding-top:12px}.le-clauses>input{box-sizing:border-box;width:100%;margin-bottom:6px}.le-clause-list{gap:4px;max-height:280px;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.le-clause-list button{cursor:pointer;text-align:left;width:100%;font:inherit;background:#fff;border:1px solid #d0d4da;border-radius:6px;padding:4px 8px;font-size:12px}.le-clause-list button:hover:not(:disabled){background:#f3f5f8}.le-clause-list small{color:#3a56b4;margin-right:6px}@media (width<=800px){.le-root{grid-template-columns:1fr}.legal-doc{padding:32px 24px}}@media print{.le-printing body *{visibility:hidden}.le-printing .legal-doc,.le-printing .legal-doc *{visibility:visible}.le-printing .legal-doc{width:100%;max-width:none;box-shadow:none;padding:0;position:absolute;top:0;left:0}.le-printing .le-var{color:inherit;background:0 0;padding:0}.le-printing .le-cite{background:0 0;text-decoration:none}.le-printing .le-var--empty{color:#0000;border-bottom:1px solid #000}}
 /*$vite$:1*/

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "legal-doc-editor",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "법률문서(계약서·소장·고소장) 생성용 React 에디터 — 조항·번호 자동 매김, {{변수}} 채우기, 한글(hwp·hwpx)·Word(docx) 열기·저장",
   "license": "MIT",
   "repository": {