@community-release/nx-ui 0.0.35 → 0.0.36

package/dist/module.json

@@ -1,5 +1,5 @@
 {
   "name": "ui",
   "configKey": "ui",
-  "version": "0.0.35"
+  "version": "0.0.36"
 }

package/dist/runtime/components/map/index.vue

@@ -75,6 +75,14 @@ const props = defineProps({
 		default: '',
 		type: String
 	},
+	clusterColor: {
+		default: comProps.clusterColor,
+		type: String
+	},
+	disabledClusterColor: {
+		default: comProps.disabledClusterColor,
+		type: String
+	},
 });
 
 store.coord = props.coord;
@@ -86,6 +94,8 @@ store.markers = props.markers;
 store.markerImage = props.markerImage;
 store.markerActiveImage = props.markerActiveImage;
 store.markerDisabledImage = props.markerDisabledImage;
+store.clusterColor = props.clusterColor;
+store.disabledClusterColor = props.disabledClusterColor;
 
 watch(() => props.disabledMarkers, (v) => {
 	store.setDisabledMarkers(v);

package/dist/runtime/components/map/location/nearest.vue

@@ -72,6 +72,8 @@
 		if (clickInProcess) return;
 		clickInProcess = true;
 
+		store.setSelectedMarker(null);
+
 		try {
 			// If cache not exist or it's older than 1 minute
 			if (!cachedPosition || Date.now() - cachedTime > 60000) {
@@ -107,7 +109,6 @@
 			emit('error', 'error-geo-not-enabled-on-device');
 		}
 
-		store.setSelectedMarker(null);
 		loading.value = false;
 		clickInProcess = false;
 	}

package/dist/runtime/components/map/openlayers/index.vue

@@ -75,6 +75,8 @@
 		markerActiveImage,
 		markerDisabledImage,
 		selectedMarker,
+		clusterColor,
+		disabledClusterColor,
 		userCoord
 	} = storeToRefs(store);
 
@@ -90,8 +92,6 @@
 	watch([requestCoordChange, requestZoomChange], () => {
 		if (!requestCoordChange.value && !requestZoomChange.value) return;
 
-		console.log('Watch coord or zoom change');
-
 		const options = {
 			duration: cameraDuration.value
 		};
@@ -239,18 +239,31 @@
 				const isSelected = markerId === selectedMarker.value?.id;
 
 				style = styleCache[isSelected ? 'active' : (isDisabled ? 'disabled' : 'default')];
+			
 			// If cluster
 			} else {
+				let isDisabled = false;
+
+				// Check if cluster have disabled markers
+				for (let item of allFeatures) {
+					if (disabledMarkers.value.includes(item.attributes.id)) {
+						isDisabled = true;
+						break;
+					}
+				}
+
+				const cacheId = size + (isDisabled ? 'd' : '');
+
 				// Have cache
-				if (styleCache[size]) {
-					style = styleCache[size];
+				if (styleCache[cacheId]) {
+					style = styleCache[cacheId];
 				// No cache
 				} else {
 					style = new Style({
 						image: new CircleStyle({
 							radius: 14,
 							fill: new Fill({
-								color: '#4b3aaa',
+								color: isDisabled ? disabledClusterColor.value : clusterColor.value,
 							}),
 						}),
 						text: new Text({
@@ -262,7 +275,7 @@
 						}),
 					});
 
-					styleCache[size] = style;
+					styleCache[cacheId] = style;
 				}
 			}
 

package/dist/runtime/components/map/props.json

@@ -2,5 +2,6 @@
 	"zoom": 8,
 	"zoomMin": 7,
 	"zoomMax": 18,
-	"userMarkerColor": "var(--ui-color-primary)"
+	"clusterColor": "#4b3aaa",
+	"disabledClusterColor": "#5f6761"
 }

package/dist/runtime/components/map/store.d.ts

@@ -13,6 +13,8 @@ export const useMapStore: import("pinia").StoreDefinition<"map", {
     markers: never[];
     selectedMarker: null;
     disabledMarkers: never[];
+    clusterColor: string;
+    disabledClusterColor: string;
     userCoord: never[];
 }, {
     /**

package/dist/runtime/components/map/store.mjs

@@ -34,6 +34,8 @@ export const useMapStore = defineStore('map', {
 			markers: [],
 			selectedMarker: null,
 			disabledMarkers: [],
+			clusterColor: '',
+			disabledClusterColor: '',
 
 			userCoord: []
 		}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@community-release/nx-ui",
-    "version": "0.0.35",
+    "version": "0.0.36",
     "description": "nx-ui - Nuxt UI library",
     "repository": {
         "type": "git",