Function image

  • image(props): Element

  • Creates an image viewer component for displaying and interacting with images.

    Parameters

    • props: UiImageProps

      Configuration object

    Returns Element

    A JSX element representing the image viewer component with zoom, rotation, and download controls

    Example

    Basic usage with static image

    image({
      src: 'data:image/png;base64,iVBORw0KGgoAAAANSU...',
      filename: 'screenshot.png'
    });

    Example

    Usage with dynamic image from central state

    image({
      src: (state) => state.currentDocument.imageData,
      filename: (state) => `${state.currentDocument.name}.${state.currentDocument.extension}`,
      errorMessage: (state) => `Failed to load ${state.currentDocument.name}`
    });

    Example

    Usage with custom settings and messages

    image({
      src: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEA...',
      filename: 'report.jpg',
      debounceMs: 500,
      loadingMessage: 'Processing image...',
      errorMessage: 'Image could not be displayed',
      id: 'main-image-viewer'
    });

Settings