UNPKG

azure-devops-ui

Version:

React components for building web UI in Azure DevOps

1 lines 2.08 kB
import{__assign}from"tslib";import"../../CommonImports";import"../../Core/core.css";import*as React from"react";import{MasterDetailsContext}from"../../MasterDetailsContext";import{Observer}from"../../Observer";import{Surface,SurfaceBackground}from"../../Surface";import{css}from"../../Util";import{SingleLayerMasterPanel,SingleLayerMasterPanelHeader}from"../SingleLayerMasterPanel/SingleLayerMasterPanel";import*as Utils_Accessibility from"../../Core/Util/Accessibility";var MasterPanel=function(e){var r=e.className,t=e.showOnSmallScreens,e=(React.useRef(null),React.useContext(MasterDetailsContext));return React.createElement(Surface,{background:SurfaceBackground.neutral},React.createElement(Observer,{masterDetailsLayer:e.getCurrentLayer(),hideDetailsPanel:e.hideDetailsPanel},function(e){return React.createElement(MasterPanelInternal,{className:css(r,e.hideDetailsPanel&&"full-screen"),layer:e.masterDetailsLayer,showOnSmallScreens:t||e.hideDetailsPanel})}))},MasterPanelInternal=function(e){var r=e.className,t=e.layer,a=e.showOnSmallScreens,n=React.createRef(),s=React.useRef(!0),c=(React.useEffect(function(){s.current?s.current=!1:(n.current&&n.current.focus(),Utils_Accessibility.announce(t.ariaLabel))},[e.layer]),t.masterPanelContent),l=t.parentItem,o=t.selectedMasterItem,e=c.renderHeader?function(){return c.renderHeader(l)}:void 0,i=c.renderSearch?function(){return c.renderSearch(l)}:void 0,u=c.renderContent?function(){return c.renderContent(l,o)}:void 0;return React.createElement(React.Fragment,null,React.createElement("div",{ref:n,tabIndex:-1}),React.createElement(SingleLayerMasterPanel,{className:r,key:"master-panel-".concat(t.key),renderContent:u,renderHeader:e,renderSearch:i,showOnSmallScreens:a}))},MasterPanelHeader=function(e){var r=React.useContext(MasterDetailsContext),t=r.getCurrentLayer().value.masterPanelContent;return React.createElement(SingleLayerMasterPanelHeader,__assign({},e,{onBackButtonClick:!1!==t.hideBackButton?void 0:function(){!1!==(t.onBackButtonClick&&t.onBackButtonClick())&&r.pop()}}))};export{MasterPanel,MasterPanelHeader};