import { jsxs as C, jsx as p } from "react/jsx-runtime";
import { u as ae, a as ye, b as be, c as Ke, d as _e, e as Oe, f as Fe, g as We, h as Ve } from "./use-editor.BDXlYRYz.js";
import * as d from "react";
import { useState as ne, useRef as F, useCallback as qe, useLayoutEffect as Ue, useEffect as U, useContext as ke, createContext as we, lazy as z, Suspense as _, startTransition as Ge } from "react";
import { _ as S, B as O, r as Xe } from "./twind.D7be0E5m.js";
import { S as xe, y as W, V as Ye, u as Je, a as Qe, c as Ze, P as Ne, b as et, d as tt, e as rt, O as nt } from "./index.D1WHzYVh.js";
import { u as me } from "./index.CQJkC40r.js";
import { u as ie, a as st, b as ot, c as at, d as it, e as lt, f as le, g as ct, h as ut, i as Se, j as dt, k as pt, l as ft } from "./use-page-data.BTws06Go.js";
import { getThemeCss as mt } from "../get-theme-css.js";
import { D as vt } from "./dnd.esm.ByOls-Fs.js";
import { N as J, r as q, m as gt } from "./chunk-3RDGTRSB.DySNCMmQ.js";
import "@sinclair/typebox";
import "lodash-es";
import { r as Pe, o as Ee, s as ht, a as Ce, v as X, b as Y, c as yt } from "./radius.prop.CaQGG1qO.js";
import { e as bt, t as kt } from "./height.props.26hvoARc.js";
const M = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], wt = { p: { type: "enum | string", className: "rt-r-p", customProperties: ["--p"], values: M, responsive: !0 }, px: { type: "enum | string", className: "rt-r-px", customProperties: ["--pl", "--pr"], values: M, responsive: !0 }, py: { type: "enum | string", className: "rt-r-py", customProperties: ["--pt", "--pb"], values: M, responsive: !0 }, pt: { type: "enum | string", className: "rt-r-pt", customProperties: ["--pt"], values: M, responsive: !0 }, pr: { type: "enum | string", className: "rt-r-pr", customProperties: ["--pr"], values: M, responsive: !0 }, pb: { type: "enum | string", className: "rt-r-pb", customProperties: ["--pb"], values: M, responsive: !0 }, pl: { type: "enum | string", className: "rt-r-pl", customProperties: ["--pl"], values: M, responsive: !0 } }, Q = ["visible", "hidden", "clip", "scroll", "auto"], xt = ["static", "relative", "absolute", "fixed", "sticky"], V = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "-1", "-2", "-3", "-4", "-5", "-6", "-7", "-8", "-9"], Nt = ["0", "1"], St = ["0", "1"], Pt = { ...wt, ...kt, ...bt, position: { type: "enum", className: "rt-r-position", values: xt, responsive: !0 }, inset: { type: "enum | string", className: "rt-r-inset", customProperties: ["--inset"], values: V, responsive: !0 }, top: { type: "enum | string", className: "rt-r-top", customProperties: ["--top"], values: V, responsive: !0 }, right: { type: "enum | string", className: "rt-r-right", customProperties: ["--right"], values: V, responsive: !0 }, bottom: { type: "enum | string", className: "rt-r-bottom", customProperties: ["--bottom"], values: V, responsive: !0 }, left: { type: "enum | string", className: "rt-r-left", customProperties: ["--left"], values: V, responsive: !0 }, overflow: { type: "enum", className: "rt-r-overflow", values: Q, responsive: !0 }, overflowX: { type: "enum", className: "rt-r-ox", values: Q, responsive: !0 }, overflowY: { type: "enum", className: "rt-r-oy", values: Q, responsive: !0 }, flexBasis: { type: "string", className: "rt-r-fb", customProperties: ["--flex-basis"], responsive: !0 }, flexShrink: { type: "enum | string", className: "rt-r-fs", customProperties: ["--flex-shrink"], values: Nt, responsive: !0 }, flexGrow: { type: "enum | string", className: "rt-r-fg", customProperties: ["--flex-grow"], values: St, responsive: !0 }, gridArea: { type: "string", className: "rt-r-ga", customProperties: ["--grid-area"], responsive: !0 }, gridColumn: { type: "string", className: "rt-r-gc", customProperties: ["--grid-column"], responsive: !0 }, gridColumnStart: { type: "string", className: "rt-r-gcs", customProperties: ["--grid-column-start"], responsive: !0 }, gridColumnEnd: { type: "string", className: "rt-r-gce", customProperties: ["--grid-column-end"], responsive: !0 }, gridRow: { type: "string", className: "rt-r-gr", customProperties: ["--grid-row"], responsive: !0 }, gridRowStart: { type: "string", className: "rt-r-grs", customProperties: ["--grid-row-start"], responsive: !0 }, gridRowEnd: { type: "string", className: "rt-r-gre", customProperties: ["--grid-row-end"], responsive: !0 } }, Et = ["1", "2", "3", "4"], Ct = ["classic", "solid", "soft", "surface", "outline", "ghost"], ve = { ...Ce, size: { type: "enum", className: "rt-r-size", values: Et, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: Ct, default: "solid" }, ...ht, ...Ee, ...Pe, loading: { type: "boolean", className: "rt-loading", default: !1 } }, Z = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], $t = { gap: { type: "enum | string", className: "rt-r-gap", customProperties: ["--gap"], values: Z, responsive: !0 }, gapX: { type: "enum | string", className: "rt-r-cg", customProperties: ["--column-gap"], values: Z, responsive: !0 }, gapY: { type: "enum | string", className: "rt-r-rg", customProperties: ["--row-gap"], values: Z, responsive: !0 } }, It = ["div", "span"], Bt = ["none", "inline-flex", "flex"], Dt = ["row", "column", "row-reverse", "column-reverse"], Rt = ["start", "center", "end", "baseline", "stretch"], Lt = ["start", "center", "end", "between"], At = ["nowrap", "wrap", "wrap-reverse"], Tt = { as: { type: "enum", values: It, default: "div" }, ...Ce, display: { type: "enum", className: "rt-r-display", values: Bt, responsive: !0 }, direction: { type: "enum", className: "rt-r-fd", values: Dt, responsive: !0 }, align: { type: "enum", className: "rt-r-ai", values: Rt, responsive: !0 }, justify: { type: "enum", className: "rt-r-jc", values: Lt, parseValue: Ht, responsive: !0 }, wrap: { type: "enum", className: "rt-r-fw", values: At, responsive: !0 }, ...$t };
function Ht(e) {
  return e === "between" ? "space-between" : e;
}
const G = d.forwardRef((e, t) => {
  const { className: r, asChild: s, as: a = "div", ...l } = X(e, Tt, Pt, Y);
  return d.createElement(s ? xe : a, { ...l, ref: t, className: W("rt-Flex", r) });
});
G.displayName = "Flex";
const Mt = ["1", "2", "3"], zt = { size: { type: "enum", className: "rt-r-size", values: Mt, default: "2", responsive: !0 }, loading: { type: "boolean", default: !0 } }, $e = d.forwardRef((e, t) => {
  const { className: r, children: s, loading: a, ...l } = X(e, zt, Y);
  if (!a) return s;
  const f = d.createElement("span", { ...l, ref: t, className: W("rt-Spinner", r) }, d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }), d.createElement("span", { className: "rt-SpinnerLeaf" }));
  return s === void 0 ? f : d.createElement(G, { asChild: !0, position: "relative", align: "center", justify: "center" }, d.createElement("span", null, d.createElement("span", { "aria-hidden": !0, style: { display: "contents", visibility: "hidden" }, inert: void 0 }, s), d.createElement(G, { asChild: !0, align: "center", justify: "center", position: "absolute", inset: "0" }, d.createElement("span", null, f))));
});
$e.displayName = "Spinner";
function jt(e, t) {
  if (e !== void 0) return typeof e == "string" ? t(e) : Object.fromEntries(Object.entries(e).map(([r, s]) => [r, t(s)]));
}
function jr(e) {
  return e === "3" ? "3" : "2";
}
function Kt(e) {
  switch (e) {
    case "1":
      return "1";
    case "2":
    case "3":
      return "2";
    case "4":
      return "3";
  }
}
const Ie = d.forwardRef((e, t) => {
  const { size: r = ve.size.default } = e, { className: s, children: a, asChild: l, color: f, radius: c, disabled: n = e.loading, ...u } = X(e, ve, Y);
  return d.createElement(l ? xe : "button", { "data-disabled": n || void 0, "data-accent-color": f, "data-radius": c, ...u, ref: t, className: W("rt-reset", "rt-BaseButton", s), disabled: n }, e.loading ? d.createElement(d.Fragment, null, d.createElement("span", { style: { display: "contents", visibility: "hidden" }, "aria-hidden": !0 }, a), d.createElement(Ye, null, a), d.createElement(G, { asChild: !0, align: "center", justify: "center", position: "absolute", inset: "0" }, d.createElement("span", null, d.createElement($e, { size: jt(r, Kt) })))) : a);
});
Ie.displayName = "BaseButton";
const se = d.forwardRef(({ className: e, ...t }, r) => d.createElement(Ie, { ...t, ref: r, className: W("rt-Button", e) }));
se.displayName = "Button";
function _t(e) {
  const t = d.useRef({ value: e, previous: e });
  return d.useMemo(() => (t.current.value !== e && (t.current.previous = t.current.value, t.current.value = e), t.current.previous), [e]);
}
var ce = "Switch", [Ot, Kr] = Ze(ce), [Ft, Wt] = Ot(ce), Be = d.forwardRef(
  (e, t) => {
    const {
      __scopeSwitch: r,
      name: s,
      checked: a,
      defaultChecked: l,
      required: f,
      disabled: c,
      value: n = "on",
      onCheckedChange: u,
      ...v
    } = e, [m, g] = d.useState(null), o = Je(t, (R) => g(R)), $ = d.useRef(!1), D = m ? !!m.closest("form") : !0, [x = !1, h] = Qe({
      prop: a,
      defaultProp: l,
      onChange: u
    });
    return /* @__PURE__ */ C(Ft, { scope: r, checked: x, disabled: c, children: [
      /* @__PURE__ */ p(
        Ne.button,
        {
          type: "button",
          role: "switch",
          "aria-checked": x,
          "aria-required": f,
          "data-state": Le(x),
          "data-disabled": c ? "" : void 0,
          disabled: c,
          value: n,
          ...v,
          ref: o,
          onClick: et(e.onClick, (R) => {
            h((j) => !j), D && ($.current = R.isPropagationStopped(), $.current || R.stopPropagation());
          })
        }
      ),
      D && /* @__PURE__ */ p(
        Vt,
        {
          control: m,
          bubbles: !$.current,
          name: s,
          value: n,
          checked: x,
          required: f,
          disabled: c,
          style: { transform: "translateX(-100%)" }
        }
      )
    ] });
  }
);
Be.displayName = ce;
var De = "SwitchThumb", Re = d.forwardRef(
  (e, t) => {
    const { __scopeSwitch: r, ...s } = e, a = Wt(De, r);
    return /* @__PURE__ */ p(
      Ne.span,
      {
        "data-state": Le(a.checked),
        "data-disabled": a.disabled ? "" : void 0,
        ...s,
        ref: t
      }
    );
  }
);
Re.displayName = De;
var Vt = (e) => {
  const { control: t, checked: r, bubbles: s = !0, ...a } = e, l = d.useRef(null), f = _t(r), c = tt(t);
  return d.useEffect(() => {
    const n = l.current, u = window.HTMLInputElement.prototype, m = Object.getOwnPropertyDescriptor(u, "checked").set;
    if (f !== r && m) {
      const g = new Event("click", { bubbles: s });
      m.call(n, r), n.dispatchEvent(g);
    }
  }, [f, r, s]), /* @__PURE__ */ p(
    "input",
    {
      type: "checkbox",
      "aria-hidden": !0,
      defaultChecked: r,
      ...a,
      tabIndex: -1,
      ref: l,
      style: {
        ...e.style,
        ...c,
        position: "absolute",
        pointerEvents: "none",
        opacity: 0,
        margin: 0
      }
    }
  );
};
function Le(e) {
  return e ? "checked" : "unchecked";
}
var qt = Be, Ut = Re;
const Gt = ["1", "2", "3"], Xt = ["classic", "surface", "soft"], Yt = { size: { type: "enum", className: "rt-r-size", values: Gt, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: Xt, default: "surface" }, ...yt, ...Ee, ...Pe }, Ae = d.forwardRef((e, t) => {
  const { className: r, color: s, radius: a, ...l } = X(e, Yt, Y);
  return d.createElement(qt, { "data-accent-color": s, "data-radius": a, ...l, asChild: !1, ref: t, className: W("rt-reset", "rt-SwitchRoot", r) }, d.createElement(Ut, { className: W("rt-SwitchThumb", { "rt-high-contrast": e.highContrast }) }));
});
Ae.displayName = "Switch";
const ge = 1e3;
function Jt() {
  const e = ie(), t = st(), { onSavePage: r, onSaveSite: s, onDraftChange: a } = ae(), l = me(async (c) => {
    await (r == null ? void 0 : r({
      pageId: t.id,
      pageVersionId: "latest",
      siteId: t.siteId,
      data: c
    })), e.setDirty(!1);
  }, ge), f = me(async (c) => {
    await (s == null ? void 0 : s({
      siteId: t.siteId,
      data: c
    })), e.setDirty(!1);
  }, ge);
  ot((c) => {
    console.debug("Sections have changed, updating page version", c), e.setDirty(!0), l({ sections: c });
  }), at((c) => {
    console.debug("Attributes have changed:", c), e.setDirty(!0), l({ attr: c });
  }), it((c) => {
    console.debug("pagePath has changed, updating page version"), e.setDirty(!0), l({ path: c });
  }), lt((c) => {
    console.debug("theme has changed, updating page version"), e.setDirty(!0), f({ theme: c });
  });
}
function oe() {
  return oe = Object.assign ? Object.assign.bind() : function(e) {
    for (var t = 1; t < arguments.length; t++) {
      var r = arguments[t];
      for (var s in r) ({}).hasOwnProperty.call(r, s) && (e[s] = r[s]);
    }
    return e;
  }, oe.apply(null, arguments);
}
var Te = ["shift", "alt", "meta", "mod", "ctrl"], Qt = {
  esc: "escape",
  return: "enter",
  ".": "period",
  ",": "comma",
  "-": "slash",
  " ": "space",
  "`": "backquote",
  "#": "backslash",
  "+": "bracketright",
  ShiftLeft: "shift",
  ShiftRight: "shift",
  AltLeft: "alt",
  AltRight: "alt",
  MetaLeft: "meta",
  MetaRight: "meta",
  OSLeft: "meta",
  OSRight: "meta",
  ControlLeft: "ctrl",
  ControlRight: "ctrl"
};
function A(e) {
  return (e && Qt[e] || e || "").trim().toLowerCase().replace(/key|digit|numpad|arrow/, "");
}
function Zt(e) {
  return Te.includes(e);
}
function ee(e, t) {
  return t === void 0 && (t = ","), e.split(t);
}
function te(e, t, r) {
  t === void 0 && (t = "+");
  var s = e.toLocaleLowerCase().split(t).map(function(f) {
    return A(f);
  }), a = {
    alt: s.includes("alt"),
    ctrl: s.includes("ctrl") || s.includes("control"),
    shift: s.includes("shift"),
    meta: s.includes("meta"),
    mod: s.includes("mod")
  }, l = s.filter(function(f) {
    return !Te.includes(f);
  });
  return oe({}, a, {
    keys: l,
    description: r,
    hotkey: e
  });
}
(function() {
  typeof document < "u" && (document.addEventListener("keydown", function(e) {
    e.key !== void 0 && He([A(e.key), A(e.code)]);
  }), document.addEventListener("keyup", function(e) {
    e.key !== void 0 && Me([A(e.key), A(e.code)]);
  })), typeof window < "u" && window.addEventListener("blur", function() {
    T.clear();
  });
})();
var T = /* @__PURE__ */ new Set();
function ue(e) {
  return Array.isArray(e);
}
function er(e, t) {
  t === void 0 && (t = ",");
  var r = ue(e) ? e : e.split(t);
  return r.every(function(s) {
    return T.has(s.trim().toLowerCase());
  });
}
function He(e) {
  var t = Array.isArray(e) ? e : [e];
  T.has("meta") && T.forEach(function(r) {
    return !Zt(r) && T.delete(r.toLowerCase());
  }), t.forEach(function(r) {
    return T.add(r.toLowerCase());
  });
}
function Me(e) {
  var t = Array.isArray(e) ? e : [e];
  e === "meta" ? T.clear() : t.forEach(function(r) {
    return T.delete(r.toLowerCase());
  });
}
function tr(e, t, r) {
  (typeof r == "function" && r(e, t) || r === !0) && e.preventDefault();
}
function rr(e, t, r) {
  return typeof r == "function" ? r(e, t) : r === !0 || r === void 0;
}
function nr(e) {
  return ze(e, ["input", "textarea", "select"]);
}
function ze(e, t) {
  t === void 0 && (t = !1);
  var r = e.target, s = e.composed, a = null;
  return sr(r) && s ? a = e.composedPath()[0] && e.composedPath()[0].tagName : a = r && r.tagName, ue(t) ? !!(a && t && t.some(function(l) {
    var f;
    return l.toLowerCase() === ((f = a) == null ? void 0 : f.toLowerCase());
  })) : !!(a && t && t);
}
function sr(e) {
  return !!e.tagName && !e.tagName.startsWith("-") && e.tagName.includes("-");
}
function or(e, t) {
  return e.length === 0 && t ? (console.warn('A hotkey has the "scopes" option set, however no active scopes were found. If you want to use the global scopes feature, you need to wrap your app in a <HotkeysProvider>'), !0) : t ? e.some(function(r) {
    return t.includes(r);
  }) || e.includes("*") : !0;
}
var ar = function(t, r, s) {
  s === void 0 && (s = !1);
  var a = r.alt, l = r.meta, f = r.mod, c = r.shift, n = r.ctrl, u = r.keys, v = t.key, m = t.code, g = t.ctrlKey, o = t.metaKey, $ = t.shiftKey, D = t.altKey, x = A(m), h = v.toLowerCase();
  if (!(u != null && u.includes(x)) && !(u != null && u.includes(h)) && !["ctrl", "control", "unknown", "meta", "alt", "shift", "os"].includes(x))
    return !1;
  if (!s) {
    if (a === !D && h !== "alt" || c === !$ && h !== "shift")
      return !1;
    if (f) {
      if (!o && !g)
        return !1;
    } else if (l === !o && h !== "meta" && h !== "os" || n === !g && h !== "ctrl" && h !== "control")
      return !1;
  }
  return u && u.length === 1 && (u.includes(h) || u.includes(x)) ? !0 : u ? er(u) : !u;
}, ir = /* @__PURE__ */ we(void 0), lr = function() {
  return ke(ir);
};
function je(e, t) {
  return e && t && typeof e == "object" && typeof t == "object" ? Object.keys(e).length === Object.keys(t).length && //@ts-ignore
  Object.keys(e).reduce(function(r, s) {
    return r && je(e[s], t[s]);
  }, !0) : e === t;
}
var cr = /* @__PURE__ */ we({
  hotkeys: [],
  enabledScopes: [],
  toggleScope: function() {
  },
  enableScope: function() {
  },
  disableScope: function() {
  }
}), ur = function() {
  return ke(cr);
};
function dr(e) {
  var t = F(void 0);
  return je(t.current, e) || (t.current = e), t.current;
}
var he = function(t) {
  t.stopPropagation(), t.preventDefault(), t.stopImmediatePropagation();
}, pr = typeof window < "u" ? Ue : U;
function N(e, t, r, s) {
  var a = ne(null), l = a[0], f = a[1], c = F(!1), n = r instanceof Array ? s instanceof Array ? void 0 : s : r, u = ue(e) ? e.join(n == null ? void 0 : n.splitKey) : e, v = r instanceof Array ? r : s instanceof Array ? s : void 0, m = qe(t, v ?? []), g = F(m);
  v ? g.current = m : g.current = t;
  var o = dr(n), $ = ur(), D = $.enabledScopes, x = lr();
  return pr(function() {
    if (!((o == null ? void 0 : o.enabled) === !1 || !or(D, o == null ? void 0 : o.scopes))) {
      var h = function(i, b) {
        var k;
        if (b === void 0 && (b = !1), !(nr(i) && !ze(i, o == null ? void 0 : o.enableOnFormTags))) {
          if (l !== null) {
            var H = l.getRootNode();
            if ((H instanceof Document || H instanceof ShadowRoot) && H.activeElement !== l && !l.contains(H.activeElement)) {
              he(i);
              return;
            }
          }
          (k = i.target) != null && k.isContentEditable && !(o != null && o.enableOnContentEditable) || ee(u, o == null ? void 0 : o.splitKey).forEach(function(de) {
            var E, L = te(de, o == null ? void 0 : o.combinationKey);
            if (ar(i, L, o == null ? void 0 : o.ignoreModifiers) || (E = L.keys) != null && E.includes("*")) {
              if (o != null && o.ignoreEventWhen != null && o.ignoreEventWhen(i) || b && c.current)
                return;
              if (tr(i, L, o == null ? void 0 : o.preventDefault), !rr(i, L, o == null ? void 0 : o.enabled)) {
                he(i);
                return;
              }
              g.current(i, L), b || (c.current = !0);
            }
          });
        }
      }, R = function(i) {
        i.key !== void 0 && (He(A(i.code)), ((o == null ? void 0 : o.keydown) === void 0 && (o == null ? void 0 : o.keyup) !== !0 || o != null && o.keydown) && h(i));
      }, j = function(i) {
        i.key !== void 0 && (Me(A(i.code)), c.current = !1, o != null && o.keyup && h(i, !0));
      }, K = l || (n == null ? void 0 : n.document) || document;
      return K.addEventListener("keyup", j), K.addEventListener("keydown", R), x && ee(u, o == null ? void 0 : o.splitKey).forEach(function(y) {
        return x.addHotkey(te(y, o == null ? void 0 : o.combinationKey, o == null ? void 0 : o.description));
      }), function() {
        K.removeEventListener("keyup", j), K.removeEventListener("keydown", R), x && ee(u, o == null ? void 0 : o.splitKey).forEach(function(y) {
          return x.removeHotkey(te(y, o == null ? void 0 : o.combinationKey, o == null ? void 0 : o.description));
        });
      };
    }
  }, [l, u, o, D]), f;
}
function fr() {
  const e = ae(), t = le(), r = ie(), s = ye(), a = be(), l = ct(a), { undo: f, redo: c } = ut();
  N("esc", () => {
    e.deselectBrick(), e.setSelectedSectionId(), e.hidePanel();
  }), N("mod+c", () => {
    const n = window.getSelection();
    n != null && n.rangeCount || console.debug("mod+c pressed");
  }), N(["backspace", "del"], (n) => {
    a && (n.preventDefault(), t.deleteBrick(a), e.deselectBrick(a), e.hidePanel("inspector"));
  }), N("s", (n) => {
    n.preventDefault(), e.togglePanel("settings");
  }), N("l", (n) => {
    n.preventDefault(), e.togglePanel("library");
  }), N("t", (n) => {
    n.preventDefault(), e.togglePanel("theme");
  }), N("p", (n) => {
    n.preventDefault(), e.togglePanel();
  }), N(
    ["mod+up", "mod+left"],
    (n) => {
      n.preventDefault(), a && (console.log("Moving %s up", a), t.moveBrickWithin(a, "previous"));
    },
    {
      enableOnContentEditable: !0
    }
  ), N(["mod+z", "ctrl+z"], (n) => {
    n.preventDefault(), f();
  }), N(["mod+shift+z", "ctrl+shift+z"], (n) => {
    n.preventDefault(), c();
  }), N(
    ["mod+down", "mod+right"],
    (n) => {
      n.preventDefault(), a && (console.log("Moving %s to right", a), t.moveBrickWithin(a, "next"));
    },
    {
      enableOnContentEditable: !0
    }
  ), N("mod+d", (n) => {
    n.preventDefault(), a && (t.duplicateBrick(a), rt("Brick duplicated", {
      id: "duplicate-brick"
    }));
  }), N("mod+j", (n) => {
    n.preventDefault(), e.toggleEditorEnabled();
  }), N("mod+g", (n) => {
    n.preventDefault(), console.log("Debugging draft:");
    const { sections: u, themes: v, siteAttr: m, sitemap: g, attr: o, brickMap: $ } = r;
    console.log({ sections: u, themes: v, siteAttr: m, sitemap: g, attr: o, brickMap: $ });
  }), N(
    "space",
    (n) => {
      console.log("space pressed", n), !n.target.classList.contains("tiptap") && (n.preventDefault(), n.stopPropagation(), l && t.updateBrickProps(
        l.id,
        {
          grow: !l.props.grow
        },
        s === "mobile"
      ));
    },
    {
      enableOnContentEditable: !0
    }
  );
}
function mr({ themes: e }) {
  var u;
  const [t, r] = ne(0), [s, a] = ne(0), l = F(null), f = F(null), c = Ke(), n = e[t];
  return U(() => {
    const v = setInterval(() => {
      r((m) => (m + 1) % e.length), c != null && c.length && a((m) => (m + 1) % c.length);
    }, 1e4);
    return () => clearInterval(v);
  }, [e, c]), U(() => {
    var v, m, g;
    (v = f.current) == null || v.style.setProperty("background-color", n.colors.base200), (m = f.current) == null || m.style.setProperty("color", n.colors.baseContent), (g = l.current) == null || g.style.setProperty(
      "background-image",
      `conic-gradient(from 0deg, ${n.colors.primary}, ${n.colors.secondary}, ${n.colors.accent}, ${n.colors.primary})`
    );
  }, [n]), /* @__PURE__ */ C(
    "div",
    {
      ref: f,
      className: S(
        "w-full flex justify-center items-center h-full relative overflow-hidden animate-background bg-size[400%] opacity-50",
        O({
          backgroundImage: c ? `url(${(u = c[s]) == null ? void 0 : u.url})` : "none",
          backgroundSize: "cover"
        })
      ),
      children: [
        /* @__PURE__ */ p("div", { ref: l, className: S("absolute w-[100vh] h-[100vh] inset-0 animate-spin-blob z-20") }),
        /* @__PURE__ */ p(
          "div",
          {
            className: S(
              "rounded-full absolute backdrop-blur-3xl inset-0 scale-150 bg-white/40 z-50 flex items-center justify-center",
              O({
                textShadow: "0 0 3px rgba(0, 0, 0, 0.3)",
                color: "#FFFFFF",
                fontSize: "1.2rem",
                fontWeight: "bold",
                transition: "color 0.3s ease, background-color 0.3s ease"
              })
            ),
            children: n.name
          }
        )
      ]
    }
  );
}
function vr() {
  return Se(), dt(), /* @__PURE__ */ p(
    "div",
    {
      className: S("absolute bg-gray-200 top-0 bottom-0 left-0 right-0 flex items-center justify-center"),
      children: /* @__PURE__ */ C("h2", { className: S("text-gray-400 leading-relaxed text-xl font-semibold flex-1 text-center !font-sans"), children: [
        "Welcome!",
        /* @__PURE__ */ p("br", {}),
        "To get started, please answer a few questions from our beloved Bot, Upsie.",
        /* @__PURE__ */ p("br", {}),
        "Your site will then appear here... 🤩"
      ] })
    }
  );
}
function gr() {
  var e;
  return ((e = globalThis.location) == null ? void 0 : e.hostname) === "localhost";
}
const hr = z(() => import("./Tour.Bsb8n9Bn.js")), yr = z(() => import("./NavBar.CwggsoND.js")), br = z(() => import("./Chat.D9gFCUcy.js")), kr = z(() => import("./EditablePage.DsDuD92u.js")), wr = z(() => import("../Page.js")), re = z(() => import("./DeviceFrame.BnOntnxd.js")), xr = z(() => import("./Panel.MXnX74DA.js"));
function _r(e) {
  const t = F(null), r = ie(), s = _e(), a = Oe(), l = pt(), { panelPosition: f } = Fe(), c = ft(), n = Se(), u = le(), v = ye(), { setDraggingBrickType: m, toggleDebugMode: g, hidePanel: o } = ae(), $ = be(), D = We(), x = gr(), h = Ve();
  Jt(), fr(), U(() => {
    const y = r.previewTheme ?? r.theme;
    y && Xe(O(mt(y)));
  }, [r.previewTheme, r.theme]);
  const R = (y) => {
    const { draggableId: i } = y, b = document.getElementById(i);
    b == null || b.classList.add(S("moving"));
  }, j = (y) => {
    m(y.draggableId);
    const i = document.getElementById(y.draggableId);
    i && (window.getComputedStyle(i).getPropertyValue("background-color") === "rgba(0, 0, 0, 0)" && i.classList.add(S("!bg-upstart-100")), i.classList.add(S("shadow-2xl")), i.style.setProperty("max-height", "25dvh", "important"), i.style.setProperty("overflow", "hidden", "important"));
  }, K = (y) => {
    var L, pe;
    const { destination: i, source: b, draggableId: k, type: H, combine: de } = y;
    m(null);
    const E = document.getElementById(k);
    if (E && (E.classList.remove(S("moving")), E.classList.remove(S("shadow-2xl")), E.style.removeProperty("box-shadow"), E.style.removeProperty("max-height"), E.style.removeProperty("overflow"), E.style.removeProperty("scale"), E.style.removeProperty("transform-origin"), E.style.removeProperty("transition")), !i) {
      console.warn("Dropped outside a valid droppable area, no action taken.");
      return;
    }
    if (i.droppableId === b.droppableId && i.index === b.index) {
      console.log("Dropped in the same position, no action taken.");
      return;
    }
    if (b.droppableId.startsWith("$library$")) {
      const B = l.find((I) => I.id === i.droppableId);
      if (B) {
        const I = J(k);
        u.addBrick(I, B.id, i.index, null), console.log(
          `Added new brick ${k} to section ${B.id} at index ${i.index}`
        );
      }
      const P = u.getBrick(i.droppableId);
      if (P && q[P.type] && q[P.type].isContainer) {
        const I = J(k), w = (L = r.brickMap.get(P.id)) == null ? void 0 : L.sectionId;
        if (!w) {
          console.warn(`No section found for container ${P.id}`);
          return;
        }
        u.addBrick(I, w, i.index, P.id), console.log(
          `Added new brick ${k} to container ${P.id} at index ${i.index} in section ${w}`
        );
      }
      if (i.droppableId === "page") {
        const I = `s_${gt()}`;
        u.createEmptySection(I);
        const w = J(k);
        u.addBrick(w, I, 0, null);
      }
    } else if (H === "section") {
      const B = Array.from(l), [P] = B.splice(b.index, 1);
      B.splice(i.index, 0, P), u.reorderSections(B.map((I) => I.id));
    } else if (H === "brick") {
      const B = b.droppableId, P = i.droppableId;
      if (l.find((w) => w.id === i.droppableId))
        B === P ? (console.log(
          `Moving brick ${k} within section from ${b.index} to ${i.index}`
        ), u.reorderBrickWithin(k, i.index)) : (console.log(
          `Moving brick ${k} from section ${B} to ${P}`
        ), u.moveBrickToSection(k, P, i.index));
      else {
        const w = u.getBrick(i.droppableId);
        if (w && q[w.type] && q[w.type].isContainer) {
          const fe = (pe = r.brickMap.get(w.id)) == null ? void 0 : pe.sectionId;
          if (!fe) {
            console.warn(`No section found for container ${w.id}`);
            return;
          }
          if (k === w.id) {
            console.warn("Cannot move a container into itself");
            return;
          }
          console.log(
            `Moving brick ${k} to container ${w.id} at index ${i.index} in section ${fe}`
          ), u.moveBrickToContainerBrick(k, w.id, i.index);
        }
      }
      v === "desktop" && Ge(() => {
        u.adjustMobileLayout();
      });
    }
  };
  return s ? /* @__PURE__ */ p(
    vt,
    {
      onDragEnd: K,
      onDragStart: R,
      onBeforeCapture: j,
      children: /* @__PURE__ */ C(
        "div",
        {
          id: "editor",
          className: S(
            "grid relative transition-all mx-auto w-full",
            Nr(n, a),
            "min-h-[100dvh] max-h-[100dvh]",
            n.isReady === !1 && O({
              background: `linear-gradient(120deg,
              oklab(from #9291e7 l a b / 0.65),
              oklab(from #7270c6 l a b / 0.65),
              oklab(from #c050c2 l a b / 0.65),
              oklab(from #ef50a2 l a b / 0.65),
              oklab(from #ff6285 l a b / 0.65),
              oklab(from #ff806b l a b / 0.65),
              oklab(from #ffa25a l a b / 0.65),
              oklab(from #ffc358 l a b / 0.65)
          )`
            }),
            n.isReady === !1 && "transition-all duration-500 ease-in-out"
          ),
          ...e,
          ref: t,
          children: [
            l.length > 0 && n.isReady && /* @__PURE__ */ p(_, { children: /* @__PURE__ */ p(hr, {}) }),
            /* @__PURE__ */ p(_, { children: /* @__PURE__ */ p(yr, {}) }),
            a && /* @__PURE__ */ p(_, { children: /* @__PURE__ */ p(br, {}) }),
            /* @__PURE__ */ p(_, { children: /* @__PURE__ */ p(xr, {}) }),
            /* @__PURE__ */ C(
              "main",
              {
                className: S(
                  "flex-1 flex place-content-center z-40 overflow-x-auto overscroll-none ",
                  n.isReady === !1 && "!hidden",
                  O({
                    gridArea: "main",
                    scrollbarColor: "var(--violet-4) var(--violet-2)",
                    scrollBehavior: "smooth",
                    scrollbarGutter: "stable",
                    scrollbarWidth: f === "left" ? "thin" : "none",
                    "&:hover": {
                      scrollbarColor: "var(--violet-7) var(--violet-3)"
                    }
                  })
                ),
                children: [
                  n.isReady && /* @__PURE__ */ p(_, { children: /* @__PURE__ */ C(re, { children: [
                    /* @__PURE__ */ p(kr, {}),
                    r.previewTheme && /* @__PURE__ */ p(Sr, {})
                  ] }) }),
                  !n.isReady && (c.length > 0 ? /* @__PURE__ */ p(re, { children: /* @__PURE__ */ p(mr, { themes: c }) }) : /* @__PURE__ */ p(re, { children: /* @__PURE__ */ p(vr, {}) })),
                  /* @__PURE__ */ p(
                    nt,
                    {
                      toastOptions: {
                        position: "bottom-center",
                        style: {
                          background: "rgba(0, 0, 0, 0.85)",
                          color: "white",
                          fontSize: "0.85rem",
                          fontWeight: "500"
                          // marginBottom: "1rem",
                        },
                        className: S("last:mb-1 px-1 py-1 rounded-lg"),
                        error: {
                          style: {
                            background: "#880808"
                          }
                        }
                      }
                    }
                  ),
                  x && /* @__PURE__ */ C(
                    "div",
                    {
                      className: "fixed flex max-w-[548px] items-center divide-x divide-gray-300 bottom-0 right-6 p-2 text-xs text-gray-500 bg-gray-100 dark:bg-dark-800 z-[19999] rounded-t-md",
                      style: {
                        // Shadow to the top left corner
                        boxShadow: "0 -2px 4px rgba(0, 0, 0, 0.1), -2px 0 4px rgba(0, 0, 0, 0.1)"
                      },
                      children: [
                        /* @__PURE__ */ C("div", { className: "px-2", children: [
                          "Selected brick: ",
                          $ ?? "none"
                        ] }),
                        /* @__PURE__ */ C("div", { className: "px-2", children: [
                          "Selected section: ",
                          D ?? "none"
                        ] }),
                        /* @__PURE__ */ C("div", { className: "flex items-center gap-1 px-2", children: [
                          /* @__PURE__ */ p(Ae, { defaultChecked: h, onCheckedChange: g, size: "1", id: "debug-mode" }),
                          /* @__PURE__ */ C("label", { htmlFor: "debug-mode", className: "cursor-pointer select-none", children: [
                            "Debug mode",
                            " ",
                            /* @__PURE__ */ p("b", { className: S("font-semibold", h ? "text-upstart-600" : "text-gray-500"), children: h ? "on" : "off" })
                          ] })
                        ] })
                      ]
                    }
                  )
                ]
              }
            )
          ]
        }
      )
    }
  ) : /* @__PURE__ */ p("div", { className: "@container", children: /* @__PURE__ */ p(_, { children: /* @__PURE__ */ p(
    wr,
    {
      page: {
        ...r,
        tags: []
      }
    }
  ) }) });
}
function Nr(e, t) {
  return O({
    gridTemplateAreas: t ? '"navbar navbar" "chat main"' : '"navbar" "main"',
    gridTemplateRows: "64px 1fr",
    gridTemplateColumns: e.isReady === !1 ? "1fr 0px" : t ? "360px 1fr" : "1fr"
    // maxWidth: generationState.isReady === false ? "clamp(500px, 40dvw, 650px)" : "none",
  });
}
function Sr() {
  const { validatePreviewTheme: e } = le();
  return /* @__PURE__ */ p("div", { className: "sticky bottom-4 left-0 right-0 flex justify-center items-center z-[9999]", children: /* @__PURE__ */ C("div", { className: "p-3 bg-black/70 backdrop-blur-md rounded-lg max-w-fit flex gap-2 shadow-xl", children: [
    /* @__PURE__ */ p(se, { variant: "solid", color: "gray", onClick: () => e(!1), children: "Revert" }),
    /* @__PURE__ */ p(se, { onClick: () => e(!0), variant: "solid", children: "Accept theme" })
  ] }) });
}
export {
  _r as E,
  jt as a,
  jr as b,
  Tt as c,
  Ae as i,
  Ie as n,
  se as o,
  wt as p,
  $e as s,
  _t as u
};
//# sourceMappingURL=Editor.BKAe5gEp.js.map
