chore(PoiMap): rename PoiGeoJson to PoiMap

packages/visualizations-react/src/components/PoiMap.tsx

@@ -0,0 +1,7 @@
+import { PoiMap as _PoiMap, PoiMapOptions, PoiMapData, Async } from '@opendatasoft/visualizations';
+import { FC } from 'react';
+import wrap from './ReactImpl';
+
+// Explicit name and type are needed for Storybook
+const PoiMap: FC<{ data: Async<PoiMapData>; options: PoiMapOptions }> = wrap(_PoiMap);
+export default PoiMap;

packages/visualizations-react/src/index.tsx

@@ -5,4 +5,4 @@ export { default as KpiCard } from './components/KpiCard';
 export { default as ChoroplethGeoJson } from './components/ChoroplethGeoJson';
 export { default as ChoroplethVectorTiles } from './components/ChoroplethVectorTiles';
 export { default as ChoroplethSvg } from './components/ChoroplethSvg';
-export { default as PoiGeoJson } from './components/PoiGeoJson';
+export { default as PoiMap } from './components/PoiMap';

packages/visualizations-react/stories/Poi/PoiGeoJson.stories.tsx → packages/visualizations-react/stories/Poi/PoiMap.stories.tsx

@@ -3,8 +3,8 @@ import { BBox } from 'geojson';
 import { PoiMapData } from '@opendatasoft/visualizations';
 import { ComponentMeta, ComponentStory } from '@storybook/react';
 
-import { PoiGeoJson } from '../../src';
 import { shapes as data } from './data';
+import { PoiMap } from '../../src';
 
 const BASE_STYLE = 'https://demotiles.maplibre.org/style.json';
 
@@ -21,14 +21,14 @@ const layers : PoiMapData["layers"] = [{
 
 const bbox : BBox = [ -6.855469,41.343825,11.645508,51.371780];
 
-const meta: ComponentMeta<typeof PoiGeoJson> = {
-    title: 'Poi/GeoJson',
-    component: PoiGeoJson,
+const meta: ComponentMeta<typeof PoiMap> = {
+    title: 'Poi/PoiMap',
+    component: PoiMap,
 };
 
 export default meta;
 
-const Template: ComponentStory<typeof PoiGeoJson> = args => (
+const Template: ComponentStory<typeof PoiMap> = args => (
     <div
         style={{
             width: '50%',
@@ -38,14 +38,14 @@ const Template: ComponentStory<typeof PoiGeoJson> = args => (
             border: '1px solid black',
         }}
     >
-        <PoiGeoJson {...args} />
+        <PoiMap {...args} />
     </div>
 );
 
 /**
  * STORY: No layer params
  */
-export const PoiMapNoLayersParams : ComponentStory<typeof PoiGeoJson> = Template.bind({});
+export const PoiMapNoLayersParams : ComponentStory<typeof PoiMap> = Template.bind({});
 const PoiMapNoLayersParamsArgs = {
     data: {},
     options: {style: BASE_STYLE, bbox}
@@ -55,7 +55,7 @@ PoiMapNoLayersParams.args = PoiMapNoLayersParamsArgs;
 /**
  * STORY: No interactive
  */
-export const PoiMapNonInteractive : ComponentStory<typeof PoiGeoJson> = Template.bind({});
+export const PoiMapNonInteractive : ComponentStory<typeof PoiMap> = Template.bind({});
 const PoiMapNonInteractiveArgs = {
     data:  {value:{ layers, sources: { [layers[0].source] : {type: "geojson" as const, data}}}},
     options: {
@@ -69,7 +69,7 @@ PoiMapNonInteractive.args = PoiMapNonInteractiveArgs;
 /**
  * STORY: With match expression
  */
-export const PoiMapMatchExpression : ComponentStory<typeof PoiGeoJson> = Template.bind({});
+export const PoiMapMatchExpression : ComponentStory<typeof PoiMap> = Template.bind({});
 const PoiMapMatchExpressionArgs = {
     data: {
         value: {

packages/visualizations/src/components/MapPoi/MapRender.svelte

@@ -5,7 +5,7 @@
     import type { LngLatBoundsLike, MapOptions, StyleSpecification } from 'maplibre-gl';
     import { onDestroy, onMount } from 'svelte';
 
-    import MapPOI from './Map';
+    import Map from './Map';
 
     // Base style, sources and layers
     export let style: MapOptions['style'];
@@ -18,7 +18,7 @@
     export let interactive: boolean;
 
     let container: HTMLElement;
-    const map = new MapPOI();
+    const map = new Map();
 
     $: map.toggleInteractivity(interactive ? 'enable' : 'disable');
     $: map.setBbox(bbox);

packages/visualizations/src/components/MapPoi/index.ts

@@ -1,11 +1,11 @@
 import type { PoiMapData, PoiMapOptions } from './types';
-import PoiGeoJsonImpl from './PoiGeoJson.svelte';
+import MapImpl from './Map.svelte';
 import SvelteImpl from '../SvelteImpl';
 
 import 'maplibre-gl/dist/maplibre-gl.css';
 
-export default class PoiGeoJson extends SvelteImpl<PoiMapData, PoiMapOptions> {
-    protected getSvelteComponentClass(): typeof PoiGeoJsonImpl {
-        return PoiGeoJsonImpl;
+export default class Map extends SvelteImpl<PoiMapData, PoiMapOptions> {
+    protected getSvelteComponentClass(): typeof MapImpl {
+        return MapImpl;
     }
 }

packages/visualizations/src/index.ts

@@ -3,7 +3,7 @@ export { default as MarkdownText } from './components/MarkdownText';
 export { default as KpiCard } from './components/KpiCard';
 export { ChoroplethGeoJson, ChoroplethVectorTiles } from './components/Map/WebGl';
 export { default as ChoroplethSvg } from './components/Map/Svg';
-export { default as PoiGeoJson } from './components/MapPoi';
+export { default as PoiMap } from './components/MapPoi';
 
 export * from './types';
 export * from './components/types';