"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var use_stylesheet_factory_exports = {};
__export(use_stylesheet_factory_exports, {
  useStylesheetFactory: () => useStylesheetFactory
});
module.exports = __toCommonJS(use_stylesheet_factory_exports);
var import_react = require("react");
var import_serialize = require("@emotion/serialize");
var import_controls = require("@makeswift/controls");
var import_root_style_registry = require("../root-style-registry");
var import_style = require("../controls/style");
var import_typography = require("../controls/typography");
var import_use_breakpoints = require("./use-breakpoints");
var import_use_css_id = require("./use-css-id");
var import_use_style = require("../use-style");
var import_poll_box_model = require("../poll-box-model");
function useStylesheetFactory() {
  const breakpoints = (0, import_use_breakpoints.useBreakpoints)();
  const cache = (0, import_root_style_registry.useCache)();
  const componentUid = (0, import_use_css_id.useCssId)();
  const computedStyles = (0, import_react.useRef)({}).current;
  const boxModelCallbacks = (0, import_react.useRef)({}).current;
  return (0, import_react.useMemo)(() => {
    const getStylesheet = (styleSheetId) => ({
      breakpoints() {
        return breakpoints;
      },
      defineStyle(style, onBoxModelChange) {
        const serialized = serializeStyle(breakpoints, style, cache);
        const uid = `u-${componentUid}-${styleSheetId}`;
        computedStyles[uid] = serialized;
        const className = (0, import_use_style.serializedStyleClassName)(cache, serialized);
        if (!onBoxModelChange)
          return className;
        boxModelCallbacks[uid] = onBoxModelChange;
        return `${className} ${uid}`;
      },
      child(id) {
        return getStylesheet(`${styleSheetId}-${id}`);
      }
    });
    return {
      get(propName) {
        return getStylesheet(propName);
      },
      useDefinedStyles() {
        (0, import_use_style.useStyles)(cache, Object.values(computedStyles));
        (0, import_react.useEffect)(() => {
          const unsubscribes = Object.entries(boxModelCallbacks).map(
            ([uid, callback]) => callback != null ? (0, import_poll_box_model.pollBoxModel)({
              element: document.querySelector(`.${uid}`),
              onBoxModelChange: callback
            }) : void 0
          ).filter(import_controls.isNotNil);
          return () => unsubscribes.forEach((fn) => fn());
        }, [Object.keys(boxModelCallbacks).join(" ")]);
      }
    };
  }, [breakpoints, cache, componentUid]);
}
function isTypographyStyle(style) {
  return Array.isArray(style);
}
function isStyleV2(style) {
  return typeof style === "object" && "getStyle" in style && typeof style.getStyle === "function";
}
function styleV2Css(breakpoints, style) {
  return {
    ...style.getStyle((0, import_controls.getBaseBreakpoint)(breakpoints)),
    ...breakpoints.reduce(
      (styles, breakpoint) => ({
        ...styles,
        [(0, import_controls.getBreakpointMediaQuery)(breakpoint)]: style.getStyle(breakpoint)
      }),
      {}
    )
  };
}
function resolvedStyleToCss(breakpoints, style) {
  if (isTypographyStyle(style)) {
    return (0, import_typography.typographyCss)(breakpoints, style);
  }
  if (isStyleV2(style)) {
    return styleV2Css(breakpoints, style);
  }
  const { properties, styleData } = style;
  return (0, import_style.styleV1Css)(breakpoints, styleData, properties);
}
function serializeStyle(breakpoints, style, cache) {
  const css = resolvedStyleToCss(breakpoints, style);
  return (0, import_serialize.serializeStyles)([css], cache.registered);
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  useStylesheetFactory
});
//# sourceMappingURL=use-stylesheet-factory.js.map