import { BlockGroup as X, BlockType as F } from "../../types/block.js";
import { Unit as c } from "../../types/style.js";
import { createBlockConfig as N } from "../../../../../utils.js";
import { generatePseudoStyle as v, generateResponsiveStyle as p, generateUnitValue as T, generateSpacingValue as f } from "../../utils/style.js";
import { lazy as m } from "react";
import { TbIcons as U } from "../../../../../node_modules/.pnpm/react-icons@5.5.0_react@19.0.0/node_modules/react-icons/tb/index.js";
const H = N({
  type: F.ICON,
  label: "Icon",
  icon: U,
  component: m(() => import("./components/icon.block.js")),
  group: X.BASIC,
  settings: {
    icon: {
      iconSet: "fe",
      iconName: "star"
    },
    size: {
      desktop: {
        unit: c.PX,
        value: 50
      }
    },
    view: { desktop: "default" },
    shape: { desktop: "circle" },
    color: {
      default: "var(--accent-color)"
    },
    padding: {
      desktop: {
        top: 25,
        right: 25,
        bottom: 25,
        left: 25,
        unit: c.PX,
        linked: !0
      }
    },
    alignment: {
      desktop: "center"
    },
    border: {
      width: {
        desktop: {
          top: 2,
          right: 2,
          bottom: 2,
          left: 2,
          unit: c.PX,
          linked: !0
        }
      }
    }
  },
  style({ breakpoints: l, settings: o }) {
    return {
      "& .icon-wrapper": {
        display: "flex",
        ...p(l, (t) => {
          var d;
          const r = (d = o.alignment) == null ? void 0 : d[t];
          return {
            justifyContent: r === "left" ? "flex-start" : r === "right" ? "flex-end" : r === "center" ? "center" : null
          };
        }),
        "& .icon": {
          ...p(l, (t) => {
            var u, g, h, b, s, k, y, R;
            const {
              top: r,
              right: d,
              bottom: i,
              left: n
            } = f((u = o.padding) == null ? void 0 : u[t]), {
              top: a,
              right: W,
              bottom: w,
              left: L
            } = f((h = (g = o.border) == null ? void 0 : g.radius) == null ? void 0 : h[t]), {
              top: I,
              right: x,
              bottom: z,
              left: P
            } = f((s = (b = o.border) == null ? void 0 : b.width) == null ? void 0 : s[t]), e = (k = o.view) == null ? void 0 : k.desktop;
            return {
              paddingTop: e !== "default" && r,
              paddingRight: e !== "default" && d,
              paddingBottom: e !== "default" && i,
              paddingLeft: e !== "default" && n,
              borderTopLeftRadius: a,
              borderTopRightRadius: W,
              borderBottomRightRadius: w,
              borderBottomLeftRadius: L,
              borderColor: e === "framed" && ((y = o.color) == null ? void 0 : y.default),
              borderTopWidth: e === "framed" && I,
              borderRightWidth: e === "framed" && x,
              borderBottomWidth: e === "framed" && z,
              borderLeftWidth: e === "framed" && P,
              fontSize: T((R = o.size) == null ? void 0 : R[t]),
              ...v((S) => {
                var B, C;
                return {
                  backgroundColor: e === "stacked" ? (B = o.color) == null ? void 0 : B[S] : e === "framed" ? (C = o.secondaryColor) == null ? void 0 : C[S] : void 0
                };
              })
            };
          }),
          "& > *": {
            ...p(l, (t) => {
              var r;
              return {
                transform: `rotate(${T((r = o.rotate) == null ? void 0 : r[t])})`
              };
            }),
            ...v((t) => {
              var i, n, a;
              return {
                color: ((i = o.view) == null ? void 0 : i.desktop) === "stacked" ? ((n = o.secondaryColor) == null ? void 0 : n[t]) ?? "#fff" : (a = o.color) == null ? void 0 : a[t]
              };
            })
          }
        }
      }
    };
  },
  controls: [
    {
      label: "Content",
      component: m(() => import("./components/icon-content.control.js"))
    },
    {
      label: "Style",
      component: m(() => import("./components/icon-style.control.js"))
    }
  ]
});
export {
  H as default
};
//# sourceMappingURL=icon.config.js.map
