Giter VIP home page Giter VIP logo

google-maps-input's Introduction

@sanity/google-maps-input

This is a Sanity Studio v3 plugin. For the v2 version, please refer to the v2-branch.

What is it?

Plugin for Sanity Studio providing input handlers for geo-related input types using Google Maps.

This plugin will replace the default geopoint input component.

Google maps input

Know issues in Studio V3

  • Diff-preview is not implemented.

These will be re-added well before Studio V3 GA.

Installation

In your studio folder, run:

npm install --save @sanity/google-maps-input

or

yarn add @sanity/google-maps-input

Usage

Add it as a plugin in sanity.config.ts (or .js), with a valid Google Maps API key:

import {googleMapsInput} from '@sanity/google-maps-input'

export default defineConfig({
  // ...
  plugins: [
    googleMapsInput({
      apiKey: 'my-api-key',
    }),
  ],
})

Ensure that the key has access to:

  • Google Maps JavaScript API
  • Google Places API Web Service
  • Google Static Maps API

And that the key allows web-access from the Studio URL(s) you are using the plugin in.

Note: This plugin will replace the default geopoint input component.

Stuck? Get help

Slack Community Button

Join Sanity’s developer community or ping us on twitter.

License

MIT-licensed. See LICENSE.

Develop & test

This plugin uses @sanity/plugin-kit with default configuration for build & watch scripts.

See Testing a plugin in Sanity Studio on how to run this plugin with hotreload in the studio.

Release new version

Run "CI & Release" workflow. Make sure to select the main branch and check "Release new version".

google-maps-input's People

Contributors

bjoerge avatar pierrenel avatar renovate[bot] avatar semantic-release-bot avatar simeongriggs avatar snorrees avatar stipsan avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

google-maps-input's Issues

Link to address input

Is there a way to link the map to an input where the user can type an address and have it pinpointed on the map?

Thanks!

The structure tool crashed when running the build preview

Describe the bug

When running the preview, I get an error: Cannot read properties of undefined (reading 'color')

To Reproduce

Steps to reproduce the behavior:

  1. build sanity
  2. run preview

Screenshot
image

Which versions of Sanity are you using?

@sanity/cli 3.30.0 (up to date)
@sanity/google-maps-input 3.0.2 (up to date)
@sanity/vision 3.30.0 (up to date)
sanity 3.30.0 (up to date)

Which versions of Node.js / npm are you running?

10.2.3
v18.19.0

Google API address data support

It would be great to support google address locations API for this.

We are developing a 'dealer' locator tool for one of our clients and they need to input their dealer's address and ensure the address data is returned in the map pin on google maps.

so a postcode/address search would be required in the sanity studio, and the data stored would need to be a full google maps location/address object from the API.

Define default location

Is your feature request related to a problem? Please describe.
When adding new coordinates, the maps input always have the default position in Oslo, Norway.

Describe the solution you'd like
While I understand why Oslo :-) it would be nice to have an option to set a different default location. I'm from Croatia and every time I add a location I have to scroll way down before even beginning to find my location. It's not a huge problem, but it isn't a very pleasant experience.

Cheers.

Dependency Dashboard

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.


Using a curated preset maintained by


Sanity: The Composable Content Cloud

Pending Approval

These branches will be created by Renovate only once you click their checkbox below.

  • chore(deps): update commitlint monorepo to v19 (major) (@commitlint/cli, @commitlint/config-conventional)
  • chore(deps): update dependency semantic-release to v23
  • πŸ” Create all pending approval PRs at once πŸ”

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

Detected dependencies

github-actions
.github/workflows/main.yml
  • actions/checkout v4
  • actions/setup-node v4
  • actions/checkout v4
  • actions/setup-node v4
  • actions/checkout v4
  • actions/setup-node v3@8c91899e586c5b171469028077307d293428b516
npm
package.json
  • @sanity/icons ^2.0.0
  • @sanity/incompatible-plugin ^1.0.4
  • @sanity/ui ^1.0.0
  • lodash ^4.17.21
  • @commitlint/cli ^17.7.1
  • @commitlint/config-conventional ^17.7.0
  • @sanity/pkg-utils ^2.4.8
  • @sanity/plugin-kit ^3.1.10
  • @sanity/semantic-release-preset ^4.1.4
  • @types/google.maps ^3.54.5
  • @types/react ^18.2.21
  • @types/styled-components ^5.1.29
  • @typescript-eslint/eslint-plugin ^6.5.0
  • @typescript-eslint/parser ^6.5.0
  • eslint ^8.48.0
  • eslint-config-prettier ^9.0.0
  • eslint-config-sanity ^6.0.0
  • eslint-plugin-prettier ^5.0.0
  • eslint-plugin-react ^7.33.2
  • eslint-plugin-react-hooks ^4.6.0
  • npm-run-all ^4.1.5
  • prettier ^3.0.3
  • prettier-plugin-packagejson ^2.4.5
  • react ^18.2.0
  • react-dom ^18.2.0
  • react-is ^18.2.0
  • rimraf ^5.0.1
  • sanity ^3.16.1
  • semantic-release ^21.1.1
  • styled-components ^5.3.11
  • typescript ^5.2.2
  • react ^18
  • sanity ^3.14
  • node >=14

  • Check this box to trigger a request for Renovate to run again on this repository

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.