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

React components for building web UI in Azure DevOps

import{__extends}from"tslib";import"../../CommonImports";import"../../Core/core.css";import"./Toast.css";import*as React from"react";import{makeCancelable}from"../../Core/Util/Promise";import{Button}from"../../Button";import{Callout,ContentJustification,ContentLocation}from"../../Callout";import{Measure}from"../../Measure";import{css,getSafeId,KeyCode}from"../../Util";var Toast=function(e){function t(t){var o=e.call(this,t)||this;return o.callToActionRef=React.createRef(),o.onCallToActionClick=function(t){o.props.onCallToActionClick&&o.props.onCallToActionClick(t)},o.onKeyboardShortcut=function(t){o.callToActionRef.current&&!o.state.fadingOut&&t.ctrlKey&&t.altKey&&t.which===KeyCode.t&&o.callToActionRef.current.focus()},o.onMeasureCallToAction=function(t,e){o.setState({callToActionWidth:t})},o.state={fadingOut:!1},o}return __extends(t,e),t.prototype.fadeOut=function(){var e=this,t=(this.fadeOutPromise&&this.fadeOutPromise.cancel(),new Promise(function(t){e.setState({fadingOut:!0}),setTimeout(function(){t()},500)}));return this.fadeOutPromise=makeCancelable(t),this.fadeOutPromise},t.prototype.render=function(){var t=this.props,e=t.message,o=t.callToAction,t=t.className,n=this.state,a=n.callToActionWidth,a=!o||!a||a<=120,c=a?"one-line flex-row":"multi-line flex-column",a=a?"flex-grow":void 0,n=n.fadingOut?"fade-out":void 0;return React.createElement(Callout,{className:css(t,"bolt-toast no-events"),contentClassName:css("bolt-toast-content",c,n),contentJustification:ContentJustification.Center,contentLocation:ContentLocation.End},React.createElement("span",{className:css("bolt-toast-message flex-shrink",a),id:getSafeId("toast-message"),role:"alert"},e),o&&React.createElement(React.Fragment,null,React.createElement("span",{className:"bolt-toast-separator flex-noshrink"}),React.createElement(Measure,{onMeasure:this.onMeasureCallToAction},React.createElement("div",{className:"bolt-toast-call-to-action-container"},React.createElement(Button,{ariaDescribedBy:"toast-message",className:"bolt-toast-call-to-action flex-noshrink",ref:this.callToActionRef,subtle:!0,onClick:this.onCallToActionClick},o)))))},t.prototype.componentDidMount=function(){document.addEventListener("keydown",this.onKeyboardShortcut)},t.prototype.componentWillUnmount=function(){this.fadeOutPromise&&this.fadeOutPromise.cancel(),document.removeEventListener("keydown",this.onKeyboardShortcut)},t}(React.Component);export{Toast};