UNPKG

react-leaflet-custom-corners-control

Version:

Creates a control wrapper around a React element with custom corners.

58 lines (57 loc) 2.59 kB
var __assign = (this && this.__assign) || function () { __assign = Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; import L from 'leaflet'; import React from 'react'; import { useMap } from 'react-leaflet'; var POSITION_CLASSES = { bottomleft: 'leaflet-bottom leaflet-left', bottomright: 'leaflet-bottom leaflet-right', topleft: 'leaflet-top leaflet-left', topright: 'leaflet-top leaflet-right', topcenter: 'leaflet-top leaflet-center', middlecenter: 'leaflet-middle leaflet-center', middleleft: 'leaflet-middle leaflet-left', middleright: 'leaflet-middle leaflet-right', bottomcenter: 'leaflet-bottom leaflet-center', }; var Control = function (props) { var _a, _b; var _c = React.useState(document.createElement('div')), portalRoot = _c[0], setPortalRoot = _c[1]; var positionClass = ((props.position && POSITION_CLASSES[props.position]) || POSITION_CLASSES.topright); var controlContainerRef = React.createRef(); var map = useMap(); React.useEffect(function () { if (controlContainerRef.current !== null) { L.DomEvent.disableClickPropagation(controlContainerRef.current); L.DomEvent.disableScrollPropagation(controlContainerRef.current); } }, [controlContainerRef]); React.useEffect(function () { var mapContainer = map.getContainer(); var targetDiv = mapContainer.getElementsByClassName(positionClass); setPortalRoot(targetDiv[0]); }, [positionClass]); React.useEffect(function () { if (portalRoot !== null) { if (props.prepend !== undefined && props.prepend === true) { portalRoot.prepend(controlContainerRef.current); } else { portalRoot.append(controlContainerRef.current); } } }, [portalRoot, props.prepend, controlContainerRef]); var className = (((_b = (_a = props.container) === null || _a === void 0 ? void 0 : _a.className) === null || _b === void 0 ? void 0 : _b.concat(' ')) || '') + 'leaflet-control'; return (React.createElement("div", __assign({}, props.container, { ref: controlContainerRef, className: className }), props.children)); }; export default Control; //# sourceMappingURL=Control.js.map