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