{
  "custom": {
    "breadcrumbs": [
      "Spaces",
      "Floor 1",
      "DM11"
    ]
  },
  "params": {},
  "propConfig": {
    "custom.breadcrumbs": {
      "binding": {
        "config": {
          "path": "session.custom.breadcrumbs"
        },
        "transforms": [
          {
            "code": "\treturn value.split(\u0027/\u0027)",
            "type": "script"
          }
        ],
        "type": "property"
      },
      "persistent": true
    }
  },
  "props": {
    "defaultSize": {
      "height": 80,
      "width": 1200
    }
  },
  "root": {
    "children": [
      {
        "children": [
          {
            "meta": {
              "name": "Icon"
            },
            "position": {
              "basis": "38px",
              "shrink": 0
            },
            "propConfig": {
              "props.path": {
                "binding": {
                  "config": {
                    "path": "view.custom.breadcrumbs[0]"
                  },
                  "transforms": [
                    {
                      "fallback": "material/menu_open",
                      "inputType": "scalar",
                      "mappings": [
                        {
                          "input": "Home",
                          "output": "material/home"
                        },
                        {
                          "input": "Spaces",
                          "output": "material/domain"
                        },
                        {
                          "input": "Equipment",
                          "output": "material/settings_input_component"
                        },
                        {
                          "input": "Analysis",
                          "output": "material/analytics"
                        },
                        {
                          "input": "Alarms",
                          "output": "material/notifications"
                        },
                        {
                          "input": "Diagnostics",
                          "output": "material/build"
                        }
                      ],
                      "outputType": "scalar",
                      "type": "map"
                    }
                  ],
                  "type": "property"
                }
              }
            },
            "props": {
              "color": "var(--text-color)",
              "style": {
                "marginRight": "5px",
                "opacity": "0.50"
              }
            },
            "type": "ia.display.icon"
          },
          {
            "meta": {
              "name": "Breadcrumbs"
            },
            "position": {
              "grow": 1,
              "shrink": 0
            },
            "propConfig": {
              "props.instances": {
                "binding": {
                  "config": {
                    "path": "session.custom.breadcrumbs"
                  },
                  "transforms": [
                    {
                      "code": "\titems \u003d value.split(\u0027/\u0027)\n\treturn_array \u003d []\n\tfor item in items:\n\t\tnew_item \u003d {}\n\t\tnew_item[\u0027label\u0027] \u003d item\n\t\tnew_item[\u0027isLast\u0027] \u003d False\n\t\treturn_array.append(new_item)\n\treturn_array[-1][\u0027isLast\u0027] \u003d True\n\treturn return_array",
                      "type": "script"
                    }
                  ],
                  "type": "property"
                }
              }
            },
            "props": {
              "alignContent": "space-around",
              "alignItems": "center",
              "elementPosition": {
                "basis": "auto",
                "shrink": 0
              },
              "path": "Frames/Layouts/Header/Label",
              "style": {
                "gap": "var(--space-xs)",
                "overflow": "visible"
              }
            },
            "type": "ia.display.flex-repeater"
          },
          {
            "children": [
              {
                "events": {
                  "dom": {
                    "onClick": [
                      {
                        "config": {},
                        "enabled": false,
                        "scope": "C",
                        "type": "login"
                      },
                      {
                        "config": {
                          "script": "\tif self.session.props.auth.authenticated:\n\t\tsystem.perspective.logout()\n\telse:\n\t\tsystem.perspective.login()"
                        },
                        "scope": "G",
                        "type": "script"
                      }
                    ]
                  }
                },
                "meta": {
                  "name": "Icon"
                },
                "position": {
                  "basis": "30px"
                },
                "propConfig": {
                  "props.path": {
                    "binding": {
                      "config": {
                        "path": "session.props.auth.authenticated"
                      },
                      "transforms": [
                        {
                          "fallback": "material/login",
                          "inputType": "scalar",
                          "mappings": [
                            {
                              "input": true,
                              "output": "material/person_outline"
                            },
                            {
                              "input": false,
                              "output": "material/login"
                            }
                          ],
                          "outputType": "scalar",
                          "type": "map"
                        }
                      ],
                      "type": "property"
                    }
                  }
                },
                "props": {
                  "color": "var(--text-color)"
                },
                "type": "ia.display.icon"
              },
              {
                "events": {
                  "dom": {
                    "onClick": [
                      {
                        "config": {},
                        "enabled": false,
                        "scope": "C",
                        "type": "login"
                      },
                      {
                        "config": {
                          "script": "\tif self.session.props.auth.authenticated:\n\t\tsystem.perspective.logout()\n\telse:\n\t\tsystem.perspective.login()"
                        },
                        "scope": "G",
                        "type": "script"
                      }
                    ]
                  }
                },
                "meta": {
                  "name": "Button"
                },
                "propConfig": {
                  "props.text": {
                    "binding": {
                      "config": {
                        "path": "session.props.auth.authenticated"
                      },
                      "transforms": [
                        {
                          "fallback": "\"Login\"",
                          "inputType": "scalar",
                          "mappings": [
                            {
                              "input": true,
                              "output": "{session.props.auth.user.userName}"
                            },
                            {
                              "input": false,
                              "output": "\"Login\""
                            }
                          ],
                          "outputType": "expression",
                          "type": "map"
                        }
                      ],
                      "type": "property"
                    }
                  }
                },
                "props": {
                  "textStyle": {
                    "color": "var(--text-color)"
                  }
                },
                "type": "ia.input.button"
              }
            ],
            "meta": {
              "name": "Controls"
            },
            "position": {
              "basis": "200px"
            },
            "props": {
              "justify": "flex-end",
              "style": {
                "gap": "var(--space-xs)"
              }
            },
            "type": "ia.container.flex"
          }
        ],
        "meta": {
          "name": "Content"
        },
        "position": {
          "basis": "100%"
        },
        "props": {
          "alignContent": "center",
          "alignItems": "center",
          "style": {
            "paddingLeft": "10px"
          }
        },
        "type": "ia.container.flex"
      },
      {
        "meta": {
          "name": "Label"
        },
        "position": {
          "basis": "1px"
        },
        "props": {
          "style": {
            "border": "var(--container-border)"
          }
        },
        "type": "ia.display.label"
      }
    ],
    "meta": {
      "name": "root"
    },
    "props": {
      "alignContent": "center",
      "direction": "column",
      "style": {
        "backgroundColor": "var(--container-root)",
        "padding": "var(--space-sm)"
      }
    },
    "scripts": {
      "customMethods": [],
      "extensionFunctions": null,
      "messageHandlers": [
        {
          "messageType": "updateBreadcrumb",
          "pageScope": true,
          "script": "\tself.view.custom.path \u003d payload[\u0027target\u0027]",
          "sessionScope": false,
          "viewScope": false
        }
      ]
    },
    "type": "ia.container.flex"
  }
}