@owp/core 2.5.9 → 2.5.11

package/dist/features/themePreview/dialogs/ThemePreviewDialog.js

@@ -1,55 +1,55 @@
-var xe = Object.defineProperty;
-var n = (r, i) => xe(r, "name", { value: i, configurable: !0 });
-import { jsx as t, jsxs as f } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
-import { defaultSnackbarTheme as Pe } from "../configs/snackbar.js";
-import { themesConfig as Ce } from "../configs/presets.js";
-import { defaultSettingsConfig as Te } from "../configs/settings.js";
-import { useConfirm as be } from "../../../hooks/useConfirm.js";
-import { readZipEntryJson as Ee, saveAsZipFile as Se } from "../../../utils/zipUtil.js";
-import ye from "../../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/DownloadOutlined.js";
-import Ae from "../../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/RestoreOutlined.js";
-import Fe from "../../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/SaveOutlined.js";
-import Le from "../../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/UploadFileOutlined.js";
-import { Button as h, Typography as W, TextField as ke } from "@mui/material";
-import { useDialogs as _e } from "@toolpad/core/useDialogs";
-import { enqueueSnackbar as m } from "notistack";
-import { useState as k, useRef as u, useEffect as v } from "react";
-import { useThemePreview as Re } from "../hooks/useThemePreview.js";
-import { ThemePreviewControls as Ie } from "../components/ThemePreviewControls.js";
-import { ThemePreviewCanvas as Me } from "../components/ThemePreviewCanvas.js";
-import { resetThemePreviewSessionState as Ne } from "../utils/themePreviewSettings.js";
-import { createThemePreviewExportData as De, createThemePreviewAppConfigFiles as Ve } from "../utils/themePreviewExport.js";
-import { OwpDialog as j } from "../../../components/OwpDialog/OwpDialog.js";
-const Oe = Ce, We = ".owp,.zip,application/zip", O = 300 * 1e3, je = 2 * 1e3, ze = 15 * 1e3;
-function Be(r) {
-  const i = De(r);
+var ve = Object.defineProperty;
+var n = (r, i) => ve(r, "name", { value: i, configurable: !0 });
+import { jsx as t, jsxs as m } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
+import { defaultSnackbarTheme as ge } from "../configs/snackbar.js";
+import { themesConfig as we } from "../configs/presets.js";
+import { defaultSettingsConfig as xe } from "../configs/settings.js";
+import { useConfirm as Pe } from "../../../hooks/useConfirm.js";
+import { readZipEntryJson as Ce, saveAsZipFile as Te } from "../../../utils/zipUtil.js";
+import be from "../../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/DownloadOutlined.js";
+import Se from "../../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/RestoreOutlined.js";
+import Ee from "../../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/SaveOutlined.js";
+import ye from "../../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/UploadFileOutlined.js";
+import { Button as h, Typography as M, TextField as Ae } from "@mui/material";
+import { useDialogs as ke } from "@toolpad/core/useDialogs";
+import { enqueueSnackbar as d } from "notistack";
+import { useState as I, useRef as u, useEffect as g } from "react";
+import { useThemePreview as Le } from "../hooks/useThemePreview.js";
+import { ThemePreviewControls as Fe } from "../components/ThemePreviewControls.js";
+import { ThemePreviewCanvas as Ne } from "../components/ThemePreviewCanvas.js";
+import { resetThemePreviewSessionState as _e } from "../utils/themePreviewSettings.js";
+import { createThemePreviewExportData as Re, createThemePreviewAppConfigFiles as De } from "../utils/themePreviewExport.js";
+import { OwpDialog as V } from "../../../components/OwpDialog/OwpDialog.js";
+const Me = we, Ie = ".owp,.zip,application/zip", D = 300 * 1e3, Ve = 2 * 1e3, Oe = 15 * 1e3;
+function je(r) {
+  const i = Re(r);
   return [
-    ...Ve(r).map(({ fileName: l, content: p }) => ({
-      fileName: l,
-      blob: new Blob([p], {
+    ...De(r).map(({ fileName: s, content: f }) => ({
+      fileName: s,
+      blob: new Blob([f], {
         type: "text/plain;charset=utf-8"
       })
     })),
-    ...Object.entries(i).map(([l, p]) => ({
-      fileName: `preview/${l}.json`,
-      blob: new Blob([JSON.stringify(p, null, 2)], {
+    ...Object.entries(i).map(([s, f]) => ({
+      fileName: `preview/${s}.json`,
+      blob: new Blob([JSON.stringify(f, null, 2)], {
         type: "application/json"
       })
     }))
   ];
 }
-n(Be, "createThemePreviewArchiveFiles");
-function Ue(r) {
+n(je, "createThemePreviewArchiveFiles");
+function ze(r) {
   var i;
   return (r == null ? void 0 : r.defaultSnackbarProviderProps) ?? ((i = r == null ? void 0 : r.defaultSettingsConfig) == null ? void 0 : i.snackbarProviderProps);
 }
-n(Ue, "getThemePreviewArchiveProviderProps");
-function He(r) {
+n(ze, "getThemePreviewArchiveProviderProps");
+function We(r) {
   const i = r.trim().replace(/[^0-9A-Za-z가-힣 _-]+/g, "").replace(/\s+/g, "-").replace(/-+/g, "-").replace(/^[-_]+|[-_]+$/g, "");
   return i ? `theme-preview-config-${i}` : "theme-preview-config";
 }
-n(He, "getThemePreviewConfigFileTitle");
-const g = {
+n(We, "getThemePreviewConfigFileTitle");
+const p = {
   "&.MuiButton-root": {
     fontSize: "1.3rem",
     letterSpacing: "0.04rem"
@@ -68,7 +68,7 @@ const g = {
   minHeight: 42,
   px: 2.25,
   whiteSpace: "nowrap"
-}, F = {
+}, A = {
   "&.Mui-disabled": {
     backgroundColor: "#e5e7eb",
     borderColor: "#e5e7eb",
@@ -81,7 +81,7 @@ const g = {
   backgroundColor: "#1ea3e6",
   border: "1px solid #1ea3e6",
   color: "#ffffff"
-}, L = {
+}, k = {
   "&.Mui-disabled": {
     backgroundColor: "#ffffff",
     borderColor: "#d1d5db",
@@ -94,211 +94,205 @@ const g = {
   backgroundColor: "#ffffff",
   border: "1px solid #111827",
   color: "#111827"
-}, Ke = "#111827", Ze = /* @__PURE__ */ n(({
+}, He = "#111827", Be = /* @__PURE__ */ n(({
   open: r,
   payload: i,
-  onClose: w
+  onClose: v
 }) => {
-  const [l, p] = k((i == null ? void 0 : i.initialFileName) ?? "");
+  const [s, f] = I((i == null ? void 0 : i.initialFileName) ?? "");
   return /* @__PURE__ */ t(
-    j,
+    V,
     {
       title: "설정파일 저장",
       open: r,
       maxWidth: "xs",
-      onClose: /* @__PURE__ */ n(() => w(void 0), "onClose"),
-      onConfirm: /* @__PURE__ */ n(() => w(l), "onConfirm"),
+      onClose: /* @__PURE__ */ n(() => v(void 0), "onClose"),
+      onConfirm: /* @__PURE__ */ n(() => v(s), "onConfirm"),
       contentProps: {
         sx: {
           minWidth: 360,
           p: 3
         }
       },
-      children: /* @__PURE__ */ f("div", { className: "flex flex-col gap-12", children: [
+      children: /* @__PURE__ */ m("div", { className: "flex flex-col gap-12", children: [
         /* @__PURE__ */ t(
-          ke,
+          Ae,
           {
             label: "저장 이름",
-            value: l,
+            value: s,
             placeholder: "저장 이름 입력",
-            onChange: /* @__PURE__ */ n((b) => {
-              p(b.target.value);
+            onChange: /* @__PURE__ */ n((w) => {
+              f(w.target.value);
             }, "onChange")
           }
         ),
-        /* @__PURE__ */ t(W, { variant: "body2", color: "text.secondary", children: "저장 확장자는 `.owp`로 고정됩니다." })
+        /* @__PURE__ */ t(M, { variant: "body2", color: "text.secondary", children: "저장 확장자는 `.owp`로 고정됩니다." })
       ] })
     }
   );
-}, "ThemePreviewSaveDialog"), hn = /* @__PURE__ */ n(({
+}, "ThemePreviewSaveDialog"), fn = /* @__PURE__ */ n(({
   open: r,
   payload: i,
-  onClose: w
+  onClose: v
 }) => {
-  const [l, p] = k(""), [b, _] = k(!1), R = u(null), I = u(null), x = u(null), E = u(!1), M = u(Date.now()), N = u(!1), S = u(() => {
-  }), c = u(null), z = _e(), { confirmSave: B } = be(), {
-    activeSection: d,
-    canApplyToMain: U,
-    draftSettings: y,
-    hasTemporaryChanges: A,
-    hasTemporarySnapshot: H,
-    presetOptions: K,
-    resetVersion: Z,
-    selectedModes: q,
-    selectedPresetKeys: $,
-    setActiveSection: J,
-    handlePaletteValueChange: Y,
-    handlePaletteValuesChange: G,
-    handlePaletteValueReset: Q,
-    handlePaletteValuesReset: X,
-    handleApplyToMain: ee,
-    handleLoadSettings: ne,
-    handlePresetKeyChange: te,
-    handlePresetModeChange: re,
-    handleReset: ie,
-    handleTemporaryLoad: oe,
+  const [s, f] = I(""), w = u(null), L = u(null), x = u(null), b = u(!1), F = u(Date.now()), N = u(!1), S = u(() => {
+  }), O = ke(), { confirmSave: j } = Pe(), {
+    activeSection: c,
+    canApplyToMain: z,
+    draftSettings: E,
+    hasTemporaryChanges: y,
+    hasTemporarySnapshot: W,
+    presetOptions: H,
+    resetVersion: B,
+    selectedModes: U,
+    selectedPresetKeys: K,
+    setActiveSection: Z,
+    handlePaletteValueChange: $,
+    handlePaletteValuesChange: J,
+    handlePaletteValueReset: q,
+    handlePaletteValuesReset: Y,
+    handleApplyToMain: G,
+    handleLoadSettings: Q,
+    handlePresetKeyChange: X,
+    handlePresetModeChange: ee,
+    handleReset: ne,
+    handleTemporaryLoad: te,
     handleTemporarySave: P
-  } = Re({
+  } = Le({
     initialSection: i == null ? void 0 : i.initialSection,
     initialPresetKeys: {
       main: "light1",
       navbar: "light2",
       toolbar: "surfaceDark"
     },
-    presetThemes: Oe,
-    resetTheme: Te.theme
-  }), D = d === "main" || d === "navbar" || d === "toolbar", ae = D ? q[d] : "light", se = D ? $[d] : "", o = /* @__PURE__ */ n(() => {
-    M.current = Date.now();
-  }, "handleThemePreviewInteraction"), le = /* @__PURE__ */ n(async (e) => {
-    await Se(Be(y), {
-      fileTitle: He(e),
+    presetThemes: Me,
+    resetTheme: xe.theme
+  }), _ = c === "main" || c === "navbar" || c === "toolbar", re = _ ? U[c] : "light", ie = _ ? K[c] : "", o = /* @__PURE__ */ n(() => {
+    F.current = Date.now();
+  }, "handleThemePreviewInteraction"), oe = /* @__PURE__ */ n(async (e) => {
+    await Te(je(E), {
+      fileTitle: We(e),
       archiveExtension: "owp",
       preserveFileNames: !0
     });
-  }, "handleSaveConfigFiles"), ce = /* @__PURE__ */ n(async () => {
-    const e = await z.open(Ze, {
-      initialFileName: l
+  }, "handleSaveConfigFiles"), ae = /* @__PURE__ */ n(async () => {
+    const e = await O.open(Be, {
+      initialFileName: s
     });
-    e !== void 0 && (p(e), await le(e));
-  }, "handleOpenSaveDialog"), de = /* @__PURE__ */ n(() => {
+    e !== void 0 && (f(e), await oe(e));
+  }, "handleOpenSaveDialog"), le = /* @__PURE__ */ n(() => {
     var e;
-    (e = I.current) == null || e.click();
-  }, "handleOpenZipFile"), me = /* @__PURE__ */ n(() => {
-    P("manual"), m("임시 저장을 완료했습니다.", {
+    (e = L.current) == null || e.click();
+  }, "handleOpenZipFile"), se = /* @__PURE__ */ n(() => {
+    P("manual"), d("임시 저장을 완료했습니다.", {
       variant: "success"
     });
-  }, "handleManualTemporarySave"), ue = /* @__PURE__ */ n(() => {
-    if (!oe()) {
-      m("불러올 임시 저장 데이터가 없습니다.", {
+  }, "handleManualTemporarySave"), ce = /* @__PURE__ */ n(() => {
+    if (!te()) {
+      d("불러올 임시 저장 데이터가 없습니다.", {
         variant: "warning"
       });
       return;
     }
-    m("임시 저장 데이터를 불러왔습니다.", {
+    d("임시 저장 데이터를 불러왔습니다.", {
       variant: "success"
     });
-  }, "handleManualTemporaryLoad"), fe = /* @__PURE__ */ n(async () => {
-    A && (await B({
+  }, "handleManualTemporaryLoad"), de = /* @__PURE__ */ n(async () => {
+    y && (await j({
       title: "변경된 값을 저장하겠습니까?"
-    }) ? (P("manual"), m("임시 저장되었습니다. 다시 실행하면 저장된 데이터를 불러옵니다.", {
+    }) ? (P("manual"), d("임시 저장되었습니다. 다시 실행하면 저장된 데이터를 불러옵니다.", {
       variant: "info"
-    })) : Ne()), w(void 0);
-  }, "handleDialogClose"), pe = /* @__PURE__ */ n(async (e) => {
-    var s, C;
-    const a = (s = e.target.files) == null ? void 0 : s[0];
+    })) : _e()), v(void 0);
+  }, "handleDialogClose"), me = /* @__PURE__ */ n(async (e) => {
+    var l, C;
+    const a = (l = e.target.files) == null ? void 0 : l[0];
     if (a)
       try {
-        const T = await Ee(
+        const T = await Ce(
           a,
-          (we) => we.endsWith("settings.json")
+          (pe) => pe.endsWith("settings.json")
         );
         if (!T) {
-          m("settings.json 파일이 없습니다.", {
+          d("settings.json 파일이 없습니다.", {
             variant: "warning"
           });
           return;
         }
-        const V = (C = T.defaultSettingsConfig) == null ? void 0 : C.theme, ve = T.defaultSnackbarTheme ?? Pe, ge = Ue(T);
-        if (!V) {
-          m("theme 설정을 읽지 못했습니다.", {
+        const R = (C = T.defaultSettingsConfig) == null ? void 0 : C.theme, ue = T.defaultSnackbarTheme ?? ge, he = ze(T);
+        if (!R) {
+          d("theme 설정을 읽지 못했습니다.", {
             variant: "warning"
           });
           return;
         }
-        ne(V, ve, ge), m("설정 파일을 로드하고 메인 화면에 적용했습니다.", {
+        Q(R, ue, he), d("설정 파일을 로드하고 메인 화면에 적용했습니다.", {
           variant: "success"
         });
       } catch {
-        m("설정 파일을 불러오는 중 오류가 발생했습니다.", {
+        d("설정 파일을 불러오는 중 오류가 발생했습니다.", {
           variant: "error"
         });
       } finally {
         e.target.value = "";
       }
-  }, "handleZipFileChange"), he = /* @__PURE__ */ n((e) => {
-    e !== d && (c.current && (cancelAnimationFrame(c.current), c.current = null), _(!0), c.current = requestAnimationFrame(() => {
-      J(e), c.current = requestAnimationFrame(() => {
-        _(!1), c.current = null;
-      });
-    }));
+  }, "handleZipFileChange"), fe = /* @__PURE__ */ n((e) => {
+    e !== c && Z(e);
   }, "handleSectionChange");
-  return v(() => {
+  return g(() => {
     S.current = P;
-  }, [P]), v(() => {
-    N.current = A;
-  }, [A]), v(() => {
-    const e = R.current;
+  }, [P]), g(() => {
+    N.current = y;
+  }, [y]), g(() => {
+    const e = w.current;
     if (!e)
       return;
     const a = /* @__PURE__ */ n(() => {
-      E.current = !0, o();
-    }, "handlePointerDown"), s = /* @__PURE__ */ n(() => {
-      E.current = !1, o();
+      b.current = !0, o();
+    }, "handlePointerDown"), l = /* @__PURE__ */ n(() => {
+      b.current = !1, o();
     }, "handlePointerUp");
-    return e.addEventListener("pointerdown", a), e.addEventListener("pointerup", s), e.addEventListener("pointercancel", s), e.addEventListener("keydown", o), e.addEventListener("input", o), e.addEventListener("change", o), e.addEventListener("focusin", o), () => {
-      e.removeEventListener("pointerdown", a), e.removeEventListener("pointerup", s), e.removeEventListener("pointercancel", s), e.removeEventListener("keydown", o), e.removeEventListener("input", o), e.removeEventListener("change", o), e.removeEventListener("focusin", o);
+    return e.addEventListener("pointerdown", a), e.addEventListener("pointerup", l), e.addEventListener("pointercancel", l), e.addEventListener("keydown", o), e.addEventListener("input", o), e.addEventListener("change", o), e.addEventListener("focusin", o), () => {
+      e.removeEventListener("pointerdown", a), e.removeEventListener("pointerup", l), e.removeEventListener("pointercancel", l), e.removeEventListener("keydown", o), e.removeEventListener("input", o), e.removeEventListener("change", o), e.removeEventListener("focusin", o);
     };
-  }, []), v(() => {
+  }, []), g(() => {
     const e = /* @__PURE__ */ n(() => {
       x.current && (window.clearTimeout(x.current), x.current = null);
-    }, "clearAutoSaveTimeout"), a = /* @__PURE__ */ n((s) => {
+    }, "clearAutoSaveTimeout"), a = /* @__PURE__ */ n((l) => {
       e(), x.current = window.setTimeout(() => {
-        const C = E.current || Date.now() - M.current < je;
+        const C = b.current || Date.now() - F.current < Ve;
         if (document.hidden || C) {
-          a(ze);
+          a(Oe);
           return;
         }
-        S.current("auto"), a(O);
-      }, s);
+        S.current("auto"), a(D);
+      }, l);
     }, "scheduleAutoSave");
-    return a(O), () => {
+    return a(D), () => {
       e();
     };
-  }, []), v(() => {
+  }, []), g(() => {
     const e = /* @__PURE__ */ n(() => {
       N.current && S.current("manual");
     }, "handlePageExit");
     return window.addEventListener("pagehide", e), window.addEventListener("beforeunload", e), () => {
       window.removeEventListener("pagehide", e), window.removeEventListener("beforeunload", e);
     };
-  }, []), v(() => () => {
-    c.current && cancelAnimationFrame(c.current);
   }, []), /* @__PURE__ */ t(
-    j,
+    V,
     {
-      title: /* @__PURE__ */ f("div", { className: "flex w-full flex-wrap items-center justify-between gap-12", children: [
-        /* @__PURE__ */ t(W, { variant: "h6", fontWeight: 700, sx: { color: Ke }, children: "OWP Theme Preview" }),
-        /* @__PURE__ */ f("div", { className: "flex flex-wrap items-center gap-8", children: [
+      title: /* @__PURE__ */ m("div", { className: "flex w-full flex-wrap items-center justify-between gap-12", children: [
+        /* @__PURE__ */ t(M, { variant: "h6", fontWeight: 700, sx: { color: He }, children: "OWP Theme Preview" }),
+        /* @__PURE__ */ m("div", { className: "flex flex-wrap items-center gap-8", children: [
           /* @__PURE__ */ t(
             h,
             {
               size: "small",
               variant: "outlined",
               sx: {
-                ...g,
-                ...L
+                ...p,
+                ...k
               },
-              onClick: ie,
+              onClick: ne,
               children: "기본 설정으로 되돌리기"
             }
           ),
@@ -307,33 +301,45 @@ const g = {
             {
               size: "small",
               variant: "contained",
-              disabled: !U,
+              disabled: !z,
               sx: {
-                ...g,
-                ...F
+                ...p,
+                ...A
               },
-              onClick: ee,
+              onClick: G,
               children: "메인에 적용해보기"
             }
           )
         ] })
       ] }),
       open: r,
-      maxWidth: "xl",
+      fullScreen: !0,
       canConfirm: !1,
-      onClose: fe,
-      actions: /* @__PURE__ */ f("div", { className: "grid min-w-0 flex-1 grid-cols-[1fr_auto_1fr] items-center gap-y-8", children: [
-        /* @__PURE__ */ f("div", { className: "flex flex-wrap items-center justify-start gap-8", children: [
+      onClose: de,
+      slotProps: {
+        paper: {
+          sx: {
+            borderRadius: 0,
+            display: "flex",
+            flexDirection: "column",
+            height: "100dvh",
+            m: 0,
+            maxHeight: "100dvh"
+          }
+        }
+      },
+      actions: /* @__PURE__ */ m("div", { className: "grid min-w-0 flex-1 grid-cols-[1fr_auto_1fr] items-center gap-y-8", children: [
+        /* @__PURE__ */ m("div", { className: "flex flex-wrap items-center justify-start gap-8", children: [
           /* @__PURE__ */ t(
             h,
             {
               variant: "contained",
-              startIcon: /* @__PURE__ */ t(Fe, {}),
+              startIcon: /* @__PURE__ */ t(Ee, {}),
               sx: {
-                ...g,
-                ...F
+                ...p,
+                ...A
               },
-              onClick: me,
+              onClick: se,
               children: "임시 저장하기"
             }
           ),
@@ -341,28 +347,28 @@ const g = {
             h,
             {
               variant: "outlined",
-              startIcon: /* @__PURE__ */ t(Ae, {}),
-              disabled: !H,
+              startIcon: /* @__PURE__ */ t(Se, {}),
+              disabled: !W,
               sx: {
-                ...g,
-                ...L
+                ...p,
+                ...k
               },
-              onClick: ue,
+              onClick: ce,
               children: "임시 저장 불러오기"
             }
           )
         ] }),
-        /* @__PURE__ */ f("div", { className: "flex flex-wrap items-center justify-center gap-8", children: [
+        /* @__PURE__ */ m("div", { className: "flex flex-wrap items-center justify-center gap-8", children: [
           /* @__PURE__ */ t(
             h,
             {
               variant: "contained",
-              startIcon: /* @__PURE__ */ t(ye, {}),
+              startIcon: /* @__PURE__ */ t(be, {}),
               sx: {
-                ...g,
-                ...F
+                ...p,
+                ...A
               },
-              onClick: ce,
+              onClick: ae,
               children: "설정파일 저장하기"
             }
           ),
@@ -370,78 +376,79 @@ const g = {
             h,
             {
               variant: "outlined",
-              startIcon: /* @__PURE__ */ t(Le, {}),
+              startIcon: /* @__PURE__ */ t(ye, {}),
               sx: {
-                ...g,
-                ...L
+                ...p,
+                ...k
               },
-              onClick: de,
+              onClick: le,
               children: "설정파일 불러오기"
             }
           )
         ] }),
         /* @__PURE__ */ t("div", {})
       ] }),
-      slotProps: {
-        paper: {
-          sx: {
-            width: "min(1680px, calc(100vw - 48px))",
-            maxWidth: "none",
-            height: "calc(100vh - 48px)",
-            m: 3
-          }
-        }
-      },
       contentProps: {
         sx: {
+          display: "flex",
+          flex: 1,
+          flexDirection: "column",
           height: "100%",
+          minHeight: 0,
+          overflow: "hidden",
           p: 3
         }
       },
-      children: /* @__PURE__ */ f("div", { ref: R, className: "flex h-full min-h-0 flex-col gap-12", children: [
-        /* @__PURE__ */ t(
-          "input",
-          {
-            ref: I,
-            type: "file",
-            accept: We,
-            className: "hidden",
-            onChange: pe
-          }
-        ),
-        /* @__PURE__ */ f("div", { className: "grid min-h-0 flex-1 gap-20 xl:grid-cols-[420px_minmax(0,1fr)]", children: [
-          /* @__PURE__ */ t(
-            Ie,
-            {
-              activeSection: d,
-              presetOptions: K,
-              selectedMode: ae,
-              selectedPresetKey: se,
-              settings: y,
-              resetVersion: Z,
-              onSectionChange: he,
-              onPaletteValueChange: Y,
-              onPaletteValuesChange: G,
-              onPaletteValueReset: Q,
-              onPaletteValuesReset: X,
-              onPresetKeyChange: te,
-              onPresetModeChange: re
-            }
-          ),
-          /* @__PURE__ */ t(
-            Me,
-            {
-              activeSection: d,
-              isLoading: b,
-              settings: y
-            }
-          )
-        ] })
-      ] })
+      children: /* @__PURE__ */ m(
+        "div",
+        {
+          ref: w,
+          className: "flex h-full min-h-0 flex-col gap-12 overflow-hidden",
+          children: [
+            /* @__PURE__ */ t(
+              "input",
+              {
+                ref: L,
+                type: "file",
+                accept: Ie,
+                className: "hidden",
+                onChange: me
+              }
+            ),
+            /* @__PURE__ */ m("div", { className: "grid min-h-0 flex-1 gap-20 overflow-hidden xl:grid-cols-[420px_minmax(0,1fr)]", children: [
+              /* @__PURE__ */ t("div", { className: "min-h-0", children: /* @__PURE__ */ t(
+                Fe,
+                {
+                  activeSection: c,
+                  presetOptions: H,
+                  selectedMode: re,
+                  selectedPresetKey: ie,
+                  settings: E,
+                  resetVersion: B,
+                  onSectionChange: fe,
+                  onPaletteValueChange: $,
+                  onPaletteValuesChange: J,
+                  onPaletteValueReset: q,
+                  onPaletteValuesReset: Y,
+                  onPresetKeyChange: X,
+                  onPresetModeChange: ee
+                }
+              ) }),
+              /* @__PURE__ */ t("div", { className: "flex min-h-0 min-w-0 overflow-hidden", children: /* @__PURE__ */ t(
+                Ne,
+                {
+                  activeSection: c,
+                  settings: E
+                }
+              ) })
+            ] })
+          ]
+        }
+      )
     }
   );
 }, "ThemePreviewDialog");
 export {
-  hn as ThemePreviewDialog
+  fn as ThemePreviewDialog
 };
 //# sourceMappingURL=ThemePreviewDialog.js.map