import { m as H, x as k, S as v } from "./color-system.CJ_hkE1_.js";
import { _ as $, B as a } from "./twind.BLUk_ZzT.js";
import { jsx as B } from "react/jsx-runtime";
import { Suspense as F, lazy as C } from "react";
import { merge as I, get as w } from "lodash-es";
import { c as W, u as S } from "./schema-resolver.C4i_G2fr.js";
import { f as O, q as M } from "./_commonjsHelpers.BCwc0xb5.js";
import "@sinclair/typebox";
function lt({ attributes: t, editable: e, typography: o, showIntro: r }) {
  return $(
    "flex flex-col group/page mx-auto relative max-w-full w-full p-0 antialiased",
    e && "overflow-hidden min-h-[100cqh]",
    H(t.$backgroundColor) ? a({ backgroundColor: t.$backgroundColor }) : t.$backgroundColor,
    H(t.$textColor) ? a({ color: t.$textColor }) : t.$textColor,
    // typeof attributes.$backgroundColor?.image === "string" &&
    //   css({
    //     backgroundImage: `url(${attributes.$backgroundColor.image})`,
    //     backgroundRepeat: attributes.$backgroundColor.repeat ?? "no-repeat",
    //     backgroundSize: attributes.$backgroundColor.size ?? "cover",
    //     backgroundPosition: "center top",
    //   }),
    G(o),
    // Animate all bricks when the page is loading
    e && r && "[&>.brick-wrapper]:(opacity-0 animate-elastic-pop)"
  );
}
function G(t) {
  function e(o) {
    return o.type === "stack" ? `var(--font-${o.family})` : `"${o.family}"`;
  }
  return a({
    fontFamily: e(t.body),
    fontSize: `${t.base}px`,
    "& h1, & h2, & h3, & h4, & h5, & h6, & h7": {
      fontFamily: e(t.heading)
    }
  });
}
const A = /* @__PURE__ */ Object.assign({ "../bricks/accordion.tsx": () => import("./accordion.B2OH7xVW.js"), "../bricks/button.tsx": () => import("./button.DfSW0V_z.js"), "../bricks/card.tsx": () => import("./card.C_9M4d2Z.js"), "../bricks/carousel.tsx": () => import("./carousel.D2nDBSY-.js"), "../bricks/footer.tsx": () => import("./footer.D1ovKbGp.js"), "../bricks/form.tsx": () => import("./form.IkzY4ehZ.js"), "../bricks/hero.tsx": () => import("./hero.BxJvTjb_.js"), "../bricks/icon.tsx": () => import("./icon.DHFyfRzK.js"), "../bricks/image.tsx": () => import("./image.CdbmCP9b.js"), "../bricks/images-gallery.tsx": () => import("./images-gallery.ByioPdu8.js"), "../bricks/map.tsx": () => import("./map.Do8zxSWg.js"), "../bricks/navbar.tsx": () => import("./navbar.DIpCplUn.js"), "../bricks/sidebar.tsx": () => import("./sidebar.BB7K2mVt.js"), "../bricks/social-links.tsx": () => import("./social-links.-apACLht.js"), "../bricks/spacer.tsx": () => import("./spacer.BHuVzHKm.js"), "../bricks/testimonials.tsx": () => import("./testimonials.CQsUId4O.js"), "../bricks/text.tsx": () => import("./text.BIKkHjgq.js"), "../bricks/timeline.tsx": () => import("./timeline.B_hLbnO7.js"), "../bricks/vbox.tsx": () => import("./vbox.DbVc0BDk.js"), "../bricks/video.tsx": () => import("./video.BPYPs1G4.js").then((t) => t.v) }), D = Object.entries(A).reduce(
  (t, [e, o]) => {
    const r = e.match(/\.\/bricks\/(.*)\.tsx$/)[1];
    return t[r] = C(o), t;
  },
  // biome-ignore lint/suspicious/noExplicitAny: <explanation>
  {}
), at = ({
  brick: t,
  editable: e,
  selectedBrickId: o
}) => {
  const r = D[t.type];
  if (!r)
    return console.warn("Brick not found", t.type), null;
  const s = {
    brick: t,
    editable: e,
    selected: t.id === o
  };
  return /* @__PURE__ */ B(F, { children: /* @__PURE__ */ B(r, { ...s }) });
};
function q(t) {
  return t ? [
    t.color && k(t.color, "backgroundColor"),
    t.image && a({
      backgroundImage: `url(${t.image})`,
      backgroundSize: t.size ?? "auto",
      backgroundRepeat: t.repeat ?? "no-repeat"
    })
  ] : null;
}
function j(t, e) {
  return e ? `@desktop:(${a({ gap: t })}) @mobile:(${a({ gap: e })})` : a({
    gap: t
  });
}
function E(t, e) {
  return e ? `@desktop:(${v(t, "bg-color")}) @mobile:(${v(e, "bg-color")})` : v(t, "bg");
}
function N(t, e) {
  return k(t, "color");
}
function K(t) {
  return k(t, "opacity");
}
function p(t, e) {
  if (!e)
    return t;
  if (t && e)
    return `@desktop:(${t}) @mobile:(${e})`;
  if (e)
    return `@mobile:(${e})`;
}
function R(t) {
  return t ? "sticky top-0 left-0 right-0 self-start w-fill z-[99999] isolate" : null;
}
function T(t) {
  if (!t)
    return null;
  const {
    width: e = "border-0",
    sides: o = [],
    color: r,
    // color = "border-transparent",
    style: s = "border-solid",
    rounding: n = ""
  } = t;
  let i = "";
  const d = e.includes("-") ? e.split("-")[1] : null;
  return o != null && o.length ? i = o.map((f) => `${f}${d ? `-${d}` : ""}`).join(" ") : i = e, [k(r, "borderColor"), s, i, n];
}
function _(t, e) {
  return [t == null ? void 0 : t.vertical, t == null ? void 0 : t.horizontal];
}
function J(t, e) {
  return t;
}
function L(t, e) {
  return t ? "grow" : null;
}
const Q = {
  "styles:color": N,
  "styles:basicAlign": _,
  "styles:basicGap": J,
  "styles:textShadow": p,
  "styles:opacity": K,
  "styles:objectFit": p,
  "styles:objectPosition": p,
  "styles:heroSize": p,
  "styles:fontSize": p,
  // new test
  // "styles:backgroundColor": getBackgroundColorStyles,
  // "styles:background": getBackgroundStyles,
  // "styles:border": getBorderStyles,
  "styles:padding": p,
  // test
  "styles:gap": j,
  "styles:border": T,
  "styles:gradientDirection": p,
  "styles:backgroundColor": E,
  "styles:background": q
  // "styles:rounding": simpleClassHandler,
}, U = {
  // "styles:padding": simpleClassHandler, // test
  "styles:alignItems": p,
  "styles:shadow": p,
  // "styles:rounding": simpleClassHandler,
  "styles:fixedPositioned": R,
  "styles:alignSelf": p,
  "styles:growHorizontally": L
};
function X(t) {
  return t.includes(".") ? t.split(".").slice(0, -1).join(".") : t;
}
function h(t, e = "", o = {}) {
  if (t.type === "object")
    for (const r in t.properties) {
      const s = W(t.properties[r]);
      s["ui:styleId"] && (o[`${e}${r}`] = s["ui:styleId"]), h(s, `${e}${r}.`, o);
    }
  else t.type === "array" && h(t.items, `${e}[].`, o);
  return o;
}
function z(t, e, o) {
  const { props: r, mobileProps: s } = e, n = I({}, O[e.type].props, r), i = S(e.type), d = Object.entries(t).reduce((l, [u, x]) => {
    var m;
    const c = w(i.props.properties, u);
    if (c) {
      const g = W(c);
      if ((m = g.metadata) != null && m.filter) {
        const b = g.metadata.filter;
        b(g, n) || l.push(u);
      }
    }
    return l;
  }, []), f = o === "brick" ? Q : U;
  return Object.entries(t).reduce(
    (l, [u, x]) => {
      const c = f[x];
      if (!c || d.includes(u))
        return l;
      const m = X(u);
      l[m] = l[m] ?? [];
      const g = w(n, u), b = w(s, u);
      return l[m].push(
        // @ts-expect-error
        $(c == null ? void 0 : c(g, b))
      ), l;
    },
    {}
  );
}
function pt(t) {
  const e = S(t.type), o = h(e.props);
  return z(o, t, "brick");
}
function ut({
  brick: t,
  editable: e,
  selected: o,
  isContainerChild: r = !1
}) {
  var l, u, x, c, m, g, b, P;
  const { props: s, mobileProps: n } = t, i = S(t.type), d = h(i.props), f = Object.values(d), y = z(d, t, "wrapper");
  return $(
    i.staticClasses,
    s.className,
    s.preset,
    "brick-wrapper group/brick flex",
    !(n != null && n.width) && ((l = i.minWidth) == null ? void 0 : l.mobile) && `@mobile:min-w-[${i.minWidth.mobile}px]`,
    !s.width && ((u = i.minWidth) == null ? void 0 : u.desktop) && `@desktop:min-w-[${i.minWidth.desktop}px]`,
    (x = i.minHeight) != null && x.mobile ? `@mobile:min-h-[${i.minHeight.mobile}px]` : "@mobile:(min-h-fit)",
    (c = i.minHeight) != null && c.desktop ? `@desktop:min-h-[${i.minHeight.desktop}px]` : "@desktop:(min-h-fit)",
    ((m = i.maxHeight) == null ? void 0 : m.mobile) && `@mobile:max-h-[${i.maxHeight.mobile}px]`,
    ((g = i.maxHeight) == null ? void 0 : g.desktop) && `@desktop:max-h-[${i.maxHeight.desktop}px]`,
    // Always respect the parent container width
    r && "flex-grow",
    /*!isContainerChild &&*/
    ((b = i.maxWidth) == null ? void 0 : b.mobile) && `@mobile:max-w-[${i.maxWidth.mobile}px]`,
    /*!isContainerChild &&*/
    ((P = i.maxWidth) == null ? void 0 : P.desktop) && `@desktop:max-w-[${i.maxWidth.desktop}px]`,
    !r && typeof s.width < "u" && `@desktop:w-[${s.width}]`,
    !r && typeof s.width > "u" && `@desktop:w-[${i.defaultWidth.desktop}]`,
    !r && typeof (n == null ? void 0 : n.width) < "u" ? `@mobile:w-[${n.width}]` : `@mobile:w-[${i.defaultWidth.mobile}]`,
    typeof s.height < "u" && a({
      height: `${s.height}`
    }),
    typeof s.height > "u" && `@mobile:h-[${i.defaultHeight.mobile}] @desktop:h-[${i.defaultHeight.desktop}]`,
    f.includes("styles:fixedPositioned") === !1 && "relative",
    // container children expand to fill the space
    r && "container-child",
    Y(e === !0, i.isContainer, r, o),
    ...Object.values(y).flat()
  );
}
function Y(t, e, o, r, s) {
  return t ? [
    "select-none transition-[outline] duration-[200ms]",
    "outline outline-2 outline-transparent outline-dashed",
    e ? "outline-offset-[6px]" : "outline-offset-2",
    r && !e && "!outline-upstart-400",
    r && e && "!outline-orange-300",
    !r && !o && !e && "hover:(outline-upstart-400/60)",
    !r && !o && e && "hover:(outline-orange-300/20)",
    !r && o && "hover:(outline-upstart-400/60) group-hover/brick:(outline-upstart-400/60)",
    a({
      "&.selected-group": {
        outlineColor: "var(--violet-8) !important"
      },
      "&.moving": {
        outlineColor: "var(--violet-8)"
      },
      "&.resizing": {
        outlineColor: "var(--violet-8)"
      },
      "& [data-brick-group]:hover": {
        outline: "1px dashed var(--violet-8)",
        opacity: 0.85
      },
      // This is the class of the drag element original emplacement
      // "&.moving": {
      //   backgroundColor: "var(--gray-a6)",
      // },
      // Hide all content when dragging
      // "&.moving > *": {
      //   visibility: "hidden",
      // },
      // Hide any UI children elements when dragging
      "&.moving [data-ui]": {
        display: "none"
      }
    })
  ] : null;
}
function ct({ section: t, selected: e, editable: o, previewMode: r }) {
  var f, y;
  const s = t.props.gap ?? "12px", n = M.properties.backgroundColor["ui:presets"], i = t.props.backgroundColor ? n[t.props.backgroundColor].value.main : void 0, d = t.props.gradientDirection;
  return $(
    "flex @mobile:flex-col @desktop:flex-row w-full @container/section group/section overflow-visible relative mx-auto max-sm:max-w-dvw",
    [
      // section.props.preset as string,
      i,
      d,
      t.props.maxWidth,
      typeof t.props.minHeight == "string" && t.props.minHeight !== "full" && `min-h-[${t.props.minHeight}]`,
      // full height
      t.props.minHeight === "full" && o && "min-h-[calc(100dvh-60px)]",
      // when in editor mode
      t.props.minHeight === "full" && !o && "min-h-dvh",
      // when in real mode
      t.props.alignItems,
      t.props.justifyContent,
      // Padding and gap
      // css({ gap: `${GAP}`, paddingInline: `${GAP}`, paddingBlock: `${GAP}` }),
      j(s, (f = t.mobileProps) == null ? void 0 : f.gap),
      p(
        `p-[${s}]`,
        (y = t.mobileProps) != null && y.gap ? `p-[${t.mobileProps.gap}]` : void 0
      ),
      a({
        "&:has([data-is-navbar])": {
          // This is a hack to ensure that the navbar is not affected by the section's padding
          paddingInline: "0px !important",
          paddingBlock: "0px !important",
          flexDirection: "row"
        }
      }),
      "flex-nowrap",
      // Background
      // Section editor styles
      Z({ editable: o, previewMode: r, section: t, selected: e }),
      // Manage the section order using css "order" (flex) property
      a({
        order: t.order
      })
    ]
  );
}
function Z({ section: t, editable: e, selected: o, previewMode: r }) {
  return e ? [
    "select-none transition-[outline] duration-150 relative",
    "outline-dashed outline-2 -outline-offset-2",
    // "self-stretch",
    o ? "outline-upstart-500/40" : "outline-transparent hover:outline-upstart-500/40",
    // this is the grid overlay shown when dragging
    e && r && a`
      &:has(.moving), &:has(.moving) ~ section {
        & [data-floating-ui-portal] {
          display: none;
        }
        & .resizable-handle {
          display: none;
        }
      }`
  ] : null;
}
export {
  at as B,
  lt as a,
  pt as b,
  ut as c,
  ct as u
};
//# sourceMappingURL=use-section-style.Cg6VYj5D.js.map
