⚠️ Early Stage Project: This library is not production-ready yet. Developers should use it with caution and expect breaking changes.

Weeklog

Welcome to the Terrae Weeklog. Every weekend, I dedicate time to building and improving this library. Here you'll find detailed updates on new features, improvements, and fixes shipped during each weekend coding session.

Week 2

Sunday, February 1, 2026

Week 1

Sunday, January 25, 2026

New Components

Blur Area

View docs

New MapBlurArea component to blur specific areas on the map. Supports multiple areas, custom blur intensity, rounded corners, and interaction blocking for premium content or unexplored areas.

Polygon

View docs

New MapPolygon component for drawing static filled polygons on the map. Supports customizable fill color, stroke color, opacity, and dashed strokes.

Animated Polygon

View docs

New MapAnimatedPolygon component for drawing animated polygons with outline and fill effects. Supports three animation modes: draw, fill, and draw-then-fill.

Animated Radial Lines

View docs

New MapLineRadial component for animated curved lines spreading from a central origin to multiple destinations. Supports custom markers, traveling markers, staggered animations, and auto-curvature based on distance.

Animated Arc

View docs

New MapArcAnimated component for animated curved arc lines between two points. Supports customizable arc height, traveling markers, origin/destination markers, dash patterns, and loop animations.

New Properties

Map

autoRotate

View docs

New autoRotate and rotateSpeed props for automatic globe rotation. Only works with projection="globe".

Map

showLoader

View docs

New showLoader prop for external loader control. Also includes a new animated globe as the default loader.

Map

projection

View docs

The projection prop is now reactive. Switch between all 8 Mapbox projections dynamically at runtime.

Map

Style Presets

View docs

Built-in style presets that automatically adapt to your theme. Includes standardMapStyles, streetsMapStyles, outdoorsMapStyles, satelliteMapStyles, and navigationMapStyles.

Mini Map

draggable

View docs

New draggable prop lets users reposition the minimap anywhere within the map container.

Mini Map

rounded

View docs

New rounded prop for custom border radius. Set to a number or "full" for a circular minimap.

Mini Map

styles

View docs

New styles prop for theme-aware map styles. Minimap now automatically switches between light and dark styles based on your theme.

Map Compare

orientation

View docs

New orientation prop for horizontal or vertical layouts, and showLabels to display Before/After labels.

Fixes

Animated Lines

Theme Switching

Fixed animation breaking when switching themes. The component now properly re-adds sources and restarts animation after theme changes.

Hello, Terrae! 🚀

Sunday, January 18, 2026

I'm excited to introduce Terrae—a modern, declarative map library built for design engineers who want beautiful, interactive maps without the complexity. Built with React, TypeScript, shadcn/ui, and Mapbox GL JS.

What's included in the initial release:

  • Core map component with theme support
  • Markers with customizable content and avatars
  • Popups and tooltips
  • Navigation controls (zoom, rotation, fullscreen)
  • MiniMap for context overview
  • Lines and animated route paths with dashed line support
  • Animated markers with path following
  • Animated pulse effects
  • Circle clusters for data visualization
  • Side-by-side map comparison
  • Image and video overlays
  • Rain weather effects

This is just the beginning. More components, features, and improvements are coming in future weekend updates. Thank you for being part of this journey!

Want to shape the future of Terrae?

Your feedback and ideas help guide development priorities. Share your suggestions, feature requests, or use cases on GitHub.