@team-monolith/cds 1.130.0-alpha.2 → 1.130.0-alpha.4

package/dist/patterns/LexicalEditor/nodes/ImageNode/ImageComponent.js

@@ -3,35 +3,37 @@ import { stdin_default as t } from "../../../../node_modules/.pnpm/remixicon@4.3
 import { RESET_BUTTON as n } from "../../../../utils/reset.js";
 import { VISUALLY_HIDDEN as r } from "../../../../utils/visuallyHidden.js";
 import { $isImageNode as i } from "./ImageNode.js";
-import { ImageNotAvailable as a } from "./ImageNotAvailable.js";
-import { InsertImageDialog as o } from "../../components/InsertImageDialog/InsertImageDialog.js";
-import { ImageResizer as s } from "./ImageResizer.js";
-import { css as c } from "@emotion/react";
-import { Suspense as l, useCallback as u, useEffect as d, useRef as f, useState as p } from "react";
-import m from "@emotion/styled";
-import { Fragment as h, jsx as g, jsxs as _ } from "@emotion/react/jsx-runtime";
-import { useTranslation as ee } from "react-i18next";
-import { $getNodeByKey as v, $getSelection as y, $isNodeSelection as b, $isRangeSelection as x, $setSelection as te, CLICK_COMMAND as ne, COMMAND_PRIORITY_LOW as S, DRAGSTART_COMMAND as C, KEY_BACKSPACE_COMMAND as w, KEY_DELETE_COMMAND as re, KEY_ENTER_COMMAND as ie, KEY_ESCAPE_COMMAND as ae, SELECTION_CHANGE_COMMAND as T, createCommand as E } from "lexical";
-import { mergeRegister as oe } from "@lexical/utils";
-import { useLexicalComposerContext as se } from "@lexical/react/LexicalComposerContext";
-import { useLexicalNodeSelection as ce } from "@lexical/react/useLexicalNodeSelection";
-import { useLexicalEditable as D } from "@lexical/react/useLexicalEditable";
+import { LexicalCustomConfigContext as a } from "../../LexicalCustomConfigContext.js";
+import { ImageNotAvailable as o } from "./ImageNotAvailable.js";
+import { InsertImageDialog as s } from "../../components/InsertImageDialog/InsertImageDialog.js";
+import { CompactImageView as ee } from "./CompactImageView.js";
+import { ImageResizer as c } from "./ImageResizer.js";
+import { css as l } from "@emotion/react";
+import { Suspense as u, useCallback as d, useContext as f, useEffect as te, useRef as p, useState as m } from "react";
+import h from "@emotion/styled";
+import { Fragment as g, jsx as _, jsxs as v } from "@emotion/react/jsx-runtime";
+import { useTranslation as y } from "react-i18next";
+import { $getNodeByKey as b, $getSelection as x, $isNodeSelection as S, $isRangeSelection as ne, $setSelection as re, CLICK_COMMAND as C, COMMAND_PRIORITY_LOW as w, DRAGSTART_COMMAND as T, KEY_BACKSPACE_COMMAND as ie, KEY_DELETE_COMMAND as ae, KEY_ENTER_COMMAND as oe, KEY_ESCAPE_COMMAND as se, SELECTION_CHANGE_COMMAND as ce, createCommand as E } from "lexical";
+import { mergeRegister as le } from "@lexical/utils";
+import { useLexicalComposerContext as D } from "@lexical/react/LexicalComposerContext";
+import { useLexicalNodeSelection as O } from "@lexical/react/useLexicalNodeSelection";
+import { useLexicalEditable as ue } from "@lexical/react/useLexicalEditable";
 //#region src/cds/patterns/LexicalEditor/nodes/ImageNode/ImageComponent.tsx
