import { j as t } from "./jsx-runtime-Sp0orL4X.js";
import k from "@monaco-editor/react";
import { B as C } from "./context-menu-zu6r7B6f.js";
import { useTranslation as j } from "react-i18next";
import { useState as l, useCallback as v, useEffect as g } from "react";
import { u as y, a as N, b as T, c as E } from "./index-T7WZImL0.js";
import { Cross2Icon as w } from "@radix-ui/react-icons";
import { useThrottledCallback as B } from "@react-hookz/web";
import "@radix-ui/react-switch";
import "@radix-ui/react-accordion";
import "@radix-ui/react-alert-dialog";
import "@radix-ui/react-slot";
import "class-variance-authority";
import "@radix-ui/react-label";
import "@radix-ui/react-scroll-area";
import "@radix-ui/react-tabs";
import "@radix-ui/react-tooltip";
import "@radix-ui/react-popover";
import "@radix-ui/react-hover-card";
import "@radix-ui/react-dropdown-menu";
import "@radix-ui/react-separator";
import "@radix-ui/react-toast";
import "cmdk";
import "@radix-ui/react-dialog";
import "@radix-ui/react-context-menu";
import "clsx";
import "tailwind-merge";
import "lodash-es";
import "jotai";
import "./iconBase-zweRWSz0.js";
import "@chaibuilder/runtime";
import "./plugin-sJ3Hzvpv.js";
import "tree-model";
import "react-quill";
import "./STRINGS-rPGH65PW.js";
import "react-hotkeys-hook";
import "@floating-ui/dom";
import "@floating-ui/react-dom";
import "flagged";
import "@tailwindcss/typography";
import "@tailwindcss/forms";
import "@tailwindcss/aspect-ratio";
import "tailwindcss-palette-generator";
import "react-wrap-balancer";
import "react-dom";
import "prop-types";
import "re-resizable";
import "@rjsf/validator-ajv8";
import "@rjsf/core";
import "react-arborist";
import "lucide-react";
import "himalaya";
import "react-icons-picker";
import "react-autosuggest";
import "fuse.js";
import "i18next";
import "lodash";
import "framer-motion";
const a = (r) => {
  const i = document.createElement("div");
  return i.innerHTML = r, i.innerHTML;
};
function zt() {
  const { t: r } = j(), [i, n] = l(!1), [m, c] = l(""), [o, s] = y(), [p] = N(), d = T(), u = E(), f = B(
    (e) => {
      const b = a(e);
      u([o.blockId], { [o.blockProp]: b });
    },
    [],
    300
  ), x = v(() => {
    if (i) {
      const e = a(m);
      d([o.blockId], { [o.blockProp]: e });
    }
  }, [i, m]);
  g(() => {
    p.includes(o == null ? void 0 : o.blockId) || (x(), s(null));
  }, [p]);
  const h = () => {
    s(null);
  };
  return /* @__PURE__ */ t.jsxs("div", { className: "h-full rounded-t-lg border-t-4 border-black bg-black text-white", children: [
    /* @__PURE__ */ t.jsx("button", { onClick: h, className: "fixed inset-0 z-[100000] cursor-default bg-gray-400/20" }),
    /* @__PURE__ */ t.jsxs("div", { className: "relative z-[100001] h-full w-full flex-col gap-y-1", children: [
      /* @__PURE__ */ t.jsxs("div", { className: "-mt-1 flex items-center justify-between px-2 py-2", children: [
        /* @__PURE__ */ t.jsxs("h3", { className: "space-x-3 text-sm font-semibold", children: [
          /* @__PURE__ */ t.jsx("span", { children: r("HTML Code Editor |") }),
          /* @__PURE__ */ t.jsx("span", { className: "text-xs text-gray-400", children: r("Scripts will be only executed in preview and live mode.") })
        ] }),
        /* @__PURE__ */ t.jsx("div", { className: "flex gap-x-2", children: /* @__PURE__ */ t.jsx(
          C,
          {
            onClick: () => s(null),
            size: "sm",
            variant: "destructive",
            className: "h-6 w-fit",
            children: /* @__PURE__ */ t.jsx(w, {})
          }
        ) })
      ] }),
      /* @__PURE__ */ t.jsx(
        k,
        {
          onMount: (e) => {
            e.setValue(o.initialCode);
          },
          onChange: (e) => {
            n(!0), c(e), f(e);
          },
          height: "100%",
          defaultLanguage: "html",
          theme: "vs-dark",
          defaultValue: "",
          options: {
            minimap: {
              enabled: !1
            }
          }
        }
      )
    ] })
  ] });
}
export {
  zt as default
};
