> For the complete documentation index, see [llms.txt](https://docs.mapbox.com/mapbox-search-js/ja/llms.txt)

# Address Autofill

**Address Autofill** provides a rich UI for address search and autocomplete functionality for address forms in React-based web apps.

This page includes reference documentation for the Address Autofill and Address Confirmation components, hooks, and types in the **Mapbox Search JS React** framework.

For installation instructions and a helpful introduction to using Address Autofill in your React app, see our [React Address Autofill Quickstart Guide](https://docs.mapbox.com/mapbox-search-js/ja/guides/autofill/react).

## Components

### AddressAutofill

`<AddressAutofill>` is a React component that wraps an address [`<input>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/text) element with intelligent, location-aware autocomplete functionality.

To use this element, you must have a [Mapbox access token](https://www.mapbox.com/help/create-api-access-token/).

This component must be a descendant of a [`<form>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form), and the form must have inputs with proper HTML `autocomplete` attributes. If your application works with browser autofill, you may already have this functionality.

-   [The HTML autocomplete attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete)
-   [Autofill](https://web.dev/learn/forms/autofill/)

#### Props

<table class="table table--fixed table--compact" style="width:100%;table-layout:fixed"><colgroup><col width="28%"><col></colgroup><thead><tr class="bg-gray-faint"><th style="border-top-left-radius:4px">Name</th><th style="border-top-right-radius:4px">Description</th></tr></thead><tbody><tr><td><strong>accessToken</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>The <a href="https://docs.mapbox.com/help/glossary/access-token/">Mapbox access token</a> to use for all requests.</span></td></tr><tr><td><strong>options</strong>&nbsp;<span>Partial&lt;<a href="#addressautofilloptions">AddressAutofillOptions</a>&gt;</span>&nbsp;</td><td><span>Options to pass to the underlying <a href="/mapbox-search-js/api/core/autofill/#addressautofillcore">AddressAutofillCore</a> interface.</span></td></tr><tr><td><strong>theme</strong>&nbsp;<span><a href="/mapbox-search-js/api/web/theming/#theme">Theme</a></span>&nbsp;</td><td><span>The <a href="/mapbox-search-js/api/web/theming/#theme">Theme</a> to use for styling the autofill component's suggestions dropdown. <code>theme.cssText</code> selectors may target ( <code>.MapboxSearch</code> , <code>.Label</code> , <code>.Results</code> , <code>.ResultsList</code> , <code>.ResultsAttribution</code> , <code>.Suggestion</code> , <code>.SuggestionIcon</code> , <code>.SuggestionText</code> , <code>.SuggestionName</code> , <code>.SuggestionDesc</code> ). This theme is not applied to the input element — that's your own <code>&lt;input&gt;</code> — and it does not reach the address confirmation dialog shown by <code>confirmOnBrowserAutofill</code> ; theme that separately via its own <code>theme</code> option (see <a href="#addressconfirmoptions">AddressConfirmOptions</a> ).</span></td></tr><tr><td><strong>popoverOptions</strong>&nbsp;<span>Partial&lt;<a href="#popoveroptions">PopoverOptions</a>&gt;</span>&nbsp;</td><td><span>The <a href="#popoveroptions">PopoverOptions</a> to define popover positioning.</span></td></tr><tr><td><strong>confirmOnBrowserAutofill</strong>&nbsp;<span>(<a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a> | <a href="#addressconfirmoptions">AddressConfirmOptions</a>)</span>&nbsp;</td><td><span>If true, forms autofilled by the browser will prompt the <a href="/mapbox-search-js/api/web/autofill/#confirmaddress">confirmAddress</a> dialog for user confirmation. An <a href="#addressconfirmoptions">AddressConfirmOptions</a> object can also be passed to prompt <a href="/mapbox-search-js/api/web/autofill/#confirmaddress">confirmAddress</a> with custom options. Defaults to false.</span></td></tr><tr><td><strong>browserAutofillEnabled</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span>&nbsp;</td><td><span>Enables the browser's autocomplete popup to show during the first two typed characters while Mapbox results are suppressed. Defaults to false.<p><strong>Note:</strong> Due to varying specifications, efforts to suppress browser autocomplete behavior may not work on all browsers.</p></span></td></tr><tr><td><strong>children</strong>&nbsp;<span>React.ReactChild</span>&nbsp;</td><td><span>Children to render inside the autofill component. This <strong>must</strong> include an <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/text"><code>&lt;input&gt;</code></a> element with either autocomplete type <code>"street-address"</code> or <code>"address-line1"</code> .</span></td></tr><tr><td><strong>onChange</strong>&nbsp;<span>function (value: <a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>): void</span>&nbsp;</td><td><span>Callback for when the <code>&lt;input&gt;</code> value changes.</span></td></tr><tr><td><strong>onSuggest</strong>&nbsp;<span>function (res: <a href="#addressautofillsuggestionresponse">AddressAutofillSuggestionResponse</a>): void</span>&nbsp;</td><td><span>Fired when the user is typing in the input and provides a list of suggestions. The underlying response from <a href="/mapbox-search-js/api/core/autofill/#addressautofillcore">AddressAutofillCore</a> is passed.</span></td></tr><tr><td><strong>onSuggestError</strong>&nbsp;<span>function (error: <a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Error">Error</a>): void</span>&nbsp;</td><td><span>Fired when <a href="/mapbox-search-js/api/core/autofill/#addressautofillcore">AddressAutofillCore</a> has errored providing a list of suggestions. The underlying error is passed.</span></td></tr><tr><td><strong>onRetrieve</strong>&nbsp;<span>function (res: <a href="#addressautofillretrieveresponse">AddressAutofillRetrieveResponse</a>): void</span>&nbsp;</td><td><span>Fired when the user has selected a suggestion, before the form is autofilled. The underlying response from <a href="/mapbox-search-js/api/core/autofill/#addressautofillcore">AddressAutofillCore</a> is passed.</span></td></tr><tr><td><strong>interceptSearch</strong>&nbsp;<span>function (value: <a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>): <a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>A callback providing the opportunity to validate and/or manipulate the input text before it triggers a search, for example by using a regular expression. If a truthy string value is returned, it will be passed into the underlying search API. If <code>null</code> , <code>undefined</code> or empty string is returned, no search request will be performed.</span></td></tr></tbody></table>

#### Import[​](#import)

```javascript
import { AddressAutofill } from '@mapbox/search-js-react'
```

#### Example

```js
export function Component() {
  const [value, setValue] = React.useState('');

  const handleChange = (e) => {
    setValue(e.target.value);
  };

  return (
    <form>
      <AddressAutofill accessToken={'YOUR_MAPBOX_ACCESS_TOKEN'}>
        <input
          autoComplete="shipping address-line1"
          value={value}
          onChange={handleChange}
        />
      </AddressAutofill>
    </form>
  );
}
```

このsection on AddressAutofillは役に立ちましたか？[Yes](null)[No](null)

## Hooks

### useAddressAutofillCore

A React hook that returns a [AddressAutofillCore](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#addressautofillcore) instance.

#### Parameters

| Name | Description |
| --- | --- |
| **options** [AddressAutofillOptions](#addressautofilloptions)  |  |
| **options.accessToken** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | Your Mapbox access token. |

#### Returns

[AddressAutofillCore](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#addressautofillcore)

#### Import[​](#import)

```javascript
import { useAddressAutofillCore } from '@mapbox/search-js-react'
```

#### Example

```js
import { useAddressAutofillCore } from '../src';
const autofill = useAddressAutofillCore({ accessToken: 'YOUR_MAPBOX_ACCESS_TOKEN' });
const response = await autofill.suggest('1600 pennsylvania ave nw', {
  sessionToken: 'test-123'
});
console.log(response);
// { suggestions: [...], attribution: '...' };
```

#### Related

-   [AddressAutofillCore](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#addressautofillcore)
-   [AddressAutofillCore](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#addressautofillcore)

このsection on useAddressAutofillCoreは役に立ちましたか？[Yes](null)[No](null)

### useConfirmAddress

A React hook that returns a form ref and a function to show the address confirmation modal

#### Parameters

| Name | Description |
| --- | --- |
| **optionsArg** [AddressConfirmOptions](#addressconfirmoptions) (default `{}`) |  |

#### Returns

UseConfirmAddressObject

#### Import[​](#import)

```javascript
import { useConfirmAddress } from '@mapbox/search-js-react'
```

#### Example

```js
import { useConfirmAddress } from '@mapbox/search-js-react';

export function Autofill(): React.ReactElement {
  const { formRef, showConfirm } = useConfirmAddress({
    footer: 'My custom footer'
  });

  const handleSubmit = React.useCallback(async () => {
    const result = await showConfirm();
     console.log(result);
  }, [showConfirm]);

  return (
    <div>
      <form
        ref={formRef}
        style={{ display: 'flex', flexDirection: 'column', marginTop: 30 }}
      >
        <AddressAutofill
          ...
        >
    </div>
  );
}
```

#### Related

-   [confirmAddress](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/web/autofill/#confirmaddress)

このsection on useConfirmAddressは役に立ちましたか？[Yes](null)[No](null)

## Types

### AddressAutofillRefType

Methods available on a `ref` when attached to the [AddressAutofill](#addressautofill) component.

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

| Name | Description |
| --- | --- |
| **focus** any  |  |

このsection on AddressAutofillRefTypeは役に立ちましたか？[Yes](null)[No](null)

### AddressAutofillOptions

Options used by [AddressAutofillCore](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#addressautofillcore) and [useAddressAutofillCore](#useaddressautofillcore) to control the location, language, country, and limit of results. All properties are optional.

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

| Name | Description |
| --- | --- |
| **bbox** ([string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [LngLatBoundsLike](#lnglatboundslike))  | Limit results to only those contained within the supplied bounding box. |
| **country** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | An [ISO 3166 alpha-2 country code](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) to be returned. If not specified, results will not be filtered by country. |
| **language** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | The [IETF language tag](https://en.wikipedia.org/wiki/IETF_language_tag) to be returned. If not specified, `en` will be used. |
| **limit** ([string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number))  | The number of results to return, up to `10` . |
| **proximity** ([string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [LngLatLike](#lnglatlike))  | Bias the response to favor results that are closer to this location. Provide a point coordinate provided as a [LngLatLike](#lnglatlike) , or use the string `ip` to use the requester's IP address. |
| **streets** ([string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String) \| [boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean))  | If enabled, street results may be returned in addition to addresses. Defaults to `true` . |

このsection on AddressAutofillOptionsは役に立ちましたか？[Yes](null)[No](null)

### AddressConfirmOptions

Object defining options for Address Autofill API, UI, form parsing, and address comparison

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

| Name | Description |
| --- | --- |
| **accessToken** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | Mapbox access token used for the Address Autofill and Static Image APIs |
| **footer** ([boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String))  | Custom footer text appearing at the bottom of the confirmation modal dialog. If `true` or left undefined, the default footer text will be used. If `false` , the footer will not be shown. |
| **minimap** ([boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| [ConfirmationMinimapOptions](#confirmationminimapoptions))  | If true, a static minimap showing the suggested address location will be displayed in the modal dialog. If an object, a minimap will be displayed with the specified styling and theming configuration. Defaults to false. |
| **options** Partial<[ValidationOptions](#validationoptions)>  | Address Autofill API configuration options [ValidationOptions](#validationoptions) |
| **sections** [Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)<[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)>  | An array of section names used within form element `autocomplete` attributes to identify and group one address section from another, e.g. "section-shipping" or "section-billing". These are often used when a single contains multiple logical sections. If left undefined, all discoverable sections will be processed. |
| **skipConfirmModal** function (feature: [AddressAutofillFeatureSuggestion](#addressautofillfeaturesuggestion)): [boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)  | A callback used to pre-confirm an address and skip the UI modal. The feature argument contains all address components, as well as an [MatchCode](#matchcode) object, which are used to express the confidence of an address match. The callback must return a boolean, with `true` indicating that the address has been pre-confirmed, and the UI modal will be skipped and will not be presented to the end-user. If left undefined, this defaults to skipping showing the modal when the validated feature's match code returns an "exact" match. |
| **theme** [Theme](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/web/theming/#theme)  | CSS variables and icons for the confirmation dialog. `theme.cssText` selectors may target: `.Modal` , `.ModalHeader` , `.ModalHeaderTitle` , `.ModalFooter` , `.Icon` , `.IconQuestion` , `.IconClose` , `.ModalAddress` , `.ModalAddressApprove` , `.ModalMap` , `.Minimap` , `.ModalDescription` , `.ModalSubheader` , `.Button` , `.ButtonPrimary` , `.ButtonSecondary` , `.ButtonApprove` , `.ButtonReject` . To theme the embedded minimap itself, use the `minimap` option instead — see [ConfirmationMinimapOptions](#confirmationminimapoptions) . |

このsection on AddressConfirmOptionsは役に立ちましたか？[Yes](null)[No](null)

### PopoverOptions

Options controlling the display of the Popover used in [AddressAutofill](#addressautofill), [MapboxSearchBox](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/web/search/#mapboxsearchbox), and [MapboxGeocoder](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/web/geocoding/#mapboxgeocoder).

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

| Name | Description |
| --- | --- |
| **flip** [boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)  | If true, the popover will flip to the opposite side of the reference element to try to keep it in view when scrolling out of frame. Defaults to false. |
| **offset** [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)  | The distance gap between the popover and the reference element. Defaults to 5px. |
| **placement** (`"top-start"` \| `"bottom-start"`)  | Positions the popover above or below the reference element. Defaults to 'bottom-start'. |

このsection on PopoverOptionsは役に立ちましたか？[Yes](null)[No](null)

### AddressAutofillSuggestion

An `AddressAutofillSuggestion` object represents a suggestion result from the Mapbox Address Autofill API.

Suggestion objects are "part one" of the two-step interactive autofill experience. Suggestion objects do not include geographic coordinates.

To get the coordinates of the result, use [AddressAutofillCore#retrieve](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#addressautofillcore#retrieve).

For tracking purposes, it is useful for any follow-up requests based on this suggestion to include same [SessionToken](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/search_session/#sessiontoken) as the original request.

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

<table class="table table--fixed table--compact" style="width:100%;table-layout:fixed"><colgroup><col width="28%"><col></colgroup><thead><tr class="bg-gray-faint"><th style="border-top-left-radius:4px">Name</th><th style="border-top-right-radius:4px">Description</th></tr></thead><tbody><tr><td><strong>accuracy</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>A point accuracy metric for the returned address feature. Can be one of <code>rooftop</code> , <code>parcel</code> , <code>point</code> , <code>interpolated</code> , <code>intersection</code> , <code>street</code> .</span></td></tr><tr><td><strong>action</strong>&nbsp;<span>{id: <a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>}</span>&nbsp;</td><td><span>Action block of the suggestion result. contains id to execute retrieve</span></td></tr><tr><td><strong>address_level1</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Address level 1 from the <a href="https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill">WHATWG Autocomplete Specification</a></span></td></tr><tr><td><strong>address_level2</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Address level 2 from the <a href="https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill">WHATWG Autocomplete Specification</a></span></td></tr><tr><td><strong>address_level3</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Address level 3 from the <a href="https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill">WHATWG Autocomplete Specification</a></span></td></tr><tr><td><strong>address_line1</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Address line 1 from the <a href="https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill">WHATWG Autocomplete Specification</a></span></td></tr><tr><td><strong>address_line2</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Address line 2 from the <a href="https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill">WHATWG Autocomplete Specification</a></span></td></tr><tr><td><strong>address_line3</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Address line 3 from the <a href="https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill">WHATWG Autocomplete Specification</a></span></td></tr><tr><td><strong>context</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a>&lt;<a href="#addressautofillfeaturecontextcomponent">AddressAutofillFeatureContextComponent</a>&gt;</span>&nbsp;</td><td><span>An array of context objects representing the hierarchy of encompassing parent features for a given feature.</span></td></tr><tr><td><strong>country</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Long form country name, for example: "United States"</span></td></tr><tr><td><strong>country_code</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>The short form country name, for example: "us". This follows the <a href="https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2">ISO 3166 alpha-2 country code</a> specification.</span></td></tr><tr><td><strong>description</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Additional details, such as city and state for addresses.</span></td></tr><tr><td><strong>feature_name</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>The name of the feature.</span></td></tr><tr><td><strong>full_address</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>The full address of the suggestion.</span></td></tr><tr><td><strong>language</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>The <a href="https://en.wikipedia.org/wiki/IETF_language_tag">IETF language tag</a> of the feature.</span></td></tr><tr><td><strong>maki</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>The name of the <a href="https://labs.mapbox.com/maki-icons/">Maki</a> icon associated with the feature.</span></td></tr><tr><td><strong>mapbox_id</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Feature id. The <code>mapbox_id</code> uniquely identifies a feature in the Mapbox search database.</span></td></tr><tr><td><strong>match_code</strong>&nbsp;<span><a href="#matchcode">MatchCode</a></span>&nbsp;</td><td><span>An object describing the level of confidence that the given response feature matches the address intended by the request query. Includes boolean flags denoting matches for each address sub-component.</span></td></tr><tr><td><strong>matching_name</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>The feature name, as matched by the search algorithm.</span></td></tr><tr><td><strong>metadata</strong>&nbsp;<span>{iso_3166_1: <a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>}</span>&nbsp;</td><td><span>Address metadata fields of the feature.<p>Includes the short form country name, for example: "us". This follows the <a href="https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2">ISO 3166 alpha-2 country code</a> specification.</p></span></td></tr><tr><td><strong>place_name</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>A string representing the feature in the requested language, if specified, and its full result hierarchy.</span></td></tr><tr><td><strong>place_type</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a>&lt;<a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a>&gt;</span>&nbsp;</td><td><span>An array of strings representing the geographic feature type of the feature. Possible values include "address" and "secondary_address".</span></td></tr><tr><td><strong>postcode</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>Postal code.</span></td></tr></tbody></table>

#### Example

```js
const autofill = new AddressAutofillCore({ accessToken: 'pk.my-mapbox-access-token' });

const sessionToken = new SessionToken();
const result = await search.autofill('Washington D.C.', { sessionToken });
if (result.suggestions.length === 0) return;

const suggestion = result.suggestions[0];
const { features } = await autofill.retrieve(suggestion, { sessionToken });
doSomethingWithCoordinates(features);
```

このsection on AddressAutofillSuggestionは役に立ちましたか？[Yes](null)[No](null)

### AddressAutofillFeatureSuggestion

An `AddressAutofillFeatureSuggestion` object represents [GeoJSON](https://docs.mapbox.com/help/glossary/geojson/) suggestion results from the Mapbox Address Autofill API.

As per the Mapbox Address Autofill API, this will always be [Point](https://geojson.org/geojson-spec.html#point).

#### Type

any

#### Example

```js
const featureSuggestion = {
  type: 'Feature',
  geometry: {
    type: 'Point',
    coordinates: [0,0]
  },
  properties: {
    feature_name: 'Washington D.C.',
  }
};
```

#### Static Members

##### bbox

A bounding box for the feature. This may be significantly larger than the geometry.

###### Type

[LngLatBoundsLike](#lnglatboundslike)

このsection on AddressAutofillFeatureSuggestionは役に立ちましたか？[Yes](null)[No](null)

### AddressAutofillSuggestionResponse

Response object returned when calling the `suggest` method of [AddressAutofillCore](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#addressautofillcore)

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

| Name | Description |
| --- | --- |
| **attribution** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | The attribution data for results. |
| **suggestions** [Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)<[AddressAutofillSuggestion](#addressautofillsuggestion)>  | The returned suggestion objects. |

このsection on AddressAutofillSuggestionResponseは役に立ちましたか？[Yes](null)[No](null)

### AddressAutofillRetrieveResponse

Response object returned when calling the `retrieve` method of [AddressAutofillCore](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#addressautofillcore)

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

| Name | Description |
| --- | --- |
| **attribution** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | The attribution data for results. |
| **features** [Array](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array)<[AddressAutofillFeatureSuggestion](#addressautofillfeaturesuggestion)>  | The returned feature objects. |

このsection on AddressAutofillRetrieveResponseは役に立ちましたか？[Yes](null)[No](null)

### AddressAutofillFeatureContextComponent

Object representing one level of hierarcy among encompassing parent features for a given [AddressAutofillSuggestion](#addressautofillsuggestion).

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

| Name | Description |
| --- | --- |
| **id** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | An identifier prefixed with the component type, for example `country.123` . |
| **mapbox_id** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | The unique Mapbox ID of the context feature. |
| **text** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | A string representing the feature in the requested language, if specified. |
| **wikidata_id** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  | The [Wikidata](https://wikidata.org/) identifier for the returned feature. |

このsection on AddressAutofillFeatureContextComponentは役に立ちましたか？[Yes](null)[No](null)

### LngLatLike

A [LngLat](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/geography/#lnglat) object, an array of two numbers representing longitude and latitude, or an object with `lng` and `lat` or `lon` and `lat` properties.

#### Type

([LngLat](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/geography/#lnglat) \| [[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number), [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)] \| {lng: [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number), lat: [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)} \| {lon: [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number), lat: [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)})

#### Example

```js
const v1 = new LngLat(-122.420679, 37.772537);
const v2 = [-122.420679, 37.772537];
const v3 = {lon: -122.420679, lat: 37.772537};
```

このsection on LngLatLikeは役に立ちましたか？[Yes](null)[No](null)

### LngLatBoundsLike

A [LngLatBounds](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/geography/#lnglatbounds) object, an array of [LngLatLike](#lnglatlike) objects in [sw, ne] order, or an array of numbers in [west, south, east, north] order.

#### Type

([LngLatBounds](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/geography/#lnglatbounds) \| [[LngLatLike](#lnglatlike), [LngLatLike](#lnglatlike)] \| [[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number), [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number), [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number), [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)])

#### Example

```js
const v1 = new LngLatBounds(
  new LngLat(-73.9876, 40.7661),
  new LngLat(-73.9397, 40.8002)
);
const v2 = new LngLatBounds([-73.9876, 40.7661], [-73.9397, 40.8002]);
const v3 = [[-73.9876, 40.7661], [-73.9397, 40.8002]];
```

このsection on LngLatBoundsLikeは役に立ちましたか？[Yes](null)[No](null)

### ConfirmationMinimapOptions

Styling and theming options for a [MapboxAddressMinimap](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/web/minimap/#mapboxaddressminimap) embedded inside a confirmation dialog.

#### Type

Partial<Pick<[MapboxAddressMinimap](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/web/minimap/#mapboxaddressminimap), (`"defaultMapStyle"` \| `"theme"` \| `"mapStyleMode"` \| `"satelliteToggle"`)>>

#### Example

```js
const result = await confirmAddress(form, {
  accessToken: 'abc-123',
  minimap: {
    defaultMapStyle: ['mapbox', 'outdoors-v11'],
    theme: { icons: { marker: MARKER_SVG } },
    mapStyleMode: 'default',
    satelliteToggle: true
  }
});
```

このsection on ConfirmationMinimapOptionsは役に立ちましたか？[Yes](null)[No](null)

### ValidationOptions

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

<table class="table table--fixed table--compact" style="width:100%;table-layout:fixed"><colgroup><col width="28%"><col></colgroup><thead><tr class="bg-gray-faint"><th style="border-top-left-radius:4px">Name</th><th style="border-top-right-radius:4px">Description</th></tr></thead><tbody><tr><td><strong>bbox</strong>&nbsp;<span>(<a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a> | <a href="#lnglatboundslike">LngLatBoundsLike</a>)</span>&nbsp;</td><td><span>Limit results to only those contained within the supplied bounding box.</span></td></tr><tr><td><strong>country</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>An <a href="https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2">ISO 3166 alpha-2 country code</a> to be returned.<p>If not specified, results will not be filtered by country.</p></span></td></tr><tr><td><strong>language</strong>&nbsp;<span><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>&nbsp;</td><td><span>The <a href="https://en.wikipedia.org/wiki/IETF_language_tag">IETF language tag</a> to be returned.<p>If not specified, <code>en</code> will be used.</p></span></td></tr><tr><td><strong>proximity</strong>&nbsp;<span>(<a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String">string</a> | <a href="#lnglatlike">LngLatLike</a>)</span>&nbsp;</td><td><span>Bias the response to favor results that are closer to this location.<p>When both <a href="#validationoptions#proximity">ValidationOptions#proximity</a> and <a href="ValidationOptions#origin">ValidationOptions#origin</a> are specified, <code>origin</code> is interpreted as the target of a route, while <code>proximity</code> indicates the current user location.</p></span></td></tr></tbody></table>

このsection on ValidationOptionsは役に立ちましたか？[Yes](null)[No](null)

### MatchCode

An object describing the level of confidence that the given response feature matches the address intended by the request query.

#### Type

[Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)

#### Properties

| Name | Description |
| --- | --- |
| **address_number** [MatchCodeType](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#matchcodetype)  | An indication of how well the `address_number` component of the feature matches the query. |
| **confidence** [MatchCodeConfidence](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#matchcodeconfidence)  | An overall confidence level for how well the feature matches the query. |
| **country** [MatchCodeType](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#matchcodetype)  | An indication of how well the `country` component of the feature matches the query. |
| **locality** [MatchCodeType](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#matchcodetype)  | An indication of how well the `locality` component of the feature matches the query. |
| **place** [MatchCodeType](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#matchcodetype)  | An indication of how well the `place` component of the feature matches the query. |
| **postcode** [MatchCodeType](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#matchcodetype)  | An indication of how well the `postcode` component of the feature matches the query. |
| **region** [MatchCodeType](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#matchcodetype)  | An indication of how well the `region` component of the feature matches the query. |
| **secondary_address** [MatchCodeType](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#matchcodetype)  | An indication of how well the `secondary_address` component of the feature matches the query. |
| **street** [MatchCodeType](https://docs.mapbox.com/mapbox-search-js/ja/mapbox-search-js/api/core/autofill/#matchcodetype)  | An indication of how well the `street` component of the feature matches the query. |

このsection on MatchCodeは役に立ちましたか？[Yes](null)[No](null)