Define transition property of clusters and cnclustered points in mapbox gl js

Question

I'm using mapbox gl js to display markers on my map and the cluster function to cluster them as soon as the user zooms out. I render the markers like that:

// Create a layer for the clusters
map.addLayer({
    id: 'clusters',
    type: 'symbol',
    source: 'markers',
    filter: ['has', 'point_count'],
    layout: {
        'icon-image': 'clusterBackgroundCircle', 
        'icon-size': 0.2, 
        'text-field': '{point_count_abbreviated}',
        'icon-anchor': 'center',
        'icon-allow-overlap': true,
    },
    paint: {
        'text-color': 'rgba(21, 14, 86, 1)',
    },
})

// Create a layer for the individual markers
map.addLayer({
    id: 'unclustered-point',
    type: 'symbol',
    source: 'markers',
    filter: ['!', ['has', 'point_count']],
    layout: {
        'icon-image': 'custom-marker-icon', 
        'icon-size': 0.35,
        'icon-anchor': 'bottom',
        'icon-allow-overlap': true,
    },
})

In principal, that works fine. What I can't get to work is the fadein and out duration of the clusters and unclustered-points. I want them to be the same duration, which they currently aren't.

I've tried playing with the following, which is not working.

paint: {
    'icon-opacity-transition': {
        duration: 500,
        delay: 0
    },

How can I define duration for those clusters and unclustered points?