@tracktor/map 0.1.0

package/LICENSE

@@ -0,0 +1,15 @@
+The ISC License (ISC)
+
+Copyright (C) 2025 Tracktor
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION
+OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN
+CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

package/README.md

@@ -0,0 +1,104 @@
+# 📍 MarkerMap - React Map Library
+
+**MarkerMap** is a React library built on top of Mapbox GL JS. It simplifies rendering interactive maps with customizable markers in your React applications.
+
+## 🚀 Installation
+
+```bash
+npm install @tracktor/map
+```
+
+or
+
+```bash
+yarn add @tracktor/map
+```
+
+## 📦 Dependencies
+
+This library depends on:
+
+- `@tracktor/design-system` for theming and styling
+- `mapbox-gl` for map rendering
+- React 18+
+
+## 🔧 Usage
+
+```tsx
+import MarkerMap from "@tracktor/map";
+
+const markers = [
+  {
+    id: 1,
+    lng: 2.3522,
+    lat: 48.8566,
+    Tooltip: <div>Paris</div>,
+    iconImage: "marker-icon.png",
+    size: 40,
+    onClick: () => alert("Marker clicked!"),
+  },
+];
+
+<MarkerMap
+  markers={markers}
+  center={[2.3522, 48.8566]}
+  zoom={10}
+  fitBounds
+  height={400}
+  width="100%"
+/>
+```
+
+## 🧩 Props
+
+### MarkerMap Props
+
+| Prop               | Type                             | Description                                                             |
+|--------------------|----------------------------------|-------------------------------------------------------------------------|
+| `markers`          | `MarkerProps[]`                  | List of markers to display                                              |
+| `center`           | `LngLatLike` or `[number, number]` | Initial map center coordinates                                         |
+| `zoom`             | `number`                         | Initial zoom level                                                      |
+| `fitBounds`        | `boolean`                        | Automatically fit the map to the bounds of all markers                 |
+| `fitBoundsPadding` | `number`                         | Padding around markers when fitting bounds                             |
+| `zoomFlyFrom`      | `number`                         | Zoom level to fly in from                                              |
+| `popupMaxWidth`    | `string`                         | Max width for popups                                                   |
+| `width`            | `number` or `string`             | Map width                                                               |
+| `height`           | `number` or `string`             | Map height                                                              |
+| `loading`          | `boolean`                        | Whether to show a loading state                                        |
+| `markerImageURL`   | `string`                         | Default marker image URL                                               |
+| `containerStyle`   | `SxProps`                        | Custom styles for the map container                                    |
+| `disableFlyTo`     | `boolean`                        | Disable flyTo animation on marker click                                |
+| `flyToDuration`    | `number`                         | Duration of the flyTo animation                                        |
+| `fitBoundDuration` | `number`                         | Duration of the fitBounds animation                                    |
+| `square`           | `boolean`                        | Forces the map to be square-shaped                                     |
+| `openPopup`        | `number` or `string`             | ID of the marker with an open popup                                    |
+| `openPopupOnHover` | `boolean`                        | Automatically open popups on marker hover                              |
+| `onMapClick`       | `(lng: number, lat: number) => void` | Callback triggered when clicking on the map                         |
+
+### MarkerProps
+
+| Prop        | Type                 | Description                                                   |
+|-------------|----------------------|---------------------------------------------------------------|
+| `id`        | `number` or `string` | Unique marker identifier                                      |
+| `lng`       | `number`             | Longitude                                                     |
+| `lat`       | `number`             | Latitude                                                      |
+| `Tooltip`   | `ReactNode`          | Tooltip content displayed in a popup                          |
+| `iconImage` | `string`             | Image URL used as marker icon                                 |
+| `size`      | `number`             | Marker size in pixels                                         |
+| `zIndex`    | `number`             | Z-index to control stacking order                             |
+| `onClick`   | `() => void`         | Function triggered on marker click                            |
+| `type`      | `string`             | Custom marker type (optional, for filtering or styling)       |
+| `name`      | `string`             | Name of the marker                                            |
+| `Icon`      | `ReactNode`          | Custom React component to render instead of default image     |
+
+## 🖼 Visual Example
+
+<img src="./src/assets/example.png" alt="MarkerMap Example" width="400" />
+
+## 🧑‍💻 Contributing
+
+Contributions are welcome! Please follow the coding conventions and include tests when necessary.
+
+## 📄 License
+
+MIT © [Kevin Graff / Tracktor]

package/dist/components/MapBox/MapBox.d.ts

@@ -0,0 +1,10 @@
+import { SxProps } from '@tracktor/design-system';
+interface MapBoxProps {
+    width?: number | string;
+    height?: number | string;
+    loading?: boolean;
+    containerStyle?: SxProps;
+    square?: boolean;
+}
+declare const _default: import('react').ForwardRefExoticComponent<MapBoxProps & import('react').RefAttributes<HTMLElement>>;
+export default _default;

package/dist/components/MarkerMap/MarkerMap.d.ts

@@ -0,0 +1,3 @@
+import { MarkerMapProps } from '../../types/MarkerMap.tsx';
+declare const MarkerMap: ({ containerStyle, square, theme, height, width, ...props }: MarkerMapProps) => import("react/jsx-runtime").JSX.Element;
+export default MarkerMap;

package/dist/components/MarkerMap/useMarkerMap.d.ts

@@ -0,0 +1,11 @@
+import { Map } from 'mapbox-gl';
+import { MarkerMapProps } from '../../types/MarkerMap.tsx';
+export declare const DEFAULT_CENTER_LNG = 2.333;
+export declare const DEFAULT_CENTER_LAT = 46.8677;
+declare const useMarkerMap: ({ markers, loading, center, flyToDuration, fitBoundDuration, fitBounds, disableFlyTo, fitBoundsPadding, mapStyle, zoom, zoomFlyFrom, openPopup, onMapClick, }: MarkerMapProps) => {
+    loading: boolean | undefined;
+    map: import('react').RefObject<Map | null>;
+    mapContainer: import('react').RefObject<HTMLDivElement | null>;
+    markers: import('../../main').MarkerProps[] | undefined;
+};
+export default useMarkerMap;

package/dist/context/MapProvider.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+interface MapProviderContextProps {
+    licenseMuiX?: string;
+    licenceMapbox?: string;
+}
+export interface MapProviderProps extends MapProviderContextProps {
+    children: ReactNode;
+}
+export declare const MapProviderContext: import('react').Context<MapProviderContextProps>;
+export declare const MapProvider: ({ children, licenseMuiX, licenceMapbox }: MapProviderProps) => import("react/jsx-runtime").JSX.Element;
+export default MapProvider;

package/dist/main.d.ts

@@ -0,0 +1,6 @@
+export { default as MarkerMap } from './components/MarkerMap/MarkerMap';
+export * from './components/MarkerMap/MarkerMap';
+export { default as MapProvider } from './context/MapProvider';
+export * from './context/MapProvider';
+export * from './types/Markers';
+export * from './types/MarkerMap';