-var O = /* @__PURE__ */ new Set(), k = E("RIGHT_CLICK_IMAGE_COMMAND");
-function A(e) {
-	if (!O.has(e)) throw new Promise((t) => {
+var k = /* @__PURE__ */ new Set(), A = E("RIGHT_CLICK_IMAGE_COMMAND");
+function j(e) {
+	if (!k.has(e)) throw new Promise((t) => {
 		let n = new Image();
 		n.src = e, n.onload = () => {
-			O.add(e), t(null);
+			k.add(e), t(null);
 		}, n.onerror = () => {
-			O.add(e);
+			k.add(e);
 		};
 	});
 }
-function j(e) {
-	let { altText: t, className: r, imageRef: i, src: a, width: o, height: s, maxWidth: c, onError: l, title: u, buttonProps: d, addtionalInfoLabel: f } = e;
-	A(a);
-	let p = /* @__PURE__ */ g("img", {
+function M(e) {
+	let { altText: t, className: r, imageRef: i, src: a, width: o, height: s, maxWidth: ee, onError: c, title: l, buttonProps: u, addtionalInfoLabel: d } = e;
+	j(a);
+	let f = /* @__PURE__ */ _("img", {
 		className: r || void 0,
 		src: a,
 		alt: t,
@@ -41,151 +43,155 @@ function j(e) {
 			maxWidth: "100%",
 			width: o
 		},
-		title: u,
-		onError: l,
+		title: l,
+		onError: c,
 		draggable: "false"
 	});
-	return d ? /* @__PURE__ */ _("button", {
+	return u ? /* @__PURE__ */ v("button", {
 		type: "button",
 		css: n,
-		...d,
-		children: [p, f]
-	}) : p;
+		...u,
+		children: [f, d]
+	}) : f;
 }
-function M({ src: n, altText: m, nodeKey: E, width: O, height: A, maxWidth: M, resizable: ue }) {
-	let N = f(null), P = f(null), [F, I, L] = ce(E), [R, z] = p(!1), [B] = se(), [V, H] = p(null), de = f(null), [U, W] = p(!1), { t: G } = ee(), K = u((e) => {
-		let t = y();
-		return F && b(t) && (e.preventDefault(), B.update(() => {
+function N({ src: n, altText: h, nodeKey: E, width: k, height: j, maxWidth: N, resizable: fe }) {
+	let P = p(null), F = p(null), [I, L, R] = O(E), [z, B] = m(!1), [V] = D(), [H, pe] = m(null), me = p(null), [U, W] = m(!1), { t: G } = y(), K = d((e) => {
+		let t = x();
+		return I && S(t) && (e.preventDefault(), V.update(() => {
 			t.getNodes().forEach((e) => {
 				i(e) && e.remove();
 			});
 		})), !1;
-	}, [B, F]), q = u((e) => {
-		let t = y(), n = P.current;
-		return F && b(t) && t.getNodes().length === 1 && n !== null && n !== document.activeElement ? (e.preventDefault(), n.focus(), !0) : !1;
-	}, [F]), J = u((e) => P.current === e.target ? (te(null), B.update(() => {
-		I(!0);
-		let e = B.getRootElement();
+	}, [V, I]), q = d((e) => {
+		let t = x(), n = F.current;
+		return I && S(t) && t.getNodes().length === 1 && n !== null && n !== document.activeElement ? (e.preventDefault(), n.focus(), !0) : !1;
+	}, [I]), J = d((e) => F.current === e.target ? (re(null), V.update(() => {
+		L(!0);
+		let e = V.getRootElement();
 		e !== null && e.focus();
-	}), !0) : !1, [B, I]), Y = u((e) => {
+	}), !0) : !1, [V, L]), Y = d((e) => {
 		let t = e;
-		return R ? !0 : t.target === N.current ? (t.shiftKey ? I(!F) : (L(), I(!0)), !0) : !1;
+		return z ? !0 : t.target === P.current ? (t.shiftKey ? L(!I) : (R(), L(!0)), !0) : !1;
 	}, [
-		R,
-		F,
+		z,
 		I,
-		L
-	]), X = u((e) => {
-		B.getEditorState().read(() => {
-			let t = y();
-			e.target.tagName === "IMG" && x(t) && t.getNodes().length === 1 && B.dispatchCommand(k, e);
+		L,
+		R
+	]), X = d((e) => {
+		V.getEditorState().read(() => {
+			let t = x();
+			e.target.tagName === "IMG" && ne(t) && t.getNodes().length === 1 && V.dispatchCommand(A, e);
 		});
-	}, [B]);
-	d(() => {
-		let e = !0, t = B.getRootElement(), n = oe(B.registerUpdateListener(({ editorState: t }) => {
-			e && H(t.read(() => y()));
-		}), B.registerCommand(T, (e, t) => (de.current = t, !1), S), B.registerCommand(ne, Y, S), B.registerCommand(k, Y, S), B.registerCommand(C, (e) => e.target === N.current ? (e.preventDefault(), !0) : !1, S), B.registerCommand(re, K, S), B.registerCommand(w, K, S), B.registerCommand(ie, q, S), B.registerCommand(ae, J, S));
+	}, [V]);
+	te(() => {
+		let e = !0, t = V.getRootElement(), n = le(V.registerUpdateListener(({ editorState: t }) => {
+			e && pe(t.read(() => x()));
+		}), V.registerCommand(ce, (e, t) => (me.current = t, !1), w), V.registerCommand(C, Y, w), V.registerCommand(A, Y, w), V.registerCommand(T, (e) => e.target === P.current ? (e.preventDefault(), !0) : !1, w), V.registerCommand(ae, K, w), V.registerCommand(ie, K, w), V.registerCommand(oe, q, w), V.registerCommand(se, J, w));
 		return t?.addEventListener("contextmenu", X), () => {
 			e = !1, n(), t?.removeEventListener("contextmenu", X);
 		};
 	}, [
-		L,
-		B,
 		R,
-		F,
+		V,
+		z,
+		I,
 		E,
 		K,
 		q,
 		J,
 		Y,
 		X,
-		I
+		L
 	]);
-	let fe = (e, t) => {
+	let he = (e, t) => {
 		setTimeout(() => {
-			z(!1);
-		}, 200), B.update(() => {
-			let n = v(E);
+			B(!1);
+		}, 200), V.update(() => {
+			let n = b(E);
 			i(n) && n.setWidthAndHeight(e, t);
 		});
-	}, pe = () => {
-		z(!0);
-	}, Z = F && b(V) && !R, Q = F || R, [me, $] = p(!1);
-	return D() ? /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ _(le, { children: [/* @__PURE__ */ g(l, {
+	}, ge = () => {
+		B(!0);
+	}, Z = I && S(H) && !z, Q = I || z, [_e, $] = m(!1), ve = ue(), { compactEditorMode: ye } = f(a);
+	return ye ? /* @__PURE__ */ _(ee, {
+		src: n,
+		altText: h,
+		nodeKey: E
+	}) : ve ? /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ v(de, { children: [/* @__PURE__ */ _(u, {
 		fallback: null,
-		children: /* @__PURE__ */ g("div", {
+		children: /* @__PURE__ */ _("div", {
 			draggable: Z,
-			css: c`
+			css: l`
               // ImageResizer를 위한 relative 설정입니다.
               position: relative;
             `,
-			children: U ? /* @__PURE__ */ g(a, {}) : /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ g(j, {
-				className: Q ? `focused ${b(V) ? "draggable" : ""}` : null,
+			children: U ? /* @__PURE__ */ _(o, {}) : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(M, {
+				className: Q ? `focused ${S(H) ? "draggable" : ""}` : null,
 				src: n,
-				altText: m,
-				imageRef: N,
-				width: O,
-				height: A,
-				maxWidth: M,
+				altText: h,
+				imageRef: P,
+				width: k,
+				height: j,
+				maxWidth: N,
 				onError: () => W(!0)
-			}), ue && b(V) && Q && /* @__PURE__ */ g(s, {
+			}), fe && S(H) && Q && /* @__PURE__ */ _(c, {
 				showCaption: !1,
 				setShowCaption: () => {},
-				editor: B,
-				buttonRef: P,
-				imageRef: N,
-				onResizeStart: pe,
-				onResizeEnd: fe,
+				editor: V,
+				buttonRef: F,
+				imageRef: P,
+				onResizeStart: ge,
+				onResizeEnd: he,
 				captionsEnabled: !1
 			})] })
 		})
-	}), /* @__PURE__ */ g(e, {
+	}), /* @__PURE__ */ _(e, {
 		size: "small",
 		color: "icon",
-		icon: /* @__PURE__ */ g(t, {}),
+		icon: /* @__PURE__ */ _(t, {}),
 		onClick: () => {
 			$(!0);
 		},
 		"aria-label": G("이미지 수정하기", { context: "스퀘어버튼, 렉시컬 이미지 도구" })
-	})] }), /* @__PURE__ */ g(o, {
-		open: me,
+	})] }), /* @__PURE__ */ _(s, {
+		open: _e,
 		title: G("이미지 수정하기", { context: "제목, 이미지 수정 다이얼로그" }),
 		onClose: () => $(!1),
 		imageProps: {
 			src: n,
-			altText: m
+			altText: h
 		},
 		onChange: (e) => {
-			B.update(() => {
-				let t = v(E);
+			V.update(() => {
+				let t = b(E);
 				i(t) && (t.setSrc(e.src), t.setAltText(e.altText));
 			});
 		},
 		onDelete: () => {
-			B.update(() => {
-				let e = v(E);
+			V.update(() => {
+				let e = b(E);
 				i(e) && e.remove();
 			});
 		}
-	}, n)] }) : /* @__PURE__ */ g(l, {
+	}, n)] }) : /* @__PURE__ */ _(u, {
 		fallback: null,
-		children: /* @__PURE__ */ g("div", {
+		children: /* @__PURE__ */ _("div", {
 			draggable: Z,
-			children: U ? /* @__PURE__ */ g(a, {}) : /* @__PURE__ */ g(j, {
-				className: Q ? `focused ${b(V) ? "draggable" : ""}` : null,
-				css: c`
+			children: U ? /* @__PURE__ */ _(o, {}) : /* @__PURE__ */ _(M, {
+				className: Q ? `focused ${S(H) ? "draggable" : ""}` : null,
+				css: l`
                 cursor: pointer;
               `,
 				src: n,
-				altText: m,
-				imageRef: N,
-				width: O,
-				height: A,
-				maxWidth: M,
+				altText: h,
+				imageRef: P,
+				width: k,
+				height: j,
+				maxWidth: N,
 				onError: () => W(!0),
-				buttonProps: { onClick: () => window.open(n, "_blank") },
+				buttonProps: { onClick: () => window.open(n, "_blank", "noopener") },
 				title: G("클릭해서 원본 이미지 보기."),
-				addtionalInfoLabel: /* @__PURE__ */ g("span", {
+				addtionalInfoLabel: /* @__PURE__ */ _("span", {
 					css: r,
 					children: G("(새 창)", { context: "렉시컬 이미지 도구" })
 				})
@@ -193,9 +199,9 @@ function M({ src: n, altText: m, nodeKey: E, width: O, height: A, maxWidth: M, r
 		})
 	});
 }
-var le = m.div`
+var de = h.div`
   display: flex;
   gap: 4px;
 `;
 //#endregion
-export { M as ImageComponent };
+export { N as ImageComponent };

package/dist/patterns/LexicalEditor/nodes/ProblemInputNode/InputComponent.js

@@ -1,8 +1,8 @@
 import { SquareButton as e } from "../../../../components/SquareButton.js";
 import { stdin_default as t } from "../../../../node_modules/.pnpm/remixicon@4.3.0/node_modules/remixicon/icons/System/settings-3-fill.js";
-import { getTexts as n } from "../../../../texts.js";
-import { SettingForm as r } from "./SettingForm/SettingForm.js";
-import { LexicalCustomConfigContext as i } from "../../LexicalCustomConfigContext.js";
+import { LexicalCustomConfigContext as n } from "../../LexicalCustomConfigContext.js";
+import { getTexts as r } from "../../../../texts.js";
+import { SettingForm as i } from "./SettingForm/SettingForm.js";
 import { TextInput as a } from "./TextInput.js";
 import { SegmentedInput as o } from "./SegmentedInput.js";
 import { $isProblemInputNode as s } from "./ProblemInputNode.js";
@@ -16,7 +16,7 @@ import { useLexicalComposerContext as _ } from "@lexical/react/LexicalComposerCo
 import { useLexicalEditable as v } from "@lexical/react/useLexicalEditable";
 //#region src/cds/patterns/LexicalEditor/nodes/ProblemInputNode/InputComponent.tsx
 function y(d) {
-	let { answer: y, isCorrect: x, ...S } = d, { solutions: C, showCharacterNumber: w, placeholder: T, nodeKey: E } = S, [D] = _(), { t: O } = h(), [k, A] = u(!1), j = v(), [M, N] = u(y), { freezeProblemNode: P } = l(i), F = C[0].value, I = (e) => {
+	let { answer: y, isCorrect: x, ...S } = d, { solutions: C, showCharacterNumber: w, placeholder: T, nodeKey: E } = S, [D] = _(), { t: O } = h(), [k, A] = u(!1), j = v(), [M, N] = u(y), { freezeProblemNode: P } = l(n), F = C[0].value, I = (e) => {
 		N(e), D.update(() => {
 			let t = g(E);
 			s(t) && t.setAnswer(e);
@@ -40,14 +40,14 @@ function y(d) {
 			},
 			"aria-label": O("입력 칸 설정", { context: "렉시컬 주관식 입력 도구" })
 		})]
-	}), k && /* @__PURE__ */ p(r, {
+	}), k && /* @__PURE__ */ p(i, {
 		...S,
 		onClose: () => A(!1)
 	})] }) : w ? /* @__PURE__ */ p(o, {
 		readOnly: P,
 		isCorrect: x,
 		answerFormat: F,
-		placeholder: T || n(O, "placeholderEnterHere"),
+		placeholder: T || r(O, "placeholderEnterHere"),
 		value: M,
 		onChange: I
 	}) : /* @__PURE__ */ p(a, {
@@ -55,7 +55,7 @@ function y(d) {
 		isCorrect: x,
 		size: "small",
 		color: "default",
-		placeholder: T || n(O, "placeholderEnterHere"),
+		placeholder: T || r(O, "placeholderEnterHere"),
 		value: M,
 		onChange: (e) => {
 			I(e.target.value);

package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SelectComponent.js

@@ -1,8 +1,8 @@
 import { SquareButton as e } from "../../../../components/SquareButton.js";
 import { stdin_default as t } from "../../../../node_modules/.pnpm/remixicon@4.3.0/node_modules/remixicon/icons/System/alarm-warning-fill.js";
 import { stdin_default as n } from "../../../../node_modules/.pnpm/remixicon@4.3.0/node_modules/remixicon/icons/System/settings-3-fill.js";
-import { getTexts as r } from "../../../../texts.js";
-import { LexicalCustomConfigContext as i } from "../../LexicalCustomConfigContext.js";
+import { LexicalCustomConfigContext as r } from "../../LexicalCustomConfigContext.js";
+import { getTexts as i } from "../../../../texts.js";
 import { SelectBoxEdit as a } from "./SelectBox/SelectBoxEdit.js";
 import { SelectBoxView as o } from "./SelectBox/SelectBoxView.js";
 import { SettingForm as s } from "./SettingForm/SettingForm.js";
@@ -17,7 +17,7 @@ import { useLexicalComposerContext as v } from "@lexical/react/LexicalComposerCo
 import { useLexicalEditable as y } from "@lexical/react/useLexicalEditable";
 //#region src/cds/patterns/LexicalEditor/nodes/ProblemSelectNode/SelectComponent.tsx
 function b(f) {
-	let { selected: b, hasMultipleSolutions: S, selections: C, nodeKey: w } = f, [T] = v(), { t: E } = g(), [D, O] = d(!1), k = y(), { freezeProblemNode: A, showQuizSolution: j } = u(i), M = S || S === void 0 && C.filter((e) => "isAnswer" in e && e.isAnswer).length > 1;
+	let { selected: b, hasMultipleSolutions: S, selections: C, nodeKey: w } = f, [T] = v(), { t: E } = g(), [D, O] = d(!1), k = y(), { freezeProblemNode: A, showQuizSolution: j } = u(r), M = S || S === void 0 && C.filter((e) => "isAnswer" in e && e.isAnswer).length > 1;
 	return k ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ h("div", {
 		css: l`
           display: flex;
@@ -64,7 +64,7 @@ function b(f) {
 		children: [M && /* @__PURE__ */ h(x, { children: [/* @__PURE__ */ m(t, { css: l`
                 width: 14px;
                 height: 14px;
-              ` }), r(E, "multipleChoicesProblem")] }), C.map((e, t) => /* @__PURE__ */ m(o, {
+              ` }), i(E, "multipleChoicesProblem")] }), C.map((e, t) => /* @__PURE__ */ m(o, {
 			multipleSelectionsEnabled: M,
 			index: t + 1,
 			isAnswer: j && "isAnswer" in e ? e.isAnswer : void 0,

package/dist/patterns/LexicalEditor/nodes/SheetInputNode/InputComponent.js

@@ -1,8 +1,8 @@
 import { SquareButton as e } from "../../../../components/SquareButton.js";
 import { stdin_default as t } from "../../../../node_modules/.pnpm/remixicon@4.3.0/node_modules/remixicon/icons/System/settings-3-fill.js";
 import { Input as n } from "../../../../components/Input.js";
-import { getTexts as r } from "../../../../texts.js";
-import { LexicalCustomConfigContext as i } from "../../LexicalCustomConfigContext.js";
+import { LexicalCustomConfigContext as r } from "../../LexicalCustomConfigContext.js";
+import { getTexts as i } from "../../../../texts.js";
 import { SettingForm as a } from "./SettingForm.js";
 import { $isSheetInputNode as o } from "./SheetInputNode.js";
 import { css as s } from "@emotion/react";
@@ -16,7 +16,7 @@ import { useLexicalEditable as _ } from "@lexical/react/useLexicalEditable";
 //#region src/cds/patterns/LexicalEditor/nodes/SheetInputNode/InputComponent.tsx
 var v = 84, y = 8;
 function b(u) {
-	let { multiline: b, value: S, placeholder: C, nodeKey: w } = u, [T] = g(), [E, D] = l(!1), O = _(), [k, A] = l(!1), [j, M] = l(S), { freezeProblemNode: N } = c(i), { t: P } = m(), F = (e) => {
+	let { multiline: b, value: S, placeholder: C, nodeKey: w } = u, [T] = g(), [E, D] = l(!1), O = _(), [k, A] = l(!1), [j, M] = l(S), { freezeProblemNode: N } = c(r), { t: P } = m(), F = (e) => {
 		M(e), T.update(() => {
 			let t = h(w);
 			o(t) && t.setValue(e);
@@ -60,7 +60,7 @@ function b(u) {
 		},
 		size: "small",
 		color: k ? "activePrimary" : "default",
-		placeholder: C || r(P, "placeholderEnterHere"),
+		placeholder: C || i(P, "placeholderEnterHere"),
 		value: j,
 		onChange: (e) => {
 			F(e.target.value);

package/dist/patterns/LexicalEditor/nodes/SheetSelectNode/SelectComponent/SelectComponent.js

@@ -1,8 +1,8 @@
 import { SquareButton as e } from "../../../../../components/SquareButton.js";
 import { stdin_default as t } from "../../../../../node_modules/.pnpm/remixicon@4.3.0/node_modules/remixicon/icons/System/alarm-warning-fill.js";
 import { stdin_default as n } from "../../../../../node_modules/.pnpm/remixicon@4.3.0/node_modules/remixicon/icons/System/settings-3-fill.js";
-import { getTexts as r } from "../../../../../texts.js";
-import { LexicalCustomConfigContext as i } from "../../../LexicalCustomConfigContext.js";
+import { LexicalCustomConfigContext as r } from "../../../LexicalCustomConfigContext.js";
+import { getTexts as i } from "../../../../../texts.js";
 import { SettingForm as a } from "./SettingForm/SettingForm.js";
 import { SelectBoxView as o } from "./SelectBox/SelectBoxView.js";
 import { SelectBoxEdit as s } from "./SelectBox/SelectBoxEdit.js";
@@ -17,7 +17,7 @@ import { useLexicalComposerContext as v } from "@lexical/react/LexicalComposerCo
 import { useLexicalEditable as y } from "@lexical/react/useLexicalEditable";
 //#region src/cds/patterns/LexicalEditor/nodes/SheetSelectNode/SelectComponent/SelectComponent.tsx
 function b(f) {
-	let { selections: b, selected: S, allowMultipleAnswers: C, nodeKey: w } = f, [T] = v(), { t: E } = g(), [D, O] = d(!1), k = y(), { freezeProblemNode: A } = u(i);
+	let { selections: b, selected: S, allowMultipleAnswers: C, nodeKey: w } = f, [T] = v(), { t: E } = g(), [D, O] = d(!1), k = y(), { freezeProblemNode: A } = u(r);
 	return k ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ h("div", {
 		css: l`
           display: flex;
@@ -57,7 +57,7 @@ function b(f) {
 	})] }) : /* @__PURE__ */ h(p, { children: [C && /* @__PURE__ */ h(x, { children: [/* @__PURE__ */ m(t, { css: l`
                 width: 14px;
                 height: 14px;
-              ` }), r(E, "multipleChoicesProblem")] }), b.map((e, t) => /* @__PURE__ */ m(o, {
+              ` }), i(E, "multipleChoicesProblem")] }), b.map((e, t) => /* @__PURE__ */ m(o, {
 		index: t + 1,
 		isSelected: S.includes(e.value),
 		image: e.show.image,

package/dist/patterns/LexicalEditor/plugins/CompactToolbarPlugin/CompactToolbarPlugin.d.ts

@@ -0,0 +1 @@
+export declare function CompactToolbarPlugin(): JSX.Element | null;

package/dist/patterns/LexicalEditor/plugins/CompactToolbarPlugin/CompactToolbarPlugin.js

@@ -0,0 +1,106 @@
+import { stdin_default as e } from "../../../../node_modules/.pnpm/remixicon@4.3.0/node_modules/remixicon/icons/System/upload-line.js";
+import { CdsContext as t } from "../../../../CdsProvider.js";
+import { $createImageNode as n } from "../../nodes/ImageNode/ImageNode.js";
+import { $createFileNode as r } from "../../nodes/FileNode/FileNode.js";
+import { getTexts as i } from "../../../../texts.js";
+import "../../uploadConstants.js";
+import { COMPACT_ATTACHMENT_NODES as a } from "./compactAttachmentNodes.js";
+import { css as o } from "@emotion/react";
+import { useContext as s, useLayoutEffect as c, useRef as l, useState as u } from "react";
+import d from "@emotion/styled";
+import { jsx as f, jsxs as p } from "@emotion/react/jsx-runtime";
+import { useTranslation as m } from "react-i18next";
+import { $createParagraphNode as h, $getRoot as g } from "lexical";
+import { mergeRegister as _ } from "@lexical/utils";
+import { useLexicalComposerContext as v } from "@lexical/react/LexicalComposerContext";
+import y from "moment";
+//#region src/cds/patterns/LexicalEditor/plugins/CompactToolbarPlugin/CompactToolbarPlugin.tsx
+function b() {
+	let { t } = m(), n = x(), r = S(), i = l(null);
+	return n ? null : /* @__PURE__ */ p(C, { children: [/* @__PURE__ */ p(w, {
+		type: "button",
+		onClick: () => i.current?.click(),
+		children: [/* @__PURE__ */ f(e, {}), /* @__PURE__ */ f(T, { children: t("업로드") })]
+	}), /* @__PURE__ */ f(E, {
+		ref: i,
+		type: "file",
+		onChange: (e) => {
+			let t = e.target.files?.[0];
+			t && r(t), e.target.value = "";
+		}
+	})] });
+}
+function x() {
+	let [e] = v(), [t, n] = u(!1);
+	return c(() => {
+		let t = /* @__PURE__ */ new Set();
+		return _(...a.map((r) => e.registerMutationListener(r, (e) => {
+			for (let [n, r] of e) r === "destroyed" ? t.delete(n) : t.add(n);
+			n(t.size > 0);
+		}, { skipInitialization: !1 })));
+	}, [e]), t;
+}
+function S() {
+	let [e] = v(), a = s(t), { t: o } = m();
+	return async (t) => {
+		let s = a.lexical?.uploadByFile, c = a.lexical?.showFileError;
+		if (!s) return;
+		if (t.size >= 1073741824) {
+			c?.("upload", i(o, "errorFileTooLarge"));
+			return;
+		}
+		let l;
+		try {
+			l = await s(t);
+		} catch {
+			c?.("upload", o("파일을 업로드하지 못했습니다. 다시 시도해 주세요."));
+			return;
+		}
+		e.update(() => {
+			let e = t.type.startsWith("image/") ? n({
+				src: l,
+				altText: t.name
+			}) : r({
+				fileUrl: l,
+				fileName: t.name,
+				fileSize: t.size,
+				fileUploadDate: y().format("YYYY.MM.DD HH:mm:ss")
+			}), i = g(), a = i.getFirstChild();
+			a ? a.insertBefore(e) : i.append(e), e.getNextSibling() === null && e.insertAfter(h());
+		});
+	};
+}
+var C = d.div(({ theme: e }) => o`
+    display: flex;
+    gap: 8px;
+    padding: 8px;
+    border: 1px dashed ${e.color.foreground.neutralBaseDisabled};
+    border-radius: 10px;
+  `), w = d.button(({ theme: e }) => o`
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+    width: 72px;
+    height: 64px;
+    padding: 8px;
+    border: 1px solid ${e.color.foreground.neutralBaseDisabled};
+    border-radius: 8px;
+    background: ${e.color.background.neutralBase};
+    color: ${e.color.foreground.neutralBase};
+    cursor: pointer;
+
+    &:hover {
+      background: ${e.color.background.neutralAlt};
+    }
+  `), T = d.span(({ theme: e }) => o`
+    font-family: ${e.fontFamily.ui};
+    font-size: 12px;
+    font-weight: 500;
+    line-height: 16px;
+  `), E = d.input`
+  display: none;
+`;
+//#endregion
+export { b as CompactToolbarPlugin };

package/dist/patterns/LexicalEditor/plugins/CompactToolbarPlugin/compactAttachmentNodes.d.ts

@@ -0,0 +1,8 @@
+import { Klass, LexicalNode } from 'lexical';
+/**
+ * AIDEV-NOTE:
+ * compactEditorMode 툴바가 "첨부 노드"로 간주해 추적하는 노드 목록의 진실의 근원.
+ * 첨부 노드가 본문에 하나라도 존재하면 삽입 툴바를 미노출한다(CompactToolbarPlugin 참고).
+ * 새로운 첨부 노드(예: 비디오)가 추가되면 이 배열에만 등록하면 된다.
+ */
+export declare const COMPACT_ATTACHMENT_NODES: Klass<LexicalNode>[];

package/dist/patterns/LexicalEditor/plugins/CompactToolbarPlugin/compactAttachmentNodes.js

@@ -0,0 +1,6 @@
+import { ImageNode as e } from "../../nodes/ImageNode/ImageNode.js";
+import { FileNode as t } from "../../nodes/FileNode/FileNode.js";
+//#region src/cds/patterns/LexicalEditor/plugins/CompactToolbarPlugin/compactAttachmentNodes.ts
+var n = [e, t];
+//#endregion
+export { n as COMPACT_ATTACHMENT_NODES };

package/dist/patterns/LexicalEditor/plugins/CompactToolbarPlugin/index.d.ts

@@ -0,0 +1 @@
+export * from './CompactToolbarPlugin';

package/dist/patterns/LexicalEditor/plugins/DragDropPastePlugin/index.js

@@ -1,5 +1,6 @@
 import { CdsContext as e } from "../../../../CdsProvider.js";
 import { getTexts as t } from "../../../../texts.js";
+import "../../uploadConstants.js";
 import { INSERT_IMAGE_COMMAND as n } from "../ImagesPlugin/index.js";
 import { UPLOAD_FILE_COMMAND as r } from "../FilePlugin/index.js";
 import { useContext as i, useEffect as a } from "react";
@@ -16,22 +17,22 @@ var p = [
 	"image/heif",
 	"image/gif",
 	"image/webp"
-], m = 1 * 1024 * 1024 * 1024;
-function h() {
-	let [h] = d(), g = i(e), _ = g.lexical?.uploadByFile, v = g.lexical?.showFileError, { t: y } = o();
-	return a(() => h.registerCommand(c, (e) => ((async () => {
-		if (!_) return !1;
+];
+function m() {
+	let [m] = d(), h = i(e), g = h.lexical?.uploadByFile, _ = h.lexical?.showFileError, { t: v } = o();
+	return a(() => m.registerCommand(c, (e) => ((async () => {
+		if (!g) return !1;
 		let i = await u(e, [""]);
 		for (let { file: e } of i) if (l(e, p)) {
-			let t = await _(e);
-			h.dispatchCommand(n, {
+			let t = await g(e);
+			m.dispatchCommand(n, {
 				altText: e.name,
 				src: t
 			});
-		} else if (e.size >= m) v?.("upload", t(y, "errorFileTooLarge"));
+		} else if (e.size >= 1073741824) _?.("upload", t(v, "errorFileTooLarge"));
 		else {
-			let t = await _(e);
-			h.dispatchCommand(r, {
+			let t = await g(e);
+			m.dispatchCommand(r, {
 				fileUrl: t,
 				fileName: e.name,
 				fileSize: e.size,
@@ -39,11 +40,11 @@ function h() {
 			});
 		}
 	})(), !0), s), [
-		h,
-		v,
+		m,
 		_,
-		y
+		g,
+		v
 	]), null;
 }
 //#endregion
-export { h as DragDropPastePlugin };
+export { m as DragDropPastePlugin };

package/dist/patterns/LexicalEditor/uploadConstants.d.ts

@@ -0,0 +1,6 @@
+/**
+ * LexicalEditor의 모든 업로드 경로(DragDropPaste, UploadFileDialog, FileSelectInput,
+ * CompactToolbarPlugin)가 공유하는 최대 파일 크기. 경로마다 따로 정의하면 한도가 어긋나
+ * 사용자 혼란이 생기므로 단일 출처로 둔다.
+ */
+export declare const MAX_FILE_SIZE: number;

package/dist/patterns/LexicalEditor/uploadConstants.js

@@ -0,0 +1,4 @@
+//#region src/cds/patterns/LexicalEditor/uploadConstants.ts
+var e = 1024 * 1024 * 1024;
+//#endregion
+export { e as MAX_FILE_SIZE };