import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Canvas } from '@storybook/addon-docs/blocks';
import * as MapStories from './map.stories';

<Meta of={MapStories} />

<Title />
<Subtitle>A powerful Google Maps integration with support for advanced markers and custom layers.</Subtitle>

<Description />

<Primary />

---

## Variations

<Stories />

---

## AI Best Practices

> [!IMPORTANT]
> - **API Configuration** — Ensure the `apiKey` is provided either via props or the `XerticaProvider` global context.
> - **Explicit Dimensions** — Always set a `height` prop or use a CSS class with a defined height; maps will not render in containers with 0 height.
> - **Coordinate Safety** — Use the `{ lat, lng }` format for all coordinates to ensure compatibility with the underlying Google Maps engine.
