fix distributed style assignment

lib/layer/featureStyle.mjs

@@ -12,6 +12,8 @@ export default layer => {
 
     featureProperties(feature)
 
+    //console.log(feature.properties)
+
     // A filter flag is set either in the layer styles object or in the theme.
     if ((layer.style.filter || layer.style.theme?.filter)
 
@@ -145,27 +147,10 @@ export default layer => {
     // The layer.highlight must be a match for the feature ID.
     if (layer.highlight !== (feature.get('id') || feature.getId())) return;
 
-    if (feature.geometryType !== 'Point') {
-
-      // Merge highlight with feature style for non point features.
-      mapp.utils.merge(feature.style, layer.style.highlight)
-      return;
-    }
-
-    // Highlighted point features should be drawn on top.
-    feature.style.zIndex = Infinity
-
-    if (layer.style.highlight.icon) {
-
-      feature.style.icon = Array.isArray(layer.style.highlight.icon)
-
-        // Array icon styles must not be assigned.
-        ? layer.highlight.icon
-        : Object.assign(feature.style.icon, layer.style.highlight.icon)
+    feature.style = {
+      ...structuredClone(layer.style.highlight),
+      ...feature.style
     }
-
-    // The highlight scale is defined as scale in the highlight style block.
-    feature.style.highlightScale = layer.style.highlight.scale
   }
 
   function labelStyle(feature) {

lib/layer/styleParser.mjs

@@ -3,8 +3,7 @@ const iconKeys = new Set([
   'scale',
   'url',
   'svg',
-  'type',
-  'fillColor'])
+  'type'])
 
 const styleKeys = new Set([
   'icon',
@@ -13,20 +12,28 @@ const styleKeys = new Set([
   'strokeWidth',
   'strokeOpacity',
   'fillOpacity',
+  'fillColor',
   'clusterScale',
   'zoomInScale',
   'zoomOutScale',
   'highlightScale']).union(iconKeys)
 
 export default layer => {
 
+  // Assign a default highlight style and ensure that zIndex is infinity if not implicit.
+  layer.style.highlight ??= {}
+  layer.style.highlight.zIndex ??= Infinity
+  layer.style.highlight.highlightScale = layer.style.highlight.scale
+  delete layer.style.highlight.scale
+
   layer.style ??= {}
 
   layer.style.default ??= {
     strokeColor: '#333',
     fillColor: '#fff9',
     icon: {
-      type: 'dot'
+      type: 'dot',
+      fillColor: '#fff',
     }
   }
 

lib/layer/themes/distributed.mjs

@@ -12,8 +12,7 @@ export default function(theme, feature) {
   // The feature field property value already has a style assigned.
   if (theme.lookup[ID]) {
 
-    // Assign style from lookup object.
-    mapp.utils.merge(feature.style, theme.lookup[ID].style)
+    feature.style = theme.lookup[ID].style
     return;
   }
 
@@ -72,6 +71,5 @@ export default function(theme, feature) {
   // Assign the style to the lookup object for the feature field property value.
   theme.lookup[ID] = theme.cat_arr[i]
 
-  // Merge the cat style with the feature style.
-  mapp.utils.merge(feature.style, theme.lookup[ID])
+  feature.style = theme.lookup[ID].style
 }