"use client";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require_chunk = require("../../chunk-BN4qSVkS.cjs");
const require_styles_colors = require("../../styles/colors.cjs");
const require_styles_tokens_typography = require("../../styles/tokens/typography.cjs");
const require_components_typography_base_Body = require("./base/Body.cjs");
const require_components_typography_base_Code = require("./base/Code.cjs");
const require_utils_emotion = require("../../utils/emotion.cjs");
const require_components_typography_base_Display = require("./base/Display.cjs");
const require_components_typography_base_Headline = require("./base/Headline.cjs");
const require_components_typography_base_Title = require("./base/Title.cjs");
const require_styles_common = require("../../styles/common.cjs");
const require_styles_utils = require("../../styles/utils.cjs");
const require_styles_tokens_spacing = require("../../styles/tokens/spacing.cjs");
const require_components_ContentTable = require("../ContentTable.cjs");
let _emotion_styled = require("@emotion/styled");
_emotion_styled = require_chunk.__toESM(_emotion_styled);
let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
//#region src/components/typography/Article.tsx
function Article({ defaultTypography, children }) {
	return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(StyledArticle, {
		type: defaultTypography?.type || "Body",
		size: defaultTypography?.size || "Medium",
		children
	});
}
const StyledArticle = _emotion_styled.default.article`
  ${({ theme, type, size }) => require_styles_tokens_typography.getTypographyString(theme, type, size)}

  ${require_components_typography_base_Display.displaySelector("h1")} {
    margin: 0;
  }

  ${require_components_typography_base_Headline.headlineSelector("h1")} {
    margin: 0;
    padding-bottom: ${require_styles_tokens_spacing.Spacing.px.xs};
  }

  ${require_components_typography_base_Headline.headlineSelector("h2")} {
    padding-top: ${require_styles_tokens_spacing.Spacing.px["2xl"]};
    padding-bottom: ${require_styles_tokens_spacing.Spacing.px.xs};
    margin: 0;
  }

  ${require_components_typography_base_Headline.headlineSelector("h3")} {
    padding-top: ${require_styles_tokens_spacing.Spacing.px["2xl"]};
    padding-bottom: ${require_styles_tokens_spacing.Spacing.px.xs};
    margin: 0;
  }

  ${require_components_typography_base_Headline.headlineSelector("h4")} {
    padding-top: ${require_styles_tokens_spacing.Spacing.px["2xl"]};
    padding-bottom: ${require_styles_tokens_spacing.Spacing.px.xs};
    margin: 0;
  }

  ${require_components_typography_base_Headline.headlineSelector("h5")} {
    padding-top: ${require_styles_tokens_spacing.Spacing.px["2xl"]};
    padding-bottom: ${require_styles_tokens_spacing.Spacing.px.xs};
    margin: 0;
  }

  ${require_components_typography_base_Headline.headlineSelector("h6")} {
    padding-top: ${require_styles_tokens_spacing.Spacing.px["2xl"]};
    padding-bottom: ${require_styles_tokens_spacing.Spacing.px.xs};
    margin: 0;
  }

  ${require_utils_emotion.select(require_components_typography_base_Body.StyledBody)} {
    margin-top: ${require_styles_tokens_spacing.Spacing.px.xs};
    margin-bottom: ${require_styles_tokens_spacing.Spacing.px.xs};
  }

  ${require_utils_emotion.select(require_components_ContentTable.StyledContentTable)} {
    margin: ${require_styles_tokens_spacing.Spacing.px["2xl"]} 0;
  }

  img,
  video {
    margin-top: ${require_styles_tokens_spacing.Spacing.px.md};
    margin-bottom: ${require_styles_tokens_spacing.Spacing.px.md};
  }

  strong {
    font-weight: 700;
  }

  *:not(${require_components_typography_base_Headline.ALL_HEADLINE_SELECTORS},${require_utils_emotion.select(require_components_typography_base_Title.StyledTitle)},${require_utils_emotion.select(require_components_typography_base_Code.StyledCode)})
    > a {
    ${({ theme }) => require_styles_tokens_typography.getTypographyString(theme, "Label Strong", "Large")}
    font-size: inherit;
    color: ${({ theme }) => theme.link};
  }

  ul,
  ol {
    padding-left: ${require_styles_tokens_spacing.Spacing.px.lg};
    margin-top: ${require_styles_tokens_spacing.Spacing.px.xs};
    margin-bottom: ${require_styles_tokens_spacing.Spacing.px.xs};
    *:not(a) {
      color: ${({ theme }) => theme.text};
    }
  }

  li {
    ${({ theme }) => require_styles_tokens_typography.getTypographyString(theme, "Body", "Medium")}
    :not(:last-child) {
      margin-bottom: ${require_styles_tokens_spacing.Spacing.px["3xs"]};
    }
  }

  code:not([class|="language"]) {
    ${({ theme }) => require_styles_tokens_typography.getTypographyString(theme, "Code", "Medium")}
    background: ${require_styles_colors.colors.grayBlue94};
    padding: ${require_styles_tokens_spacing.Spacing.px["4xs"]} ${require_styles_tokens_spacing.Spacing.px["2xs"]};
    margin: ${require_styles_tokens_spacing.Spacing.px["4xs"]};
    border-radius: 4px;
  }

  pre[class|="language"] {
    ${require_styles_common.standardBorderRadius(8)}
    width: 100%;
    padding: ${require_styles_tokens_spacing.Spacing.px.md} ${require_styles_tokens_spacing.Spacing.px.lg};
    margin: ${require_styles_tokens_spacing.Spacing.px.md} 0;
  }

  // Must match specificity of prismjs to get proper line height!
  pre[class|="language"],
  code[class|="language"] {
    ${({ theme }) => require_styles_tokens_typography.getTypographyString(theme, "Code", "Small")}

    ${require_styles_utils.overflowAutoWithoutScrollbars}
  }

  blockquote {
    margin: ${require_styles_tokens_spacing.Spacing.px.xs} 0;
  }
`;
//#endregion
exports.Article = Article;
exports.StyledArticle = StyledArticle;
