More complete documentation

[openSourcerer9000]

Ok, this codesandbox got me up and running, since the Get Started sandbox is currently broken. Great work, this seems like a good start so far.

It looks like the heading of each of those examples is an available component, and then it gives the names of the props that can be passed in. However, there's no documentation on what is legal to pass through those props and what they do. For example, this one just says options, with no further explanation. The Show Code code doesn't seem to correspond with the examples, and doesn't contain the component shown. I would recommend just showing the component in action in context of the map, we don't necessarily need to see the MUI breakpoints etc.

[openSourcerer9000]

More specifically, for example, how does one import and use MlLayerSwitcher? I assume this is a legend control component?

import {
  MlLayerSwitcher,
  MapLibreMap,
  MlNavigationTools,
  MlGeoJsonLayer,
  useMap,
} from "@mapcomponents/react-maplibre";

index.js:1 ./src/App.js
Attempted import error: 'MlLayerSwitcher' is not exported from '@mapcomponents/react-maplibre'.

[cioddi]

Hi @openSourcerer9000 thank you for your messages.
Sadly we got some problems with our codesandbox templates since maplibre-gl switched to Typescript it is no longer possible to install npm modules that use maplibre-gl as a dependency. We are looking for a fix, it appears to be something related to the way maplibre-gl has integrated the service-worker code within the npm module.

The MlLayerswitcher component is not yet exported by the module since it is still experimental.

I recommend our storybook for browsing through existing components (I see you are using that already) https://mapcomponents.github.io/react-map-components-maplibre

And using our create-react-app template to get started with developing a project.

npx create-react-app@latest app_name --template=@mapcomponents/cra-template

I will give a more detailed answer in the other issue you opened.
We are working on the documentation. The important components have a quite complete documentation of attributes (e.g. https://mapcomponents.github.io/react-map-components-maplibre/?path=/docs/mapcomponents-mlgeojsonlayer--linestring). Other components are poorly or not documented yet, usually ones that are still in a proof of concept stage. We are aiming to overhaul the documentation especially regarding an easy entry soon.

[chris-aeviator]

The storybooks don't provide much help - they show settings without showing the underlying code.

[cioddi]

The storybook and catalogue are still work in progress.

The storybook is currently providing documentation for component attributes on the docs tab.
Though the code samples shown in the docs tab are sometimes unrelated since they sometimes show the decorator code for component stories instead of the actual story code. Also the documentation of important hook such as useMap is missing in there. We'll fix that and get back to you.

[cioddi]

We have improved the documentation a lot, although it is not complete yet.
The code examples in the storybook docs tab have been improved on most components to show more relevant code.

I will close this issue for now, still we are determined to constantly improve the documentation and make the project as accessible as possible.