@shopify/shop-minis-react/dist/components/MinisContainer.js

React component library for Shopify Shop Minis with Tailwind CSS v4 support (source-only, requires TypeScript)

import { jsx as r, jsxs as c } from "react/jsx-runtime";
import { useState as m, useEffect as l } from "react";
import { ImagePickerProvider as u } from "../providers/ImagePickerProvider.js";
function p({ children: s }) {
  const [a, t] = m(!1);
  return l(() => {
    const n = () => window.minisSDK ? (t(!0), !0) : !1;
    if (n())
      return;
    const e = (o) => {
      const { type: d } = JSON.parse(o.data);
      d === "MINIS_SDK_READY" && t(!0);
    };
    window.addEventListener("message", e), document.addEventListener("message", e);
    const i = setInterval(() => {
      n() && clearInterval(i);
    }, 100);
    return () => {
      window.removeEventListener("message", e), document.removeEventListener("message", e);
    };
  }, []), a ? /* @__PURE__ */ r(u, { children: s }) : /* @__PURE__ */ r("div", { className: "h-screen bg-gray-50 flex items-center justify-center", children: /* @__PURE__ */ c("div", { className: "text-center", children: [
    /* @__PURE__ */ r("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900 mx-auto mb-4" }),
    /* @__PURE__ */ r("p", { className: "text-gray-600", children: "Loading..." })
  ] }) });
}
export {
  p as MinisContainer
};
//# sourceMappingURL=MinisContainer.js.map