@intility/bifrost-react/dist/components/Skeleton/Skeleton.CardImage.js

React library for Intility's design system, Bifrost.

import { jsx as _jsx } from "react/jsx-runtime";
import { forwardRef } from "react";
import classnames from "classnames";
import SkeletonRect from "./Skeleton.Rect.js";
/**
 * Loading placeholder for Card.Image
 */ const SkeletonCardImage = /*#__PURE__*/ forwardRef(({ className, style, height, aspectRatio, ...props }, ref)=>{
    // mimic same behavior as Card.Image
    const anyHeightValue = height ?? style?.height ?? style?.minHeight;
    return /*#__PURE__*/ _jsx(SkeletonRect, {
        ...props,
        className: classnames(className, "bf-card-image"),
        style: {
            aspectRatio,
            ...anyHeightValue !== undefined && {
                // if we set both an aspect ratio and a height, the image will not stretch to full width
                // so we make sure aspect ratio is auto whenever a height value is passed in
                aspectRatio: "auto"
            },
            ...style
        },
        height: anyHeightValue,
        ref: ref
    });
});
SkeletonCardImage.displayName = "Skeleton.CardImage";
export default SkeletonCardImage;