npm install react-image-pointer

const dataIphone16 = {
  details: {
    title: 'Apple iPhone 16',
    description: 'Latest model of the iPhone with advanced features and camera system.',
  },
  points: [{
    id: 1,
    x: 64.7,
    y: 37,
    info: {
      title: 'Side Button',
      description: 'Used to turn the device on/off and activate Siri or Voice Control.'
    },
    link: {
      title: "Siri Control",
      url: "https://support.apple.com/en-us/111778"
    },
  }, {
    id: 2,
    x: 42,
    y: 20,
    info: {
      title: 'Rear Camera System',
      description: 'Multiple camera configuration for high-quality photography and video, including Main, Ultra Wide, and Telephoto lenses.'
    },
    image: {
      src: '/images/camara-iphone16.webp',
      alt: 'Camera Details'
    }
  }, {
    id: 3,
    x: 54.5,
    y: 64,
    info: {
      title: 'Volume Buttons',
      description: 'Just Volume Buttons'
    },
  }],
};

<ImagePointer src="/images/iphone-16.webp" itemData={dataIphone16} maxHeight="600px" isDarkMode={isDarkMode} />