@sakaniui/react 0.10.2 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -2,6 +2,43 @@
2
2
 
3
3
  All notable changes to `@sakaniui/react` are documented here.
4
4
 
5
+ ## 0.11.0
6
+
7
+ - **New: `Map`**, an interactive tile map built from the new *↳ Map* page in Figma, with no map library.
8
+ Tiles are plain images on a Web Mercator grid (OpenStreetMap by default; pass `tileUrl` and `attribution` for
9
+ your own provider). Drag to pan with inertia, scroll or pinch to zoom at the pointer, double-click to zoom in;
10
+ with focus, arrows pan and + / - zoom. Props: `center`, `zoom`, `minZoom`, `maxZoom` (changing `center` or `zoom`
11
+ flies the map there), `onViewChange`, `controls`, `locate` with `onLocate` / `onLocateError`, `height`, `tileUrl`,
12
+ `attribution`. Dark mode inverts and mutes the tiles through `--map-tile-filter`, which you can override.
13
+ - **`MapMarker`**: `pin`, `dot` or `cluster` (with `count`), `selected`, `label`, `onClick`.
14
+ - **`MapPopup`**: a card that opens above a place, with `title`, `description`, `onClose` and `offset`.
15
+ - **Live data:** `glide` (ms) on `MapMarker` and `MapPopup` slides them to each new `position` instead of
16
+ jumping, for markers fed by a WebSocket, server-sent events or polling. It interpolates the place, so it stays
17
+ correct while the map is panned or zoomed, and reduced motion turns it off.
18
+ - **`MapClusterLayer`**: pass `points` and a `renderPoint`; nearby places group into counted cluster markers
19
+ that zoom to their places on click, and only what is in view is rendered (a zoom step takes about 5 ms with
20
+ 10,000 places). `radius`, `clusterMaxZoom` and `onClusterClick` tune it.
21
+ - **Dark mode** like the Figma *Dark* example: the map follows a `.dark` class on `<html>` or any ancestor, or
22
+ pass `theme="dark"` to make just that map dark on a light page (tiles, markers, controls and popups all switch).
23
+ The default tiles are darkened to flat near-black land with blue water and roads darker than the land;
24
+ `tileUrlDark` swaps in a provider's own dark tiles instead.
25
+ - **Every Figma variant and state:** `MapMarker` Pin / Dot / Cluster × Default / Hover / Selected (hover works on
26
+ every marker, and the hovered or selected one rises above its neighbours); new `MapControlButton` and
27
+ `MapControls` (Default / Hover / Disabled, with or without the locate button); `MapPopup` gains `pointer`
28
+ (Figma *Show pointer*). `hovered` pins the hover look on markers and control buttons for docs and visual tests.
29
+ - `useMapContext()` gives custom overlays `project`, `zoom`, `flyTo` and `fitBounds`.
30
+ - **New: `MapGlobe`**, a 3D dotted globe (the Figma *Map Globe*), with hover too: markers have Default, Hover
31
+ (soft halo), Selected (larger halo) and Active (pulse) states; hovering one stops the spin and shows its `label`
32
+ in a small card; `onMarkerClick` / `onMarkerHover` report the marker, and labelled markers are reachable with Tab.
33
+ `theme="dark"` makes a globe on a dark surface draw light dots. `variant` "land" dots the continents and "ocean"
34
+ dots the sea; it spins, can be dragged with inertia, and pauses offscreen and under reduced motion. `markers`
35
+ (with `active` pulses) and `arcs` are plain props, so a feed can drive them. It is a canvas with an orthographic
36
+ projection and an 11 KB land mask (Natural Earth, public domain, notice in `THIRD_PARTY_NOTICES.md`), so it adds
37
+ no dependency.
38
+ - Agent contract: `Map`, `MapMarker`, `MapPopup`, `MapClusterLayer` and `MapGlobe` are in the manifest with the
39
+ aliases *google maps*, *leaflet*, *mapbox*, *globe*, *marker clustering* and more, plus recipes for a live feed
40
+ and for clustering.
41
+
5
42
  ## 0.10.2
6
43
 
7
44
  - **New logo.** The SakaniUI arc mark replaces the orange "S" tile everywhere the library shows its own brand:
@@ -59,3 +59,25 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
59
59
  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
60
60
  SOFTWARE.
61
61
  ```
62
+
63
+ ## Natural Earth land, via world-atlas
64
+
65
+ `src/components/Map/landMask.ts` (the land mask behind `MapGlobe`) is Natural Earth 1:110m land
66
+ (https://www.naturalearthdata.com), which is in the public domain, rasterised from the TopoJSON in
67
+ world-atlas 2.0.2 (https://github.com/topojson/world-atlas), used under the ISC license:
68
+
69
+ ```
70
+ Copyright 2013-2019 Michael Bostock
71
+
72
+ Permission to use, copy, modify, and/or distribute this software for any purpose
73
+ with or without fee is hereby granted, provided that the above copyright notice
74
+ and this permission notice appear in all copies.
75
+
76
+ THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
77
+ REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND
78
+ FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
79
+ INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS
80
+ OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER
81
+ TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF
82
+ THIS SOFTWARE.
83
+ ```