@nordcom/nordstar-heading
Version:
Component used to display title/heading text.
25 lines (24 loc) • 3.54 kB
JavaScript
import heading_module_default from "./heading.module.scss.js";
import { cn, forwardRef } from "@nordcom/nordstar-system";
import { jsx } from "react/jsx-runtime";
//#region src/heading.tsx
/**
* `<Heading/>`, a component to render headings.
*
* @param {object} props - `<Heading/>` props.
* @param {string} [props.level='h1'] - The level of the heading.
* @param {As} [props.as] - The element to render the component as.
* @returns {ReactNode} The `<Heading/>` component.
*/
var Heading = forwardRef(({ as, level = "h1", className, ...props }, ref) => {
return /* @__PURE__ */ jsx(as || level, {
...props,
className: cn(heading_module_default.container, "font-heading", level === "h1" && "hyphens-auto font-extrabold text-4xl uppercase leading-12", level === "h2" && "font-normal text-2xl text-foreground-highlight lowercase leading-8", level === "h3" && "font-extrabold text-xl lowercase leading-8", level === "h4" && "font-bold text-base uppercase leading-6", className),
"data-level": level,
ref
});
});
Heading.displayName = "Nordstar.Typography.Heading";
//#endregion
export { Heading as default };
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGVhZGluZy5qcyIsIm5hbWVzIjpbXSwic291cmNlcyI6WyIuLi9zcmMvaGVhZGluZy50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBBcyB9IGZyb20gJ0Bub3JkY29tL25vcmRzdGFyLXN5c3RlbSc7XG5pbXBvcnQgeyBjbiwgZm9yd2FyZFJlZiB9IGZyb20gJ0Bub3JkY29tL25vcmRzdGFyLXN5c3RlbSc7XG5pbXBvcnQgc3R5bGVzIGZyb20gJy4vaGVhZGluZy5tb2R1bGUuc2Nzcyc7XG5cbmV4cG9ydCB0eXBlIEhlYWRpbmdQcm9wcyA9IHtcbiAgICBsZXZlbD86ICdoMScgfCAnaDInIHwgJ2gzJyB8ICdoNCc7XG4gICAgYXM/OiBBcztcbn07XG5cbi8qKlxuICogYDxIZWFkaW5nLz5gLCBhIGNvbXBvbmVudCB0byByZW5kZXIgaGVhZGluZ3MuXG4gKlxuICogQHBhcmFtIHtvYmplY3R9IHByb3BzIC0gYDxIZWFkaW5nLz5gIHByb3BzLlxuICogQHBhcmFtIHtzdHJpbmd9IFtwcm9wcy5sZXZlbD0naDEnXSAtIFRoZSBsZXZlbCBvZiB0aGUgaGVhZGluZy5cbiAqIEBwYXJhbSB7QXN9IFtwcm9wcy5hc10gLSBUaGUgZWxlbWVudCB0byByZW5kZXIgdGhlIGNvbXBvbmVudCBhcy5cbiAqIEByZXR1cm5zIHtSZWFjdE5vZGV9IFRoZSBgPEhlYWRpbmcvPmAgY29tcG9uZW50LlxuICovXG5jb25zdCBIZWFkaW5nID0gZm9yd2FyZFJlZjwnaDEnLCBIZWFkaW5nUHJvcHM+KCh7IGFzLCBsZXZlbCA9ICdoMScsIGNsYXNzTmFtZSwgLi4ucHJvcHMgfSwgcmVmKSA9PiB7XG4gICAgY29uc3QgVGFnID0gYXMgfHwgbGV2ZWw7XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8VGFnXG4gICAgICAgICAgICB7Li4ucHJvcHN9XG4gICAgICAgICAgICBjbGFzc05hbWU9e2NuKFxuICAgICAgICAgICAgICAgIHN0eWxlcy5jb250YWluZXIsXG4gICAgICAgICAgICAgICAgJ2ZvbnQtaGVhZGluZycsXG4gICAgICAgICAgICAgICAgbGV2ZWwgPT09ICdoMScgJiYgJ2h5cGhlbnMtYXV0byBmb250LWV4dHJhYm9sZCB0ZXh0LTR4bCB1cHBlcmNhc2UgbGVhZGluZy0xMicsXG4gICAgICAgICAgICAgICAgbGV2ZWwgPT09ICdoMicgJiYgJ2ZvbnQtbm9ybWFsIHRleHQtMnhsIHRleHQtZm9yZWdyb3VuZC1oaWdobGlnaHQgbG93ZXJjYXNlIGxlYWRpbmctOCcsXG4gICAgICAgICAgICAgICAgbGV2ZWwgPT09ICdoMycgJiYgJ2ZvbnQtZXh0cmFib2xkIHRleHQteGwgbG93ZXJjYXNlIGxlYWRpbmctOCcsXG4gICAgICAgICAgICAgICAgbGV2ZWwgPT09ICdoNCcgJiYgJ2ZvbnQtYm9sZCB0ZXh0LWJhc2UgdXBwZXJjYXNlIGxlYWRpbmctNicsXG4gICAgICAgICAgICAgICAgY2xhc3NOYW1lLFxuICAgICAgICAgICAgKX1cbiAgICAgICAgICAgIGRhdGEtbGV2ZWw9e2xldmVsfVxuICAgICAgICAgICAgcmVmPXtyZWZ9XG4gICAgICAgIC8+XG4gICAgKTtcbn0pO1xuXG5IZWFkaW5nLmRpc3BsYXlOYW1lID0gJ05vcmRzdGFyLlR5cG9ncmFwaHkuSGVhZGluZyc7XG5cbmV4cG9ydCBkZWZhdWx0IEhlYWRpbmc7XG4iXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7OztBQWlCQSxJQUFNLFVBQVUsWUFBZ0MsRUFBRSxJQUFJLFFBQVEsTUFBTSxXQUFXLEdBQUcsU0FBUyxRQUFRO0NBRy9GLE9BQ0ksb0JBSFEsTUFBTSxPQUdkO0VBQ0ksR0FBSTtFQUNKLFdBQVcsR0FDUCx1QkFBTyxXQUNQLGdCQUNBLFVBQVUsUUFBUSw2REFDbEIsVUFBVSxRQUFRLHNFQUNsQixVQUFVLFFBQVEsOENBQ2xCLFVBQVUsUUFBUSwyQ0FDbEIsVUFDSDtFQUNELGNBQVk7RUFDUDtFQUNQLENBQUE7RUFFUjtBQUVGLFFBQVEsY0FBYyJ9