import { BlockGroup as G, BlockType as H } from "../../types/block.js";
import { Unit as J, TextAlignType as O } from "../../types/style.js";
import { createBlockConfig as X } from "../../utils/index.js";
import { generateResponsiveStyle as i, generateTypography as d, generatePseudoStyle as Y, generateUnitValue as u } from "../../utils/style.js";
import { lazy as c } from "react";
import { PiRectangleDashed as q } from "../../../../../node_modules/.pnpm/react-icons@5.5.0_react@19.0.0/node_modules/react-icons/pi/index.js";
const _ = X({
  type: H.BANNER,
  label: "Banner",
  icon: q,
  component: c(() => import("./components/banner.block.js")),
  group: G.ADVANCED,
  settings: {
    title: {
      text: { en: "80% Off" },
      typography: {
        fontSize: {
          desktop: { unit: J.PX, value: 20 }
        }
      }
    },
    subTitle: {
      text: { en: "For selected brands" }
    },
    description: {
      text: {
        en: "Also credit card user will get 15% cash back on purchase over $300."
      }
    },
    button: {
      text: { en: "Click Here" }
    },
    image: {
      fit: {
        desktop: { default: "cover" }
      }
    },
    overlayColor: {
      desktop: { default: "rgba(0, 0, 0, 0.2)" }
    }
  },
  style: ({ breakpoints: l, settings: o }) => {
    var p, m, g, f, y, b, x, h, v, C, T, A, B, k, D, S, w, z, I, R, P, $, N;
    return {
      width: "100%",
      "& .banner": {
        ...i(l, (r) => {
          var t, e;
          return {
            backgroundSize: (e = (t = o.image) == null ? void 0 : t.fit) == null ? void 0 : e[r]
          };
        }),
        backgroundImage: (m = (p = o.image) == null ? void 0 : p.media) != null && m.url ? `url(${(f = (g = o.image) == null ? void 0 : g.media) == null ? void 0 : f.url})` : void 0,
        backgroundPosition: "center",
        backgroundRepeat: "no-repeat",
        position: "relative",
        "& .overlay": {
          display: (b = (y = o.image) == null ? void 0 : y.media) != null && b.url ? "block" : "none",
          backgroundColor: (h = (x = o.overlayColor) == null ? void 0 : x.desktop) == null ? void 0 : h.default,
          position: "absolute",
          top: 0,
          left: 0,
          bottom: 0,
          right: 0,
          zIndex: 1
        },
        "& .content": {
          position: "relative",
          zIndex: 2,
          ...i(l, (r) => {
            var t, e;
            return {
              padding: u((e = (t = o.card) == null ? void 0 : t.padding) == null ? void 0 : e[r])
            };
          })
        },
        "& .title": {
          color: (T = (C = (v = o.title) == null ? void 0 : v.color) == null ? void 0 : C.desktop) == null ? void 0 : T.default,
          ...d(l, (A = o.title) == null ? void 0 : A.typography),
          ...i(l, (r) => {
            var t, e, n, a;
            return {
              textAlign: (e = (t = o.title) == null ? void 0 : t.alignment) == null ? void 0 : e[r],
              marginBottom: u((a = (n = o.title) == null ? void 0 : n.spacing) == null ? void 0 : a[r])
            };
          })
          // Typography end
        },
        "& .sub-title": {
          color: (D = (k = (B = o.subTitle) == null ? void 0 : B.color) == null ? void 0 : k.desktop) == null ? void 0 : D.default,
          ...d(l, (S = o.subTitle) == null ? void 0 : S.typography),
          ...i(l, (r) => {
            var t, e, n, a;
            return {
              textAlign: (e = (t = o.subTitle) == null ? void 0 : t.alignment) == null ? void 0 : e[r],
              marginBottom: u((a = (n = o.subTitle) == null ? void 0 : n.spacing) == null ? void 0 : a[r])
            };
          })
          // Typography end
        },
        "& .description": {
          color: (I = (z = (w = o.description) == null ? void 0 : w.color) == null ? void 0 : z.desktop) == null ? void 0 : I.default,
          ...d(l, (R = o.description) == null ? void 0 : R.typography),
          ...i(l, (r) => {
            var t, e, n, a;
            return {
              textAlign: (e = (t = o.description) == null ? void 0 : t.alignment) == null ? void 0 : e[r],
              marginBottom: u((a = (n = o.description) == null ? void 0 : n.spacing) == null ? void 0 : a[r])
            };
          })
          // Typography end
        },
        // Button
        "& .button-wrapper": {
          width: "100%",
          display: "flex",
          alignItems: "center",
          ...i(l, (r) => {
            var e, n;
            const t = (n = (e = o.button) == null ? void 0 : e.alignment) == null ? void 0 : n[r];
            return {
              justifyContent: t === "left" ? "flex-start" : t === "right" ? "flex-end" : t === "center" ? "center" : void 0
            };
          }),
          "& .btn": {
            padding: "10px 20px",
            borderRadius: "5px",
            textAlign: "center",
            transitionDuration: (P = o.button) != null && P.transitionDuration ? `${($ = o.button) == null ? void 0 : $.transitionDuration}ms` : void 0,
            ...d(l, (N = o.button) == null ? void 0 : N.typography),
            ...i(l, (r) => {
              var e, n;
              const t = (n = (e = o.button) == null ? void 0 : e.alignment) == null ? void 0 : n[r];
              return {
                ...Y((a) => {
                  var U, E, F, V, j;
                  return {
                    color: (F = (E = (U = o.button) == null ? void 0 : U.color) == null ? void 0 : E[r]) == null ? void 0 : F[a],
                    backgroundColor: `${(j = (V = o.button) == null ? void 0 : V.backgroundColor) == null ? void 0 : j[a]} !important`
                  };
                }),
                width: t === O.JUSTIFY ? "100%" : void 0
              };
            })
          }
        }
      }
    };
  },
  controls: [
    {
      label: "Content",
      component: c(() => import("./components/banner-content.control.js"))
    },
    {
      label: "Style",
      component: c(() => import("./components/banner-style.control.js"))
    }
  ]
});
export {
  _ as default
};
//# sourceMappingURL=banner.config.js.map
