GeometryCollectionInput

Form input for drawing a GeoJSON.GeometryCollection. All drawn shapes are stored together as a single GeometryCollection value.

Installation

pnpm dlx shadcn@latest add @shadmin/geometry-collection-input

Usage

import { GeometryCollectionInput } from "@/components/leaflet";
 
<Create>
  <SimpleForm>
    <GeometryCollectionInput
      source="geom"
      label="Mixed shapes"
      defaultCenter={[48.85, 2.35]}
    />
  </SimpleForm>
</Create>;

The Geoman toolbar exposes draw buttons for each shape in allowedShapes (defaults to ["Point", "LineString", "Polygon"]). Restrict the list to limit what can be drawn into the collection.

<GeometryCollectionInput
  source="geom"
  allowedShapes={["Polygon"]}
  label="Polygons-only collection"
/>

Props

PropRequiredTypeDefaultDescription
sourceRequiredstring-RHF field to write the geometry to.
allowedShapesOptionalShapeKind[]["Point","LineString","Polygon"]Draw-button filter — only listed shapes appear in the toolbar.
zoomOptionalnumber13Initial zoom level.
defaultCenterOptional[number, number][0, 0]Initial map center [lat, lng].
heightOptionalnumber | string300Height of the map container.
tileUrlOptionalstringOpenStreetMap tile URLTile layer URL template.
attributionOptionalstringOSM attributionTile attribution string.
pathOptionsOptionalL.PathOptions-Vector styling for all drawn shapes.
snappableOptionalbooleantrueEnable Geoman snap-to-vertex.
snapDistanceOptionalnumber20Snap radius in pixels.
labelOptionalReactNode-Label rendered above the map.
helperTextOptionalReactNode-Helper text rendered below the map.
disabledOptionalbooleanfalseDisable editing.
validateOptional(v) => string | undefined-RHF-compatible validator(s).