import { jsxs as E, jsx as f } from "react/jsx-runtime";
import { u as ae, a as Me, b as ie, c as Ke, d as je, e as _e, f as Oe, g as le, h as he, i as Fe, j as We, k as ye, l as Ve, m as qe, n as Ue, o as Ge, p as Xe, q as Ye, r as Je, s as Qe, t as Ze } from "./use-editor.BroT97uF.js";
import * as d from "react";
import { useState as ne, useRef as O, useCallback as et, useLayoutEffect as tt, useEffect as U, useContext as be, createContext as ke, lazy as z, Suspense as j, startTransition as rt } from "react";
import { _ as P, B as _, r as nt } from "./twind.D7be0E5m.js";
import { c as st, O as ot } from "./index.Bxix3KXR.js";
import { u as fe } from "./index.DgDwMmGF.js";
import { getThemeCss as at } from "../get-theme-css.js";
import { D as it } from "./dnd.esm.ByOls-Fs.js";
import { N as J, y as q, m as lt } from "./_commonjsHelpers.C2ttCLrd.js";
import "@sinclair/typebox";
import "lodash-es";
import { S as we, y as F, V as ct, u as ut, a as dt, c as pt, P as xe, b as ft, d as mt } from "./index.need7dF0.js";
import { e as gt, t as vt, o as ht, p as yt, u as bt } from "./index.ChhKNKNO.js";
import { r as Ne, o as Se, s as kt, a as Ee, v as X, b as Y, c as wt } from "./radius.prop.Kearsnsi.js";
const H = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], xt = { p: { type: "enum | string", className: "rt-r-p", customProperties: ["--p"], values: H, responsive: !0 }, px: { type: "enum | string", className: "rt-r-px", customProperties: ["--pl", "--pr"], values: H, responsive: !0 }, py: { type: "enum | string", className: "rt-r-py", customProperties: ["--pt", "--pb"], values: H, responsive: !0 }, pt: { type: "enum | string", className: "rt-r-pt", customProperties: ["--pt"], values: H, responsive: !0 }, pr: { type: "enum | string", className: "rt-r-pr", customProperties: ["--pr"], values: H, responsive: !0 }, pb: { type: "enum | string", className: "rt-r-pb", customProperties: ["--pb"], values: H, responsive: !0 }, pl: { type: "enum | string", className: "rt-r-pl", customProperties: ["--pl"], values: H, responsive: !0 } }, Q = ["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: 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: 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"], me = { ...Ee, size: { type: "enum", className: "rt-r-size", values: Pt, default: "2", responsive: !0 }, variant: { type: "enum", className: "rt-variant", values: $t, default: "solid" }, ...kt, ...Se, ...Ne, loading: { type: "boolean", className: "rt-loading", default: !1 } }, Z = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], It = { 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 } }, 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"], Tt = ["nowrap", "wrap", "wrap-reverse"], Ht = { as: { type: "enum", values: Bt, default: "div" }, ...Ee, 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: zt, responsive: !0 }, wrap: { type: "enum", className: "rt-r-fw", values: Tt, responsive: !0 }, ...It };
function zt(e) {
  return e === "between" ? "space-between" : e;
}
const G = d.forwardRef((e, t) => {
  const { className: r, asChild: n, as: u = "div", ...l } = X(e, Ht, Ct, Y);
  return d.createElement(n ? we : u, { ...l, ref: t, className: F("rt-Flex", r) });
});
G.displayName = "Flex";
const Mt = ["1", "2", "3"], Kt = { size: { type: "enum", className: "rt-r-size", values: Mt, default: "2", responsive: !0 }, loading: { type: "boolean", default: !0 } }, Ce = d.forwardRef((e, t) => {
  const { className: r, children: n, loading: u, ...l } = X(e, Kt, Y);
  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(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 }, n), d.createElement(G, { asChild: !0, align: "center", justify: "center", position: "absolute", inset: "0" }, d.createElement("span", null, s))));
});
Ce.displayName = "Spinner";
const Pe = d.forwardRef((e, t) => {
  const { size: r = me.size.default } = e, { className: n, children: u, asChild: l, color: s, radius: i, disabled: p = e.loading, ...c } = X(e, me, Y);
  return d.createElement(l ? we : "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(G, { asChild: !0, align: "center", justify: "center", position: "absolute", inset: "0" }, d.createElement("span", null, d.createElement(Ce, { size: ht(r, yt) })))) : u);
});
Pe.displayName = "BaseButton";
const se = d.forwardRef(({ className: e, ...t }, r) => d.createElement(Pe, { ...t, ref: r, className: F("rt-Button", e) }));
se.displayName = "Button";
var ce = "Switch", [jt, zr] = pt(ce), [_t, Ot] = jt(ce), $e = d.forwardRef(
  (e, t) => {
    const {
      __scopeSwitch: r,
      name: n,
      checked: u,
      defaultChecked: l,
      required: s,
      disabled: i,
      value: p = "on",
      onCheckedChange: c,
      ...g
    } = e, [m, v] = d.useState(null), o = ut(t, (D) => v(D)), I = d.useRef(!1), B = m ? !!m.closest("form") : !0, [w = !1, h] = dt({
      prop: u,
      defaultProp: l,
      onChange: c
    });
    return /* @__PURE__ */ E(_t, { scope: r, checked: w, disabled: i, children: [
      /* @__PURE__ */ f(
        xe.button,
        {
          type: "button",
          role: "switch",
          "aria-checked": w,
          "aria-required": s,
          "data-state": De(w),
          "data-disabled": i ? "" : void 0,
          disabled: i,
          value: p,
          ...g,
          ref: o,
          onClick: ft(e.onClick, (D) => {
            h((M) => !M), B && (I.current = D.isPropagationStopped(), I.current || D.stopPropagation());
          })
        }
      ),
      B && /* @__PURE__ */ f(
        Ft,
        {
          control: m,
          bubbles: !I.current,
          name: n,
          value: p,
          checked: w,
          required: s,
          disabled: i,
          style: { transform: "translateX(-100%)" }
        }
      )
    ] });
  }
);
$e.displayName = ce;
var Ie = "SwitchThumb", Be = d.forwardRef(
  (e, t) => {
    const { __scopeSwitch: r, ...n } = e, u = Ot(Ie, r);
    return /* @__PURE__ */ f(
      xe.span,
      {
        "data-state": De(u.checked),
        "data-disabled": u.disabled ? "" : void 0,
        ...n,
        ref: t
      }
    );
  }
);
Be.displayName = Ie;
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 v = new Event("click", { bubbles: n });
      m.call(p, r), p.dispatchEvent(v);
    }
  }, [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 De(e) {
  return e ? "checked" : "unchecked";
}
var Wt = $e, Vt = Be;
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, ...Se, ...Ne }, Re = d.forwardRef((e, t) => {
  const { className: r, color: n, radius: u, ...l } = X(e, Gt, Y);
  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 }) }));
});
Re.displayName = "Switch";
const ge = 1e3;
function Xt() {
  const e = ae(), t = Me(), { onSavePage: r, onSaveSite: n, onDraftChange: u } = ie(), l = fe(async (i) => {
    await (r == null ? void 0 : r({
      pageId: t.id,
      pageVersionId: "latest",
      siteId: t.siteId,
      data: i
    })), e.setDirty(!1);
  }, ge), s = fe(async (i) => {
    await (n == null ? void 0 : n({
      siteId: t.siteId,
      data: i
    })), e.setDirty(!1);
  }, ge);
  Ke((i) => {
    console.debug("Sections have changed, updating page version", i), e.setDirty(!0), l({ sections: i });
  }), je((i) => {
    console.debug("Attributes have changed:", i), e.setDirty(!0), l({ attr: i });
  }), _e((i) => {
    console.debug("pagePath has changed, updating page version"), e.setDirty(!0), l({ path: i });
  }), Oe((i) => {
    console.debug("theme has changed, updating page version"), e.setDirty(!0), s({ theme: i });
  });
}
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 n in r) ({}).hasOwnProperty.call(r, n) && (e[n] = r[n]);
    }
    return e;
  }, oe.apply(null, arguments);
}
var Le = ["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 Le.includes(e);
}
function ee(e, t) {
  return t === void 0 && (t = ","), e.split(t);
}
function te(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 !Le.includes(s);
  });
  return oe({}, u, {
    keys: l,
    description: r,
    hotkey: e
  });
}
(function() {
  typeof document < "u" && (document.addEventListener("keydown", function(e) {
    e.key !== void 0 && Ae([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 ue(e) {
  return Array.isArray(e);
}
function Qt(e, t) {
  t === void 0 && (t = ",");
  var r = ue(e) ? e : e.split(t);
  return r.every(function(n) {
    return A.has(n.trim().toLowerCase());
  });
}
function Ae(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 He(e, ["input", "textarea", "select"]);
}
function He(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, ue(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, g = t.key, m = t.code, v = t.ctrlKey, o = t.metaKey, I = t.shiftKey, B = t.altKey, w = L(m), h = g.toLowerCase();
  if (!(c != null && c.includes(w)) && !(c != null && c.includes(h)) && !["ctrl", "control", "unknown", "meta", "alt", "shift", "os"].includes(w))
    return !1;
  if (!n) {
    if (u === !B && h !== "alt" || i === !I && h !== "shift")
      return !1;
    if (s) {
      if (!o && !v)
        return !1;
    } else if (l === !o && h !== "meta" && h !== "os" || p === !v && h !== "ctrl" && h !== "control")
      return !1;
  }
  return c && c.length === 1 && (c.includes(h) || c.includes(w)) ? !0 : c ? Qt(c) : !c;
}, or = /* @__PURE__ */ ke(void 0), ar = function() {
  return be(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__ */ ke({
  hotkeys: [],
  enabledScopes: [],
  toggleScope: function() {
  },
  enableScope: function() {
  },
  disableScope: function() {
  }
}), lr = function() {
  return be(ir);
};
function cr(e) {
  var t = O(void 0);
  return ze(t.current, e) || (t.current = e), t.current;
}
var ve = function(t) {
  t.stopPropagation(), t.preventDefault(), t.stopImmediatePropagation();
}, ur = typeof window < "u" ? tt : U;
function N(e, t, r, n) {
  var u = ne(null), l = u[0], s = u[1], i = O(!1), p = r instanceof Array ? n instanceof Array ? void 0 : n : r, c = ue(e) ? e.join(p == null ? void 0 : p.splitKey) : e, g = r instanceof Array ? r : n instanceof Array ? n : void 0, m = et(t, g ?? []), v = O(m);
  g ? v.current = m : v.current = t;
  var o = cr(p), I = lr(), B = I.enabledScopes, w = ar();
  return ur(function() {
    if (!((o == null ? void 0 : o.enabled) === !1 || !nr(B, o == null ? void 0 : o.scopes))) {
      var h = function(a, b) {
        var x;
        if (b === void 0 && (b = !1), !(tr(a) && !He(a, o == null ? void 0 : o.enableOnFormTags))) {
          if (l !== null) {
            var T = l.getRootNode();
            if ((T instanceof Document || T instanceof ShadowRoot) && T.activeElement !== l && !l.contains(T.activeElement)) {
              ve(a);
              return;
            }
          }
          (x = a.target) != null && x.isContentEditable && !(o != null && o.enableOnContentEditable) || ee(c, o == null ? void 0 : o.splitKey).forEach(function(de) {
            var W, R = te(de, 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) || b && i.current)
                return;
              if (Zt(a, R, o == null ? void 0 : o.preventDefault), !er(a, R, o == null ? void 0 : o.enabled)) {
                ve(a);
                return;
              }
              v.current(a, R), b || (i.current = !0);
            }
          });
        }
      }, D = function(a) {
        a.key !== void 0 && (Ae(L(a.code)), ((o == null ? void 0 : o.keydown) === void 0 && (o == null ? void 0 : o.keyup) !== !0 || o != null && o.keydown) && h(a));
      }, M = function(a) {
        a.key !== void 0 && (Te(L(a.code)), i.current = !1, o != null && o.keyup && h(a, !0));
      }, K = l || (p == null ? void 0 : p.document) || document;
      return K.addEventListener("keyup", M), K.addEventListener("keydown", D), w && ee(c, o == null ? void 0 : o.splitKey).forEach(function(y) {
        return w.addHotkey(te(y, o == null ? void 0 : o.combinationKey, o == null ? void 0 : o.description));
      }), function() {
        K.removeEventListener("keyup", M), K.removeEventListener("keydown", D), w && ee(c, o == null ? void 0 : o.splitKey).forEach(function(y) {
          return w.removeHotkey(te(y, o == null ? void 0 : o.combinationKey, o == null ? void 0 : o.description));
        });
      };
    }
  }, [l, c, o, B]), s;
}
function dr() {
  const e = ie(), t = le(), r = ae(), n = he(), { undo: u, redo: l } = Fe();
  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), st("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: g, attr: m, brickMap: v } = r;
    console.log({ sections: i, themes: p, siteAttr: c, sitemap: g, attr: m, brickMap: v });
  });
}
function pr({ themes: e }) {
  var c;
  const [t, r] = ne(0), [n, u] = ne(0), l = O(null), s = O(null), i = We(), p = e[t];
  return U(() => {
    const g = setInterval(() => {
      r((m) => (m + 1) % e.length), i != null && i.length && u((m) => (m + 1) % i.length);
    }, 1e4);
    return () => clearInterval(g);
  }, [e, i]), U(() => {
    var g, m, v;
    (g = s.current) == null || g.style.setProperty("background-color", p.colors.base200), (m = s.current) == null || m.style.setProperty("color", p.colors.baseContent), (v = l.current) == null || v.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: P(
        "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: P("absolute w-[100vh] h-[100vh] inset-0 animate-spin-blob z-20") }),
        /* @__PURE__ */ f(
          "div",
          {
            className: P(
              "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 ye(), Ve(), /* @__PURE__ */ f(
    "div",
    {
      className: P("absolute bg-gray-200 top-0 bottom-0 left-0 right-0 flex items-center justify-center"),
      children: /* @__PURE__ */ E("h2", { className: P("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 = z(() => import("./Tour.DpkGLSCJ.js")), vr = z(() => import("./NavBar.2f1ua3b9.js")), hr = z(() => import("./Chat.DML2yIbh.js")), yr = z(() => import("./EditablePage.CZD4sqn8.js")), br = z(() => import("../Page.js")), re = z(() => import("./DeviceFrame.Bc8veksJ.js")), kr = z(() => import("./Panel.BEbFhfoe.js"));
function Mr(e) {
  const t = O(null), r = ae(), n = qe(), u = Ue(), l = Ge(), { panelPosition: s } = Xe(), i = Ye(), p = ye(), c = le(), g = Je(), { setDraggingBrickType: m, toggleDebugMode: v, hidePanel: o } = ie(), I = he(), B = Qe(), w = mr(), h = Ze();
  Xt(), dr(), U(() => {
    const y = r.previewTheme ?? r.theme;
    y && nt(_(at(y)));
  }, [r.previewTheme, r.theme]);
  const D = (y) => {
    const { draggableId: a } = y, b = document.getElementById(a);
    b == null || b.classList.add(P("moving"));
  }, M = (y) => {
    m(y.draggableId);
    const a = document.getElementById(y.draggableId);
    a && window.getComputedStyle(a).getPropertyValue("background-color") === "rgba(0, 0, 0, 0)" && a.classList.add(P("!bg-upstart-100"));
  }, K = (y) => {
    var W, R;
    const { destination: a, source: b, draggableId: x, type: T, combine: de } = y;
    if (m(null), !a) {
      console.warn("Dropped outside a valid droppable area, no action taken.");
      return;
    }
    if (a.droppableId === b.droppableId && a.index === b.index) {
      console.log("Dropped in the same position, no action taken.");
      return;
    }
    if (b.droppableId.startsWith("$library$")) {
      const $ = l.find((C) => C.id === a.droppableId);
      if ($) {
        const C = J(x);
        c.addBrick(C, $.id, a.index, null), console.log(
          `Added new brick ${x} to section ${$.id} at index ${a.index}`
        );
      }
      const S = c.getBrick(a.droppableId);
      if (S && q[S.type] && q[S.type].isContainer) {
        const C = J(x), k = (W = r.brickMap.get(S.id)) == null ? void 0 : W.sectionId;
        if (!k) {
          console.warn(`No section found for container ${S.id}`);
          return;
        }
        c.addBrick(C, k, a.index, S.id), console.log(
          `Added new brick ${x} to container ${S.id} at index ${a.index} in section ${k}`
        );
      }
      if (a.droppableId === "page") {
        console.log("Brick has been dropped on page!");
        const C = `s_${lt()}`;
        c.createEmptySection(C);
        const k = J(x);
        c.addBrick(k, C, 0, null);
      }
    } else if (T === "section") {
      const $ = Array.from(l), [S] = $.splice(b.index, 1);
      $.splice(a.index, 0, S), c.reorderSections($.map((C) => C.id));
    } else if (T === "brick") {
      const $ = b.droppableId, S = a.droppableId;
      if (l.find((k) => k.id === a.droppableId))
        $ === S ? (console.log(
          `Moving brick ${x} within section from ${b.index} to ${a.index}`
        ), c.reorderBrickWithin(x, a.index)) : (console.log(
          `Moving brick ${x} from section ${$} to ${S}`
        ), c.moveBrickToSection(x, S, a.index));
      else {
        const k = c.getBrick(a.droppableId);
        if (k && q[k.type] && q[k.type].isContainer) {
          const pe = (R = r.brickMap.get(k.id)) == null ? void 0 : R.sectionId;
          if (!pe) {
            console.warn(`No section found for container ${k.id}`);
            return;
          }
          if (x === k.id) {
            console.warn("Cannot move a container into itself");
            return;
          }
          console.log(
            `Moving brick ${x} to container ${k.id} at index ${a.index} in section ${pe}`
          ), c.moveBrickToContainerBrick(x, k.id, a.index);
        }
      }
      g === "desktop" && rt(() => {
        c.adjustMobileLayout();
      });
    }
  };
  return n ? /* @__PURE__ */ f(
    it,
    {
      onDragEnd: K,
      onDragStart: D,
      onBeforeCapture: M,
      children: /* @__PURE__ */ E(
        "div",
        {
          id: "editor",
          className: P(
            "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: P(
                  "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(re, { children: [
                    /* @__PURE__ */ f(yr, {}),
                    r.previewTheme && /* @__PURE__ */ f(xr, {})
                  ] }) }),
                  !p.isReady && (i.length > 0 ? /* @__PURE__ */ f(re, { children: /* @__PURE__ */ f(pr, { themes: i }) }) : /* @__PURE__ */ f(re, { children: /* @__PURE__ */ f(fr, {}) })),
                  /* @__PURE__ */ f(
                    ot,
                    {
                      toastOptions: {
                        position: "bottom-center",
                        style: {
                          background: "rgba(0, 0, 0, 0.85)",
                          color: "white",
                          fontSize: "0.85rem",
                          fontWeight: "500"
                          // marginBottom: "1rem",
                        },
                        className: P("last:mb-1 px-1 py-1 rounded-lg"),
                        error: {
                          style: {
                            background: "#880808"
                          }
                        }
                      }
                    }
                  ),
                  w && /* @__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(Re, { defaultChecked: h, onCheckedChange: v, size: "1", id: "debug-mode" }),
                          /* @__PURE__ */ E("label", { htmlFor: "debug-mode", className: "cursor-pointer select-none", children: [
                            "Debug mode",
                            " ",
                            /* @__PURE__ */ f("b", { className: P("font-semibold", h ? "text-upstart-600" : "text-gray-500"), children: h ? "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 } = le();
  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(se, { variant: "solid", color: "gray", onClick: () => e(!1), children: "Revert" }),
    /* @__PURE__ */ f(se, { onClick: () => e(!0), variant: "solid", children: "Accept theme" })
  ] }) });
}
export {
  Mr as E,
  Re as i,
  Pe as n,
  se as o,
  xt as p,
  Ce as s,
  Ht as u
};
//# sourceMappingURL=Editor.Cy5FahuF.js.map
