import { g as U, y as ve, p as b, h as I, be as xe, W as ze, j as e, B as a, l, cp as H, cq as G, k as V, m as ue, c as me, u as le, s as ie, r as P, X as $e, v as fe, am as pe, e as ge, t as he, a as be, a2 as K, d as R, w as Y, x as L, z as n, a7 as qe, q as T, S as re, T as ce, n as Q, E as Z, f as F, i as N, aH as Ae, bI as Ee, bs as Me, cr as Oe } from "./index-G5Vdjjso.js";
var Se = F('<div class="placeholder-h svelte-18tp3wn"></div>'), He = F('<div class="placeholder-v svelte-18tp3wn"></div>'), Le = F('<div class="underlay-h svelte-18tp3wn"></div> <div class="underlay-v svelte-18tp3wn"></div>', 1), Ne = F("<div><!> <!></div>");
function je(j, o) {
  U(o, !1);
  const M = () => L(k, "$builderStore", d), c = () => L(X, "$component", d), x = () => L(J, "$children", d), p = () => L(D, "$context", d), z = () => L(te, "$styles", d), [d, $] = ve(), u = n(), q = n(), v = n(), A = n(), E = n(), _ = n(), w = n(), y = n();
  let O = b(o, "onClick", 8);
  const X = I("component"), { styleable: W, builderStore: k } = I("sdk"), D = I("context");
  let B = n(), g = n(), C = n(), J = qe({}), ee = n(!1), te = xe({});
  const _e = (t, s, i) => {
    const f = s ? "mobileRowEnd" : "desktopRowEnd";
    let r = 2;
    for (let h of Object.keys(t))
      t[h][f] > r && (r = t[h][f]);
    let S = r - 1;
    return i ? Math.ceil((S + 10) / 10) * 10 : S;
  }, se = (t) => {
    J.update((s) => ({
      ...s,
      [t.dataset.id]: {
        desktopRowEnd: parseInt(t.dataset.gridDesktopRowEnd),
        mobileRowEnd: parseInt(t.dataset.gridMobileRowEnd)
      }
    }));
  }, we = (t) => {
    J.update((s) => (delete s[t.dataset.id], { ...s }));
  }, ye = (t) => {
    const s = new ResizeObserver((i) => {
      if (!i?.[0])
        return;
      const f = i[0].target;
      a(B, f.clientWidth), a(g, f.clientHeight);
    });
    return s.observe(t), s;
  };
  ze(() => {
    let t, s;
    return s = ye(e(C)), t = new MutationObserver((i) => {
      for (let f of i) {
        const { target: r, type: S, addedNodes: h, removedNodes: oe } = f;
        r === e(C) ? h[0]?.classList?.contains("component") ? se(h[0]) : oe[0]?.classList?.contains("component") && we(oe[0]) : S === "attributes" && r.parentNode === e(C) && r.classList.contains("component") && se(r);
      }
    }), t.observe(e(C), {
      childList: !0,
      attributes: !0,
      subtree: !0,
      attributeFilter: ["data-grid-desktop-row-end", "data-grid-mobile-row-end"]
    }), a(ee, !0), () => {
      t?.disconnect(), s?.disconnect();
    };
  }), l(() => M(), () => {
    a(u, M().inBuilder);
  }), l(() => (c(), e(u)), () => {
    a(q, c().isRoot && e(u));
  }), l(() => p(), () => {
    a(w, p().device.mobile);
  }), l(() => (x(), e(w), e(q)), () => {
    a(v, _e(x(), e(w), e(q)));
  }), l(() => (e(v), H), () => {
    a(A, e(v) * H);
  }), l(() => (e(g), H), () => {
    a(E, Math.floor(e(g) / H));
  }), l(() => (e(v), e(E)), () => {
    a(_, Math.max(e(v), e(E)));
  }), l(() => (e(B), G), () => {
    a(y, e(B) / G);
  }), l(
    () => (c(), e(A), e(_), e(y), H),
    () => {
      te.set({
        ...c().styles,
        normal: {
          ...c().styles?.normal,
          "--height": `${e(A)}px`,
          "--min-height": c().styles?.normal?.height || 0,
          "--cols": G,
          "--rows": e(_),
          "--col-size": e(y),
          "--row-size": H
        }
      });
    }
  ), V(), ue();
  var m = Ne();
  let ae;
  var ne = me(m);
  {
    var ke = (t) => {
      var s = Le(), i = T(s);
      re(i, 5, () => ({ length: e(_) }), ce, (r, S) => {
        var h = Se();
        R(r, h);
      }), P(i);
      var f = ie(i, 2);
      re(f, 5, () => ({ length: G }), ce, (r, S) => {
        var h = He();
        R(r, h);
      }), P(f), R(t, s);
    };
    le(ne, (t) => {
      e(u) && t(ke);
    });
  }
  var Ce = ie(ne, 2);
  {
    var Re = (t) => {
      var s = Q(), i = T(s);
      Z(i, o, "default", {}, null), R(t, s);
    };
    le(Ce, (t) => {
      e(ee) && t(Re);
    });
  }
  P(m), $e(m, (t) => a(C, t), () => e(C)), fe(m, (t, s) => W?.(t, s), z), pe(() => ge("click", m, function(...t) {
    O()?.apply(this, t);
  })), he(
    (t) => {
      ae = be(m, 1, "grid svelte-18tp3wn", null, ae, t), K(m, "data-cols", G), K(m, "data-col-size", e(y)), K(m, "data-required-rows", e(v));
    },
    [() => ({ mobile: e(w), clickable: !!O() })]
  ), R(j, m), Y(), $();
}
var Be = F("<div><!></div>");
function de(j, o) {
  U(o, !1);
  const M = () => L(A, "$component", c), [c, x] = ve(), p = n(), z = n(), d = n(), $ = n(), u = n(), q = n(), { styleable: v } = I("sdk"), A = I("component");
  let E = b(o, "direction", 8), _ = b(o, "hAlign", 8), w = b(o, "vAlign", 8), y = b(o, "size", 8), O = b(o, "gap", 8), X = b(o, "wrap", 8), W = b(o, "onClick", 8);
  l(() => N(E()), () => {
    a(p, E() ? `flex-container direction-${E()}` : "");
  }), l(() => N(_()), () => {
    a(z, _() ? `hAlign-${_()}` : "");
  }), l(() => N(w()), () => {
    a(d, w() ? `vAlign-${w()}` : "");
  }), l(() => N(y()), () => {
    a($, y() ? `size-${y()}` : "");
  }), l(() => N(O()), () => {
    a(u, O() ? `gap-${O()}` : "");
  }), l(
    () => (e(p), e(z), e(d), e($), e(u)),
    () => {
      a(q, [
        e(p),
        e(z),
        e(d),
        e($),
        e(u)
      ].join(" "));
    }
  ), V(), ue();
  var k = Be();
  let D;
  var B = me(k);
  Z(B, o, "default", {}, null), P(k), fe(k, (g, C) => v?.(g, C), () => M().styles), pe(() => ge("click", k, function(...g) {
    W()?.apply(this, g);
  })), he((g) => D = be(k, 1, Ae(e(q)), "svelte-11rnque", D, g), [() => ({ clickable: !!W(), wrap: X() })]), R(j, k), Y(), x();
}
function Ie(j, o) {
  const M = Ee(o, ["children", "$$slots", "$$events", "$$legacy"]);
  U(o, !1);
  const c = n();
  let x = b(o, "layout", 8, "flex");
  l(() => (N(x()), de), () => {
    a(c, x() === "grid" ? je : de);
  }), V();
  var p = Q(), z = T(p);
  Me(z, () => e(c), (d, $) => {
    $(d, Oe(() => M, {
      children: (u, q) => {
        var v = Q(), A = T(v);
        Z(A, o, "default", {}, null), R(u, v);
      },
      $$slots: { default: !0 }
    }));
  }), R(j, p), Y();
}
export {
  Ie as default
};
