Visualizer 
{
    "value": "idle",
    "previousValue": "",
    "event": {},
    "previousEvent": {},
    "context": {
        "dir": "ltr",
        "value": {
            "h": 0,
            "s": 100,
            "l": 50,
            "a": 1
        },
        "format": "hsla",
        "disabled": false,
        "closeOnSelect": false,
        "id": ":R1m:",
        "name": "color",
        "activeId": null,
        "activeChannel": null,
        "activeOrientation": null,
        "fieldsetDisabled": false,
        "restoreFocus": true,
        "positioning": {
            "placement": "bottom"
        },
        "isRtl": false,
        "isDisabled": false,
        "isInteractive": true,
        "valueAsString": "hsla(0, 100%, 50%, 1)",
        "areaValue": {
            "h": 0,
            "s": 100,
            "l": 50,
            "a": 1
        },
        "readOnly": false
    },
    "done": false,
    "tags": [
        "closed"
    ],
    "nextEvents": [
        "CONTROLLED.OPEN",
        "OPEN",
        "TRIGGER.CLICK",
        "CHANNEL_INPUT.FOCUS",
        "VALUE.SET",
        "FORMAT.SET",
        "CHANNEL_INPUT.CHANGE",
        "EYEDROPPER.CLICK"
    ],
    "changed": false
}