@dnb/eufemia/es/elements/typography/H.js

DNB Eufemia Design System UI Library

"use client";

import withComponentMarkers from "../../shared/helpers/withComponentMarkers.js";
import { useContext } from 'react';
import { clsx } from 'clsx';
import E from "../Element.js";
import { setNextLevel, getHeadingSize } from "../../components/heading/HeadingHelpers.js";
import { useTheme } from "../../shared/index.js";
import Context from "../../shared/Context.js";
import { useTypography } from "./Typography.js";
import { jsx as _jsx } from "react/jsx-runtime";
const H = props => {
  const {
    element = 'h1',
    is,
    level,
    size,
    className,
    ...rest
  } = useTypography(props);
  const resolvedElement = element !== null && element !== void 0 ? element : is;
  const numSiz = parseFloat(String(resolvedElement).substring(1));
  if (level === 'use') {
    setNextLevel(numSiz);
  }
  const theme = useTheme();
  const targetSize = size === 'auto' && getHeadingSize(theme?.name)[numSiz] || size || 'xx-large';
  const context = useContext(Context);
  return _jsx(E, {
    as: resolvedElement,
    internalClass: clsx(targetSize && `dnb-h--${targetSize}`, context?.theme?.surface === 'dark' && 'dnb-t--surface-dark', className),
    ...rest
  });
};
withComponentMarkers(H, {
  _isHeadingElement: true,
  _supportsSpacingProps: true
});
export default H;
//# sourceMappingURL=H.js.map