@engie-group/fluid-design-system-react/lib/components/skeleton/NJSkeletonArea.js

Fluid Design System React

import { jsx } from 'react/jsx-runtime';
import React__default from 'react';
import { Utils } from '../../utils/util.js';
import { NJIcon } from '../icon/NJIcon.js';

const NJSkeletonArea = React__default.forwardRef(({ icon, height, width, children, style, className, ...htmlProps }, ref) => {
    const classes = Utils.classNames('nj-skeleton', 'nj-skeleton--area', className);
    const getIconChildren = (children) => {
        const className = Utils.classNames(children?.props.className, 'nj-skeleton__icon');
        return React__default.cloneElement(children, { className });
    };
    return (jsx("div", { ref: ref, "aria-hidden": "true", style: {
            ...style,
            ...(!!height && { height }),
            ...(!!width && { width })
        }, className: classes, ...htmlProps, children: children && !icon ? (getIconChildren(children)) : (jsx(NJIcon, { name: icon ?? 'image', scale: "xl", variant: "tertiary", className: "nj-skeleton__icon" })) }));
});
NJSkeletonArea.displayName = 'NJSkeletonArea';

export { NJSkeletonArea };