Modifica ed elimina il disegno selezionato

LMEMappeCatastaliApp.csproj

@@ -28,8 +28,8 @@
         <ApplicationId>com.companyname.lmemappecatastaliapp</ApplicationId>
 
         <!-- Versions -->
-        <ApplicationDisplayVersion>0.2.22</ApplicationDisplayVersion>
+        <ApplicationDisplayVersion>0.2.28</ApplicationDisplayVersion>
-        <ApplicationVersion>26</ApplicationVersion>
+        <ApplicationVersion>32</ApplicationVersion>
 
         <!-- To develop, package, and publish an app to the Microsoft Store, see: https://aka.ms/MauiTemplateUnpackaged -->
         <WindowsPackageType>None</WindowsPackageType>

Services/MapExportService.cs

@@ -78,6 +78,8 @@ public sealed class MapExportService
             BuildStyle("drawing", "ff1679f9", "333c92fb"),
             BuildStyle("poi", "ffff7a00", "33ff7a00"),
             BuildStyle("gps-trail", "ff00a5ff", "2200a5ff"));
+        var categoryFolders = new Dictionary<string, XElement>(StringComparer.Ordinal);
+        var groupFolders = new Dictionary<(string Category, string Group), XElement>();
 
         foreach (var feature in features.EnumerateArray())
         {
@@ -102,7 +104,31 @@ public sealed class MapExportService
                 placemark.Add(extendedData);
             }
             placemark.Add(BuildGeometry(geometry));
-            document.Add(placemark);
+            var categoryName = GetString(properties, "_lmeCategoryName")?.Trim();
+            var groupName = GetString(properties, "_lmeGroupName")?.Trim();
+            var parent = document;
+            if (!string.IsNullOrWhiteSpace(categoryName))
+            {
+                if (!categoryFolders.TryGetValue(categoryName, out var categoryFolder))
+                {
+                    categoryFolder = new XElement(Kml + "Folder", new XElement(Kml + "name", categoryName));
+                    categoryFolders[categoryName] = categoryFolder;
+                    document.Add(categoryFolder);
+                }
+                parent = categoryFolder;
+            }
+            if (!string.IsNullOrWhiteSpace(groupName))
+            {
+                var key = (categoryName ?? string.Empty, groupName);
+                if (!groupFolders.TryGetValue(key, out var groupFolder))
+                {
+                    groupFolder = new XElement(Kml + "Folder", new XElement(Kml + "name", groupName));
+                    groupFolders[key] = groupFolder;
+                    parent.Add(groupFolder);
+                }
+                parent = groupFolder;
+            }
+            parent.Add(placemark);
         }
 
         return new XDocument(new XDeclaration("1.0", "utf-8", null), new XElement(Kml + "kml", document)).ToString();

wwwroot/css/app.css

