✨ MAJOR FEATURES: • Auto-zoom intelligence với smart bounds fitting • Enhanced 3D GPS markers với pulsing effects • Professional route display với 6-layer rendering • Status-based parking icons với availability indicators • Production-ready build optimizations 🗺️ AUTO-ZOOM FEATURES: • Smart bounds fitting cho GPS + selected parking • Adaptive padding (50px) cho visual balance • Max zoom control (level 16) để tránh quá gần • Dynamic centering khi không có selection 🎨 ENHANCED VISUALS: • 3D GPS marker với multi-layer pulse effects • Advanced parking icons với status colors • Selection highlighting với animation • Dimming system cho non-selected items 🛣️ ROUTE SYSTEM: • OpenRouteService API integration • Multi-layer route rendering (glow, shadow, main, animated) • Real-time distance & duration calculation • Visual route info trong popup 📱 PRODUCTION READY: • SSR safe với dynamic imports • Build errors resolved • Global deployment via Vercel • Optimized performance 🌍 DEPLOYMENT: • Vercel: https://whatever-ctk2auuxr-phong12hexdockworks-projects.vercel.app • Bundle size: 22.8 kB optimized • Global CDN distribution • HTTPS enabled 💾 VERSION CONTROL: • MapView-v2.0.tsx backup created • MAPVIEW_VERSIONS.md documentation • Full version history tracking
42 lines
1.7 KiB
JavaScript
42 lines
1.7 KiB
JavaScript
import * as React from 'react';
|
|
import { fullWidthClassName, zeroRightClassName } from 'react-remove-scroll-bar/constants';
|
|
import { useMergeRefs } from 'use-callback-ref';
|
|
import { effectCar } from './medium';
|
|
const nothing = () => {
|
|
return;
|
|
};
|
|
/**
|
|
* Removes scrollbar from the page and contain the scroll within the Lock
|
|
*/
|
|
const RemoveScroll = React.forwardRef((props, parentRef) => {
|
|
const ref = React.useRef(null);
|
|
const [callbacks, setCallbacks] = React.useState({
|
|
onScrollCapture: nothing,
|
|
onWheelCapture: nothing,
|
|
onTouchMoveCapture: nothing,
|
|
});
|
|
const { forwardProps, children, className, removeScrollBar, enabled, shards, sideCar, noRelative, noIsolation, inert, allowPinchZoom, as: Container = 'div', gapMode, ...rest } = props;
|
|
const SideCar = sideCar;
|
|
const containerRef = useMergeRefs([ref, parentRef]);
|
|
const containerProps = {
|
|
...rest,
|
|
...callbacks,
|
|
};
|
|
return (React.createElement(React.Fragment, null,
|
|
enabled && (React.createElement(SideCar, { sideCar: effectCar, removeScrollBar: removeScrollBar, shards: shards, noRelative: noRelative, noIsolation: noIsolation, inert: inert, setCallbacks: setCallbacks, allowPinchZoom: !!allowPinchZoom, lockRef: ref, gapMode: gapMode })),
|
|
forwardProps ? (React.cloneElement(React.Children.only(children), {
|
|
...containerProps,
|
|
ref: containerRef,
|
|
})) : (React.createElement(Container, { ...containerProps, className: className, ref: containerRef }, children))));
|
|
});
|
|
RemoveScroll.defaultProps = {
|
|
enabled: true,
|
|
removeScrollBar: true,
|
|
inert: false,
|
|
};
|
|
RemoveScroll.classNames = {
|
|
fullWidth: fullWidthClassName,
|
|
zeroRight: zeroRightClassName,
|
|
};
|
|
export { RemoveScroll };
|