import {
  select
} from "./chunk-YMNSXZ5D.js";
import {
  colors
} from "./chunk-2VBDEO6M.js";
import {
  getTypographyString
} from "./chunk-E4EXM4SY.js";

// src/styles/fonts/typography/Headline.tsx
import styled from "@emotion/styled";
import React from "react";
import { jsx } from "@emotion/react/jsx-runtime";
var HEADINGS = ["h1", "h2", "h3", "h4", "h5", "h6"];
function isReactNodeWithChildren(node) {
  return Boolean(
    node && React.isValidElement(node) && typeof node.props === "object" && node.props !== null && "children" in node.props && node.props.children !== void 0
  );
}
var getHeadlineText = (element) => {
  if (typeof element === "string") {
    return element;
  }
  if (Array.isArray(element)) {
    return getHeadlineText(element[0]);
  }
  if (isReactNodeWithChildren(element)) {
    return getHeadlineText(element.props.children);
  }
  throw new Error(
    "Could not find text in Headline element: " + (element == null ? void 0 : element.toString())
  );
};
var getHeaderId = (element) => {
  if (React.isValidElement(element) && (element == null ? void 0 : element.type) === "a" && "href" in element.props) {
    const props = element.props;
    return getHeaderId(props.href);
  }
  if (typeof element === "string") {
    return element.replace("#", "");
  }
  if (Array.isArray(element)) {
    return getHeaderId(element[0]);
  }
  if (isReactNodeWithChildren(element)) {
    return getHeaderId(element.props.children);
  }
  throw new Error(
    "Could not find text in Headline element: " + (element == null ? void 0 : element.toString())
  );
};
var toKebabCase = (str) => {
  return str.replaceAll(" ", "-").toLowerCase();
};
var Headline = ({
  children,
  color,
  size = "Medium" /* Medium */,
  heading = "h1"
}) => {
  const id = toKebabCase(getHeaderId(children));
  return /* @__PURE__ */ jsx(StyledHeadline, { as: heading, id, size, color, children });
};
var StyledHeadline = styled.span`
  color: ${({ theme, color }) => `${color || theme.text || colors.black}`};
  ${({ theme, size }) => {
  return size ? getTypographyString(theme.typography[theme.app].Headline[size]) : "";
}}

  * {
    color: ${({ theme, color }) => `${color || theme.text || colors.black}`};
    ${({ theme, size }) => {
  return size ? getTypographyString(theme.typography[theme.app].Headline[size]) : "";
}}
  }
`;
function headlineSelector(heading) {
  return `${heading}${select(StyledHeadline)}`;
}
var ALL_HEADLINE_SELECTORS = HEADINGS.map(headlineSelector).join(",");

export {
  HEADINGS,
  getHeadlineText,
  Headline,
  headlineSelector,
  ALL_HEADLINE_SELECTORS
};