@@ -176,10 +176,11 @@ input[type="checkbox"] {
     position: absolute;
     top: 72px;
     right: 12px;
+    bottom: calc(var(--nav-height) + 8px);
     z-index: 940;
     display: grid;
-    width: min(320px, calc(100% - 24px));
+    box-sizing: border-box;
-    max-height: calc(100% - 152px);
+    width: min(480px, 50vw);
     overflow-y: auto;
     border: 1px solid var(--line);
     border-radius: 8px;
@@ -265,17 +266,30 @@ input[type="checkbox"] {
 .layer-manager-group,
 .layer-manager-block,
 .layer-manager-object {
-    border: 1px solid #dce3e6;
+    border: 1px solid var(--layer-group-border, #dce3e6);
     border-radius: 6px;
-    background: #fff;
+    background: var(--layer-group-surface, #fff);
+}
+
+.layer-manager-group > summary,
+.layer-manager-block > summary {
+    background: var(--layer-group-parent, #f6f8f9);
+}
+
+.layer-manager-object > summary {
+    background: var(--layer-group-surface, #fff);
 }
 
 .layer-manager-group > summary,
 .layer-manager-block > summary,
 .layer-manager-object > summary {
     display: grid;
-    grid-template-columns: 28px 20px minmax(0, 1fr) auto auto;
+    grid-template-columns: 28px minmax(0, 1fr) 50px;
-    align-items: center;
+    grid-template-areas:
+        "handle title count"
+        ". visibility moves"
+        ". actions moves";
+    align-items: start;
     gap: 6px;
     min-height: 38px;
     padding: 4px 6px;
@@ -290,6 +304,7 @@ input[type="checkbox"] {
 }
 
 .layer-drag-handle {
+    grid-area: handle;
     width: 28px;
     height: 28px;
     border: 0;
@@ -302,7 +317,56 @@ input[type="checkbox"] {
     cursor: grab;
 }
 
+.layer-row-actions {
+    grid-area: actions;
+    display: grid;
+    grid-template-columns: minmax(0, 1fr);
+    width: min(130px, 100%);
+    gap: 4px;
+}
+
+.layer-manager-group > summary > input,
+.layer-manager-block > summary > input,
+.layer-manager-object > summary > input {
+    grid-area: visibility;
+    justify-self: start;
+    width: 20px;
+    height: 20px;
+    margin: 1px 0;
+}
+
+.layer-rename-button,
+.layer-remove-button {
+    width: 100%;
+    min-height: 28px;
+    min-width: 0;
+    padding: 4px;
+    border: 1px solid #bfd4cd;
+    border-radius: 4px;
+    background: #eef8f5;
+    color: var(--accent-strong);
+    font-size: 10px;
+    font-weight: 800;
+    line-height: 1.15;
+    overflow-wrap: anywhere;
+}
+
+.layer-rename-button:active {
+    background: #d9eee7;
+}
+
+.layer-remove-button {
+    border-color: #fecaca;
+    background: #fff1f2;
+    color: #b42318;
+}
+
+.layer-remove-button:active {
+    background: #ffe4e6;
+}
+
 .layer-move-buttons {
+    grid-area: moves;
     display: inline-grid;
     grid-template-columns: 24px 24px;
     gap: 2px;
@@ -326,25 +390,83 @@ input[type="checkbox"] {
 }
 
 .layer-manager-title {
+    grid-area: title;
     min-width: 0;
     overflow-wrap: anywhere;
+    color: var(--layer-group-accent, var(--ink));
     font-size: 12px;
-    font-weight: 700;
+}
+
+.layer-manager-group > summary > .layer-manager-title {
+    font-size: 13px;
+    font-weight: 800;
+}
+
+.layer-manager-block > summary > .layer-manager-title {
+    font-size: 12px;
+    font-weight: 800;
+}
+
+.layer-manager-object > summary > .layer-manager-title {
+    font-size: 11px;
+    font-style: italic;
+    font-weight: 400;
 }
 
 .layer-manager-count {
+    grid-area: count;
+    justify-self: end;
     color: var(--muted);
     font-size: 10px;
 }
 
 .layer-manager-children {
-    padding: 0 5px 5px 18px;
+    margin-left: 4px;
+    padding: 4px 3px 5px 6px;
+    border-left: 2px solid var(--layer-group-border, #dce3e6);
+}
+
+.layer-manager-block > .layer-manager-children {
+    margin-left: 5px;
+    padding-left: 5px;
+}
+
+.layer-manager-object {
+    margin-left: 3px;
+    border-radius: 4px;
+}
+
+.layer-manager-object > summary {
+    grid-template-columns: 24px minmax(0, 1fr) 46px;
+    gap: 4px;
+    padding: 3px 4px;
+}
+
+.layer-manager-object > summary > .layer-drag-handle {
+    width: 24px;
+    height: 24px;
+    font-size: 15px;
+}
+
+.layer-manager-object > summary > .layer-move-buttons {
+    grid-template-columns: 22px 22px;
+}
+
+.layer-manager-object > summary > .layer-move-buttons button {
+    width: 22px;
+    height: 24px;
+}
+
+.layer-manager-object > summary .layer-rename-button,
+.layer-manager-object > summary .layer-remove-button {
+    min-height: 24px;
+    font-size: 9px;
 }
 
 .layer-manager-details {
     display: grid;
     gap: 2px;
-    padding: 0 8px 7px 40px;
+    padding: 0 6px 7px 12px;
     color: var(--muted);
     font-size: 10px;
 }
@@ -380,6 +502,12 @@ input[type="checkbox"] {
     box-shadow: inset 3px 0 #ff00d4;
 }
 
+.layer-manager-parent-highlighted > summary,
+.layer-manager-parent-selected > summary {
+    background: #fff0fb;
+    box-shadow: inset 3px 0 #ff00d4;
+}
+
 .gps-overlay {
     position: absolute;
     top: 72px;
@@ -889,8 +1017,8 @@ footer {
     .map-layer-panel {
         top: 68px;
         right: 8px;
-        width: min(320px, calc(100% - 16px));
+        bottom: calc(var(--nav-height) + 8px);
-        max-height: calc(100% - 144px);
+        width: 50vw;
     }
 
     .tool-sheet {

wwwroot/js/lme-map.js

@@ -22,8 +22,12 @@ const lmeState = {
     importedSheetsVisible: false,
     importedMeasurements: null,
     drawings: null,
+    drawingsRenderer: null,
+    drawingSelection: null,
     drawingMeasurements: null,
     drawControl: null,
+    drawingDeleteButton: null,
+    ignoreMapClickUntil: 0,
     activeDrawHandler: null,
     drawEventsBound: false,
     includeKmlSheetLayer: false,
@@ -51,13 +55,19 @@ const lmeState = {
     managerHighlight: null,
     managerHighlightedObjectId: null,
     managerHighlightedCategoryKey: null,
+    managerHighlightedParentKey: null,
+    managerHighlightedParentRecords: null,
+    managerHoveredParentKey: null,
+    managerHoveredParentRecords: null,
     managerOutsideSelectionBound: false,
     managerHiddenObjects: new Map(),
     managerHiddenObjectIds: new Set(),
     managerHiddenMeasurementSummaryIds: new Set(),
     managerHiddenMeasurementSideIds: new Set(),
     managerHiddenCategories: new Set(),
+    managerRemovedCategories: new Set(),
     managerObjectOrder: {},
+    managerCategoryNames: {},
     managerExpandedRows: new Set(),
     dotNetReference: null
 };
@@ -172,10 +182,12 @@ function init(dotNetReference) {
     });
     const managerHighlightPane = lmeState.map.createPane("managerHighlightPane");
     managerHighlightPane.style.zIndex = "650";
+    lmeState.drawingsRenderer = L.canvas({ pane: "drawingsPane", tolerance: 14 });
     setLayerOrder(lmeState.layerOrder);
     lmeState.imported = L.featureGroup().addTo(lmeState.map);
     lmeState.importedSheets = L.featureGroup();
     lmeState.drawings = L.featureGroup().addTo(lmeState.map);
+    lmeState.drawingSelection = L.featureGroup();
     lmeState.importedMeasurements = L.layerGroup().addTo(lmeState.map);
     lmeState.drawingMeasurements = L.layerGroup().addTo(lmeState.map);
     lmeState.selectedParcelsLayer = L.featureGroup().addTo(lmeState.map);
@@ -199,6 +211,9 @@ function init(dotNetReference) {
     }
 
     lmeState.map.on("click", async event => {
+        if (event.originalEvent?._lmeDrawingSelected || Date.now() < lmeState.ignoreMapClickUntil) {
+            return;
+        }
         clearManagerHighlight();
         const info = await queryFeatureInfo(event.latlng);
         if (info) {
@@ -223,11 +238,16 @@ function init(dotNetReference) {
     });
     if (!lmeState.managerOutsideSelectionBound) {
         document.addEventListener("pointerdown", event => {
-            if (!lmeState.managerHighlightedObjectId) {
+            if (!lmeState.managerHighlightedObjectId && !lmeState.managerHighlightedParentKey) {
                 return;
             }
-            const selectedRow = event.target?.closest?.(".layer-manager-object");
+            if (event.target?.closest?.(".leaflet-draw")) {
-            if (selectedRow?.dataset.objectId === lmeState.managerHighlightedObjectId) {
+                return;
+            }
+            const selectedObject = event.target?.closest?.(".layer-manager-object");
+            const selectedParent = event.target?.closest?.("[data-highlight-key]");
+            if (selectedObject?.dataset.objectId === lmeState.managerHighlightedObjectId
+                || selectedParent?.dataset.highlightKey === lmeState.managerHighlightedParentKey) {
                 return;
             }
             clearManagerHighlight();
@@ -1145,6 +1165,187 @@ function managedObjectLabel(record, index) {
     return `Oggetto ${index + 1}`;
 }
 
+function managedObjectEditableName(record) {
+    const properties = record?.layer?.feature?.properties || {};
+    return properties.name || properties.Name || properties.label || properties.LABEL || "";
+}
+
+function managedObjectCanRename(record) {
+    return ["drawings", "imported", "importedSheets"].includes(record.categoryKey)
+        && record.layer?.feature?.properties;
+}
+
+function renameManagedObject(record, index) {
+    if (!managedObjectCanRename(record)) {
+        return;
+    }
+    const currentName = String(managedObjectEditableName(record) || managedObjectLabel(record, index)).trim();
+    const requestedName = window.prompt("Nuovo nome oggetto", currentName);
+    if (requestedName === null) {
+        return;
+    }
+    const name = requestedName.trim().slice(0, 120);
+    if (!name) {
+        setInfo("Nome non modificato: inserisci un testo.");
+        return;
+    }
+    const properties = record.layer.feature.properties;
+    properties.name = name;
+    record.layer.lmeManagerLabel = record.categoryKey === "drawings" && record.layer instanceof L.Marker
+        ? `POI: ${name}`
+        : null;
+    updateStoredFeaturePopup(record.layer);
+    refreshImportedMeasurements();
+    refreshDrawingMeasurements();
+    refreshLayerManager();
+    setInfo(`Oggetto rinominato: ${name}.`);
+}
+
+function managedCategoryName(category, records) {
+    const storedName = lmeState.managerCategoryNames[category.key];
+    const featureName = records
+        .map(record => record.layer?.feature?.properties?._lmeCategoryName)
+        .find(Boolean);
+    const name = String(storedName || featureName || category.label).trim();
+    if (name !== category.label) {
+        lmeState.managerCategoryNames[category.key] = name;
+    }
+    return name;
+}
+
+function managedCategoryCanRename(category) {
+    return ["drawings", "imported", "importedSheets"].includes(category.key);
+}
+
+function renameManagedCategory(category, records) {
+    const currentName = managedCategoryName(category, records);
+    const requestedName = window.prompt("Nuovo nome gruppo", currentName);
+    if (requestedName === null) {
+        return;
+    }
+    const name = requestedName.trim().slice(0, 120);
+    if (!name) {
+        setInfo("Nome non modificato: inserisci un testo.");
+        return;
+    }
+    lmeState.managerCategoryNames[category.key] = name;
+    records.forEach(record => {
+        if (record.layer?.feature?.properties) {
+            record.layer.feature.properties._lmeCategoryName = name;
+        }
+    });
+    refreshLayerManager();
+    setInfo(`Gruppo rinominato: ${name}.`);
+}
+
+function managedBlockName(source, records) {
+    return String(records
+        .map(record => record.layer?.feature?.properties?._lmeGroupName)
+        .find(Boolean) || source);
+}
+
+function renameManagedBlock(category, source, records) {
+    const currentName = managedBlockName(source, records);
+    const requestedName = window.prompt("Nuovo nome gruppo", currentName);
+    if (requestedName === null) {
+        return;
+    }
+    const name = requestedName.trim().slice(0, 120);
+    if (!name) {
+        setInfo("Nome non modificato: inserisci un testo.");
+        return;
+    }
+    records.forEach(record => {
+        if (record.layer?.feature?.properties) {
+            record.layer.feature.properties._lmeGroupName = name;
+        }
+    });
+    refreshLayerManager();
+    setInfo(`Gruppo rinominato: ${name}.`);
+}
+
+function managedCategoryCanRemove(category, records) {
+    return records.length > 0
+        && ["drawings", "imported", "importedSheets", "selectedParcels", "gpsParcels"].includes(category.key);
+}
+
+function managedObjectCanRemove(record) {
+    return ["drawings", "imported", "importedSheets", "selectedParcels", "gpsParcels"].includes(record.categoryKey);
+}
+
+function layerManagerRowActions(renameButton, removeButton) {
+    if (!renameButton && !removeButton) {
+        return "";
+    }
+    return `<span class="layer-row-actions">${renameButton}${removeButton}</span>`;
+}
+
+const layerManagerPalettes = [
+    { surface: "#f0fdf4", parent: "#dcfce7", border: "#86efac", accent: "#166534" },
+    { surface: "#eff6ff", parent: "#dbeafe", border: "#93c5fd", accent: "#1d4ed8" },
+    { surface: "#fffbeb", parent: "#fef3c7", border: "#fcd34d", accent: "#92400e" },
+    { surface: "#fff1f2", parent: "#ffe4e6", border: "#fda4af", accent: "#be123c" },
+    { surface: "#f5f3ff", parent: "#ede9fe", border: "#c4b5fd", accent: "#6d28d9" },
+    { surface: "#ecfeff", parent: "#cffafe", border: "#67e8f9", accent: "#0e7490" },
+    { surface: "#f7fee7", parent: "#ecfccb", border: "#bef264", accent: "#3f6212" }
+];
+
+function applyLayerManagerPalette(row, key) {
+    const hash = [...String(key)].reduce((value, character) =>
+        ((value * 31) + character.charCodeAt(0)) >>> 0, 0);
+    const palette = layerManagerPalettes[hash % layerManagerPalettes.length];
+    row.style.setProperty("--layer-group-surface", palette.surface);
+    row.style.setProperty("--layer-group-parent", palette.parent);
+    row.style.setProperty("--layer-group-border", palette.border);
+    row.style.setProperty("--layer-group-accent", palette.accent);
+}
+
+function clearManagedObjectState(id) {
+    lmeState.managerHiddenObjects.delete(id);
+    lmeState.managerHiddenObjectIds.delete(id);
+    lmeState.managerHiddenMeasurementSummaryIds.delete(id);
+    lmeState.managerHiddenMeasurementSideIds.delete(id);
+    Object.keys(lmeState.managerObjectOrder).forEach(categoryKey => {
+        lmeState.managerObjectOrder[categoryKey] = lmeState.managerObjectOrder[categoryKey]
+            .filter(objectId => objectId !== id);
+    });
+}
+
+function removeManagedRecords(records, subject) {
+    if (!records.length) {
+        return;
+    }
+    const message = records.length === 1
+        ? `Rimuovere ${subject} dal progetto? Non verra incluso nel prossimo salvataggio.`
+        : `Rimuovere ${subject} e tutti i suoi ${records.length} oggetti dal progetto? Non verranno inclusi nel prossimo salvataggio.`;
+    if (!window.confirm(message)) {
+        return;
+    }
+    const removedIds = new Set(records.map(record => record.id));
+    const categoryKeys = new Set(records.map(record => record.categoryKey));
+    records.forEach(record => {
+        if (record.parent?.hasLayer?.(record.layer)) {
+            record.parent.removeLayer(record.layer);
+        }
+        clearManagedObjectState(record.id);
+    });
+    categoryKeys.forEach(categoryKey => {
+        const order = lmeState.managerObjectOrder[categoryKey] || [];
+        lmeState.managerObjectOrder[categoryKey] = order.filter(id => !removedIds.has(id));
+        const category = layerManagerCategories().find(item => item.key === categoryKey);
+        if (category && managedRecordsForCategory(category).length === 0) {
+            lmeState.managerRemovedCategories.add(categoryKey);
+            delete lmeState.managerCategoryNames[categoryKey];
+        }
+    });
+    clearManagerHighlight();
+    refreshImportedMeasurements();
+    refreshDrawingMeasurements();
+    updateGpsInsideState();
+    refreshLayerManager();
+    setInfo(`${records.length === 1 ? "Oggetto rimosso" : `${records.length} oggetti rimossi`} dal progetto.`);
+}
+
 function managedObjectDetails(layer) {
     const details = [];
     const properties = layer?.feature?.properties || {};
@@ -1200,6 +1401,11 @@ function refreshLayerManager() {
             return;
         }
         const records = managedRecordsForCategory(category);
+        if (records.length) {
+            lmeState.managerRemovedCategories.delete(category.key);
+        } else if (lmeState.managerRemovedCategories.has(category.key)) {
+            return;
+        }
         const savedOrder = lmeState.managerObjectOrder[category.key] || [];
         const positions = new Map(savedOrder.map((id, index) => [id, index]));
         records.sort((left, right) =>
@@ -1222,17 +1428,39 @@ function renderLayerManagerCategory(category, records) {
     const group = document.createElement("details");
     group.className = "layer-manager-group";
     group.dataset.dragType = "category";
+    group.dataset.layerDepth = "0";
     group.dataset.categoryKey = category.key;
+    applyLayerManagerPalette(group, `category:${category.key}`);
     bindLayerManagerExpansion(group, `category:${category.key}`);
+    const categoryName = managedCategoryName(category, records);
+    const renameButton = managedCategoryCanRename(category)
+        ? `<button type="button" class="layer-rename-button" aria-label="Rinomina gruppo" title="Rinomina">Rinomina</button>`
+        : "";
+    const removeButton = managedCategoryCanRemove(category, records)
+        ? `<button type="button" class="layer-remove-button" aria-label="Rimuovi gruppo dal progetto" title="Rimuovi dal progetto">Rimuovi</button>`
+        : "";
+    const rowActions = layerManagerRowActions(renameButton, removeButton);
+    group.classList.toggle("layer-manager-with-actions", Boolean(rowActions));
     const visibleCount = records.filter(record => !lmeState.managerHiddenObjectIds.has(record.id)).length;
     const categoryVisible = !lmeState.managerHiddenCategories.has(category.key)
         && (!category.roots.length || category.roots.some(layer => lmeState.map.hasLayer(layer)));
     const visible = categoryVisible;
-    group.innerHTML = `<summary><button type="button" class="layer-drag-handle" aria-label="Trascina gruppo">☰</button><input type="checkbox" ${visible ? "checked" : ""} aria-label="Mostra ${escapeHtml(category.label)}"><span class="layer-manager-title">${escapeHtml(category.label)}</span>${layerManagerMoveButtons("gruppo")}<span class="layer-manager-count">${records.length}</span></summary><div class="layer-manager-children"></div>`;
+    group.innerHTML = `<summary><button type="button" class="layer-drag-handle" aria-label="Trascina gruppo">☰</button><input type="checkbox" ${visible ? "checked" : ""} aria-label="Mostra ${escapeHtml(categoryName)}"><span class="layer-manager-title">${escapeHtml(categoryName)}</span>${rowActions}${layerManagerMoveButtons("gruppo")}<span class="layer-manager-count">${records.length}</span></summary><div class="layer-manager-children"></div>`;
     const checkbox = group.querySelector("input");
     checkbox.indeterminate = categoryVisible && records.length > 0 && visibleCount < records.length;
     checkbox.addEventListener("click", event => event.stopPropagation());
     checkbox.addEventListener("change", () => setManagedCategoryVisible(category, checkbox.checked));
+    group.querySelector(".layer-rename-button")?.addEventListener("click", event => {
+        event.preventDefault();
+        event.stopPropagation();
+        renameManagedCategory(category, records);
+    });
+    group.querySelector(".layer-remove-button")?.addEventListener("click", event => {
+        event.preventDefault();
+        event.stopPropagation();
+        removeManagedRecords(records, `il gruppo '${categoryName}'`);
+    });
+    bindManagedParentHighlight(group, `category:${category.key}`, records);
     const children = group.querySelector(".layer-manager-children");
     if (category.blocks) {
         const blocks = new Map();
@@ -1252,12 +1480,19 @@ function renderLayerManagerBlock(category, source, records) {
     const block = document.createElement("details");
     block.className = "layer-manager-block";
     block.dataset.dragType = "block";
+    block.dataset.layerDepth = "1";
     block.dataset.categoryKey = category.key;
     block.dataset.blockKey = source;
+    applyLayerManagerPalette(block, `block:${category.key}:${source}`);
     bindLayerManagerExpansion(block, `block:${category.key}:${source}`);
     const visibleCount = records.filter(record => !lmeState.managerHiddenObjectIds.has(record.id)).length;
     const visible = visibleCount === records.length;
-    block.innerHTML = `<summary><button type="button" class="layer-drag-handle" aria-label="Trascina blocco">☰</button><input type="checkbox" ${visible ? "checked" : ""} aria-label="Mostra blocco"><span class="layer-manager-title">${escapeHtml(source)}</span>${layerManagerMoveButtons("blocco")}<span class="layer-manager-count">${records.length}</span></summary><div class="layer-manager-children"></div>`;
+    const blockName = managedBlockName(source, records);
+    const rowActions = layerManagerRowActions(
+        `<button type="button" class="layer-rename-button" aria-label="Rinomina gruppo" title="Rinomina">Rinomina</button>`,
+        `<button type="button" class="layer-remove-button" aria-label="Rimuovi gruppo dal progetto" title="Rimuovi dal progetto">Rimuovi</button>`);
+    block.classList.add("layer-manager-with-actions");
+    block.innerHTML = `<summary><button type="button" class="layer-drag-handle" aria-label="Trascina blocco">☰</button><input type="checkbox" ${visible ? "checked" : ""} aria-label="Mostra ${escapeHtml(blockName)}"><span class="layer-manager-title">${escapeHtml(blockName)}</span>${rowActions}${layerManagerMoveButtons("blocco")}<span class="layer-manager-count">${records.length}</span></summary><div class="layer-manager-children"></div>`;
     const checkbox = block.querySelector("input");
     checkbox.indeterminate = visibleCount > 0 && !visible;
     checkbox.addEventListener("click", event => event.stopPropagation());
@@ -1265,6 +1500,17 @@ function renderLayerManagerBlock(category, source, records) {
         records.forEach(record => setManagedObjectVisible(record, checkbox.checked, false));
         refreshLayerManager();
     });
+    block.querySelector(".layer-rename-button").addEventListener("click", event => {
+        event.preventDefault();
+        event.stopPropagation();
+        renameManagedBlock(category, source, records);
+    });
+    block.querySelector(".layer-remove-button").addEventListener("click", event => {
+        event.preventDefault();
+        event.stopPropagation();
+        removeManagedRecords(records, `il gruppo '${blockName}'`);
+    });
+    bindManagedParentHighlight(block, `block:${category.key}:${source}`, records);
     const children = block.querySelector(".layer-manager-children");
     records.forEach((record, index) => children.appendChild(renderLayerManagerObject(record, index)));
     return block;
@@ -1277,13 +1523,33 @@ function renderLayerManagerObject(record, index) {
         object.classList.add("layer-manager-object-selected");
     }
     object.dataset.dragType = "object";
+    object.dataset.layerDepth = "2";
     object.dataset.objectId = record.id;
     bindLayerManagerExpansion(object, `object:${record.id}`);
     const visible = !lmeState.managerHiddenObjectIds.has(record.id);
-    object.innerHTML = `<summary><button type="button" class="layer-drag-handle" aria-label="Trascina oggetto">☰</button><input type="checkbox" ${visible ? "checked" : ""} aria-label="Mostra oggetto"><span class="layer-manager-title">${escapeHtml(managedObjectLabel(record, index))}</span>${layerManagerMoveButtons("oggetto")}<span class="layer-manager-count">›</span></summary><div class="layer-manager-details"></div>`;
+    const renameButton = managedObjectCanRename(record)
+        ? `<button type="button" class="layer-rename-button" aria-label="Rinomina oggetto" title="Rinomina">Rinomina</button>`
+        : "";
+    const removeButton = managedObjectCanRemove(record)
+        ? `<button type="button" class="layer-remove-button" aria-label="Rimuovi oggetto dal progetto" title="Rimuovi dal progetto">Rimuovi</button>`
+        : "";
+    const rowActions = layerManagerRowActions(renameButton, removeButton);
+    object.classList.toggle("layer-manager-with-actions", Boolean(rowActions));
+    const objectName = managedObjectLabel(record, index);
+    object.innerHTML = `<summary><button type="button" class="layer-drag-handle" aria-label="Trascina oggetto">☰</button><input type="checkbox" ${visible ? "checked" : ""} aria-label="Mostra oggetto"><span class="layer-manager-title">${escapeHtml(objectName)}</span>${rowActions}${layerManagerMoveButtons("oggetto")}<span class="layer-manager-count">›</span></summary><div class="layer-manager-details"></div>`;
     const checkbox = object.querySelector("input");
     checkbox.addEventListener("click", event => event.stopPropagation());
     checkbox.addEventListener("change", () => setManagedObjectVisible(record, checkbox.checked, true));
+    object.querySelector(".layer-rename-button")?.addEventListener("click", event => {
+        event.preventDefault();
+        event.stopPropagation();
+        renameManagedObject(record, index);
+    });
+    object.querySelector(".layer-remove-button")?.addEventListener("click", event => {
+        event.preventDefault();
+        event.stopPropagation();
+        removeManagedRecords([record], `'${objectName}'`);
+    });
     object.querySelector(".layer-manager-title").addEventListener("click", event => {
         event.preventDefault();
         event.stopPropagation();
@@ -1515,9 +1781,126 @@ function highlightManagedObject(record) {
     document.querySelectorAll(".layer-manager-object").forEach(row => {
         row.classList.toggle("layer-manager-object-selected", row.dataset.objectId === record.id);
     });
-    const geojson = record.layer.toGeoJSON?.();
+    setSelectedDrawing(record.categoryKey === "drawings" ? record.layer : null);
-    if (geojson) {
+    renderManagerHighlight([record]);
-        L.geoJSON(geojson, {
+    fitLayer(record.layer);
+}
+
+function drawingEditToolbar() {
+    return lmeState.drawControl?._toolbars?.[L.EditToolbar.TYPE] || null;
+}
+
+function drawingEditActive() {
+    return Boolean(drawingEditToolbar()?.enabled?.());
+}
+
+function updateDrawingSelectionActions() {
+    const hasSelection = Boolean(lmeState.drawingSelection?.getLayers?.().length);
+    lmeState.drawingDeleteButton?.classList.toggle("leaflet-disabled", !hasSelection);
+    if (lmeState.drawingDeleteButton) {
+        lmeState.drawingDeleteButton.setAttribute("aria-disabled", String(!hasSelection));
+    }
+}
+
+function setSelectedDrawing(layer) {
+    if (!lmeState.drawingSelection || drawingEditActive()) {
+        return;
+    }
+    lmeState.drawingSelection.clearLayers();
+    if (layer) {
+        lmeState.drawingSelection.addLayer(layer);
+    }
+    updateDrawingSelectionActions();
+}
+
+function selectDrawingLayer(layer) {
+    if (drawingEditActive()) {
+        return;
+    }
+    const record = {
+        id: managedLayerId(layer, "drawings"),
+        categoryKey: "drawings",
+        layer,
+        parent: lmeState.drawings,
+        source: String(layer?.feature?.properties?._lmeSource || "Progetto corrente")
+    };
+    clearManagerHighlight();
+    lmeState.managerHighlightedObjectId = record.id;
+    lmeState.managerHighlightedCategoryKey = "drawings";
+    document.querySelectorAll(".layer-manager-object").forEach(row => {
+        row.classList.toggle("layer-manager-object-selected", row.dataset.objectId === record.id);
+    });
+    setSelectedDrawing(layer);
+    renderManagerHighlight([record]);
+    setInfo(`Selezione: ${managedObjectLabel(record, 0)}. Usa la matita per modificare o il cestino per eliminare.`);
+}
+
+function bindManagedParentHighlight(row, key, records) {
+    const summary = row.querySelector(":scope > summary");
+    row.dataset.highlightKey = key;
+    row.classList.toggle("layer-manager-parent-selected", lmeState.managerHighlightedParentKey === key);
+    if (lmeState.managerHighlightedParentKey === key) {
+        lmeState.managerHighlightedParentRecords = records;
+    }
+    row.querySelector(":scope > summary > .layer-manager-title").addEventListener("click", event => {
+        event.preventDefault();
+        event.stopPropagation();
+        row.open = true;
+        highlightManagedParent(row, key, records);
+    });
+    summary.addEventListener("pointerenter", () => {
+        lmeState.managerHoveredParentKey = key;
+        lmeState.managerHoveredParentRecords = records;
+        row.classList.add("layer-manager-parent-highlighted");
+        renderManagerHighlight(records);
+    });
+    summary.addEventListener("pointerleave", () => {
+        if (lmeState.managerHoveredParentKey !== key) {
+            return;
+        }
+        lmeState.managerHoveredParentKey = null;
+        lmeState.managerHoveredParentRecords = null;
+        row.classList.remove("layer-manager-parent-highlighted");
+        renderSelectedManagerHighlight();
+    });
+}
+
+function highlightManagedParent(row, key, records) {
+    if (lmeState.managerHighlightedParentKey === key) {
+        clearManagerHighlight();
+        return;
+    }
+    clearManagerHighlight();
+    lmeState.managerHighlightedParentKey = key;
+    lmeState.managerHighlightedParentRecords = records;
+    lmeState.managerHighlightedCategoryKey = records[0]?.categoryKey || null;
+    setSelectedDrawing(null);
+    row.classList.add("layer-manager-parent-selected");
+    renderManagerHighlight(records);
+}
+
+function renderSelectedManagerHighlight() {
+    if (lmeState.managerHighlightedParentRecords?.length) {
+        renderManagerHighlight(lmeState.managerHighlightedParentRecords);
+        return;
+    }
+    const selected = lmeState.managerRecords.get(lmeState.managerHighlightedObjectId);
+    renderManagerHighlight(selected ? [selected] : []);
+}
+
+function renderManagerHighlight(records) {
+    lmeState.managerHighlight?.clearLayers();
+    const features = records.flatMap(record => {
+        const geojson = record.layer?.toGeoJSON?.();
+        if (!geojson) {
+            return [];
+        }
+        return geojson.type === "FeatureCollection" ? geojson.features : [geojson];
+    });
+    if (!features.length) {
+        return;
+    }
+    L.geoJSON({ type: "FeatureCollection", features }, {
         pane: "managerHighlightPane",
         interactive: false,
         style: { color: "#ff00d4", weight: 8, opacity: 1, fillColor: "#00fff0", fillOpacity: 0.16 },
@@ -1531,17 +1914,26 @@ function highlightManagedObject(record) {
             interactive: false
         })
     }).addTo(lmeState.managerHighlight);
-    }
-    fitLayer(record.layer);
 }
 
 function clearManagerHighlight() {
     lmeState.managerHighlight?.clearLayers();
     lmeState.managerHighlightedObjectId = null;
     lmeState.managerHighlightedCategoryKey = null;
+    lmeState.managerHighlightedParentKey = null;
+    lmeState.managerHighlightedParentRecords = null;
+    lmeState.managerHoveredParentKey = null;
+    lmeState.managerHoveredParentRecords = null;
+    setSelectedDrawing(null);
     document.querySelectorAll(".layer-manager-object-selected").forEach(row => {
         row.classList.remove("layer-manager-object-selected");
     });
+    document.querySelectorAll(".layer-manager-parent-highlighted").forEach(row => {
+        row.classList.remove("layer-manager-parent-highlighted");
+    });
+    document.querySelectorAll(".layer-manager-parent-selected").forEach(row => {
+        row.classList.remove("layer-manager-parent-selected");
+    });
 }
 
 function layerManagerMoveButtons(label) {
@@ -1806,13 +2198,14 @@ function clearImported() {
 function addProjectMarker(name) {
     const center = lmeState.map.getCenter();
     const label = (name || "Nuovo POI").trim();
-    const marker = L.marker(center, { pane: "drawingsPane", draggable: true }).addTo(lmeState.drawings);
+    const marker = L.marker(center, { pane: "drawingsPane", draggable: false }).addTo(lmeState.drawings);
     marker.lmeManagerLabel = `POI: ${label}`;
     marker.feature = {
         type: "Feature",
         properties: { name: label }
     };
     marker.bindPopup(`<strong>${escapeHtml(label)}</strong><br>${center.lat.toFixed(6)}, ${center.lng.toFixed(6)}`).openPopup();
+    bindDrawingLayerSelection(marker);
     refreshDrawingMeasurements();
     setInfo(`POI aggiunto: ${label}`);
     refreshLayerManager();
@@ -1824,8 +2217,8 @@ function configureDrawLabels() {
     L.drawLocal.draw.toolbar.buttons.circle = "Misura cerchio";
     L.drawLocal.draw.toolbar.buttons.rectangle = "Disegna rettangolo";
     L.drawLocal.draw.toolbar.buttons.marker = "Aggiungi POI";
-    L.drawLocal.edit.toolbar.buttons.edit = "Modifica disegni";
+    L.drawLocal.edit.toolbar.buttons.edit = "Modifica oggetto selezionato";
-    L.drawLocal.edit.toolbar.buttons.remove = "Elimina disegni";
+    L.drawLocal.edit.toolbar.buttons.remove = "Elimina oggetto selezionato";
     L.drawLocal.draw.handlers.polygon.tooltip.start = "Tocca il primo vertice dell'area.";
     L.drawLocal.draw.handlers.polygon.tooltip.cont = "Tocca per aggiungere un vertice.";
     L.drawLocal.draw.handlers.polygon.tooltip.end = "Tocca il primo punto per chiudere l'area.";
@@ -1853,6 +2246,7 @@ function bindDrawingEvents() {
         };
         setInfo(completedLabels[event.layerType] || "Disegno completato.");
         refreshLayerManager();
+        selectDrawingLayer(event.layer);
     });
     lmeState.map.on(L.Draw.Event.EDITED, event => {
         event.layers.eachLayer(layer => annotateDrawingLayer(layer));
@@ -1860,7 +2254,9 @@ function bindDrawingEvents() {
         updateGpsInsideState();
         refreshLayerManager();
     });
-    lmeState.map.on(L.Draw.Event.DELETED, () => {
+    lmeState.map.on(L.Draw.Event.DELETED, event => {
+        event.layers?.eachLayer(layer => lmeState.drawings.removeLayer(layer));
+        clearManagerHighlight();
         refreshDrawingMeasurements();
         updateGpsInsideState();
         refreshLayerManager();
@@ -1878,10 +2274,28 @@ function enableDrawTools() {
     }
 
     configureDrawLabels();
-    const orangeArea = { pane: "drawingsPane", color: "#f97316", weight: 4, fillColor: "#fb923c", fillOpacity: 0.2 };
+    const orangeArea = {
+        pane: "drawingsPane",
+        renderer: lmeState.drawingsRenderer,
+        color: "#f97316",
+        weight: 4,
+        fillColor: "#fb923c",
+        fillOpacity: 0.2
+    };
     lmeState.drawControl = new L.Control.Draw({
         position: "topright",
-        edit: { featureGroup: lmeState.drawings },
+        edit: {
+            featureGroup: lmeState.drawingSelection,
+            remove: false,
+            edit: {
+                selectedPathOptions: {
+                    color: "#ff00d4",
+                    fillColor: "#00fff0",
+                    fillOpacity: 0.16,
+                    maintainColor: false
+                }
+            }
+        },
         draw: {
             circle: { metric: true, feet: false, showRadius: true, shapeOptions: orangeArea },
             circlemarker: false,
@@ -1897,14 +2311,72 @@ function enableDrawTools() {
                 metric: true,
                 feet: false,
                 showLength: true,
-                shapeOptions: { pane: "drawingsPane", color: "#f97316", weight: 4, opacity: 0.95 }
+                shapeOptions: {
+                    pane: "drawingsPane",
+                    renderer: lmeState.drawingsRenderer,
+                    color: "#f97316",
+                    weight: 4,
+                    opacity: 0.95
+                }
             },
             rectangle: { metric: true, shapeOptions: orangeArea }
         }
     });
     lmeState.map.addControl(lmeState.drawControl);
+    installSelectedDrawingDeleteButton();
     bindDrawingEvents();
-    setInfo("Barra strumenti attiva: misure, disegni, POI, modifica e cancellazione.");
+    setInfo("Barra strumenti attiva: seleziona un disegno sulla mappa, poi usa matita o cestino.");
+}
+
+function installSelectedDrawingDeleteButton() {
+    const toolbar = drawingEditToolbar();
+    const container = toolbar?._toolbarContainer;
+    if (!container) {
+        return;
+    }
+    const button = L.DomUtil.create("a", "leaflet-draw-edit-remove", container);
+    button.href = "#";
+    button.title = L.drawLocal.edit.toolbar.buttons.remove;
+    button.setAttribute("role", "button");
+    button.setAttribute("aria-label", L.drawLocal.edit.toolbar.buttons.remove);
+    const accessibleLabel = L.DomUtil.create("span", "sr-only", button);
+    accessibleLabel.textContent = L.drawLocal.edit.toolbar.buttons.remove;
+    L.DomEvent.on(button, "click", L.DomEvent.stop)
+        .on(button, "mousedown", L.DomEvent.stopPropagation)
+        .on(button, "touchstart", L.DomEvent.stopPropagation)
+        .on(button, "click", removeSelectedDrawing);
+    lmeState.drawingDeleteButton = button;
+    updateDrawingSelectionActions();
+}
+
+function removeSelectedDrawing() {
+    const layer = lmeState.drawingSelection?.getLayers?.()[0];
+    if (!layer) {
+        setInfo("Seleziona prima il disegno da eliminare toccandolo sulla mappa.");
+        return;
+    }
+    if (drawingEditActive()) {
+        setInfo("Salva o annulla la modifica prima di eliminare il disegno.");
+        return;
+    }
+    const record = {
+        id: managedLayerId(layer, "drawings"),
+        categoryKey: "drawings",
+        layer,
+        parent: lmeState.drawings
+    };
+    const name = managedObjectLabel(record, 0);
+    if (!window.confirm(`Eliminare solo '${name}' dal progetto?`)) {
+        return;
+    }
+    lmeState.drawingSelection.clearLayers();
+    lmeState.drawings.removeLayer(layer);
+    clearManagedObjectState(record.id);
+    clearManagerHighlight();
+    refreshDrawingMeasurements();
+    updateGpsInsideState();
+    refreshLayerManager();
+    setInfo(`'${name}' eliminato dal progetto.`);
 }
 
 function startMeasurementDrawing(mode) {
@@ -1922,19 +2394,39 @@ function startMeasurementDrawing(mode) {
             showArea: true,
             metric: true,
             feet: false,
-            shapeOptions: { pane: "drawingsPane", color: "#f97316", weight: 4, fillColor: "#fb923c", fillOpacity: 0.2 }
+            shapeOptions: {
+                pane: "drawingsPane",
+                renderer: lmeState.drawingsRenderer,
+                color: "#f97316",
+                weight: 4,
+                fillColor: "#fb923c",
+                fillOpacity: 0.2
+            }
         }),
         distance: () => new L.Draw.Polyline(lmeState.map, {
             metric: true,
             feet: false,
             showLength: true,
-            shapeOptions: { pane: "drawingsPane", color: "#f97316", weight: 4, opacity: 0.95 }
+            shapeOptions: {
+                pane: "drawingsPane",
+                renderer: lmeState.drawingsRenderer,
+                color: "#f97316",
+                weight: 4,
+                opacity: 0.95
+            }
         }),
         circle: () => new L.Draw.Circle(lmeState.map, {
             metric: true,
             feet: false,
             showRadius: true,
-            shapeOptions: { pane: "drawingsPane", color: "#f97316", weight: 4, fillColor: "#fb923c", fillOpacity: 0.2 }
+            shapeOptions: {
+                pane: "drawingsPane",
+                renderer: lmeState.drawingsRenderer,
+                color: "#f97316",
+                weight: 4,
+                fillColor: "#fb923c",
+                fillOpacity: 0.2
+            }
         })
     };
     const createHandler = handlers[mode];
@@ -1955,6 +2447,9 @@ function startMeasurementDrawing(mode) {
 
 function annotateDrawingLayer(layer, layerType) {
     layer.options.pane = "drawingsPane";
+    if (layer instanceof L.Path) {
+        layer.options.renderer = lmeState.drawingsRenderer;
+    }
     layer.feature = layer.feature || { type: "Feature", properties: {} };
     layer.feature.properties = layer.feature.properties || {};
     if (layer instanceof L.Circle) {
@@ -1964,6 +2459,25 @@ function annotateDrawingLayer(layer, layerType) {
         layer.feature.properties._lmeShape = layerType;
     }
     layer.lmeManagerLabel = drawingLayerLabel(layer, layerType);
+    bindDrawingLayerSelection(layer);
+}
+
+function bindDrawingLayerSelection(layer) {
+    if (layer.lmeDrawingSelectionBound) {
+        return;
+    }
+    layer.lmeDrawingSelectionBound = true;
+    layer.on("click", event => {
+        if (drawingEditActive()) {
+            return;
+        }
+        lmeState.ignoreMapClickUntil = Date.now() + 1000;
+        if (event.originalEvent) {
+            event.originalEvent._lmeDrawingSelected = true;
+            L.DomEvent.stopPropagation(event.originalEvent);
+        }
+        selectDrawingLayer(layer);
+    });
 }
 
 function setDrawToolsVisible(visible) {
@@ -1983,6 +2497,7 @@ function setDrawToolsVisible(visible) {
     });
     lmeState.map.removeControl(lmeState.drawControl);
     lmeState.drawControl = null;
+    lmeState.drawingDeleteButton = null;
     setInfo("Strumenti di disegno nascosti.");
 }
 
@@ -1997,6 +2512,9 @@ function clearDrawings() {
         return;
     }
 
+    drawingEditToolbar()?.disable?.();
+    lmeState.drawingSelection?.clearLayers();
+    clearManagerHighlight();
     lmeState.drawings.clearLayers();
     clearManagedCategoryState("drawings");
     lmeState.drawingMeasurements.clearLayers();
@@ -2379,12 +2897,18 @@ function loadProjectSnapshot(raw, projectName) {
 
         const restoredDrawings = L.geoJSON(data.drawings || emptyFeatureCollection(), {
             pane: "drawingsPane",
-            style: { color: "#f97316", weight: 3, fillOpacity: 0.16 },
+            style: {
+                renderer: lmeState.drawingsRenderer,
+                color: "#f97316",
+                weight: 3,
+                fillOpacity: 0.16
+            },
             pointToLayer: (feature, latlng) => {
                 const properties = feature?.properties || {};
                 if (properties._lmeShape === "circle" && Number(properties._lmeRadius) > 0) {
                     return L.circle(latlng, {
                         pane: "drawingsPane",
+                        renderer: lmeState.drawingsRenderer,
                         radius: Number(properties._lmeRadius),
                         color: "#f97316",
                         weight: 3,
@@ -2392,7 +2916,7 @@ function loadProjectSnapshot(raw, projectName) {
                         fillOpacity: 0.2
                     });
                 }
-                return L.marker(latlng, { pane: "drawingsPane", draggable: true });
+                return L.marker(latlng, { pane: "drawingsPane", draggable: false });
             },
             onEachFeature: (feature, layer) => {
                 bindStoredFeaturePopup(feature, layer);
@@ -2487,6 +3011,8 @@ function captureDisplayOptions() {
         selectedParcelsVisible: lmeState.selectedParcelsVisible,
         layerOrder: [...lmeState.layerOrder],
         layerObjectOrder: { ...lmeState.managerObjectOrder },
+        layerCategoryNames: { ...lmeState.managerCategoryNames },
+        removedLayerCategories: [...lmeState.managerRemovedCategories],
         hiddenLayerObjects: [...lmeState.managerHiddenObjectIds],
         hiddenLayerMeasurementSummaries: [...lmeState.managerHiddenMeasurementSummaryIds],
         hiddenLayerMeasurementSides: [...lmeState.managerHiddenMeasurementSideIds],
@@ -2523,6 +3049,12 @@ function applyProjectDisplayOptions(options) {
     if (options.layerObjectOrder && typeof options.layerObjectOrder === "object") {
         lmeState.managerObjectOrder = options.layerObjectOrder;
     }
+    if (options.layerCategoryNames && typeof options.layerCategoryNames === "object") {
+        lmeState.managerCategoryNames = { ...options.layerCategoryNames };
+    }
+    if (Array.isArray(options.removedLayerCategories)) {
+        lmeState.managerRemovedCategories = new Set(options.removedLayerCategories);
+    }
     if (Array.isArray(options.hiddenLayerObjects)) {
         lmeState.managerHiddenObjectIds = new Set(options.hiddenLayerObjects);
     }
@@ -2609,16 +3141,26 @@ function managedGroupGeoJson(group, categoryKey) {
             }
         });
     });
+    const categoryName = lmeState.managerCategoryNames[categoryKey];
+    if (categoryName) {
+        features.forEach(feature => {
+            feature.properties = { ...(feature.properties || {}), _lmeCategoryName: categoryName };
+        });
+    }
     return { type: "FeatureCollection", features };
 }
 
 function resetLayerManagerProjectState() {
+    drawingEditToolbar()?.disable?.();
+    lmeState.drawingSelection?.clearLayers();
     lmeState.managerHiddenObjects.clear();
     lmeState.managerHiddenObjectIds.clear();
     lmeState.managerHiddenMeasurementSummaryIds.clear();
     lmeState.managerHiddenMeasurementSideIds.clear();
     lmeState.managerHiddenCategories.clear();
+    lmeState.managerRemovedCategories.clear();
     lmeState.managerObjectOrder = {};
+    lmeState.managerCategoryNames = {};
     clearManagerHighlight();
 }
 
@@ -2641,10 +3183,18 @@ function clearManagedCategoryState(categoryKey) {
 }
 
 function bindStoredFeaturePopup(feature, layer) {
-    const properties = feature?.properties || {};
+    updateStoredFeaturePopup(layer, feature?.properties);
+}
+
+function updateStoredFeaturePopup(layer, sourceProperties) {
+    const properties = sourceProperties || layer?.feature?.properties || {};
     const label = properties.name || properties.Name || properties.label || properties.LABEL;
     if (label) {
         layer.bindPopup(`<strong>${escapeHtml(label)}</strong>`);
+        return;
+    }
+    if (typeof layer?.unbindPopup === "function") {
+        layer.unbindPopup();
     }
 }