1{"version":3,"file":"ImageWrapper.js","sourceRoot":"","sources":["../../src/web/ImageWrapper.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { CSSProperties, SyntheticEvent, useEffect, Ref, useMemo } from 'react';\n\nimport {\n ImageContentPositionObject,\n ImageContentPositionValue,\n ImageNativeProps,\n ImageSource,\n} from '../Image.types';\nimport { useBlurhash } from '../utils/blurhash/useBlurhash';\nimport { isBlurhashString, isThumbhashString } from '../utils/resolveSources';\nimport { thumbHashStringToDataURL } from '../utils/thumbhash/thumbhash';\n\nfunction ensureUnit(value: string | number) {\n const trimmedValue = String(value).trim();\n if (trimmedValue.endsWith('%')) {\n return trimmedValue;\n }\n return `${trimmedValue}px`;\n}\n\ntype KeysOfUnion<T> = T extends T ? keyof T : never;\n\nfunction getObjectPositionFromContentPositionObject(\n contentPosition?: ImageContentPositionObject\n): string {\n const resolvedPosition = { ...contentPosition } as Record<\n KeysOfUnion<ImageContentPositionObject>,\n ImageContentPositionValue\n >;\n if (!resolvedPosition) {\n return '50% 50%';\n }\n if (resolvedPosition.top == null && resolvedPosition.bottom == null) {\n resolvedPosition.top = '50%';\n }\n if (resolvedPosition.left == null && resolvedPosition.right == null) {\n resolvedPosition.left = '50%';\n }\n\n return (\n ['top', 'bottom', 'left', 'right']\n .map((key) => {\n if (key in resolvedPosition) {\n return `${key} ${ensureUnit(resolvedPosition[key])}`;\n }\n return '';\n })\n .join(' ') || '50% 50%'\n );\n}\n\nfunction getFetchPriorityFromImagePriority(priority: ImageNativeProps['priority'] = 'normal') {\n return priority && ['low', 'high'].includes(priority) ? priority : 'auto';\n}\n\nconst ImageWrapper = React.forwardRef(\n (\n {\n source,\n events,\n contentPosition,\n hashPlaceholderContentPosition,\n priority,\n style,\n hashPlaceholderStyle,\n className,\n accessibilityLabel,\n ...props\n }: {\n source?: ImageSource | null;\n events?: {\n onLoad?: (((event: SyntheticEvent<HTMLImageElement, Event>) => void) | undefined | null)[];\n onError?: ((({ source }: { source: ImageSource | null }) => void) | undefined | null)[];\n onTransitionEnd?: ((() => void) | undefined | null)[];\n onMount?: ((() => void) | undefined | null)[];\n };\n contentPosition?: ImageContentPositionObject;\n hashPlaceholderContentPosition?: ImageContentPositionObject;\n priority?: string | null;\n style: CSSProperties;\n hashPlaceholderStyle?: CSSProperties;\n className?: string;\n accessibilityLabel?: string;\n },\n ref: Ref<HTMLImageElement>\n ) => {\n useEffect(() => {\n events?.onMount?.forEach((e) => e?.());\n }, []);\n const isBlurhash = isBlurhashString(source?.uri || '');\n const isThumbhash = isThumbhashString(source?.uri || '');\n const isHash = isBlurhash || isThumbhash;\n\n // Thumbhash uri always has to start with 'thumbhash:/'\n const thumbhash = source?.uri?.replace(/thumbhash:\\//, '');\n const thumbhashUri = useMemo(\n () => (isThumbhash ? thumbHashStringToDataURL(thumbhash ?? '') : null),\n [thumbhash]\n );\n\n const blurhashUri = useBlurhash(isBlurhash ? source?.uri : null, source?.width, source?.height);\n const objectPosition = getObjectPositionFromContentPositionObject(\n isHash ? hashPlaceholderContentPosition : contentPosition\n );\n\n const uri = isHash ? blurhashUri ?? thumbhashUri : source?.uri;\n if (!uri) return null;\n return (\n <img\n ref={ref}\n alt={accessibilityLabel}\n className={className}\n src={uri || undefined}\n key={source?.uri}\n {...props}\n style={{\n width: '100%',\n height: '100%',\n position: 'absolute',\n left: 0,\n right: 0,\n objectPosition,\n ...style,\n ...(isHash ? hashPlaceholderStyle : {}),\n }}\n // @ts-ignore\n // eslint-disable-next-line react/no-unknown-property\n fetchpriority={getFetchPriorityFromImagePriority(priority || 'normal')}\n onLoad={(event) => {\n if (typeof window !== 'undefined') {\n // this ensures the animation will run, since the starting class is applied at least 1 frame before the target class set in the onLoad event callback\n window.requestAnimationFrame(() => {\n events?.onLoad?.forEach((e) => e?.(event));\n });\n } else {\n events?.onLoad?.forEach((e) => e?.(event));\n }\n }}\n onTransitionEnd={() => events?.onTransitionEnd?.forEach((e) => e?.())}\n onError={() => events?.onError?.forEach((e) => e?.({ source: source || null }))}\n />\n );\n }\n);\nexport default ImageWrapper;\n"]}