@eslam-elmeniawy/react-native-common-components/lib/module/components/ImagePlaceholder/ImagePlaceholder.js

Common `ReactNative` components packed in library for usage in projects.

"use strict";

// External imports.
import * as React from 'react';
import { StyleSheet, View } from 'react-native';
import { withTheme } from 'react-native-paper';

// Types imports.

// Internal imports.
import styles from "./ImagePlaceholder.styles.js";
import Image from "./Image.js";
import ResponsiveDimensions from "../../utils/ResponsiveDimensions.js";

/**
 * ImagePlaceholderComponent (unwrapped, for testing)
 * @internal For testing purposes only. Do not use in production code.
 */
import { jsx as _jsx } from "react/jsx-runtime";
const ImagePlaceholderComponent = /*#__PURE__*/React.memo(props => {
  const {
    size,
    source,
    placeholder,
    vectorPlaceholder,
    resizeMode,
    priority,
    cache,
    loadingProps,
    style,
    theme,
    ...other
  } = props;
  const [isLoading, setIsLoading] = React.useState(false);
  const [isError, setIsError] = React.useState(false);
  const [progress, setProgress] = React.useState(0);
  const [progressSize, setProgressSize] = React.useState(0);
  const _scaledSize = size == null || size === undefined ? undefined : ResponsiveDimensions.ms(size);
  return /*#__PURE__*/_jsx(View, {
    style: StyleSheet.flatten([styles.container, {
      width: _scaledSize,
      height: _scaledSize
    }, styles.noPadding, style]),
    ...other,
    children: /*#__PURE__*/_jsx(Image, {
      source: source,
      placeholder: placeholder,
      vectorPlaceholder: vectorPlaceholder,
      resizeMode: resizeMode,
      priority: priority,
      cache: cache,
      loadingProps: loadingProps,
      theme: theme,
      isLoading: isLoading,
      isError: isError,
      progress: progress,
      progressSize: progressSize,
      setLoadingState: setIsLoading,
      setErrorState: setIsError,
      setProgressState: setProgress,
      setProgressSizeState: setProgressSize
    })
  });
});
const ImagePlaceholder = withTheme(ImagePlaceholderComponent);
export { ImagePlaceholderComponent };
export default ImagePlaceholder;
//# sourceMappingURL=ImagePlaceholder.js.map