@owp/core 2.5.14 → 2.5.16

package/dist/features/themePreview/components/ThemePreviewColorField.js

@@ -1,16 +1,18 @@
-var oe = Object.defineProperty;
-var l = (t, e) => oe(t, "name", { value: e, configurable: !0 });
-import { jsx as n, jsxs as d, Fragment as ae } 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";
+var ne = Object.defineProperty;
+var l = (t, e) => ne(t, "name", { value: e, configurable: !0 });
+import { jsx as o, jsxs as d, Fragment as ae } 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 { IconButton as ie, Typography as k, InputAdornment as ue, MenuItem as ce, TextField as Q, Box as g, Divider as se, Popover as pe, Button as de } from "@mui/material";
 import me 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/RestartAltOutlined.js";
-import { blue as he, lightBlue as fe, cyan as xe, teal as ge, green as we, amber as be, orange as ve, deepOrange as Pe, red as ye, pink as Ce, purple as ke, deepPurple as Te, indigo as Ve, grey as Ie, blueGrey as Ee } from "@mui/material/colors";
+import { blue as he, lightBlue as fe, cyan as xe, teal as ge, green as we, amber as be, orange as Pe, deepOrange as ve, red as ye, pink as Ce, purple as ke, deepPurple as Te, indigo as Ve, grey as Ie, blueGrey as Ee } from "@mui/material/colors";
 import { useState as w, useRef as T, useEffect as b } from "react";
 import { getThemePreviewPaletteValue as Ae } from "../utils/themePreviewSettings.js";
