{
  "custom": {
    "colorHandler": {
      "auto": "#FF5101",
      "manual": "#FF5101",
      "none": "#FFFFFF"
    }
  },
  "params": {
    "Mode": 1,
    "options": [
      "Local",
      "Remote"
    ]
  },
  "propConfig": {
    "custom.colorHandler": {
      "persistent": true
    },
    "params.Mode": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.options": {
      "paramDirection": "input",
      "persistent": true
    }
  },
  "props": {
    "defaultSize": {
      "height": 20,
      "width": 60
    }
  },
  "root": {
    "children": [
      {
        "meta": {
          "name": "Label"
        },
        "position": {
          "basis": "100%",
          "grow": 1
        },
        "propConfig": {
          "position.display": {
            "binding": {
              "config": {
                "expression": "{view.params.Mode}\u003e0"
              },
              "enabled": false,
              "type": "expr"
            }
          },
          "props.style.backgroundColor": {
            "binding": {
              "config": {
                "path": "view.params.Mode"
              },
              "enabled": false,
              "transforms": [
                {
                  "code": "\tif value \u003c 0:\n\t\toutput \u003d self.view.custom.colorHandler.none\n\tif value \u003d\u003d 0:\n\t\toutput \u003d self.view.custom.colorHandler.manual\n\tif value \u003d\u003d 1:\n\t\toutput \u003d self.view.custom.colorHandler.auto\t\n\tif value \u003e 1:\n\t\toutput \u003d self.view.custom.colorHandler.none\n\t\n\n\treturn output",
                  "type": "script"
                }
              ],
              "type": "property"
            }
          },
          "props.text": {
            "binding": {
              "config": {
                "path": "view.params.Mode"
              },
              "transforms": [
                {
                  "code": "\tif value:\n\t\treturn self.view.params.options[1]\n\telse:\n\t\treturn self.view.params.options[0]",
                  "type": "script"
                }
              ],
              "type": "property"
            }
          }
        },
        "props": {
          "style": {
            "backgroundColor": "#DF5D00",
            "borderBottomLeftRadius": "var(--borderRadius)",
            "borderBottomRightRadius": "var(--borderRadius)",
            "borderTopLeftRadius": "var(--borderRadius)",
            "borderTopRightRadius": "var(--borderRadius)",
            "paddingLeft": 5,
            "paddingRight": 5
          },
          "textStyle": {
            "color": "#FFFFFF",
            "fontSize": 12,
            "textAlign": "center"
          }
        },
        "type": "ia.display.label"
      }
    ],
    "meta": {
      "name": "root"
    },
    "props": {
      "direction": "column",
      "style": {
        "borderBottomLeftRadius": "var(--borderRadius)",
        "borderBottomRightRadius": "var(--borderRadius)",
        "borderTopLeftRadius": "var(--borderRadius)",
        "borderTopRightRadius": "var(--borderRadius)",
        "boxShadow": "var(--boxShadow1)",
        "overflow": "visible"
      }
    },
    "type": "ia.container.flex"
  }
}