@alexgorbatchev/shadcn 0.0.51 → 0.0.53

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.
@@ -35,6 +35,8 @@ var DEFAULT_ATTRIBUTION = "© OpenStreetMap contributors";
35
35
  function GeoMap2({
36
36
  places,
37
37
  routes,
38
+ circles,
39
+ onViewportChange,
38
40
  selectedId,
39
41
  onSelect,
40
42
  theme = "auto",
@@ -45,6 +47,8 @@ function GeoMap2({
45
47
  variant = "default",
46
48
  ...props
47
49
  }) {
50
+ const viewportCallbackRef = useRef(onViewportChange);
51
+ viewportCallbackRef.current = onViewportChange;
48
52
  const containerRef = useRef(null);
49
53
  const mapRef = useRef(null);
50
54
  const leafletRef = useRef(null);
@@ -61,13 +65,15 @@ function GeoMap2({
61
65
  return {
62
66
  signature: JSON.stringify([
63
67
  places.map((place) => [place.id, place.lat, place.lng, place.label, place.description]),
64
- routes?.map((route) => [route.id, route.points, route.label]) ?? []
68
+ routes?.map((route) => [route.id, route.points, route.label]) ?? [],
69
+ circles?.map((circle) => [circle.id, circle.lat, circle.lng, circle.radiusMeters, circle.label]) ?? []
65
70
  ]),
71
+ validCircles: circles?.filter((circle) => isCoordinate(circle.lat, circle.lng) && Number.isFinite(circle.radiusMeters) && circle.radiusMeters > 0) ?? [],
66
72
  validPlaces,
67
73
  routePoints,
68
74
  validRoutes
69
75
  };
70
- }, [places, routes]);
76
+ }, [places, routes, circles]);
71
77
  const { signature: contentSignature, validPlaces } = mapContent;
72
78
  const mapContentRef = useRef(mapContent);
73
79
  mapContentRef.current = mapContent;
@@ -100,6 +106,17 @@ function GeoMap2({
100
106
  leafletRef.current = leaflet;
101
107
  map = leaflet.map(container, { keyboard: true });
102
108
  mapRef.current = map;
109
+ const observedMap = map;
110
+ map.on("moveend", () => {
111
+ const bounds = observedMap.getBounds();
112
+ viewportCallbackRef.current?.({
113
+ zoom: observedMap.getZoom(),
114
+ north: bounds.getNorth(),
115
+ south: bounds.getSouth(),
116
+ east: bounds.getEast(),
117
+ west: bounds.getWest()
118
+ });
119
+ });
103
120
  leaflet.tileLayer(resolvedTileUrl).addTo(map);
104
121
  const resizedMap = map;
105
122
  resizeObserver = new ResizeObserver(() => resizedMap.invalidateSize());
@@ -137,20 +154,41 @@ function GeoMap2({
137
154
  const map = mapRef.current;
138
155
  if (!leaflet || !map || !mapReady)
139
156
  return;
140
- const { routePoints, validPlaces, validRoutes } = mapContentRef.current;
157
+ const { routePoints, validPlaces, validRoutes, validCircles } = mapContentRef.current;
141
158
  const markers = markersRef.current;
142
159
  const layer = leaflet.layerGroup().addTo(map);
143
160
  const points = [
144
161
  ...validPlaces.map((place) => [place.lat, place.lng]),
145
162
  ...routePoints
146
163
  ];
164
+ const firstCircle = validCircles[0];
165
+ if (firstCircle)
166
+ map.setView([firstCircle.lat, firstCircle.lng], 13, { animate: false });
167
+ for (const circle of validCircles) {
168
+ const overlay = leaflet.circle([circle.lat, circle.lng], {
169
+ radius: circle.radiusMeters,
170
+ color: "var(--primary)",
171
+ fillColor: "var(--primary)",
172
+ fillOpacity: 0.12,
173
+ weight: 2
174
+ }).addTo(layer);
175
+ const label = document.createElement("span");
176
+ label.textContent = circle.label;
177
+ overlay.bindTooltip(label);
178
+ const path = overlay.getElement();
179
+ path?.setAttribute("role", "graphics-symbol");
180
+ path?.setAttribute("aria-label", circle.label);
181
+ path?.setAttribute("tabindex", "0");
182
+ const bounds = overlay.getBounds();
183
+ points.push([bounds.getSouth(), bounds.getWest()], [bounds.getNorth(), bounds.getEast()]);
184
+ }
147
185
  const [first] = points;
148
186
  if (points.length === 1 && first) {
149
- map.setView(first, 13);
187
+ map.setView(first, 13, { animate: false });
150
188
  } else if (points.length > 1) {
151
- map.fitBounds(leaflet.latLngBounds(points), { padding: [24, 24] });
189
+ map.fitBounds(leaflet.latLngBounds(points), { padding: [24, 24], animate: false });
152
190
  } else {
153
- map.setView([0, 0], 2);
191
+ map.setView([0, 0], 2, { animate: false });
154
192
  }
155
193
  for (const route of validRoutes) {
156
194
  const polyline = leaflet.polyline(route.points, {
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  GeoMap2
3
- } from "./chunk-6en4vrjc.js";
3
+ } from "./chunk-hf4prmk6.js";
4
4
  import {
5
5
  MermaidDiagram3
6
6
  } from "./chunk-65xd5we6.js";
@@ -4090,7 +4090,7 @@ function FilterBar2({
4090
4090
  "aria-label": filter.label,
4091
4091
  value: value[filter.id] ?? "",
4092
4092
  onValueChange: (next) => onValueChange({ ...value, [filter.id]: next }),
4093
- options: [{ value: "", label: filter.allLabel }, ...filter.options]
4093
+ options: [{ value: "", label: filter.allLabel ?? `All ${filter.label.toLowerCase()}` }, ...filter.options]
4094
4094
  }, filter.id)),
4095
4095
  /* @__PURE__ */ jsx43(Button2, {
4096
4096
  type: "button",
@@ -4,8 +4,8 @@ import type { IDensityProps } from "../density/types.js";
4
4
  type FilterDefinition = {
5
5
  id: string;
6
6
  label: string;
7
- /** Text of the choice that clears this filter, such as "All statuses" or "Any time". */
8
- allLabel: string;
7
+ /** Text of the choice that clears this filter, such as "All statuses" or "Any time". Defaults to "All {label}". */
8
+ allLabel?: string;
9
9
  options: readonly ILabelValue[];
10
10
  };
11
11
  type FilterBarProps = IDensityProps & {
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  styledGenerativeUILibrary2,
3
3
  GenerativeUi2
4
- } from "../../../chunk-gremnsj0.js";
5
- import"../../../chunk-6en4vrjc.js";
4
+ } from "../../../chunk-nt4jdzh2.js";
5
+ import"../../../chunk-hf4prmk6.js";
6
6
  import"../../../chunk-65xd5we6.js";
7
7
  import"../../../chunk-ptdr68cq.js";
8
8
  import"../../../chunk-f9sm5zpv.js";
@@ -7,6 +7,20 @@ export interface IGeoMapPlace {
7
7
  label: string;
8
8
  description?: string | undefined;
9
9
  }
10
+ export interface IGeoMapViewport {
11
+ zoom: number;
12
+ north: number;
13
+ south: number;
14
+ east: number;
15
+ west: number;
16
+ }
17
+ export interface IGeoMapCircle {
18
+ id: string;
19
+ lat: number;
20
+ lng: number;
21
+ radiusMeters: number;
22
+ label: string;
23
+ }
10
24
  export interface IGeoMapRoute {
11
25
  id: string;
12
26
  points: readonly (readonly [lat: number, lng: number])[];
@@ -15,6 +29,10 @@ export interface IGeoMapRoute {
15
29
  export interface IGeoMapProps extends Omit<ComponentProps<"div">, "children" | "onSelect" | "className" | "style"> {
16
30
  places: readonly IGeoMapPlace[];
17
31
  routes?: readonly IGeoMapRoute[] | undefined;
32
+ /** Geographic radius overlays, in meters; the initial view includes their full bounds. */
33
+ circles?: readonly IGeoMapCircle[] | undefined;
34
+ /** Reports the visible bounds after fitting, panning, or zooming, for viewport attribution. */
35
+ onViewportChange?: ((viewport: IGeoMapViewport) => void) | undefined;
18
36
  selectedId?: string | undefined;
19
37
  onSelect?: ((id: string) => void) | undefined;
20
38
  theme?: "light" | "dark" | "auto" | undefined;
@@ -28,4 +46,4 @@ export interface IGeoMapProps extends Omit<ComponentProps<"div">, "children" | "
28
46
  showPlaces?: boolean | undefined;
29
47
  variant?: "default" | "embedded";
30
48
  }
31
- export declare function GeoMap({ places, routes, selectedId, onSelect, theme, tileUrl, attribution, height, showPlaces, variant, ...props }: IGeoMapProps): JSX.Element;
49
+ export declare function GeoMap({ places, routes, circles, onViewportChange, selectedId, onSelect, theme, tileUrl, attribution, height, showPlaces, variant, ...props }: IGeoMapProps): JSX.Element;
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  GeoMap2
3
- } from "../../../chunk-6en4vrjc.js";
3
+ } from "../../../chunk-hf4prmk6.js";
4
4
  import"../../../chunk-f9sm5zpv.js";
5
5
  import"../../../chunk-bd09gygt.js";
6
6
  import"../../../chunk-x90xmrba.js";
@@ -146,6 +146,8 @@ export type { IFlowEdge } from "./elements/FlowGraph.js";
146
146
  export type { IFlowNode } from "./elements/FlowGraph.js";
147
147
  export type { IGalleryImage } from "./elements/ImageGallery.js";
148
148
  export type { IGenerationLoaderProps } from "./elements/GenerationLoader.js";
149
+ export type { IGeoMapViewport } from "./elements/GeoMap.js";
150
+ export type { IGeoMapCircle } from "./elements/GeoMap.js";
149
151
  export type { IGeoMapPlace } from "./elements/GeoMap.js";
150
152
  export type { IGeoMapProps } from "./elements/GeoMap.js";
151
153
  export type { IGeoMapRoute } from "./elements/GeoMap.js";
@@ -293,7 +293,7 @@ import {
293
293
  import"../../chunk-f9sm5zpv.js";
294
294
  import {
295
295
  GeoMap2
296
- } from "../../chunk-6en4vrjc.js";
296
+ } from "../../chunk-hf4prmk6.js";
297
297
  import {
298
298
  GitHubIcon2
299
299
  } from "../../chunk-4bjqbky7.js";
@@ -542,7 +542,7 @@ import"../../chunk-65xd5we6.js";
542
542
  import {
543
543
  styledGenerativeUILibrary2,
544
544
  GenerativeUi2
545
- } from "../../chunk-gremnsj0.js";
545
+ } from "../../chunk-nt4jdzh2.js";
546
546
  import {
547
547
  Sub2
548
548
  } from "../../chunk-f1mdtq5p.js";
@@ -31,7 +31,7 @@ import {
31
31
  DrawerHeader2,
32
32
  DrawerTitle2,
33
33
  DrawerDescription2
34
- } from "../../chunk-268pbhj1.js";
34
+ } from "../../chunk-zs390b72.js";
35
35
  import {
36
36
  MenuPopup,
37
37
  MenuItem2,
package/dist/index.js CHANGED
@@ -171,7 +171,7 @@ import {
171
171
  StatusTracker2,
172
172
  DashboardLayout2,
173
173
  BillingUsage2
174
- } from "./chunk-268pbhj1.js";
174
+ } from "./chunk-zs390b72.js";
175
175
  import {
176
176
  Tabs2,
177
177
  tabsListVariants2,
package/dist/prototype.js CHANGED
@@ -2051,7 +2051,7 @@ var program = new Command;
2051
2051
  // package.json
2052
2052
  var package_default = {
2053
2053
  name: "@alexgorbatchev/shadcn",
2054
- version: "0.0.51",
2054
+ version: "0.0.53",
2055
2055
  description: "Sharp, monospace React components with compact and comfortable densities.",
2056
2056
  license: "MIT",
2057
2057
  repository: {
@@ -44,6 +44,7 @@ GeoMap
44
44
  tileUrl: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256'%3E%3Crect width='256' height='256' fill='lightgray'/%3E%3C/svg%3E",
45
45
  attribution: "Deterministic map fixture",
46
46
  onSelect: fn(),
47
+ onViewportChange: fn(),
47
48
  }
48
49
  ```
49
50
 
@@ -146,3 +147,17 @@ Storybook CSF excerpts. Default args and render apply unless overridden. Local h
146
147
  render: (args) => <ControlledSelectionMap {...args}/>
147
148
  }
148
149
  ```
150
+
151
+ ### Radius
152
+
153
+ ```tsx
154
+ {
155
+ args: {
156
+ places: [{ id: "origin", lat: 51.5, lng: -0.12, label: "Origin" }],
157
+ routes: [],
158
+ showPlaces: false,
159
+ variant: "embedded",
160
+ },
161
+ render: (args) => <ChangingRadiusMap {...args}/>
162
+ }
163
+ ```
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alexgorbatchev/shadcn",
3
- "version": "0.0.51",
3
+ "version": "0.0.53",
4
4
  "description": "Sharp, monospace React components with compact and comfortable densities.",
5
5
  "license": "MIT",
6
6
  "repository": {