<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
             xmlns:g='urn:import:com.google.gwt.user.client.ui'
             xmlns:sb='urn:import:org.rstudio.studio.client.workbench.views.source.editors.text.status'>

   <ui:image field='statusBarTile' src='statusBarTile.png' repeatStyle='Horizontal'/>
   <ui:data field='statusBarSeparator' src='statusBarSeparator.png'/>

   <ui:style>
      @url SEPARATOR statusBarSeparator;
      @external gwt-Label;

      @sprite .statusBar {
         gwt-image: 'statusBarTile';
         width: 100%;
         font-size: 11px;
         color: #3c474d;
      }
      .statusBar div {
         display: inline;
         height: 16px;
         white-space: nowrap;
      }
      .statusBar .gwt-Label {
         position: relative;
         top: 1px;
      }
      .statusBar img {
         position: relative;
         top: 2px;
         margin-left: 6px;
      }
      .statusBar img.scopeIcon {
         top: 2px;
         margin-left: 4px;
      }
      .statusBar .element {
         display: block;
         cursor: default;
         padding-left: 5px;
         padding-right: 6px;
         background-image: SEPARATOR;
         background-position: right 0;
         background-repeat: no-repeat;
      }
      .statusBar .element.pos {
         min-width: 45px;
         text-align: center;
      }
      .statusBar .element.last {
         background-image: none;
      }
   </ui:style>

   <g:HorizontalPanel styleName="{style.statusBar}">
      <sb:StatusBarElementWidget ui:field="position_"
                                 styleName="{style.element} {style.pos}"
                                 showArrows="false"/>
      <g:Image ui:field="scopeIcon_"
               styleName="{style.scopeIcon}"/>
               
      <sb:StatusBarElementWidget ui:field="scope_"
                                 styleName="{style.element}"
                                 showArrows="true"/>
                                 
      <sb:StatusBarElementWidget ui:field="message_"
                                 styleName="{style.element}"
                                 showArrows="false"/>
                                 
      <sb:StatusBarElementWidget ui:field="language_"
                                 styleName="{style.element} {style.last}"
                                 showArrows="true"
                                 popupAlignment="right"/>
   </g:HorizontalPanel>
</ui:UiBinder>
