Use leaflet slider with multiple clusters on map

I have an array of MarkerClusterGroup on my leaflet map.

// Creating markers from GeoJson
    var markers = function (geoJson, localizationType, color) {
        return L.geoJSON(geoJson,
            {
                pointToLayer: function (point, latlng) {
                    var icon = createMarker(localizationType, color);
                    var customMarker = L.Marker.extend({ options: { markerId: point.properties.markerId, color: color } });
                    return new customMarker(latlng, { icon: icon });
                },
                onEachFeature: function (feature, layer) {
                    layer.bindPopup(`<strong>${moment(feature.properties.activityDateTime).format('DD MMMM YYYY HH:mm:ss')}</strong>`);
                    layer.on('popupopen',
                        (marker) => {
                            highlightItemOnBottomList(marker.target.options.markerId);
                        });
                }
            });
    }

var oneItemCluster = L.markerClusterGroup({
            spiderfyOnMaxZoom: false,
            maxClusterRadius: 40,
            iconCreateFunction: function (cluster) {
                var markers = cluster.getAllChildMarkers();
                return L.divIcon({
                    html: `<div style="background:${adjustColorForCluster(markers[0].options.color)
                        }; box-shadow: 0px 0px 10px 3px ${adjustColorForCluster(markers[0].options.color)
                        };" class="customCluster"><span>${cluster.getChildCount()}</span></div>`,
                    className: 'marker-cluster',
                    iconSize: new L.Point(40, 40)
                });
            }
        });
oneItemCluster.addLayer(markers);


// Adding one item cluster into map
    addNewItem(data, itemCluster) {
        this.items.push(new Item(data));
        this.clusters.push({ itemId: data.id, cluster: itemCluster });
        this.fitCurrentBounds();
        this.map.addLayer(itemCluster);
    }
addNewItem(data, oneItemCluster);

This is becouse i have many items with different cluster images for them and they should not cluster into each other even on max zoom out.

I'm trying to use this slider leaflet plugin to filter markers by activityDateTime property stored in geoJson.

Is there a way to use only one slider to filter whole array of clusters? I was able to create multiple sliders, one for each cluster, but I need one slider to filter them all.

I've tried to do this with subgroup plugin, but not sure there is possibility to assign different styles to each subgroup cluster.

Leaflet slider plugin

I'd like to achieve something similar to this :

Example

But subgroups should not merge, and each one should have different style to easily distinguish them.

from Use leaflet slider with multiple clusters on map