import * as v from "react";
import { createElement as f, useContext as j, useRef as C, Fragment as O, useLayoutEffect as D } from "react";
import { h as S, E as T, c as z, w, T as N, u as I } from "./emotion-element-cbed451f.browser.esm.js";
import { T as B, w as K } from "./emotion-element-cbed451f.browser.esm.js";
import "../../../../../../../_virtual/extends.js";
import "../../../../../hoist-non-react-statics@3.3.2/node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js";
import { insertStyles as x, registerStyles as R, getRegisteredStyles as A } from "../../../../../@emotion_utils@1.1.0/node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js";
import { serializeStyles as p } from "../../../../../@emotion_serialize@1.0.4/node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js";
var V = {
  name: "@emotion/react",
  version: "11.9.3",
  main: "dist/emotion-react.cjs.js",
  module: "dist/emotion-react.esm.js",
  browser: {
    "./dist/emotion-react.cjs.js": "./dist/emotion-react.browser.cjs.js",
    "./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
  },
  types: "types/index.d.ts",
  files: [
    "src",
    "dist",
    "jsx-runtime",
    "jsx-dev-runtime",
    "_isolated-hnrs",
    "types/*.d.ts",
    "macro.js",
    "macro.d.ts",
    "macro.js.flow"
  ],
  sideEffects: !1,
  author: "Emotion Contributors",
  license: "MIT",
  scripts: {
    "test:typescript": "dtslint types"
  },
  dependencies: {
    "@babel/runtime": "^7.13.10",
    "@emotion/babel-plugin": "^11.7.1",
    "@emotion/cache": "^11.9.3",
    "@emotion/serialize": "^1.0.4",
    "@emotion/utils": "^1.1.0",
    "@emotion/weak-memoize": "^0.2.5",
    "hoist-non-react-statics": "^3.3.1"
  },
  peerDependencies: {
    "@babel/core": "^7.0.0",
    react: ">=16.8.0"
  },
  peerDependenciesMeta: {
    "@babel/core": {
      optional: !0
    },
    "@types/react": {
      optional: !0
    }
  },
  devDependencies: {
    "@babel/core": "^7.13.10",
    "@definitelytyped/dtslint": "0.0.112",
    "@emotion/css": "11.9.0",
    "@emotion/css-prettifier": "1.0.1",
    "@emotion/server": "11.4.0",
    "@emotion/styled": "11.9.3",
    "html-tag-names": "^1.1.2",
    react: "16.14.0",
    "svg-tag-names": "^1.1.1",
    typescript: "^4.5.5"
  },
  repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
  publishConfig: {
    access: "public"
  },
  "umd:main": "dist/emotion-react.umd.min.js",
  preconstruct: {
    entrypoints: [
      "./index.js",
      "./jsx-runtime.js",
      "./jsx-dev-runtime.js",
      "./_isolated-hnrs.js"
    ],
    umdName: "emotionReact"
  }
}, W = function(e, r) {
  var s = arguments;
  if (r == null || !S.call(r, "css"))
    return f.apply(void 0, s);
  var o = s.length, n = new Array(o);
  n[0] = T, n[1] = z(e, r);
  for (var t = 2; t < o; t++)
    n[t] = s[t];
  return f.apply(null, n);
}, h = v["useInsertionEffect"] ? v["useInsertionEffect"] : D, y = !1, _ = /* @__PURE__ */ w(function(i, e) {
  process.env.NODE_ENV !== "production" && !y && (i.className || i.css) && (console.error("It looks like you're using the css prop on Global, did you mean to use the styles prop instead?"), y = !0);
  var r = i.styles, s = p([r], void 0, j(N)), o = C();
  return h(function() {
    var n = e.key + "-global", t = new e.sheet.constructor({
      key: n,
      nonce: e.sheet.nonce,
      container: e.sheet.container,
      speedy: e.sheet.isSpeedy
    }), a = !1, u = document.querySelector('style[data-emotion="' + n + " " + s.name + '"]');
    return e.sheet.tags.length && (t.before = e.sheet.tags[0]), u !== null && (a = !0, u.setAttribute("data-emotion", n), t.hydrate([u])), o.current = [t, a], function() {
      t.flush();
    };
  }, [e]), h(function() {
    var n = o.current, t = n[0], a = n[1];
    if (a) {
      n[1] = !1;
      return;
    }
    if (s.next !== void 0 && x(e, s.next, !0), t.tags.length) {
      var u = t.tags[t.tags.length - 1].nextElementSibling;
      t.before = u, t.flush();
    }
    e.insert("", s, t, !1);
  }, [e, s.name]), null;
});
process.env.NODE_ENV !== "production" && (_.displayName = "EmotionGlobal");
function M() {
  for (var i = arguments.length, e = new Array(i), r = 0; r < i; r++)
    e[r] = arguments[r];
  return p(e);
}
var X = function() {
  var e = M.apply(void 0, arguments), r = "animation-" + e.name;
  return {
    name: r,
    styles: "@keyframes " + r + "{" + e.styles + "}",
    anim: 1,
    toString: function() {
      return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
    }
  };
}, k = function i(e) {
  for (var r = e.length, s = 0, o = ""; s < r; s++) {
    var n = e[s];
    if (n != null) {
      var t = void 0;
      switch (typeof n) {
        case "boolean":
          break;
        case "object": {
          if (Array.isArray(n))
            t = i(n);
          else {
            process.env.NODE_ENV !== "production" && n.styles !== void 0 && n.name !== void 0 && console.error("You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component."), t = "";
            for (var a in n)
              n[a] && a && (t && (t += " "), t += a);
          }
          break;
        }
        default:
          t = n;
      }
      t && (o && (o += " "), o += t);
    }
  }
  return o;
};
function G(i, e, r) {
  var s = [], o = A(i, s, r);
  return s.length < 2 ? r : o + e(s);
}
var P = function(e) {
  var r = e.cache, s = e.serializedArr;
  return I(function() {
    for (var o = 0; o < s.length; o++)
      x(r, s[o], !1);
  }), null;
}, F = /* @__PURE__ */ w(function(i, e) {
  var r = !1, s = [], o = function() {
    if (r && process.env.NODE_ENV !== "production")
      throw new Error("css can only be used during render");
    for (var m = arguments.length, c = new Array(m), l = 0; l < m; l++)
      c[l] = arguments[l];
    var d = p(c, e.registered);
    return s.push(d), R(e, d, !1), e.key + "-" + d.name;
  }, n = function() {
    if (r && process.env.NODE_ENV !== "production")
      throw new Error("cx can only be used during render");
    for (var m = arguments.length, c = new Array(m), l = 0; l < m; l++)
      c[l] = arguments[l];
    return G(e.registered, o, k(c));
  }, t = {
    css: o,
    cx: n,
    theme: j(N)
  }, a = i.children(t);
  return r = !0, /* @__PURE__ */ f(O, null, /* @__PURE__ */ f(P, {
    cache: e,
    serializedArr: s
  }), a);
});
process.env.NODE_ENV !== "production" && (F.displayName = "EmotionClassNames");
if (process.env.NODE_ENV !== "production") {
  var g = !0, L = typeof jest < "u";
  if (g && !L) {
    var b = typeof globalThis < "u" ? globalThis : g ? window : global, E = "__EMOTION_REACT_" + V.version.split(".")[0] + "__";
    b[E] && console.warn("You are loading @emotion/react when it is already loaded. Running multiple instances may cause problems. This can happen if multiple versions are used, or if multiple builds of the same version are used."), b[E] = !0;
  }
}
export {
  F as ClassNames,
  _ as Global,
  B as ThemeContext,
  W as createElement,
  M as css,
  W as jsx,
  X as keyframes,
  K as withEmotionCache
};
//# sourceMappingURL=emotion-react.browser.esm.js.map
