1import { ClassAttributes, ComponentProps, ComponentType } from 'react';
2import { Image as NativeImage, ImageStyle as NativeImageStyle, StyleProp } from 'react-native';
3
4import { WebViewStyle } from './View';
5import { createSafeStyledView } from '../css/createSafeStyledView';
6
7type NativeImageProps = ComponentProps<typeof NativeImage> & ClassAttributes<typeof NativeImage>;
8
9export interface WebImageStyle {
10  opacity?: number;
11}
12
13export type ImageStyle = Omit<NativeImageStyle, 'position'> & WebImageStyle & WebViewStyle;
14
15export type WebImageProps = {
16  style?: StyleProp<ImageStyle>;
17  /** @platform web */
18  tabIndex?: number;
19  /**
20   * Set whether the image can be dragged with native browser behavior.
21   * @platform web
22   */
23  draggable?: boolean;
24};
25
26export type ImageProps = Omit<NativeImageProps, 'style'> & WebImageProps;
27
28const Image = NativeImage as ComponentType<ImageProps>;
29
30export default createSafeStyledView(Image) as ComponentType<ImageProps>;
31