@engie-group/fluid-design-system-react/lib/components/card/NJCardCover.js

Fluid Design System React

import { jsx, jsxs } from 'react/jsx-runtime';
import { Root as Slot } from '../../node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.2.6_react@19.2.0/node_modules/@radix-ui/react-slot/dist/index.js';
import React__default from 'react';
import { isDefaultComponent } from '../../utils/typeHelpers.js';
import { Utils } from '../../utils/util.js';
import { NJIcon } from '../icon/NJIcon.js';

const NJCardCover = React__default.forwardRef((props, ref) => {
    const { heading, paragraph, headingElement: Wrapper = 'h4', background, children, asChild, ...htmlProps } = props;
    let classes = Utils.classNames('nj-card', 'nj-card--cover');
    const cardContent = (jsx("div", { className: "nj-card__body", children: jsxs("div", { className: "nj-card__overlay", children: [jsx(Wrapper, { className: "nj-card__title", children: heading }), jsx(NJIcon, { name: "arrow_forward", className: "nj-card__icon" }), paragraph && jsx("p", { className: "nj-card__description", children: paragraph })] }) }));
    if (isDefaultComponent(asChild)) {
        classes = Utils.classNames(classes, htmlProps.className);
        return (jsx("a", { ref: ref, ...htmlProps, className: classes, style: { backgroundImage: `url(${background})`, ...htmlProps.style }, children: cardContent }));
    }
    return (jsx(Slot, { className: classes, style: { backgroundImage: `url(${background})` }, children: children }));
});
NJCardCover.displayName = 'NJCardCover';

export { NJCardCover };