npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

react-mapfilter

v3.2.5

Published

These components are designed for viewing data in Mapeo. They share a common interface:

Downloads

384

Readme

Mapeo View Components

These components are designed for viewing data in Mapeo. They share a common interface:

Common Props

| Name | Type | Default | Description | | ------------------- | ---------------------------------------------------------------------------------------------- | ------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | observations | Observation[] | [] | Array of Mapeo observations | | onUpdateObservation | func | | Callback fired when an observation has been updatedby the view. Signature: (observation: Observation) => void observation: The updated observation | | presets | Preset[] | [] | Array of Mapeo Presets with an array of Fields instead of Field ids. | | filter | array | | Filter expression used to filter the observations that will be shown. | | getMediaUrl | func | | Function called with an id of an image attachment and a size, should return a valid URL to the image. Signature: (id: string, size: 'thumbnail' | 'preview' | 'original') => string | | getIconUrl | func | | Function called with an id of an icon, should return a valid URL to the icon. Signature: (id: string) => string |

Contents

<MapView />

Displays observations on a map.

MapView Props

| Name | Type | Default | Description | | ------------------ | -------- | --------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | onMapMove | func | | Called with CameraOptions with properties center, zoom, bearing, pitch whenever the map is moved | | initialMapPosition | object | | Initial CameraOptions position for map - an object with properties center, zoom, bearing, pitch. If this is not set then the map will by default zoom to the bounds of the observations. If you are going to unmount and re-mount this component (e.g. within tabs) then you will want to use onMove to store the position in state, and pass it as initialPosition for when the map re-mounts. | | mapStyle | string | 'mapbox://styles/mapbox/outdoors-v10' | A Mapbox Style URL | | mapboxAccessToken | string | | A Mapbox Access Token used to access the style |

MapView instance methods

flyTo({center, zoom}, eventData?)

Changes any combination of center, zoom, bearing, and pitch, animating the transition along a curve that evokes flight. The animation seamlessly incorporates zooming and panning to help the user maintain her bearings even after traversing a great distance, takes the same options as the flyTo method of mapbox-gl-js

fitBounds(bounds, options?, eventData?)

Pans and zooms the map to contain its visible area within the specified geographical bounds. This function will also reset the map's bearing to 0 if bearing is nonzero, takes the same options as the fitBounds method of mapbox-gl-js

<MediaView />

Display a grid of all the media attachments from the observations.

MediaView Props

MediaView does not currently have any additional props beyond the common props above.

<ReportView />

Display observations as a report that can be printed.

ReportView Props

ReportView shares several props with MapView. These props apply to the inset map in the ReportView.

| Name | Type | Default | Description | | ------------------ | -------- | --------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | onMapMove | func | | Called with CameraOptions with properties center, zoom, bearing, pitch whenever the map is moved | | initialMapPosition | object | | Initial CameraOptions position for map - an object with properties center, zoom, bearing, pitch. If this is not set then the map will by default zoom to the bounds of the observations. If you are going to unmount and re-mount this component (e.g. within tabs) then you will want to use onMove to store the position in state, and pass it as initialPosition for when the map re-mounts. | | mapStyle | string | 'mapbox://styles/mapbox/outdoors-v10' | A Mapbox Style URL | | mapboxAccessToken | string | | A Mapbox Access Token used to access the style |