old peer dependencies cause npm install fail

[barbalex]

npm i causes:

PS C:\Users\alexa\apf2> npm i
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: apflora@1.101.9
npm ERR! Found: react@18.2.0
npm ERR! node_modules/react
npm ERR!   react@"18.2.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^17.0.2" from react-leaflet-fullscreen-plugin@1.0.1
npm ERR! node_modules/react-leaflet-fullscreen-plugin
npm ERR!   react-leaflet-fullscreen-plugin@"1.0.1" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

Thus the peer dependencies need to be updated.

[zidanomar]

I'm curious if this library is still being maintained

[aemzayn]

The implementation is quite simple; you can create the same component in your project. You need to install leaflet.fullscreen, as you can see in the FullscreenComponent.jsx

import { createControlComponent } from '@react-leaflet/core';
import { useMapEvents } from 'react-leaflet';
import L from 'leaflet';
import 'leaflet.fullscreen';

function createLeafletControl(props) {
  return L.control.fullscreen(props);
}

const Fullscreen = createControlComponent(createLeafletControl);

const getEventsFromProps = ({ enterFullscreen, exitFullscreen }) => {
  const events = {};

  if (enterFullscreen) {
    events.enterFullscreen = enterFullscreen;
  }

  if (exitFullscreen) {
    events.exitFullscreen = exitFullscreen;
  }

  return events;
};

export const MapFullscreen = ({ eventHandlers = {}, ...props }) => {
  useMapEvents({ ...getEventsFromProps(eventHandlers) });

  return <Fullscreen {...props} />;
};

[barbalex]

Yeah, this is my implementation: https://github.com/barbalex/apf2/blob/3776d4eab3228baefe23ae70fa52f92105074f75/src/components/Projekte/Karte/FullscreenControl.jsx