azure-devops-ui/Components/Tabs/TabBar.min.js

React components for building web UI in Azure DevOps

import{__assign,__extends}from"tslib";import"../../CommonImports";import"../../Core/core.css";import"./Tabs.css";import*as React from"react";import{ObservableLike}from"../../Core/Observable";import{ScreenContext,ScreenSize}from"../../Core/Util/Screen";import{Observer}from"../../Observer";import{SurfaceBackground,SurfaceContext}from"../../Surface";import{css}from"../../Util";import{Tab}from"./Tab";import{TabProviderContext}from"./TabProviderContext";import{Tabs}from"./Tabs";var TabBar=function(e){function r(){var r=null!==e&&e.apply(this,arguments)||this;return r.renderAdditionalContent=function(e){return e?e(!0):r.props.renderAdditionalContent&&r.props.renderAdditionalContent()},r.createTab=function(e){return React.createElement(Tab,{ariaLabel:e.ariaLabel,badgeCount:e.badgeCount,className:e.className,key:e.id,iconProps:e.iconProps,id:e.id,name:e.name,onBeforeTabChange:e.onBeforeTabChange,url:e.url&&ObservableLike.getValue(e.url),renderBadge:e.renderBadge})},r}return __extends(r,e),r.prototype.render=function(){var o=this;return React.createElement(Observer,{size:this.context.size},function(a){var n=a.size<=ScreenSize.medium;return React.createElement(SurfaceContext.Consumer,null,function(t){return React.createElement(TabProviderContext.Consumer,null,function(e){var r=o.props.selectedTabId||e.selectedId;return React.createElement("div",{className:css(o.props.className,"bolt-tabbar flex-row flex-center flex-noshrink",!o.props.disableSticky&&a.size>=ScreenSize.small&&"sticky",t.background===SurfaceBackground.neutral&&"bolt-tabbar-grey",t.background===SurfaceBackground.callout&&"bolt-tabbar-on-callout")},React.createElement(Tabs,__assign({selectedTabId:r},o.props,{className:css(o.props.tabsClassName,"bolt-tabbar-tabs flex-grow",!n&&"flex-noshrink",n&&"flex-wrap")}),o.props.children,e.tabs.map(o.createTab)),o.renderAdditionalContent(e.renderFilterBar))})})})},r.contextType=ScreenContext,r}(React.Component);export{TabBar};