-import { getColorAlphaValue as Me, toColorPickerValue as V, applyColorPickerValue as X } from "../utils/color.js";
-const Be = {
+import { getColorAlphaValue as Be, toColorPickerValue as V, applyColorPickerValue as X } from "../utils/color.js";
+import { owpDark as Me } from "../../../colors/palettes/dark.js";
+import { skyBlue as De } from "../../../colors/palettes/skyBlue.js";
+const Re = {
   "px-number": "px",
   "rem-number": "rem"
-}, Re = [
+}, ze = [
   "50",
   "100",
   "200",
@@ -25,15 +27,17 @@ const Be = {
   "A200",
   "A400",
   "A700"
-], ze = [
+], Se = [
+  ["OWP Dark", Me],
+  ["OWP Sky Blue", De],
   ["Blue", he],
   ["Light Blue", fe],
   ["Cyan", xe],
   ["Teal", ge],
   ["Green", we],
   ["Amber", be],
-  ["Orange", ve],
-  ["Deep Orange", Pe],
+  ["Orange", Pe],
+  ["Deep Orange", ve],
   ["Red", ye],
   ["Pink", Ce],
   ["Purple", ke],
@@ -41,74 +45,74 @@ const Be = {
   ["Indigo", Ve],
   ["Grey", Ie],
   ["Blue Grey", Ee]
-], re = ze.map(([t, e]) => ({
+], re = Se.map(([t, e]) => ({
   label: t,
-  colors: Re.reduce((o, m) => {
+  colors: ze.reduce((n, m) => {
     const f = e[m];
-    return f && o.push({
+    return f && n.push({
       key: `${t}-${m}`,
       shade: m,
       value: f
-    }), o;
+    }), n;
   }, [])
-})), De = new Set(
+})), We = new Set(
   re.flatMap(
     (t) => t.colors.map((e) => e.value.toLowerCase())
   )
-), Se = 500, Z = 32, ee = 20;
+), Oe = 500, Z = 32, ee = 20;
 function _e(t, e) {
   return t.replace(new RegExp(`${e}$`, "i"), "");
 }
 l(_e, "getUnitInputDisplayValue");
 function te(t) {
-  const e = t.replace(/[^0-9.,]/g, "").replace(/,/g, "."), o = e.indexOf(".");
-  if (o < 0)
+  const e = t.replace(/[^0-9.,]/g, "").replace(/,/g, "."), n = e.indexOf(".");
+  if (n < 0)
     return e;
-  const m = e.slice(0, o), f = e.slice(o + 1).replace(/\./g, "");
+  const m = e.slice(0, n), f = e.slice(n + 1).replace(/\./g, "");
   return `${m}.${f}`;
 }
 l(te, "normalizeUnitInputDisplayValue");
-function We(t) {
+function $e(t) {
   const e = te(t);
   return !e || e === "." ? "" : e.startsWith(".") ? `0${e}` : e.endsWith(".") ? e.slice(0, -1) : e;
 }
-l(We, "normalizeCommittedUnitInputDisplayValue");
-function Oe(t, e) {
-  const o = We(t);
-  return o ? `${o}${e}` : "";
+l($e, "normalizeCommittedUnitInputDisplayValue");
+function Fe(t, e) {
+  const n = $e(t);
+  return n ? `${n}${e}` : "";
 }
-l(Oe, "normalizeUnitInputValue");
-function $e(t) {
-  return (t ? Be[t] : null) ?? null;
+l(Fe, "normalizeUnitInputValue");
+function He(t) {
+  return (t ? Re[t] : null) ?? null;
 }
-l($e, "getUnitValueFormat");
-function qe({
+l(He, "getUnitValueFormat");
+function Xe({
   disabled: t = !1,
   definition: e,
-  resetVersion: o,
+  resetVersion: n,
   sectionKey: m,
   settings: f,
-  onChange: v,
+  onChange: P,
   onReset: I
 }) {
   var Y, J;
-  const [P, E] = w(null), W = T(null), a = Ae(f, m, e.path), c = $e(e.valueFormat), O = e.showColorPicker !== !1, $ = e.allowAlpha ? Me(a) : null, F = [e.description];
+  const [v, E] = w(null), O = T(null), a = Ae(f, m, e.path), c = He(e.valueFormat), _ = e.showColorPicker !== !1, $ = e.allowAlpha ? Be(a) : null, F = [e.description];
   e.allowAlpha && F.push(
     $ ? `알파값은 ${$}로 고정되고 색상만 변경됩니다. Pick 또는 MUI로 색상만 변경할 수 있습니다.` : "알파값은 고정되고 색상만 변경됩니다. Pick 또는 MUI로 색상만 변경할 수 있습니다."
   );
-  const le = F.filter(Boolean).join(" "), A = !!((Y = e.options) != null && Y.length), M = !!(e.allowAlpha && O && !A && !c), x = c ? _e(a, c) : a, H = O, B = H ? V(a).toLowerCase() : null, y = B && De.has(B) ? B : null, h = !A && !M, [R, z] = w(x), [L, C] = w(!1), [U, D] = w(V(a)), [S, _] = w(!1), i = T(null), N = T(x), G = T(a);
+  const le = F.filter(Boolean).join(" "), A = !!((Y = e.options) != null && Y.length), B = !!(e.allowAlpha && _ && !A && !c), x = c ? _e(a, c) : a, H = _, M = H ? V(a).toLowerCase() : null, y = M && We.has(M) ? M : null, h = !A && !B, [D, R] = w(x), [L, C] = w(!1), [U, z] = w(V(a)), [S, W] = w(!1), i = T(null), N = T(x), G = T(a);
   N.current = x, G.current = a, b(() => {
-    !h || L || z(x);
+    !h || L || R(x);
   }, [h, x, L]), b(() => {
-    S || D(V(a));
+    S || z(V(a));
   }, [S, a]), b(() => () => {
     i.current && window.clearTimeout(i.current);
   }, []), b(() => {
-    if (!P || !y)
+    if (!v || !y)
       return;
     const r = window.requestAnimationFrame(() => {
       var s;
-      const u = (s = W.current) == null ? void 0 : s.querySelector(
+      const u = (s = O.current) == null ? void 0 : s.querySelector(
         `[data-mui-palette-value="${y}"]`
       );
       u == null || u.scrollIntoView({
@@ -119,18 +123,18 @@ function qe({
     return () => {
       window.cancelAnimationFrame(r);
     };
-  }, [y, P]), b(() => {
-    typeof o > "u" || (i.current && (window.clearTimeout(i.current), i.current = null), z(N.current), C(!1), D(V(G.current)), _(!1));
-  }, [o]);
+  }, [y, v]), b(() => {
+    typeof n > "u" || (i.current && (window.clearTimeout(i.current), i.current = null), R(N.current), C(!1), z(V(G.current)), W(!1));
+  }, [n]);
   const j = /* @__PURE__ */ l((r) => {
-    v(
+    P(
       e.path,
-      c ? Oe(r, c) : r
+      c ? Fe(r, c) : r
     );
   }, "commitBufferedTextValue"), K = /* @__PURE__ */ l((r) => {
-    i.current && (window.clearTimeout(i.current), i.current = null), _(!1), v(e.path, X(a, r));
-  }, "commitBufferedPickerValue"), q = I || c ? /* @__PURE__ */ n(ue, { position: "end", children: /* @__PURE__ */ d("div", { className: "flex items-center gap-6 pr-2", children: [
-    I ? /* @__PURE__ */ n(
+    i.current && (window.clearTimeout(i.current), i.current = null), W(!1), P(e.path, X(a, r));
+  }, "commitBufferedPickerValue"), q = I || c ? /* @__PURE__ */ o(ue, { position: "end", children: /* @__PURE__ */ d("div", { className: "flex items-center gap-6 pr-2", children: [
+    I ? /* @__PURE__ */ o(
       ie,
       {
         size: "small",
@@ -148,38 +152,38 @@ function qe({
           color: "#6b7280",
           p: 0.25
         },
-        children: /* @__PURE__ */ n(me, { sx: { fontSize: 16 } })
+        children: /* @__PURE__ */ o(me, { sx: { fontSize: 16 } })
       }
     ) : null,
-    c ? /* @__PURE__ */ n(k, { variant: "body2", sx: { whiteSpace: "nowrap" }, children: c }) : null
+    c ? /* @__PURE__ */ o(k, { variant: "body2", sx: { whiteSpace: "nowrap" }, children: c }) : null
   ] }) }) : void 0;
   return /* @__PURE__ */ d("div", { className: "grid grid-cols-[minmax(0,1fr)_144px] items-start gap-12", children: [
-    /* @__PURE__ */ n(
+    /* @__PURE__ */ o(
       Q,
       {
         select: A,
         label: e.label,
         size: "small",
-        value: h ? R : x,
+        value: h ? D : x,
         disabled: t,
         onChange: /* @__PURE__ */ l((r) => {
-          if (M)
+          if (B)
             return;
           const u = c ? te(r.target.value) : r.target.value;
           if (h) {
-            z(u);
+            R(u);
             return;
           }
-          v(e.path, u);
+          P(e.path, u);
         }, "onChange"),
         onFocus: /* @__PURE__ */ l(() => {
           h && C(!0);
         }, "onFocus"),
         onBlur: /* @__PURE__ */ l(() => {
-          h && (C(!1), j(R));
+          h && (C(!1), j(D));
         }, "onBlur"),
         onKeyDown: /* @__PURE__ */ l((r) => {
-          !h || r.key !== "Enter" || (r.preventDefault(), C(!1), j(R), r.currentTarget.blur());
+          !h || r.key !== "Enter" || (r.preventDefault(), C(!1), j(D), r.currentTarget.blur());
         }, "onKeyDown"),
         helperText: le,
         slotProps: {
@@ -187,7 +191,7 @@ function qe({
             ...c ? {
               inputMode: "decimal"
             } : {},
-            ...M ? {
+            ...B ? {
               readOnly: !0
             } : {}
           },
@@ -197,12 +201,12 @@ function qe({
             } : {}
           }
         },
-        children: (J = e.options) == null ? void 0 : J.map((r) => /* @__PURE__ */ n(ce, { value: r.value, children: r.label }, r.value))
+        children: (J = e.options) == null ? void 0 : J.map((r) => /* @__PURE__ */ o(ce, { value: r.value, children: r.label }, r.value))
       }
     ),
     H ? /* @__PURE__ */ d("div", { className: "grid grid-cols-2 gap-6", children: [
       /* @__PURE__ */ d(ae, { children: [
-        /* @__PURE__ */ n(
+        /* @__PURE__ */ o(
           de,
           {
             size: "small",
@@ -220,7 +224,7 @@ function qe({
             children: "MUI"
           }
         ),
-        /* @__PURE__ */ n(
+        /* @__PURE__ */ o(
           Q,
           {
             hiddenLabel: !0,
@@ -230,9 +234,9 @@ function qe({
             disabled: t,
             onChange: /* @__PURE__ */ l((r) => {
               const u = r.target.value;
-              D(u), _(!0), i.current && window.clearTimeout(i.current), i.current = window.setTimeout(() => {
+              z(u), W(!0), i.current && window.clearTimeout(i.current), i.current = window.setTimeout(() => {
                 K(u);
-              }, Se);
+              }, Oe);
             }, "onChange"),
             onBlur: /* @__PURE__ */ l(() => {
               S && K(U);
@@ -276,11 +280,11 @@ function qe({
             }
           }
         ),
-        P ? /* @__PURE__ */ n(
+        v ? /* @__PURE__ */ o(
           pe,
           {
             open: !0,
-            anchorEl: P,
+            anchorEl: v,
             transitionDuration: 0,
             onClose: /* @__PURE__ */ l(() => {
               E(null);
@@ -305,8 +309,8 @@ function qe({
                 }
               }
             },
-            children: /* @__PURE__ */ n("div", { ref: W, className: "flex min-w-0 flex-col gap-10", children: re.map((r, u) => /* @__PURE__ */ d(g, { className: "flex flex-col gap-10", children: [
-              u > 0 ? /* @__PURE__ */ n(se, { flexItem: !0 }) : null,
+            children: /* @__PURE__ */ o("div", { ref: O, className: "flex min-w-0 flex-col gap-10", children: re.map((r, u) => /* @__PURE__ */ d(g, { className: "flex flex-col gap-10", children: [
+              u > 0 ? /* @__PURE__ */ o(se, { flexItem: !0 }) : null,
               /* @__PURE__ */ d(
                 g,
                 {
@@ -319,8 +323,8 @@ function qe({
                     }
                   },
                   children: [
-                    /* @__PURE__ */ n(k, { variant: "caption", color: "text.secondary", children: r.label }),
-                    /* @__PURE__ */ n(
+                    /* @__PURE__ */ o(k, { variant: "caption", color: "text.secondary", children: r.label }),
+                    /* @__PURE__ */ o(
                       g,
                       {
                         sx: {
@@ -339,7 +343,7 @@ function qe({
                               "data-mui-palette-value": s.value.toLowerCase(),
                               "aria-current": p ? "true" : void 0,
                               onClick: /* @__PURE__ */ l(() => {
-                                v(
+                                P(
                                   e.path,
                                   X(a, s.value)
                                 ), E(null);
@@ -350,7 +354,7 @@ function qe({
                                 border: "1px solid",
                                 borderColor: p ? "primary.main" : "divider",
                                 borderRadius: 1,
-                                boxShadow: p ? (ne) => `0 0 0 1px ${ne.palette.primary.main}` : "none",
+                                boxShadow: p ? (oe) => `0 0 0 1px ${oe.palette.primary.main}` : "none",
                                 color: p ? "text.primary" : "text.secondary",
                                 cursor: "pointer",
                                 display: "flex",
@@ -367,7 +371,7 @@ function qe({
                                 }
                               },
                               children: [
-                                /* @__PURE__ */ n(
+                                /* @__PURE__ */ o(
                                   g,
                                   {
                                     sx: {
@@ -380,7 +384,7 @@ function qe({
                                     }
                                   }
                                 ),
-                                /* @__PURE__ */ n(
+                                /* @__PURE__ */ o(
                                   g,
                                   {
                                     component: "span",
@@ -407,8 +411,8 @@ function qe({
         ) : null
       ] }),
       e.allowAlpha ? /* @__PURE__ */ d("div", { className: "col-span-2 flex flex-col gap-2", children: [
-        /* @__PURE__ */ n(k, { variant: "caption", color: "text.secondary", children: "Current" }),
-        /* @__PURE__ */ n(
+        /* @__PURE__ */ o(k, { variant: "caption", color: "text.secondary", children: "Current" }),
+        /* @__PURE__ */ o(
           k,
           {
             variant: "caption",
@@ -418,11 +422,11 @@ function qe({
           }
         )
       ] }) : null
-    ] }) : /* @__PURE__ */ n("div", {})
+    ] }) : /* @__PURE__ */ o("div", {})
   ] });
 }
-l(qe, "ThemePreviewColorField");
+l(Xe, "ThemePreviewColorField");
 export {
-  qe as ThemePreviewColorField
+  Xe as ThemePreviewColorField
 };
 //# sourceMappingURL=ThemePreviewColorField.js.map

package/dist/features/themePreview/components/ThemePreviewColorField.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemePreviewColorField.js","sources":["../../../../src/features/themePreview/components/ThemePreviewColorField.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  Divider,\n  IconButton,\n  InputAdornment,\n  MenuItem,\n  Popover,\n  TextField,\n  Typography,\n} from '@mui/material';\nimport RestartAltOutlinedIcon from '@mui/icons-material/RestartAltOutlined';\nimport {\n  amber,\n  blue,\n  blueGrey,\n  cyan,\n  deepOrange,\n  deepPurple,\n  green,\n  grey,\n  indigo,\n  lightBlue,\n  orange,\n  pink,\n  purple,\n  red,\n  teal,\n} from '@mui/material/colors';\nimport type {\n  ThemePreviewFieldDefinition,\n  ThemePreviewSectionKey,\n  ThemePreviewSettings,\n} from '../types';\nimport {\n  applyColorPickerValue,\n  getColorAlphaValue,\n  getThemePreviewPaletteValue,\n  toColorPickerValue,\n} from '../utils';\nimport { useEffect, useRef, useState } from 'react';\n\ninterface ThemePreviewColorFieldProps {\n  disabled?: boolean;\n  definition: ThemePreviewFieldDefinition;\n  resetVersion?: number;\n  sectionKey: ThemePreviewSectionKey;\n  settings: ThemePreviewSettings;\n  onChange: (path: string, value: string) => void;\n  onReset?: (path: string) => void;\n}\n\nconst themePreviewInputUnits = {\n  'px-number': 'px',\n  'rem-number': 'rem',\n} as const;\n\ntype ThemePreviewInputUnit = (typeof themePreviewInputUnits)[keyof typeof themePreviewInputUnits];\n\nconst themePreviewMuiColorShades = [\n  '50',\n  '100',\n  '200',\n  '300',\n  '400',\n  '500',\n  '600',\n  '700',\n  '800',\n  '900',\n  'A100',\n  'A200',\n  'A400',\n  'A700',\n] as const;\nconst themePreviewMuiColorPalettes = [\n  ['Blue', blue],\n  ['Light Blue', lightBlue],\n  ['Cyan', cyan],\n  ['Teal', teal],\n  ['Green', green],\n  ['Amber', amber],\n  ['Orange', orange],\n  ['Deep Orange', deepOrange],\n  ['Red', red],\n  ['Pink', pink],\n  ['Purple', purple],\n  ['Deep Purple', deepPurple],\n  ['Indigo', indigo],\n  ['Grey', grey],\n  ['Blue Grey', blueGrey],\n] as const;\nconst themePreviewMuiPaletteColorRows = themePreviewMuiColorPalettes.map(([label, palette]) => ({\n  label,\n  colors: themePreviewMuiColorShades.reduce<Array<{\n    key: string;\n    shade: string;\n    value: string;\n  }>>((acc, shade) => {\n    const paletteValue = (palette as Record<string, string>)[shade];\n\n    if (!paletteValue) {\n      return acc;\n    }\n\n    acc.push({\n      key: `${label}-${shade}`,\n      shade,\n      value: paletteValue,\n    });\n\n    return acc;\n  }, []),\n}));\nconst themePreviewMuiPaletteColorValueSet = new Set(\n  themePreviewMuiPaletteColorRows.flatMap((paletteRow) =>\n    paletteRow.colors.map((colorItem) => colorItem.value.toLowerCase()),\n  ),\n);\nconst THEME_PREVIEW_COLOR_PICKER_APPLY_DELAY_MS = 500;\nconst THEME_PREVIEW_SMALL_FIELD_HEIGHT = 32;\nconst THEME_PREVIEW_PICKER_SWATCH_HEIGHT = 20;\n\nfunction getUnitInputDisplayValue(value: string, unit: ThemePreviewInputUnit) {\n  return value.replace(new RegExp(`${unit}$`, 'i'), '');\n}\n\nfunction normalizeUnitInputDisplayValue(value: string) {\n  const sanitizedValue = value.replace(/[^0-9.,]/g, '').replace(/,/g, '.');\n  const decimalPointIndex = sanitizedValue.indexOf('.');\n\n  if (decimalPointIndex < 0) {\n    return sanitizedValue;\n  }\n\n  const integerPart = sanitizedValue.slice(0, decimalPointIndex);\n  const decimalPart = sanitizedValue.slice(decimalPointIndex + 1).replace(/\\./g, '');\n\n  return `${integerPart}.${decimalPart}`;\n}\n\nfunction normalizeCommittedUnitInputDisplayValue(value: string) {\n  const normalizedValue = normalizeUnitInputDisplayValue(value);\n\n  if (!normalizedValue || normalizedValue === '.') {\n    return '';\n  }\n\n  if (normalizedValue.startsWith('.')) {\n    return `0${normalizedValue}`;\n  }\n\n  if (normalizedValue.endsWith('.')) {\n    return normalizedValue.slice(0, -1);\n  }\n\n  return normalizedValue;\n}\n\nfunction normalizeUnitInputValue(value: string, unit: ThemePreviewInputUnit) {\n  const normalizedValue = normalizeCommittedUnitInputDisplayValue(value);\n\n  return normalizedValue ? `${normalizedValue}${unit}` : '';\n}\n\nfunction getUnitValueFormat(valueFormat?: ThemePreviewFieldDefinition['valueFormat']) {\n  return (valueFormat ? themePreviewInputUnits[valueFormat] : null) ?? null;\n}\n\nexport function ThemePreviewColorField({\n  disabled = false,\n  definition,\n  resetVersion,\n  sectionKey,\n  settings,\n  onChange,\n  onReset,\n}: ThemePreviewColorFieldProps) {\n  const [muiPaletteAnchorElement, setMuiPaletteAnchorElement] = useState<HTMLElement | null>(null);\n  const muiPaletteContentRef = useRef<HTMLDivElement | null>(null);\n  const value = getThemePreviewPaletteValue(settings, sectionKey, definition.path);\n  const unitValueFormat = getUnitValueFormat(definition.valueFormat);\n  const showColorPicker = definition.showColorPicker !== false;\n  const alphaValue = definition.allowAlpha ? getColorAlphaValue(value) : null;\n  const helperText = [definition.description];\n\n  if (definition.allowAlpha) {\n    helperText.push(\n      alphaValue\n        ? `알파값은 ${alphaValue}로 고정되고 색상만 변경됩니다. Pick 또는 MUI로 색상만 변경할 수 있습니다.`\n        : '알파값은 고정되고 색상만 변경됩니다. Pick 또는 MUI로 색상만 변경할 수 있습니다.',\n    );\n  }\n\n  const resolvedHelperText = helperText.filter(Boolean).join(' ');\n  const hasOptions = Boolean(definition.options?.length);\n  const isReadOnlyColorTextInput = Boolean(\n    definition.allowAlpha && showColorPicker && !hasOptions && !unitValueFormat,\n  );\n  const displayValue =\n    unitValueFormat ? getUnitInputDisplayValue(value, unitValueFormat) : value;\n  const hasPickerControls = showColorPicker;\n  const normalizedMuiPaletteValue = hasPickerControls ? toColorPickerValue(value).toLowerCase() : null;\n  const matchedMuiPaletteValue =\n    normalizedMuiPaletteValue && themePreviewMuiPaletteColorValueSet.has(normalizedMuiPaletteValue)\n      ? normalizedMuiPaletteValue\n      : null;\n  const canBufferTextInput = !hasOptions && !isReadOnlyColorTextInput;\n  const [bufferedTextValue, setBufferedTextValue] = useState(displayValue);\n  const [isBufferedTextInputFocused, setIsBufferedTextInputFocused] = useState(false);\n  const [bufferedPickerValue, setBufferedPickerValue] = useState(toColorPickerValue(value));\n  const [isBufferedPickerDirty, setIsBufferedPickerDirty] = useState(false);\n  const colorPickerApplyTimeoutRef = useRef<number | null>(null);\n  const latestDisplayValueRef = useRef(displayValue);\n  const latestValueRef = useRef(value);\n\n  latestDisplayValueRef.current = displayValue;\n  latestValueRef.current = value;\n\n  useEffect(() => {\n    if (!canBufferTextInput || isBufferedTextInputFocused) {\n      return;\n    }\n\n    setBufferedTextValue(displayValue);\n  }, [canBufferTextInput, displayValue, isBufferedTextInputFocused]);\n\n  useEffect(() => {\n    if (isBufferedPickerDirty) {\n      return;\n    }\n\n    setBufferedPickerValue(toColorPickerValue(value));\n  }, [isBufferedPickerDirty, value]);\n\n  useEffect(() => {\n    return () => {\n      if (!colorPickerApplyTimeoutRef.current) {\n        return;\n      }\n\n      window.clearTimeout(colorPickerApplyTimeoutRef.current);\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!muiPaletteAnchorElement || !matchedMuiPaletteValue) {\n      return;\n    }\n\n    const animationFrameId = window.requestAnimationFrame(() => {\n      const matchedColorButton = muiPaletteContentRef.current?.querySelector<HTMLElement>(\n        `[data-mui-palette-value=\"${matchedMuiPaletteValue}\"]`,\n      );\n\n      matchedColorButton?.scrollIntoView({\n        block: 'center',\n        inline: 'nearest',\n      });\n    });\n\n    return () => {\n      window.cancelAnimationFrame(animationFrameId);\n    };\n  }, [matchedMuiPaletteValue, muiPaletteAnchorElement]);\n\n  useEffect(() => {\n    if (typeof resetVersion === 'undefined') {\n      return;\n    }\n\n    if (colorPickerApplyTimeoutRef.current) {\n      window.clearTimeout(colorPickerApplyTimeoutRef.current);\n      colorPickerApplyTimeoutRef.current = null;\n    }\n\n    setBufferedTextValue(latestDisplayValueRef.current);\n    setIsBufferedTextInputFocused(false);\n    setBufferedPickerValue(toColorPickerValue(latestValueRef.current));\n    setIsBufferedPickerDirty(false);\n  }, [resetVersion]);\n\n  const commitBufferedTextValue = (nextValue: string) => {\n    onChange(\n      definition.path,\n      unitValueFormat ? normalizeUnitInputValue(nextValue, unitValueFormat) : nextValue,\n    );\n  };\n  const commitBufferedPickerValue = (nextPickerValue: string) => {\n    if (colorPickerApplyTimeoutRef.current) {\n      window.clearTimeout(colorPickerApplyTimeoutRef.current);\n      colorPickerApplyTimeoutRef.current = null;\n    }\n\n    setIsBufferedPickerDirty(false);\n    onChange(definition.path, applyColorPickerValue(value, nextPickerValue));\n  };\n  const inputEndAdornment = onReset || unitValueFormat ? (\n    <InputAdornment position=\"end\">\n      <div className=\"flex items-center gap-6 pr-2\">\n        {onReset ? (\n          <IconButton\n            size=\"small\"\n            aria-label={`${definition.label} reset`}\n            disabled={disabled}\n            onMouseDown={(event) => {\n              event.preventDefault();\n            }}\n            onClick={() => {\n              onReset(definition.path);\n            }}\n            sx={{\n              border: '1px solid #cbd5e1',\n              borderRadius: 1,\n              color: '#6b7280',\n              p: 0.25,\n            }}\n          >\n            <RestartAltOutlinedIcon sx={{ fontSize: 16 }} />\n          </IconButton>\n        ) : null}\n        {unitValueFormat ? (\n          <Typography variant=\"body2\" sx={{ whiteSpace: 'nowrap' }}>\n            {unitValueFormat}\n          </Typography>\n        ) : null}\n      </div>\n    </InputAdornment>\n  ) : undefined;\n\n  return (\n    <div className=\"grid grid-cols-[minmax(0,1fr)_144px] items-start gap-12\">\n      <TextField\n        select={hasOptions}\n        label={definition.label}\n        size=\"small\"\n        value={canBufferTextInput ? bufferedTextValue : displayValue}\n        disabled={disabled}\n        onChange={(event) => {\n          if (isReadOnlyColorTextInput) {\n            return;\n          }\n\n          const nextValue = unitValueFormat\n            ? normalizeUnitInputDisplayValue(event.target.value)\n            : event.target.value;\n\n          if (canBufferTextInput) {\n            setBufferedTextValue(nextValue);\n            return;\n          }\n\n          onChange(definition.path, nextValue);\n        }}\n        onFocus={() => {\n          if (!canBufferTextInput) {\n            return;\n          }\n\n          setIsBufferedTextInputFocused(true);\n        }}\n        onBlur={() => {\n          if (!canBufferTextInput) {\n            return;\n          }\n\n          setIsBufferedTextInputFocused(false);\n          commitBufferedTextValue(bufferedTextValue);\n        }}\n        onKeyDown={(event) => {\n          if (!canBufferTextInput || event.key !== 'Enter') {\n            return;\n          }\n\n          event.preventDefault();\n          setIsBufferedTextInputFocused(false);\n          commitBufferedTextValue(bufferedTextValue);\n          event.currentTarget.blur();\n        }}\n        helperText={resolvedHelperText}\n        slotProps={{\n          htmlInput:\n            {\n              ...(unitValueFormat\n                ? {\n                    inputMode: 'decimal',\n                  }\n                : {}),\n              ...(isReadOnlyColorTextInput\n                ? {\n                    readOnly: true,\n                  }\n                : {}),\n            },\n          input:\n            {\n              ...(inputEndAdornment\n                ? {\n                    endAdornment: inputEndAdornment,\n                  }\n                : {}),\n            },\n        }}\n      >\n        {definition.options?.map((option) => (\n          <MenuItem key={option.value} value={option.value}>\n            {option.label}\n          </MenuItem>\n        ))}\n      </TextField>\n\n      {hasPickerControls ? (\n        <div className=\"grid grid-cols-2 gap-6\">\n          <>\n            <Button\n              size=\"small\"\n              fullWidth\n              variant=\"outlined\"\n              disabled={disabled}\n              sx={{\n                fontSize: '1.2rem',\n                height: THEME_PREVIEW_SMALL_FIELD_HEIGHT,\n                minWidth: 0,\n              }}\n              onClick={(event) => {\n                setMuiPaletteAnchorElement(event.currentTarget);\n              }}\n            >\n              MUI\n            </Button>\n            <TextField\n              hiddenLabel\n              type=\"color\"\n              size=\"small\"\n              value={bufferedPickerValue}\n              disabled={disabled}\n              onChange={(event) => {\n                const nextPickerValue = event.target.value;\n\n                setBufferedPickerValue(nextPickerValue);\n                setIsBufferedPickerDirty(true);\n\n                if (colorPickerApplyTimeoutRef.current) {\n                  window.clearTimeout(colorPickerApplyTimeoutRef.current);\n                }\n\n                colorPickerApplyTimeoutRef.current = window.setTimeout(() => {\n                  commitBufferedPickerValue(nextPickerValue);\n                }, THEME_PREVIEW_COLOR_PICKER_APPLY_DELAY_MS);\n              }}\n              onBlur={() => {\n                if (!isBufferedPickerDirty) {\n                  return;\n                }\n\n                commitBufferedPickerValue(bufferedPickerValue);\n              }}\n              slotProps={{\n                htmlInput: {\n                  'aria-label': 'Pick color',\n                },\n              }}\n              sx={{\n                '& .MuiOutlinedInput-root': {\n                  height: THEME_PREVIEW_SMALL_FIELD_HEIGHT,\n                  px: 0.5,\n                },\n                '& input[type=\"color\"]': {\n                  WebkitAppearance: 'none',\n                  alignSelf: 'center',\n                  boxSizing: 'border-box',\n                  border: 0,\n                  borderRadius: 0,\n                  display: 'block',\n                  height: THEME_PREVIEW_PICKER_SWATCH_HEIGHT,\n                  minHeight: THEME_PREVIEW_PICKER_SWATCH_HEIGHT,\n                  overflow: 'hidden',\n                  padding: 0,\n                  p: 0,\n                  width: '100%',\n                },\n                '& input[type=\"color\"]::-webkit-color-swatch-wrapper': {\n                  borderRadius: 0,\n                  p: 0,\n                },\n                '& input[type=\"color\"]::-webkit-color-swatch': {\n                  borderColor: '#94a3b8',\n                  borderRadius: 0,\n                },\n                '& input[type=\"color\"]::-moz-color-swatch': {\n                  borderColor: '#94a3b8',\n                  borderRadius: 0,\n                },\n              }}\n            />\n            {muiPaletteAnchorElement ? (\n              <Popover\n                open\n                anchorEl={muiPaletteAnchorElement}\n                transitionDuration={0}\n                onClose={() => {\n                  setMuiPaletteAnchorElement(null);\n                }}\n                anchorOrigin={{\n                  vertical: 'bottom',\n                  horizontal: 'left',\n                }}\n                transformOrigin={{\n                  vertical: 'top',\n                  horizontal: 'left',\n                }}\n                slotProps={{\n                  paper: {\n                    sx: {\n                      maxHeight: 'calc(100vh - 32px)',\n                      maxWidth: 'calc(100vw - 32px)',\n                      minWidth: 320,\n                      overflow: 'auto',\n                      p: 1.5,\n                      width: 'min(760px, calc(100vw - 32px))',\n                    },\n                  },\n                }}\n              >\n                <div ref={muiPaletteContentRef} className=\"flex min-w-0 flex-col gap-10\">\n                  {themePreviewMuiPaletteColorRows.map((paletteRow, paletteRowIndex) => (\n                    <Box key={paletteRow.label} className=\"flex flex-col gap-10\">\n                      {paletteRowIndex > 0 ? <Divider flexItem /> : null}\n                      <Box\n                        sx={{\n                          display: 'grid',\n                          gap: 1,\n                          gridTemplateColumns: {\n                            xs: 'minmax(0, 1fr)',\n                            sm: '84px minmax(0, 1fr)',\n                          },\n                        }}\n                      >\n                        <Typography variant=\"caption\" color=\"text.secondary\">\n                          {paletteRow.label}\n                        </Typography>\n                        <Box\n                          sx={{\n                            display: 'grid',\n                            gap: 0.75,\n                            gridTemplateColumns: 'repeat(auto-fit, minmax(68px, 1fr))',\n                            minWidth: 0,\n                          }}\n                        >\n                          {paletteRow.colors.map((colorItem) => {\n                            const isMatchedMuiPaletteColor =\n                              matchedMuiPaletteValue === colorItem.value.toLowerCase();\n\n                            return (\n                              <Box\n                                key={colorItem.key}\n                                component=\"button\"\n                                type=\"button\"\n                                data-mui-palette-value={colorItem.value.toLowerCase()}\n                                aria-current={isMatchedMuiPaletteColor ? 'true' : undefined}\n                                onClick={() => {\n                                  onChange(\n                                    definition.path,\n                                    applyColorPickerValue(value, colorItem.value),\n                                  );\n                                  setMuiPaletteAnchorElement(null);\n                                }}\n                                sx={{\n                                  alignItems: 'center',\n                                  backgroundColor: isMatchedMuiPaletteColor\n                                    ? 'action.selected'\n                                    : 'background.paper',\n                                  border: '1px solid',\n                                  borderColor: isMatchedMuiPaletteColor ? 'primary.main' : 'divider',\n                                  borderRadius: 1,\n                                  boxShadow: isMatchedMuiPaletteColor\n                                    ? (theme) => `0 0 0 1px ${theme.palette.primary.main}`\n                                    : 'none',\n                                  color: isMatchedMuiPaletteColor ? 'text.primary' : 'text.secondary',\n                                  cursor: 'pointer',\n                                  display: 'flex',\n                                  flexDirection: 'column',\n                                  gap: 0.5,\n                                  justifyContent: 'center',\n                                  minWidth: 0,\n                                  p: 0.5,\n                                  transition:\n                                    'background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease',\n                                  width: '100%',\n                                  '&:hover': {\n                                    backgroundColor: 'action.hover',\n                                    borderColor: isMatchedMuiPaletteColor\n                                      ? 'primary.main'\n                                      : 'text.secondary',\n                                  },\n                                }}\n                              >\n                                <Box\n                                  sx={{\n                                    width: 30,\n                                    height: 30,\n                                    borderRadius: 1,\n                                    backgroundColor: colorItem.value,\n                                    border: '1px solid',\n                                    borderColor: isMatchedMuiPaletteColor\n                                      ? 'primary.main'\n                                      : 'divider',\n                                  }}\n                                />\n                                <Box\n                                  component=\"span\"\n                                  sx={{\n                                    fontSize: '0.75rem',\n                                    fontWeight: isMatchedMuiPaletteColor ? 700 : 600,\n                                    lineHeight: 1,\n                                  }}\n                                >\n                                  {colorItem.shade}\n                                </Box>\n                              </Box>\n                            );\n                          })}\n                        </Box>\n                      </Box>\n                    </Box>\n                  ))}\n                </div>\n              </Popover>\n            ) : null}\n          </>\n          {definition.allowAlpha ? (\n            <div className=\"col-span-2 flex flex-col gap-2\">\n              <Typography variant=\"caption\" color=\"text.secondary\">\n                Current\n              </Typography>\n              <Typography\n                variant=\"caption\"\n                color=\"text.secondary\"\n                className=\"truncate whitespace-nowrap\"\n              >\n                {value || '-'}\n              </Typography>\n            </div>\n          ) : null}\n        </div>\n      ) : (\n        <div />\n      )}\n    </div>\n  );\n}\n"],"names":["themePreviewInputUnits","themePreviewMuiColorShades","themePreviewMuiColorPalettes","blue","lightBlue","cyan","teal","green","amber","orange","deepOrange","red","pink","purple","deepPurple","indigo","grey","blueGrey","themePreviewMuiPaletteColorRows","label","palette","acc","shade","paletteValue","themePreviewMuiPaletteColorValueSet","paletteRow","colorItem","THEME_PREVIEW_COLOR_PICKER_APPLY_DELAY_MS","THEME_PREVIEW_SMALL_FIELD_HEIGHT","THEME_PREVIEW_PICKER_SWATCH_HEIGHT","getUnitInputDisplayValue","value","unit","__name","normalizeUnitInputDisplayValue","sanitizedValue","decimalPointIndex","integerPart","decimalPart","normalizeCommittedUnitInputDisplayValue","normalizedValue","normalizeUnitInputValue","getUnitValueFormat","valueFormat","ThemePreviewColorField","disabled","definition","resetVersion","sectionKey","settings","onChange","onReset","muiPaletteAnchorElement","setMuiPaletteAnchorElement","useState","muiPaletteContentRef","useRef","getThemePreviewPaletteValue","unitValueFormat","showColorPicker","alphaValue","getColorAlphaValue","helperText","resolvedHelperText","hasOptions","_a","isReadOnlyColorTextInput","displayValue","hasPickerControls","normalizedMuiPaletteValue","toColorPickerValue","matchedMuiPaletteValue","canBufferTextInput","bufferedTextValue","setBufferedTextValue","isBufferedTextInputFocused","setIsBufferedTextInputFocused","bufferedPickerValue","setBufferedPickerValue","isBufferedPickerDirty","setIsBufferedPickerDirty","colorPickerApplyTimeoutRef","latestDisplayValueRef","latestValueRef","useEffect","animationFrameId","matchedColorButton","commitBufferedTextValue","nextValue","commitBufferedPickerValue","nextPickerValue","applyColorPickerValue","inputEndAdornment","jsx","InputAdornment","jsxs","IconButton","event","RestartAltOutlinedIcon","Typography","TextField","_b","option","MenuItem","Fragment","Button","Popover","paletteRowIndex","Box","Divider","isMatchedMuiPaletteColor","theme"],"mappings":"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"}
+{"version":3,"file":"ThemePreviewColorField.js","sources":["../../../../src/features/themePreview/components/ThemePreviewColorField.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  Divider,\n  IconButton,\n  InputAdornment,\n  MenuItem,\n  Popover,\n  TextField,\n  Typography,\n} from '@mui/material';\nimport RestartAltOutlinedIcon from '@mui/icons-material/RestartAltOutlined';\nimport { owpDark, skyBlue } from '@/colors';\nimport {\n  amber,\n  blue,\n  blueGrey,\n  cyan,\n  deepOrange,\n  deepPurple,\n  green,\n  grey,\n  indigo,\n  lightBlue,\n  orange,\n  pink,\n  purple,\n  red,\n  teal,\n} from '@mui/material/colors';\nimport type {\n  ThemePreviewFieldDefinition,\n  ThemePreviewSectionKey,\n  ThemePreviewSettings,\n} from '../types';\nimport {\n  applyColorPickerValue,\n  getColorAlphaValue,\n  getThemePreviewPaletteValue,\n  toColorPickerValue,\n} from '../utils';\nimport { useEffect, useRef, useState } from 'react';\n\ninterface ThemePreviewColorFieldProps {\n  disabled?: boolean;\n  definition: ThemePreviewFieldDefinition;\n  resetVersion?: number;\n  sectionKey: ThemePreviewSectionKey;\n  settings: ThemePreviewSettings;\n  onChange: (path: string, value: string) => void;\n  onReset?: (path: string) => void;\n}\n\nconst themePreviewInputUnits = {\n  'px-number': 'px',\n  'rem-number': 'rem',\n} as const;\n\ntype ThemePreviewInputUnit = (typeof themePreviewInputUnits)[keyof typeof themePreviewInputUnits];\n\nconst themePreviewMuiColorShades = [\n  '50',\n  '100',\n  '200',\n  '300',\n  '400',\n  '500',\n  '600',\n  '700',\n  '800',\n  '900',\n  'A100',\n  'A200',\n  'A400',\n  'A700',\n] as const;\nconst themePreviewMuiColorPalettes = [\n  ['OWP Dark', owpDark],\n  ['OWP Sky Blue', skyBlue],\n  ['Blue', blue],\n  ['Light Blue', lightBlue],\n  ['Cyan', cyan],\n  ['Teal', teal],\n  ['Green', green],\n  ['Amber', amber],\n  ['Orange', orange],\n  ['Deep Orange', deepOrange],\n  ['Red', red],\n  ['Pink', pink],\n  ['Purple', purple],\n  ['Deep Purple', deepPurple],\n  ['Indigo', indigo],\n  ['Grey', grey],\n  ['Blue Grey', blueGrey],\n] as const;\nconst themePreviewMuiPaletteColorRows = themePreviewMuiColorPalettes.map(([label, palette]) => ({\n  label,\n  colors: themePreviewMuiColorShades.reduce<Array<{\n    key: string;\n    shade: string;\n    value: string;\n  }>>((acc, shade) => {\n    const paletteValue = (palette as Record<string, string>)[shade];\n\n    if (!paletteValue) {\n      return acc;\n    }\n\n    acc.push({\n      key: `${label}-${shade}`,\n      shade,\n      value: paletteValue,\n    });\n\n    return acc;\n  }, []),\n}));\nconst themePreviewMuiPaletteColorValueSet = new Set(\n  themePreviewMuiPaletteColorRows.flatMap((paletteRow) =>\n    paletteRow.colors.map((colorItem) => colorItem.value.toLowerCase()),\n  ),\n);\nconst THEME_PREVIEW_COLOR_PICKER_APPLY_DELAY_MS = 500;\nconst THEME_PREVIEW_SMALL_FIELD_HEIGHT = 32;\nconst THEME_PREVIEW_PICKER_SWATCH_HEIGHT = 20;\n\nfunction getUnitInputDisplayValue(value: string, unit: ThemePreviewInputUnit) {\n  return value.replace(new RegExp(`${unit}$`, 'i'), '');\n}\n\nfunction normalizeUnitInputDisplayValue(value: string) {\n  const sanitizedValue = value.replace(/[^0-9.,]/g, '').replace(/,/g, '.');\n  const decimalPointIndex = sanitizedValue.indexOf('.');\n\n  if (decimalPointIndex < 0) {\n    return sanitizedValue;\n  }\n\n  const integerPart = sanitizedValue.slice(0, decimalPointIndex);\n  const decimalPart = sanitizedValue.slice(decimalPointIndex + 1).replace(/\\./g, '');\n\n  return `${integerPart}.${decimalPart}`;\n}\n\nfunction normalizeCommittedUnitInputDisplayValue(value: string) {\n  const normalizedValue = normalizeUnitInputDisplayValue(value);\n\n  if (!normalizedValue || normalizedValue === '.') {\n    return '';\n  }\n\n  if (normalizedValue.startsWith('.')) {\n    return `0${normalizedValue}`;\n  }\n\n  if (normalizedValue.endsWith('.')) {\n    return normalizedValue.slice(0, -1);\n  }\n\n  return normalizedValue;\n}\n\nfunction normalizeUnitInputValue(value: string, unit: ThemePreviewInputUnit) {\n  const normalizedValue = normalizeCommittedUnitInputDisplayValue(value);\n\n  return normalizedValue ? `${normalizedValue}${unit}` : '';\n}\n\nfunction getUnitValueFormat(valueFormat?: ThemePreviewFieldDefinition['valueFormat']) {\n  return (valueFormat ? themePreviewInputUnits[valueFormat] : null) ?? null;\n}\n\nexport function ThemePreviewColorField({\n  disabled = false,\n  definition,\n  resetVersion,\n  sectionKey,\n  settings,\n  onChange,\n  onReset,\n}: ThemePreviewColorFieldProps) {\n  const [muiPaletteAnchorElement, setMuiPaletteAnchorElement] = useState<HTMLElement | null>(null);\n  const muiPaletteContentRef = useRef<HTMLDivElement | null>(null);\n  const value = getThemePreviewPaletteValue(settings, sectionKey, definition.path);\n  const unitValueFormat = getUnitValueFormat(definition.valueFormat);\n  const showColorPicker = definition.showColorPicker !== false;\n  const alphaValue = definition.allowAlpha ? getColorAlphaValue(value) : null;\n  const helperText = [definition.description];\n\n  if (definition.allowAlpha) {\n    helperText.push(\n      alphaValue\n        ? `알파값은 ${alphaValue}로 고정되고 색상만 변경됩니다. Pick 또는 MUI로 색상만 변경할 수 있습니다.`\n        : '알파값은 고정되고 색상만 변경됩니다. Pick 또는 MUI로 색상만 변경할 수 있습니다.',\n    );\n  }\n\n  const resolvedHelperText = helperText.filter(Boolean).join(' ');\n  const hasOptions = Boolean(definition.options?.length);\n  const isReadOnlyColorTextInput = Boolean(\n    definition.allowAlpha && showColorPicker && !hasOptions && !unitValueFormat,\n  );\n  const displayValue =\n    unitValueFormat ? getUnitInputDisplayValue(value, unitValueFormat) : value;\n  const hasPickerControls = showColorPicker;\n  const normalizedMuiPaletteValue = hasPickerControls ? toColorPickerValue(value).toLowerCase() : null;\n  const matchedMuiPaletteValue =\n    normalizedMuiPaletteValue && themePreviewMuiPaletteColorValueSet.has(normalizedMuiPaletteValue)\n      ? normalizedMuiPaletteValue\n      : null;\n  const canBufferTextInput = !hasOptions && !isReadOnlyColorTextInput;\n  const [bufferedTextValue, setBufferedTextValue] = useState(displayValue);\n  const [isBufferedTextInputFocused, setIsBufferedTextInputFocused] = useState(false);\n  const [bufferedPickerValue, setBufferedPickerValue] = useState(toColorPickerValue(value));\n  const [isBufferedPickerDirty, setIsBufferedPickerDirty] = useState(false);\n  const colorPickerApplyTimeoutRef = useRef<number | null>(null);\n  const latestDisplayValueRef = useRef(displayValue);\n  const latestValueRef = useRef(value);\n\n  latestDisplayValueRef.current = displayValue;\n  latestValueRef.current = value;\n\n  useEffect(() => {\n    if (!canBufferTextInput || isBufferedTextInputFocused) {\n      return;\n    }\n\n    setBufferedTextValue(displayValue);\n  }, [canBufferTextInput, displayValue, isBufferedTextInputFocused]);\n\n  useEffect(() => {\n    if (isBufferedPickerDirty) {\n      return;\n    }\n\n    setBufferedPickerValue(toColorPickerValue(value));\n  }, [isBufferedPickerDirty, value]);\n\n  useEffect(() => {\n    return () => {\n      if (!colorPickerApplyTimeoutRef.current) {\n        return;\n      }\n\n      window.clearTimeout(colorPickerApplyTimeoutRef.current);\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!muiPaletteAnchorElement || !matchedMuiPaletteValue) {\n      return;\n    }\n\n    const animationFrameId = window.requestAnimationFrame(() => {\n      const matchedColorButton = muiPaletteContentRef.current?.querySelector<HTMLElement>(\n        `[data-mui-palette-value=\"${matchedMuiPaletteValue}\"]`,\n      );\n\n      matchedColorButton?.scrollIntoView({\n        block: 'center',\n        inline: 'nearest',\n      });\n    });\n\n    return () => {\n      window.cancelAnimationFrame(animationFrameId);\n    };\n  }, [matchedMuiPaletteValue, muiPaletteAnchorElement]);\n\n  useEffect(() => {\n    if (typeof resetVersion === 'undefined') {\n      return;\n    }\n\n    if (colorPickerApplyTimeoutRef.current) {\n      window.clearTimeout(colorPickerApplyTimeoutRef.current);\n      colorPickerApplyTimeoutRef.current = null;\n    }\n\n    setBufferedTextValue(latestDisplayValueRef.current);\n    setIsBufferedTextInputFocused(false);\n    setBufferedPickerValue(toColorPickerValue(latestValueRef.current));\n    setIsBufferedPickerDirty(false);\n  }, [resetVersion]);\n\n  const commitBufferedTextValue = (nextValue: string) => {\n    onChange(\n      definition.path,\n      unitValueFormat ? normalizeUnitInputValue(nextValue, unitValueFormat) : nextValue,\n    );\n  };\n  const commitBufferedPickerValue = (nextPickerValue: string) => {\n    if (colorPickerApplyTimeoutRef.current) {\n      window.clearTimeout(colorPickerApplyTimeoutRef.current);\n      colorPickerApplyTimeoutRef.current = null;\n    }\n\n    setIsBufferedPickerDirty(false);\n    onChange(definition.path, applyColorPickerValue(value, nextPickerValue));\n  };\n  const inputEndAdornment = onReset || unitValueFormat ? (\n    <InputAdornment position=\"end\">\n      <div className=\"flex items-center gap-6 pr-2\">\n        {onReset ? (\n          <IconButton\n            size=\"small\"\n            aria-label={`${definition.label} reset`}\n            disabled={disabled}\n            onMouseDown={(event) => {\n              event.preventDefault();\n            }}\n            onClick={() => {\n              onReset(definition.path);\n            }}\n            sx={{\n              border: '1px solid #cbd5e1',\n              borderRadius: 1,\n              color: '#6b7280',\n              p: 0.25,\n            }}\n          >\n            <RestartAltOutlinedIcon sx={{ fontSize: 16 }} />\n          </IconButton>\n        ) : null}\n        {unitValueFormat ? (\n          <Typography variant=\"body2\" sx={{ whiteSpace: 'nowrap' }}>\n            {unitValueFormat}\n          </Typography>\n        ) : null}\n      </div>\n    </InputAdornment>\n  ) : undefined;\n\n  return (\n    <div className=\"grid grid-cols-[minmax(0,1fr)_144px] items-start gap-12\">\n      <TextField\n        select={hasOptions}\n        label={definition.label}\n        size=\"small\"\n        value={canBufferTextInput ? bufferedTextValue : displayValue}\n        disabled={disabled}\n        onChange={(event) => {\n          if (isReadOnlyColorTextInput) {\n            return;\n          }\n\n          const nextValue = unitValueFormat\n            ? normalizeUnitInputDisplayValue(event.target.value)\n            : event.target.value;\n\n          if (canBufferTextInput) {\n            setBufferedTextValue(nextValue);\n            return;\n          }\n\n          onChange(definition.path, nextValue);\n        }}\n        onFocus={() => {\n          if (!canBufferTextInput) {\n            return;\n          }\n\n          setIsBufferedTextInputFocused(true);\n        }}\n        onBlur={() => {\n          if (!canBufferTextInput) {\n            return;\n          }\n\n          setIsBufferedTextInputFocused(false);\n          commitBufferedTextValue(bufferedTextValue);\n        }}\n        onKeyDown={(event) => {\n          if (!canBufferTextInput || event.key !== 'Enter') {\n            return;\n          }\n\n          event.preventDefault();\n          setIsBufferedTextInputFocused(false);\n          commitBufferedTextValue(bufferedTextValue);\n          event.currentTarget.blur();\n        }}\n        helperText={resolvedHelperText}\n        slotProps={{\n          htmlInput:\n            {\n              ...(unitValueFormat\n                ? {\n                    inputMode: 'decimal',\n                  }\n                : {}),\n              ...(isReadOnlyColorTextInput\n                ? {\n                    readOnly: true,\n                  }\n                : {}),\n            },\n          input:\n            {\n              ...(inputEndAdornment\n                ? {\n                    endAdornment: inputEndAdornment,\n                  }\n                : {}),\n            },\n        }}\n      >\n        {definition.options?.map((option) => (\n          <MenuItem key={option.value} value={option.value}>\n            {option.label}\n          </MenuItem>\n        ))}\n      </TextField>\n\n      {hasPickerControls ? (\n        <div className=\"grid grid-cols-2 gap-6\">\n          <>\n            <Button\n              size=\"small\"\n              fullWidth\n              variant=\"outlined\"\n              disabled={disabled}\n              sx={{\n                fontSize: '1.2rem',\n                height: THEME_PREVIEW_SMALL_FIELD_HEIGHT,\n                minWidth: 0,\n              }}\n              onClick={(event) => {\n                setMuiPaletteAnchorElement(event.currentTarget);\n              }}\n            >\n              MUI\n            </Button>\n            <TextField\n              hiddenLabel\n              type=\"color\"\n              size=\"small\"\n              value={bufferedPickerValue}\n              disabled={disabled}\n              onChange={(event) => {\n                const nextPickerValue = event.target.value;\n\n                setBufferedPickerValue(nextPickerValue);\n                setIsBufferedPickerDirty(true);\n\n                if (colorPickerApplyTimeoutRef.current) {\n                  window.clearTimeout(colorPickerApplyTimeoutRef.current);\n                }\n\n                colorPickerApplyTimeoutRef.current = window.setTimeout(() => {\n                  commitBufferedPickerValue(nextPickerValue);\n                }, THEME_PREVIEW_COLOR_PICKER_APPLY_DELAY_MS);\n              }}\n              onBlur={() => {\n                if (!isBufferedPickerDirty) {\n                  return;\n                }\n\n                commitBufferedPickerValue(bufferedPickerValue);\n              }}\n              slotProps={{\n                htmlInput: {\n                  'aria-label': 'Pick color',\n                },\n              }}\n              sx={{\n                '& .MuiOutlinedInput-root': {\n                  height: THEME_PREVIEW_SMALL_FIELD_HEIGHT,\n                  px: 0.5,\n                },\n                '& input[type=\"color\"]': {\n                  WebkitAppearance: 'none',\n                  alignSelf: 'center',\n                  boxSizing: 'border-box',\n                  border: 0,\n                  borderRadius: 0,\n                  display: 'block',\n                  height: THEME_PREVIEW_PICKER_SWATCH_HEIGHT,\n                  minHeight: THEME_PREVIEW_PICKER_SWATCH_HEIGHT,\n                  overflow: 'hidden',\n                  padding: 0,\n                  p: 0,\n                  width: '100%',\n                },\n                '& input[type=\"color\"]::-webkit-color-swatch-wrapper': {\n                  borderRadius: 0,\n                  p: 0,\n                },\n                '& input[type=\"color\"]::-webkit-color-swatch': {\n                  borderColor: '#94a3b8',\n                  borderRadius: 0,\n                },\n                '& input[type=\"color\"]::-moz-color-swatch': {\n                  borderColor: '#94a3b8',\n                  borderRadius: 0,\n                },\n              }}\n            />\n            {muiPaletteAnchorElement ? (\n              <Popover\n                open\n                anchorEl={muiPaletteAnchorElement}\n                transitionDuration={0}\n                onClose={() => {\n                  setMuiPaletteAnchorElement(null);\n                }}\n                anchorOrigin={{\n                  vertical: 'bottom',\n                  horizontal: 'left',\n                }}\n                transformOrigin={{\n                  vertical: 'top',\n                  horizontal: 'left',\n                }}\n                slotProps={{\n                  paper: {\n                    sx: {\n                      maxHeight: 'calc(100vh - 32px)',\n                      maxWidth: 'calc(100vw - 32px)',\n                      minWidth: 320,\n                      overflow: 'auto',\n                      p: 1.5,\n                      width: 'min(760px, calc(100vw - 32px))',\n                    },\n                  },\n                }}\n              >\n                <div ref={muiPaletteContentRef} className=\"flex min-w-0 flex-col gap-10\">\n                  {themePreviewMuiPaletteColorRows.map((paletteRow, paletteRowIndex) => (\n                    <Box key={paletteRow.label} className=\"flex flex-col gap-10\">\n                      {paletteRowIndex > 0 ? <Divider flexItem /> : null}\n                      <Box\n                        sx={{\n                          display: 'grid',\n                          gap: 1,\n                          gridTemplateColumns: {\n                            xs: 'minmax(0, 1fr)',\n                            sm: '84px minmax(0, 1fr)',\n                          },\n                        }}\n                      >\n                        <Typography variant=\"caption\" color=\"text.secondary\">\n                          {paletteRow.label}\n                        </Typography>\n                        <Box\n                          sx={{\n                            display: 'grid',\n                            gap: 0.75,\n                            gridTemplateColumns: 'repeat(auto-fit, minmax(68px, 1fr))',\n                            minWidth: 0,\n                          }}\n                        >\n                          {paletteRow.colors.map((colorItem) => {\n                            const isMatchedMuiPaletteColor =\n                              matchedMuiPaletteValue === colorItem.value.toLowerCase();\n\n                            return (\n                              <Box\n                                key={colorItem.key}\n                                component=\"button\"\n                                type=\"button\"\n                                data-mui-palette-value={colorItem.value.toLowerCase()}\n                                aria-current={isMatchedMuiPaletteColor ? 'true' : undefined}\n                                onClick={() => {\n                                  onChange(\n                                    definition.path,\n                                    applyColorPickerValue(value, colorItem.value),\n                                  );\n                                  setMuiPaletteAnchorElement(null);\n                                }}\n                                sx={{\n                                  alignItems: 'center',\n                                  backgroundColor: isMatchedMuiPaletteColor\n                                    ? 'action.selected'\n                                    : 'background.paper',\n                                  border: '1px solid',\n                                  borderColor: isMatchedMuiPaletteColor ? 'primary.main' : 'divider',\n                                  borderRadius: 1,\n                                  boxShadow: isMatchedMuiPaletteColor\n                                    ? (theme) => `0 0 0 1px ${theme.palette.primary.main}`\n                                    : 'none',\n                                  color: isMatchedMuiPaletteColor ? 'text.primary' : 'text.secondary',\n                                  cursor: 'pointer',\n                                  display: 'flex',\n                                  flexDirection: 'column',\n                                  gap: 0.5,\n                                  justifyContent: 'center',\n                                  minWidth: 0,\n                                  p: 0.5,\n                                  transition:\n                                    'background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease',\n                                  width: '100%',\n                                  '&:hover': {\n                                    backgroundColor: 'action.hover',\n                                    borderColor: isMatchedMuiPaletteColor\n                                      ? 'primary.main'\n                                      : 'text.secondary',\n                                  },\n                                }}\n                              >\n                                <Box\n                                  sx={{\n                                    width: 30,\n                                    height: 30,\n                                    borderRadius: 1,\n                                    backgroundColor: colorItem.value,\n                                    border: '1px solid',\n                                    borderColor: isMatchedMuiPaletteColor\n                                      ? 'primary.main'\n                                      : 'divider',\n                                  }}\n                                />\n                                <Box\n                                  component=\"span\"\n                                  sx={{\n                                    fontSize: '0.75rem',\n                                    fontWeight: isMatchedMuiPaletteColor ? 700 : 600,\n                                    lineHeight: 1,\n                                  }}\n                                >\n                                  {colorItem.shade}\n                                </Box>\n                              </Box>\n                            );\n                          })}\n                        </Box>\n                      </Box>\n                    </Box>\n                  ))}\n                </div>\n              </Popover>\n            ) : null}\n          </>\n          {definition.allowAlpha ? (\n            <div className=\"col-span-2 flex flex-col gap-2\">\n              <Typography variant=\"caption\" color=\"text.secondary\">\n                Current\n              </Typography>\n              <Typography\n                variant=\"caption\"\n                color=\"text.secondary\"\n                className=\"truncate whitespace-nowrap\"\n              >\n                {value || '-'}\n              </Typography>\n            </div>\n          ) : null}\n        </div>\n      ) : (\n        <div />\n      )}\n    </div>\n  );\n}\n"],"names":["themePreviewInputUnits","themePreviewMuiColorShades","themePreviewMuiColorPalettes","owpDark","skyBlue","blue","lightBlue","cyan","teal","green","amber","orange","deepOrange","red","pink","purple","deepPurple","indigo","grey","blueGrey","themePreviewMuiPaletteColorRows","label","palette","acc","shade","paletteValue","themePreviewMuiPaletteColorValueSet","paletteRow","colorItem","THEME_PREVIEW_COLOR_PICKER_APPLY_DELAY_MS","THEME_PREVIEW_SMALL_FIELD_HEIGHT","THEME_PREVIEW_PICKER_SWATCH_HEIGHT","getUnitInputDisplayValue","value","unit","__name","normalizeUnitInputDisplayValue","sanitizedValue","decimalPointIndex","integerPart","decimalPart","normalizeCommittedUnitInputDisplayValue","normalizedValue","normalizeUnitInputValue","getUnitValueFormat","valueFormat","ThemePreviewColorField","disabled","definition","resetVersion","sectionKey","settings","onChange","onReset","muiPaletteAnchorElement","setMuiPaletteAnchorElement","useState","muiPaletteContentRef","useRef","getThemePreviewPaletteValue","unitValueFormat","showColorPicker","alphaValue","getColorAlphaValue","helperText","resolvedHelperText","hasOptions","_a","isReadOnlyColorTextInput","displayValue","hasPickerControls","normalizedMuiPaletteValue","toColorPickerValue","matchedMuiPaletteValue","canBufferTextInput","bufferedTextValue","setBufferedTextValue","isBufferedTextInputFocused","setIsBufferedTextInputFocused","bufferedPickerValue","setBufferedPickerValue","isBufferedPickerDirty","setIsBufferedPickerDirty","colorPickerApplyTimeoutRef","latestDisplayValueRef","latestValueRef","useEffect","animationFrameId","matchedColorButton","commitBufferedTextValue","nextValue","commitBufferedPickerValue","nextPickerValue","applyColorPickerValue","inputEndAdornment","jsx","InputAdornment","jsxs","IconButton","event","RestartAltOutlinedIcon","Typography","TextField","_b","option","MenuItem","Fragment","Button","Popover","paletteRowIndex","Box","Divider","isMatchedMuiPaletteColor","theme"],"mappings":"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"}