{"version":3,"file":"Image.cjs","sources":["../../../../src/components/layout/image/Image.tsx"],"sourcesContent":["import { IMAGE_STYLES } from '@components/layout/image/styles/Image.css.ts'\r\nimport type { ImageProps } from '@components/layout/image/types/Image.props.ts'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { memo, useMemo, type FC } from 'react'\r\n\r\n/**\r\n * `<img>` wrapper with design-token props for `objectFit`, `objectPosition`,\r\n * `borderRadius`, spacing, and `backgroundColor`. Dimensional props\r\n * (`width`, `height`, `aspectRatio`) are applied as inline styles.\r\n * Always provide a meaningful `alt` text.\r\n */\r\nconst Image: FC<ImageProps> = memo(({\r\n    alt,\r\n    objectFit,\r\n    objectPosition,\r\n    borderRadius,\r\n    padding,\r\n    margin,\r\n    backgroundColor,\r\n    width,\r\n    minWidth,\r\n    maxWidth,\r\n    height,\r\n    minHeight,\r\n    maxHeight,\r\n    aspectRatio,\r\n    className,\r\n    style,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    const recipeClassName = useMemo(\r\n        () =>\r\n            IMAGE_STYLES.recipe({\r\n                objectFit,\r\n                objectPosition,\r\n                borderRadius,\r\n                padding,\r\n                margin,\r\n                backgroundColor,\r\n            }),\r\n        [\r\n            objectFit,\r\n            objectPosition,\r\n            borderRadius,\r\n            padding,\r\n            margin,\r\n            backgroundColor,\r\n        ],\r\n    )\r\n\r\n    return (\r\n        <img\r\n            ref={ref}\r\n            alt={alt}\r\n            className={cn(recipeClassName, className)}\r\n            style={{\r\n                width,\r\n                minWidth,\r\n                maxWidth,\r\n                height,\r\n                minHeight,\r\n                maxHeight,\r\n                aspectRatio,\r\n                ...style,\r\n            }}\r\n            {...props}\r\n        />\r\n    )\r\n})\r\n\r\nImage.displayName = 'Image'\r\n\r\nexport default Image\r\n"],"names":["Image","memo","alt","objectFit","objectPosition","borderRadius","padding","margin","backgroundColor","width","minWidth","maxWidth","height","minHeight","maxHeight","aspectRatio","className","style","ref","props","recipeClassName","useMemo","IMAGE_STYLES","jsx","cn"],"mappings":"4IAWMA,EAAwBC,EAAAA,KAAK,CAAC,CAChC,IAAAC,EACA,UAAAC,EACA,eAAAC,EACA,aAAAC,EACA,QAAAC,EACA,OAAAC,EACA,gBAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EACA,OAAAC,EACA,UAAAC,EACA,UAAAC,EACA,YAAAC,EACA,UAAAC,EACA,MAAAC,EACA,IAAAC,EACA,GAAGC,CACP,IAAM,CACF,MAAMC,EAAkBC,EAAAA,QACpB,IACIC,EAAAA,aAAa,OAAO,CAChB,UAAAnB,EACA,eAAAC,EACA,aAAAC,EACA,QAAAC,EACA,OAAAC,EACA,gBAAAC,CAAA,CACH,EACL,CACIL,EACAC,EACAC,EACAC,EACAC,EACAC,CAAA,CACJ,EAGJ,OACIe,EAAAA,IAAC,MAAA,CACG,IAAAL,EACA,IAAAhB,EACA,UAAWsB,EAAAA,GAAGJ,EAAiBJ,CAAS,EACxC,MAAO,CACH,MAAAP,EACA,SAAAC,EACA,SAAAC,EACA,OAAAC,EACA,UAAAC,EACA,UAAAC,EACA,YAAAC,EACA,GAAGE,CAAA,EAEN,GAAGE,CAAA,CAAA,CAGhB,CAAC,EAEDnB,EAAM,YAAc"}