f7f758bb00
* improved locate control * fix(lib): clean up setTimeout and fix Chrome modal layout issue - Add proper cleanup for setTimeout in LocateControl to prevent memory leaks - Replace modal-open class with direct overflow style to fix Chrome scrollbar issue - Add timeout reference tracking for better component unmount handling 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * fix linting * set distance rule * optimized locatecontrol * working for new users without profile now * test(lib): add comprehensive tests for LocateControl component - Add 9 comprehensive unit tests covering all LocateControl functionality - Test modal display logic for new and existing users - Test profile creation and position updates - Test navigation after successful operations - Test error handling with proper toast notifications - Mock all external dependencies (React Router, Leaflet, APIs) - Verify dialog behavior prevents re-appearance after decline - Include snapshot tests for UI consistency - All tests pass with proper TypeScript typing 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * removed unused code, add 1s delay * updated tests * fixed tests --------- Co-authored-by: Claude <noreply@anthropic.com>
Utopia UI 
UI Framework for Real-Life-Networking-Apps
Real change happens in real life when we meet in person and connect as local communities manifesting their ideas with the earth. When we help each other to step out of our bubbles at home and start building common infrastructure to meet human needs in harmony with Mother Earth.
That is why Utopia UI exists. It is a UI kit for minimalist, fast, intuitive and mobile-first map apps, as a tool for local connection and decentralised networking. We believe in maps as the perfect link between digital tools and real life action
It can work with any backend or p2p database and any kind of data structure.
Mission
Utopia UIs mission is to provide open source building blocks to create beautiful applications with a focus on real life impact, local communities and gamification.
The building blocks are designed to allow different networks and communities to assemble their map and app for their specific needs and purpose.
It is the base of Utopia Map and Utopia Game.
Features
- Interactive Component Map with customizable Layers (like Projects, Event, People)
- Flexible API-Interface to make it work with every backend or p2p database
- Create, Update, Delete Items
- User authentification API-Interface
- Customizable Profiles for users and other items
- App shell with navigation bar and sidebar
Getting Started
-
If you want to use Utopia UI in your project, check out
/examplesto see how to use its components. -
If you need more information you can explore the docs
-
If you like to contribute to our library, see the Contribution Guide to see how to setup a development environment on your local machine.
Components
Map Component
The map shows various Layers (like places, events, profiles ...) of Items at their respective position whith nice and informative Popup and Profiles.
Tags, colors and clusters help to retain the overview.
Map Options
| Option | Type | Default | Required | Description |
|---|---|---|---|---|
height |
string |
'400px' |
No | height of the map |
width |
string |
'100vw' |
No | width of the map |
center |
LatLng |
[50.6, 9.5] |
No | initial map position |
zoom |
number |
10 |
No | initial zoom level |
Layer Options
| Option | Type | Default | Required | Description |
|---|---|---|---|---|
| ... |
Join the community
This Library is in alpha stage. You are very welcome to participate in the development
We are looking for Web Developer, UX Designer, Community Manager, Visionaries, Artists, etc. who like to support this Vision.
Support us
This project is tested with BrowserStack