import i, { useState as c, useRef as p, useEffect as g } from "react";
const o = {
  blogname: "name",
  custom_logo: "site_logo"
}, d = (n) => {
  const [m, u] = c(n.settings), s = p({}), a = (r) => {
    const e = r.data;
    if (e.messageType && e.messageType === "partial-update") {
      const t = s.current;
      o[e.property] ? t[o[e.property]] = e.value : e.property.indexOf("menu") > -1 && (t.menu_settings || (t.menu_settings = {}), t.menu_settings[e.property] = e.value), s.current = t, u({ ...s.current, random: Math.random() });
    }
  };
  return g(() => (window.addEventListener("message", a, !1), () => {
    window.removeEventListener("message", a);
  }), []), i.Children.map(n.children, (r, e) => i.cloneElement(r, {
    ...n,
    settings: { ...m },
    key: `customizer-child-${e}`
  }));
};
export {
  d as CustomizerWrapper
};
