You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
29 lines
1.0 KiB
29 lines
1.0 KiB
2 years ago
|
import { useEffect, useRef } from 'react';
|
||
|
|
import { useLeafletContext } from './context.js';
|
||
|
|
import { useEventHandlers } from './events.js';
|
||
|
|
import { useLayerLifecycle } from './layer.js';
|
||
|
|
import { withPane } from './pane.js';
|
||
|
|
export function usePathOptions(element, props) {
|
||
|
|
const optionsRef = useRef();
|
||
|
|
useEffect(function updatePathOptions() {
|
||
|
|
if (props.pathOptions !== optionsRef.current) {
|
||
|
|
const options = props.pathOptions ?? {};
|
||
|
|
element.instance.setStyle(options);
|
||
|
|
optionsRef.current = options;
|
||
|
|
}
|
||
|
|
}, [
|
||
|
|
element,
|
||
|
|
props
|
||
|
|
]);
|
||
|
|
}
|
||
|
|
export function createPathHook(useElement) {
|
||
|
|
return function usePath(props) {
|
||
|
|
const context = useLeafletContext();
|
||
|
|
const elementRef = useElement(withPane(props, context), context);
|
||
|
|
useEventHandlers(elementRef.current, props.eventHandlers);
|
||
|
|
useLayerLifecycle(elementRef.current, context);
|
||
|
|
usePathOptions(elementRef.current, props);
|
||
|
|
return elementRef;
|
||
|
|
};
|
||
|
|
}
|