"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }


var _chunkMFKERIW4cjs = require('./chunk-MFKERIW4.cjs');


var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');


var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');

// src/styles/type.tsx
var _react = require('@emotion/react');
var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
var _jsxruntime = require('@emotion/react/jsx-runtime');
var defaultHeadingSizes = {
  h1: {
    size: 32,
    sizeSm: 21
  },
  h2: {
    size: 24,
    sizeSm: 18
  },
  h3: {
    size: 21,
    sizeSm: 18
  },
  h4: {
    size: 14,
    sizeSm: 14
  }
};
var defaultHeadingMargins = {
  h1: {
    mt: 24,
    mb: 24,
    mtSm: 24,
    mbSm: 24
  },
  h2: {
    mt: 24,
    mb: 24,
    mtSm: 24,
    mbSm: 24
  },
  h3: {
    mt: 24,
    mb: 24,
    mtSm: 24,
    mbSm: 24
  },
  h4: {
    mt: 16,
    mb: 16,
    mtSm: 16,
    mbSm: 16
  }
};
var baseHeading = ({ mt, mb, mtSm, mbSm, theme }) => _react.css`
  line-height: 1.214em;

  margin-bottom: ${mb}px;
  margin-top: ${mt}px;

  ${_chunkKW3JYLRIcjs.bp.sm(`
    margin-top: ${mtSm}px;
    margin-bottom: ${mbSm}px;
  `)}
`;
var firstChildStyles = _chunkMFKERIW4cjs.firstChild.call(void 0, `margin-top: 0;`);
var headings = {
  h1: _styled2.default.h1`
    ${(props) => baseHeading(props)}
    ${firstChildStyles}

    font-size: ${_chunkMFKERIW4cjs.pxToRems.call(void 0, defaultHeadingSizes.h1.size)};
    font-weight: ${({ light }) => light ? 400 : 800}};
    ${_chunkKW3JYLRIcjs.bp.sm(`
      font-size: ${_chunkMFKERIW4cjs.pxToRems.call(void 0, defaultHeadingSizes.h1.sizeSm)};
    `)}
  `,
  h2: _styled2.default.h2`
    ${(props) => baseHeading(props)}
    ${firstChildStyles}

    font-size: ${_chunkMFKERIW4cjs.pxToRems.call(void 0, defaultHeadingSizes.h2.size)};
    font-weight: ${({ light }) => light ? 400 : 700}};
    ${_chunkKW3JYLRIcjs.bp.sm(`
      font-size: ${_chunkMFKERIW4cjs.pxToRems.call(void 0, defaultHeadingSizes.h2.sizeSm)};
    `)}
  `,
  h3: _styled2.default.h3`
    ${(props) => baseHeading(props)}
    ${firstChildStyles}

    font-size: ${_chunkMFKERIW4cjs.pxToRems.call(void 0, defaultHeadingSizes.h3.size)};
    font-weight: ${({ light }) => light ? 400 : 700}};
    ${_chunkKW3JYLRIcjs.bp.sm(`
      font-size: ${_chunkMFKERIW4cjs.pxToRems.call(void 0, defaultHeadingSizes.h3.sizeSm)};
    `)}
  `,
  h4: _styled2.default.h4`
    ${(props) => baseHeading(props)}
    ${firstChildStyles}

    font-size: ${_chunkMFKERIW4cjs.pxToRems.call(void 0, defaultHeadingSizes.h4.size)};
    font-weight: ${({ light }) => light ? 400 : 600}};
    ${_chunkKW3JYLRIcjs.bp.sm(`
      font-size: ${_chunkMFKERIW4cjs.pxToRems.call(void 0, defaultHeadingSizes.h4.sizeSm)};
    `)}
  `
};
function Heading({
  children,
  type = "h2",
  id,
  mt = defaultHeadingMargins[type].mt,
  mb = defaultHeadingMargins[type].mb,
  mtSm = defaultHeadingMargins[type].mtSm,
  mbSm = defaultHeadingMargins[type].mbSm,
  m0 = false,
  light = false
}) {
  const StyledHeading = headings[type];
  const theme = _react.useTheme.call(void 0, );
  const heading = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
    StyledHeading,
    {
      id,
      mt: m0 ? 0 : mt,
      mb: m0 ? 0 : mb,
      mtSm: m0 ? 0 : mtSm,
      mbSm: m0 ? 0 : mbSm,
      light,
      theme,
      children: id ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "a", { href: `#${id}`, css: { color: "inherit" }, children }) : children
    }
  );
  return heading;
}
function headingWithDefaults(defaultProps) {
  return (props) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Heading, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, defaultProps), props));
}





exports.headings = headings; exports.Heading = Heading; exports.headingWithDefaults = headingWithDefaults;
