All skills
mapbox avatar

/mapbox-search-integration

@65bab68 official
by mapboxmapbox/mapbox-agent-skills80 stars
17

Complete workflow for implementing Mapbox search in applications - from discovery questions to production-ready integration with best practices

Use this Skill: https://skilld.dev/gh/mapbox/mapbox-agent-skills/mapbox-search-integration

This session only. Nothing lands on disk.

referencesnodejs-search.md

≈546 tokens on demand. Your agent reads this file only when SKILL.md points to it.

Node.js: Mapbox Search JS Core

Option 1: Search JS Core (Recommended)

When to use: Server-side search, backend API, serverless functions

Installation:

npm install @mapbox/search-js-core

Complete implementation:

import { SearchSession } from '@mapbox/search-js-core';

// Initialize search session (handles session tokens automatically)
const search = new SearchSession({
  accessToken: process.env.MAPBOX_TOKEN
});

// Express.js API endpoint example
app.get('/api/search', async (req, res) => {
  const { query, proximity, country } = req.query;

  try {
    // Get suggestions (Search JS Core handles session management)
    const response = await search.suggest(query, {
      proximity: proximity ? proximity.split(',').map(Number) : undefined,
      country: country,
      limit: 10
    });

    res.json(response.suggestions);
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

// Retrieve full details for a selected result
app.get('/api/search/:id', async (req, res) => {
  try {
    const result = await search.retrieve(req.params.id);
    res.json(result.features[0]);
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

Key benefits:

  • ✅ Search JS Core handles session tokens automatically
  • ✅ Perfect for serverless (Vercel, Netlify, AWS Lambda)
  • ✅ Same API as browser Search JS Core
  • ✅ No manual debouncing needed (handle at API gateway level)

Option 2: Direct API Integration (Advanced)

When to use: Very specific requirements, need features not in Search JS Core

Implementation:

import fetch from 'node-fetch';

async function searchPlaces(query, options = {}) {
  const params = new URLSearchParams({
    q: query,
    access_token: process.env.MAPBOX_TOKEN,
    session_token: generateSessionToken(), // You must manage this
    ...options
  });

  const response = await fetch(`https://api.mapbox.com/search/searchbox/v1/suggest?${params}`);

  return response.json();
}

Important: Only use direct API calls if Search JS Core doesn't meet your needs. You'll need to handle session tokens manually.

Source: SKILL.md on GitHub

No alerts15d5 checks · Risk SAFE
  • Gen Agent Trust Hub15d

    The mapbox-search-integration skill is a professional implementation guide for Mapbox search services. It adheres to security best practices, uses official Mapbox SDKs and APIs, and provides clear guidance on secure credential handling.

  • Socket15d

    No alerts

  • Snyk15d

    Risk: LOW · No issues

  • Runlayer6mo

    1/1 file flagged

  • ZeroLeaks5mo

    Score: 93/100 · 2 sections analyzed

Signed by skilld at 65bab68. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub 8 hours ago.

Activeupdated 6 months ago
  • API
  • React
  • mapbox
  • search
  • geocoding
  • location
  • web
  • ios
  • android
  • autocomplete

README badge

README badge for mapbox/mapbox-agent-skills/mapbox-search-integration

Guides implementation of Mapbox search through discovery questions, product selection, and production-ready integration patterns. Covers Search Box API for interactive address and POI search, Geocoding API for batch geocoding, and platform-specific SDKs for web, React, iOS, and Android.

Generated from the current SKILL.md.

Should I use the Search Box API or Geocoding API?
Use Search Box API for all interactive/user-facing search, including address search, autocomplete, and POI search. Use Geocoding API only for batch server-side geocoding or maintaining an existing Geocoding API integration.
What's the difference between Search JS React, Search JS Web, and Search JS Core?
Search JS React is a React library with built-in UI (easiest for React apps). Search JS Web is a Web Components library with UI for vanilla JS. Search JS Core is a JavaScript wrapper for the API where you build your own UI.
Do I need to implement debouncing and session tokens?
Yes. Debouncing (300ms recommended) reduces API calls during typing, and session tokens are required for proper billing on every suggest/retrieve request in interactive flows.
Which platform SDK should I use?
Use Mapbox Search JS for web apps (with React/Web/Core variants), Search SDK for iOS for native iOS apps, and Search SDK for Android for native Android apps. Avoid direct API calls in favor of SDKs to handle debouncing and session management automatically.
What geographic filtering options are available?
You can use the country parameter for single/multiple countries, bbox parameter for bounding box constraints, and proximity parameter for location-based filtering.

Generated from the current SKILL.md. These answers refresh after source changes.