Condition formatting UI is blank

Hi there,

I am buliding my custom visual and currently having the issus that the UI of conditional formatting is blank when using fillRule of capabilities value.

Have tested by ColorPicker formatting property with Fill capabilities value and it works fine.

Don't know what is wrong. My code is below:

capabilities.json

...
    "objects": {
        "dataColor": {
            "displayName": "Data Colors",
            "properties": {
                "fillRule": {
                    "displayName": "Gradient Colors",
                    "type": {
                        "fillRule": {
                            "linearGradient2": {
                                "max": {
                                    "color": "#00ff00",
                                    "value": 100
                                },
                                "min": {
                                    "color": "#ff0000",
                                    "value": 0
                                },
                                "nullColoringStrategy": {}
                            },
                            "linearGradient3": {
                                "max": {
                                    "color": "#00ff00",
                                    "value": 100
                                },
                                "mid": {
                                    "color": "#00ff00",
                                    "value": 50
                                },
                                "min": {
                                    "color": "#ff0000",
                                    "value": 0
                                },
                                "nullColoringStrategy": {}
                            }
                        }
                    }
                }
            }
        }
    }
...

setting.ts

···
class DataPointCardSettings extends Card {
    fill = new GradientBar({
        name: "fillRule",
        displayName: "Font color",
        value: {value:""},
        instanceKind: powerbi.VisualEnumerationInstanceKinds.ConstantOrRule,
        selector: dataViewWildcard.createDataViewWildcardSelector(dataViewWildcard.DataViewWildcardMatchingOption.InstancesAndTotals)
    })

    name: string = "dataColor";
    displayName: string = "Data color";
    slices: Array<Slice> = [this.fill];
}
···

Could anyone have a look? Thanks in advance.

Start with the fillRule definition in capabilities.json and the DataPointCardSettings.fill configuration in setting.ts; compare them with the working ColorPicker formatting property. Reproduce the custom visual and determine what configuration is required for the conditional-formatting UI to render instead of remaining blank.