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