azure-devops-ui/Components/SplitButton/SplitButton.min.js

React components for building web UI in Azure DevOps

import{__assign}from"tslib";import"../../CommonImports";import"../../Core/core.css";import"./SplitButton.css";import*as React from"react";import{Button}from"../../Button";import{Expandable}from"../../Expandable";import{FocusZone,FocusZoneContext,FocusZoneDirection}from"../../FocusZone";import{IconSize}from"../../Icon";import{ContextualMenu}from"../../Menu";import*as Resources from"../../Resources.Widgets";import{css}from"../../Util";import{Location}from"../../Utilities/Position";function SplitButton(n){function t(){var t="function"==typeof n.menuButtonProps.contextualMenuProps?n.menuButtonProps.contextualMenuProps():n.menuButtonProps.contextualMenuProps;return React.createElement(ContextualMenu,{anchorElement:r.current,anchorOrigin:{horizontal:Location.end,vertical:Location.end},menuOrigin:{horizontal:Location.end,vertical:Location.start},menuProps:t.menuProps,onActivate:function(e,o){t.onActivate&&t.onActivate(e,o),i.current&&i.current.collapse()},onDismiss:function(){return i.current&&i.current.collapse()}})}var r=React.useRef(),i=n.expandableRef||React.useRef(),a=n.buttonRef,s=n.buttonProps,c=n.className,l=n.disabled,u=n.menuButtonProps,m=n.primary,p=n.subtle;return React.createElement(FocusZoneContext.Consumer,null,function(e){var o=React.createElement("div",{className:css(c,"bolt-split-button flex-stretch inline-flex-row"),ref:r},React.createElement(Button,__assign({},s,{className:css("bolt-split-button-main",s.className),disabled:l||s.disabled,focusZoneId:e.direction===FocusZoneDirection.Vertical?e.focuszoneId:void 0,primary:m,subtle:p,ref:a})),React.createElement("div",{className:css("bolt-split-button-divider flex-noshrink",m&&"primary",l&&"disabled")}),React.createElement(Expandable,{disabled:l,onCollapse:u.onCollapse,onExpand:u.onExpand,ref:i,renderCallout:n.renderCallout||t},function(e){return React.createElement("div",{className:"inline-flex-row",onMouseDown:e.onMouseDown,onKeyDown:e.onKeyDown},React.createElement(Button,__assign({ariaExpanded:e.expanded,ariaLabel:Resources.MoreActions,iconProps:{iconName:"ChevronDownMed",size:IconSize.small},text:void 0},u,{className:css("bolt-split-button-option flex-self-stretch body-s",u.className,e.expanded&&"active"),disabled:l,onClick:e.onClick,primary:m,subtle:p})))}));return o=e.direction!==FocusZoneDirection.Horizontal?React.createElement(FocusZone,{direction:FocusZoneDirection.Horizontal},o):o})}export{SplitButton};