getodk · latin-panda · Oct 16, 2025 · Oct 15, 2025 · Oct 15, 2025 · Oct 15, 2025
diff --git a/.changeset/quick-bobcats-pull.md b/.changeset/quick-bobcats-pull.md
@@ -0,0 +1,5 @@
+---
+'@getodk/web-forms': patch
+---
+
+Adds map tile attribution
diff --git a/...-cases/all-question-types.test.ts-snapshots/select-map-full-screen-chromium.png b/...-cases/all-question-types.test.ts-snapshots/select-map-full-screen-chromium.png
diff --git a/...t-cases/all-question-types.test.ts-snapshots/select-map-full-screen-firefox.png b/...t-cases/all-question-types.test.ts-snapshots/select-map-full-screen-firefox.png
diff --git a/...st-cases/all-question-types.test.ts-snapshots/select-map-full-screen-webkit.png b/...st-cases/all-question-types.test.ts-snapshots/select-map-full-screen-webkit.png
diff --git a/...ases/all-question-types.test.ts-snapshots/select-map-initial-state-chromium.png b/...ases/all-question-types.test.ts-snapshots/select-map-initial-state-chromium.png
diff --git a/...cases/all-question-types.test.ts-snapshots/select-map-initial-state-firefox.png b/...cases/all-question-types.test.ts-snapshots/select-map-initial-state-firefox.png
diff --git a/...-cases/all-question-types.test.ts-snapshots/select-map-initial-state-webkit.png b/...-cases/all-question-types.test.ts-snapshots/select-map-initial-state-webkit.png
diff --git a/...test-cases/all-question-types.test.ts-snapshots/select-map-panning-chromium.png b/...test-cases/all-question-types.test.ts-snapshots/select-map-panning-chromium.png
diff --git a/.../test-cases/all-question-types.test.ts-snapshots/select-map-panning-firefox.png b/.../test-cases/all-question-types.test.ts-snapshots/select-map-panning-firefox.png
diff --git a/...e/test-cases/all-question-types.test.ts-snapshots/select-map-panning-webkit.png b/...e/test-cases/all-question-types.test.ts-snapshots/select-map-panning-webkit.png
diff --git a/...-cases/all-question-types.test.ts-snapshots/select-map-point-saved-chromium.png b/...-cases/all-question-types.test.ts-snapshots/select-map-point-saved-chromium.png
diff --git a/...t-cases/all-question-types.test.ts-snapshots/select-map-point-saved-firefox.png b/...t-cases/all-question-types.test.ts-snapshots/select-map-point-saved-firefox.png
diff --git a/...st-cases/all-question-types.test.ts-snapshots/select-map-point-saved-webkit.png b/...st-cases/all-question-types.test.ts-snapshots/select-map-point-saved-webkit.png
diff --git a/...ses/all-question-types.test.ts-snapshots/select-map-point-selected-chromium.png b/...ses/all-question-types.test.ts-snapshots/select-map-point-selected-chromium.png
diff --git a/...ases/all-question-types.test.ts-snapshots/select-map-point-selected-firefox.png b/...ases/all-question-types.test.ts-snapshots/select-map-point-selected-firefox.png
diff --git a/...cases/all-question-types.test.ts-snapshots/select-map-point-selected-webkit.png b/...cases/all-question-types.test.ts-snapshots/select-map-point-selected-webkit.png
diff --git a/...-question-types.test.ts-snapshots/select-map-removed-saved-feature-chromium.png b/...-question-types.test.ts-snapshots/select-map-removed-saved-feature-chromium.png
diff --git a/...l-question-types.test.ts-snapshots/select-map-removed-saved-feature-firefox.png b/...l-question-types.test.ts-snapshots/select-map-removed-saved-feature-firefox.png
diff --git a/...ll-question-types.test.ts-snapshots/select-map-removed-saved-feature-webkit.png b/...ll-question-types.test.ts-snapshots/select-map-removed-saved-feature-webkit.png
diff --git a/...cases/all-question-types.test.ts-snapshots/select-map-view-details-chromium.png b/...cases/all-question-types.test.ts-snapshots/select-map-view-details-chromium.png
diff --git a/...-cases/all-question-types.test.ts-snapshots/select-map-view-details-firefox.png b/...-cases/all-question-types.test.ts-snapshots/select-map-view-details-firefox.png
diff --git a/...t-cases/all-question-types.test.ts-snapshots/select-map-view-details-webkit.png b/...t-cases/all-question-types.test.ts-snapshots/select-map-view-details-webkit.png
diff --git a/...-question-types.test.ts-snapshots/select-map-zoom-current-location-chromium.png b/...-question-types.test.ts-snapshots/select-map-zoom-current-location-chromium.png
diff --git a/...l-question-types.test.ts-snapshots/select-map-zoom-current-location-firefox.png b/...l-question-types.test.ts-snapshots/select-map-zoom-current-location-firefox.png
diff --git a/...ll-question-types.test.ts-snapshots/select-map-zoom-current-location-webkit.png b/...ll-question-types.test.ts-snapshots/select-map-zoom-current-location-webkit.png
diff --git a/...test-cases/all-question-types.test.ts-snapshots/select-map-zoom-in-chromium.png b/...test-cases/all-question-types.test.ts-snapshots/select-map-zoom-in-chromium.png
diff --git a/.../test-cases/all-question-types.test.ts-snapshots/select-map-zoom-in-firefox.png b/.../test-cases/all-question-types.test.ts-snapshots/select-map-zoom-in-firefox.png
diff --git a/...e/test-cases/all-question-types.test.ts-snapshots/select-map-zoom-in-webkit.png b/...e/test-cases/all-question-types.test.ts-snapshots/select-map-zoom-in-webkit.png
diff --git a/...est-cases/all-question-types.test.ts-snapshots/select-map-zoom-out-chromium.png b/...est-cases/all-question-types.test.ts-snapshots/select-map-zoom-out-chromium.png
diff --git a/...test-cases/all-question-types.test.ts-snapshots/select-map-zoom-out-firefox.png b/...test-cases/all-question-types.test.ts-snapshots/select-map-zoom-out-firefox.png
diff --git a/.../test-cases/all-question-types.test.ts-snapshots/select-map-zoom-out-webkit.png b/.../test-cases/all-question-types.test.ts-snapshots/select-map-zoom-out-webkit.png
diff --git a/...estion-types.test.ts-snapshots/select-map-zoom-to-fit-all-features-chromium.png b/...estion-types.test.ts-snapshots/select-map-zoom-to-fit-all-features-chromium.png
diff --git a/...uestion-types.test.ts-snapshots/select-map-zoom-to-fit-all-features-firefox.png b/...uestion-types.test.ts-snapshots/select-map-zoom-to-fit-all-features-firefox.png
diff --git a/...question-types.test.ts-snapshots/select-map-zoom-to-fit-all-features-webkit.png b/...question-types.test.ts-snapshots/select-map-zoom-to-fit-all-features-webkit.png
diff --git a/packages/web-forms/src/components/common/map/MapBlock.vue b/packages/web-forms/src/components/common/map/MapBlock.vue
@@ -200,7 +200,7 @@ const discardSavedFeature = () => {
 .map-block-component :deep(.ol-zoom) {
 	position: absolute;
 	right: var(--odk-map-spacing);
-	bottom: var(--odk-map-spacing);
+	bottom: 35px;
 	display: flex;
 	flex-direction: column;
 	flex-wrap: nowrap;
@@ -234,6 +234,33 @@ const discardSavedFeature = () => {
 	}
 }
 
+.map-block-component :deep(.ol-attribution) {
+	position: absolute;
+	right: 0;
+	bottom: 0;
+	background: rgba(245, 245, 245, 0.8);
+
+	button {
+		display: none;
+	}
+
+	ul {
+		margin: 0;
+		padding: 5px;
+	}
+
+	li {
+		list-style: none;
+	}
+
+	li,
+	a {
+		font-size: 10px;
+		line-height: 14px;
+		color: var(--odk-muted-text-color);
+	}
+}
+
 .map-block-error {
 	font-size: var(--odk-base-font-size);
 	color: var(--odk-error-text-color);

diff --git a/packages/web-forms/src/components/common/map/MapProperties.vue b/packages/web-forms/src/components/common/map/MapProperties.vue
@@ -97,19 +97,18 @@ const orderedProps = computed(() => {
 	margin: 0;
 
 	.property-line {
-		display: flex;
-		justify-content: flex-start;
-		flex-wrap: wrap;
-		gap: 5px;
+		display: block;
 		padding: 15px 0;
 
 		dt,
 		dd {
+			display: inline;
 			margin: 0;
 		}
 
 		dt:after {
 			content: ':';
+			margin-right: 5px;
 		}
 
 		&:not(:last-child) {

diff --git a/packages/web-forms/src/components/common/map/useMapBlock.ts b/packages/web-forms/src/components/common/map/useMapBlock.ts
@@ -5,7 +5,7 @@ import {
 } from '@/components/common/map/map-styles.ts';
 import type { FeatureCollection } from 'geojson';
 import { Map, MapBrowserEvent, View } from 'ol';
-import { Zoom } from 'ol/control';
+import { Attribution, Zoom } from 'ol/control';
 import { getCenter } from 'ol/extent';
 import Feature from 'ol/Feature';
 import GeoJSON from 'ol/format/GeoJSON';
@@ -76,7 +76,7 @@ export function useMapBlock() {
 				projection: DEFAULT_VIEW_PROJECTION,
 				extent: getProjection(DEFAULT_VIEW_PROJECTION)?.getExtent(),
 			}),
-			controls: [new Zoom()],
+			controls: [new Zoom(), new Attribution({ collapsible: false })],
 		});
 
 		currentState.value = STATES.READY;