import { a as h } from "../../../../sdk/dist/shared/chunk-AI4GHU7R.js";
import "@sinclair/typebox";
import "../../../../sdk/dist/shared/chunk-SY6DZLTC.js";
import "../../../../sdk/dist/shared/chunk-7A2JNQX3.js";
import "../../../../sdk/dist/shared/chunk-3YVJ2ELD.js";
import "../../../../sdk/dist/shared/chunk-AFVJZPLS.js";
import "../../../../sdk/dist/shared/chunk-A3GF4PYW.js";
import "../../../../sdk/dist/shared/chunk-W33JMRRN.js";
import { tx as D, css as E } from "../../../../style-system/dist/twind.js";
import { getStyleProperties } from "../styles/style-props.js";
import { useSiteAttributes, usePageAttributes } from "../../../../../use-page-data.js";
import get from "../../../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/get.js";
import { extractStylePath, pageStylesHelpersMap } from "../styles/helpers.js";
import { useFontWatcher } from "../../editor/hooks/use-font-watcher.js";
function usePageStyle({ editable, showIntro } = {}) {
  const stylesProps = getStyleProperties(h);
  const classes = useClassesFromStyleProps(stylesProps);
  const typography = useFontWatcher();
  return D(
    "flex flex-col group/page mx-auto relative max-w-full w-full p-0 antialiased",
    editable && "overflow-hidden min-h-[100cqh]",
    // pageAttributes.colorPreset?.color ?? siteAttributes.colorPreset?.color,
    Object.values(classes),
    getTypographyStyles(typography),
    // Animate all bricks when the page is loading
    editable && showIntro && "[&>.brick-wrapper]:(opacity-0 animate-elastic-pop)"
  );
}
function useClassesFromStyleProps(stylesProps) {
  const siteAttributes = useSiteAttributes();
  const pageAttributes = usePageAttributes();
  const classes = Object.entries(stylesProps).reduce(
    (acc, [path, styleId]) => {
      const helper = pageStylesHelpersMap[styleId];
      if (!helper) {
        return acc;
      }
      const part = extractStylePath(path);
      acc[part] = acc[part] ?? [];
      const resolvedProps = get(pageAttributes, path) ?? get(siteAttributes, path);
      const schema = get(h.properties, path);
      acc[part].push(D(helper?.(resolvedProps, void 0, schema)));
      return acc;
    },
    {}
  );
  return classes;
}
function getTypographyStyles(typography) {
  function formatFontFamily(font) {
    return font.type === "stack" ? `var(--font-${font.family})` : `"${font.family}"`;
  }
  return E({
    fontFamily: formatFontFamily(typography.body),
    fontSize: `${typography.base}px`,
    "& h1, & h2, & h3, & h4, & h5, & h6, & h7": {
      fontFamily: formatFontFamily(typography.heading)
    }
  });
}
export {
  usePageStyle
};
//# sourceMappingURL=use-page-style.js.map
