import { jsxs as s, Fragment as o, jsx as I } from "react/jsx-runtime";
import m from "react";
import { noop as f } from "es-toolkit/function";
import n from "../../../../../utils/classNames.js";
const k = (r) => {
  const { onClick: p = f, activeIcon: a, inactiveIcon: l, isActive: t = !1, label: e, className: d = "" } = r, g = n(
    "MapSettingsTileIcon",
    !e && "hover-scale-110",
    t ? "display-block" : "display-none",
    a?.props.className || ""
  ), h = n(
    "MapSettingsTileIcon",
    !e && "hover-scale-110",
    t ? "display-none" : "display-block",
    l?.props.className || ""
  ), c = a && m.cloneElement(a, {
    className: g
  }), i = l && m.cloneElement(l, {
    className: h
  }), N = n(
    "MapSettingsItem",
    "display-flex align-items-center gap-10",
    "text-color-darker",
    e && "margin--5",
    d
  );
  return /* @__PURE__ */ s("div", { className: N, onClick: p, children: [
    e && /* @__PURE__ */ s(o, { children: [
      /* @__PURE__ */ s("div", { className: "margin-left--5", children: [
        i,
        c
      ] }),
      /* @__PURE__ */ I("div", { className: "flex-1-1 line-height-16 padding-right-5", children: e })
    ] }),
    !e && /* @__PURE__ */ s(o, { children: [
      i,
      c
    ] })
  ] });
};
export {
  k as default
};
//# sourceMappingURL=MapSettingsItem.js.map
