import React from "react";
import { serializeStyles } from "@emotion/serialize";
import { registerStyles, insertStyles } from "@emotion/utils";
import { isServer } from "../../utils/is-server";
import { useCache } from "./root-style-registry";
const useInsertionEffectSpecifier = "useInsertionEffect";
const useInsertionEffect = React[useInsertionEffectSpecifier] ?? React.useLayoutEffect;
function useStyle(style) {
  const cache = useCache();
  const serialized = serializeStyles([style], cache.registered);
  registerStyles(cache, serialized, false);
  useUniversalInsertionEffect(() => {
    insertStyles(cache, serialized, false);
  });
  return serializedStyleClassName(cache, serialized);
}
function useStyles(cache, styles) {
  styles.forEach((s) => registerStyles(cache, s, false));
  useUniversalInsertionEffect(() => {
    styles.forEach((s) => insertStyles(cache, s, false));
  });
}
function useUniversalInsertionEffect(effect) {
  useInsertionEffect(effect);
  if (isServer())
    effect();
}
function serializedStyleClassName(cache, serialized) {
  return `${cache.key}-${serialized.name}`;
}
export {
  serializedStyleClassName,
  useStyle,
  useStyles
};
//# sourceMappingURL=use-style.js.map