{
    "salt": {
      "version": "1.0.0",
      "children": [
        {
          "view": {
            "style": {
              "flex-direction": "column",
              "flex-grow": 1,
              "flex-shrink": 1,
              "padding-top": 5,
              "padding-left": 5,
              "padding-right": 5,
              "padding-bottom": 10
            },
            "children": [
              {
                "ref": {
                  "name": "label_style_portrait",
                  "value": {
                    "paddingLeft": 8,
                    "paddingRight": 8,
                    "paddingTop": 8,
                    "paddingBottom": 2
                  }
                }
              },
              {
                "ref": {
                  "name": "property_style_portrait",
                  "value": {
                    "paddingLeft": 16,
                    "paddingRight": 8,
                    "paddingTop": 2,
                    "paddingBottom": 8
                  }
                }
              },
              {
                "ref": {
                  "name": "button_style",
                  "value": {
                    "button": {
                      "margin-left": 2,
                      "margin-right": 2
                    }
                  }
                }
              },
              {
                "box": {
                  "style": {
                    "flex-grow": 1,
                    "flex-direction": "column"
                  },
                  "scroll": "vertical",
                  "scroll-content-style": {},
                  "children": [
                    {
                      "when": {
                        "assert": {
                          "expr": "$isPortrait"
                        },
                        "children": [
                          {
                            "box": {
                              "style": {
                                "flex-direction": "column",
                                "align-items": "stretch"
                              },
                              "children": [
                                {
                                  "iterator": {
                                    "type": "property",
                                    "match": [
                                      "/.*/"
                                    ],
                                    "children": [
                                      {
                                        "label": {
                                          "style": {
                                            "$ref": "label_style_portrait"
                                          }
                                        }
                                      },
                                      {
                                        "property": {
                                          "style": {
                                            "$ref": "property_style_portrait"
                                          }
                                        }
                                      }
                                    ]
                                  }
                                }
                              ]
                            }
                          }
                        ],
                        "else-children": [
                          {
                            "table": {
                              "style": {
                                "flex-direction": "column",
                                "align-items": "stretch"
                              },
                              "layout": {
                                "column": [
                                  {
                                    "wrap": false
                                  },
                                  {
                                    "wrap": true
                                  }
                                ]
                              },
                              "cellStyle": {
                                "padding": 8
                              },
                              "rows": [
                                {
                                  "label": {
                                    "style": {
                                      "$ref": "label_style_portrait"
                                    }
                                  }
                                },
                                {
                                  "property": {
                                    "style": {
                                      "$ref": "property_style_portrait"
                                    }
                                  }
                                }
                              ],
                              "row-iterator": {
                                "type": "property",
                                "match": [
                                  "/.*/"
                                ]
                              }
                            }
                          }
                        ]
                      }
                    }
                  ]
                }
              },
              {
                "box": {
                  "style": {
                    "flex-shrink": 1,
                    "flex-direction": "column"
                  },
                  "children": [
                    {
                      "action": {
                        "id": "#edit",
                        "type": "button",
                        "x-style": {
                          "$ref": "button_style"
                        }
                      }
                    },
                    {
                      "box": {
                        "style": {
                          "flex-direction": "row"
                        },
                        "children": [
                          {
                            "action": {
                              "id": "#save",
                              "type": "button",
                              "x-style": {
                                "$ref": "button_style"
                              }
                            }
                          },
                          {
                            "action": {
                              "id": "#cancel",
                              "type": "button",
                              "x-style": {
                                "$ref": "button_style",
                                "buttonType": "secondary"
                              }
                            }
                          }
                        ]
                      }
                    }
                  ]
                }
              }
            ]
          }
        }
      ]
    }
  }