azure-devops-ui/Components/Table/ColumnMore.min.js

React components for building web UI in Azure DevOps

import{__assign}from"tslib";import"../../CommonImports";import"../../Core/core.css";import"./Table.css";import{ObservableValue}from"../../Core/Observable";import{ExpandableButton}from"../../Button";import{ContextualMenu}from"../../Menu";import*as Resources from"../../Resources.Widgets";import{KeyCode,css,eventTargetContainsNode,preventDefault}from"../../Util";import{Location}from"../../Utilities/Position";import*as React from"react";import{IMeasurementStyle,TableColumnLayout}from"./Table.Props";!function(e){e[e.compact=2]="compact",e[e.default=2.625]="default"}(ColumnMoreWidths=ColumnMoreWidths||{});var ColumnMoreWidths,ColumnMore=function(e,t,o,a,n){var r=this;void 0===a&&(a=ColumnMoreWidths.default),this.ariaLabel=Resources.MoreActions,this.columnLayout=TableColumnLayout.none,this.id="_more",this.widthStyle=IMeasurementStyle.REM,this.renderCell=function(a,t,e,n){var o,l=React.createRef();return r.refs&&!r.refs.value[a]&&(r.refs.value[a]=l),React.createElement("td",{"aria-colindex":t+1,className:css("bolt-table-cell-side-action bolt-table-cell bolt-list-cell","col-"+t),"data-column-index":t,key:"col-more",onClick:r.onClick,onDoubleClick:preventDefault,onKeyDown:r.onKeyDown,onMouseDown:preventDefault},!r.menuAvailable||r.menuAvailable(n)?React.createElement("div",{className:"bolt-table-cell-content-reveal flex-row justify-center"},React.createElement(ExpandableButton,{ariaLabel:Resources.MoreTooltip,className:"bolt-table-button-more",excludeTabStop:!0,hideDropdownIcon:!0,iconProps:{className:"small",iconName:"MoreVertical"},onClick:function(e){r.onActivate&&r.onActivate(a,t,e)},ref:null==(o=r.refs)?void 0:o.value[a],renderCallout:function(e,t,o){return React.createElement(ContextualMenu,{anchorElement:o,anchorOrigin:{horizontal:Location.end,vertical:Location.end},menuProps:__assign(__assign({},r.menuProvider(n,a,l)),{id:t}),menuOrigin:{horizontal:Location.end,vertical:Location.start},onDismiss:e.collapse})},subtle:!0,tooltipProps:{text:Resources.MoreTooltip}})):React.createElement("span",{className:"bolt-table-cell-content visually-hidden"},Resources.NoMoreActions))},this.renderHeaderCell=function(e,t){return React.createElement("th",{"aria-colindex":e+1,"aria-label":t.ariaLabel,className:css(t.headerClassName,"bolt-table-header-cell","col-header-"+e),"data-column-index":e,key:"col-more"},React.createElement("span",{className:"visually-hidden"},t.ariaLabel))},this.onClick=function(e){e.defaultPrevented||eventTargetContainsNode(e,["A"],document.body)||e.preventDefault()},this.onKeyDown=function(e){e.defaultPrevented||e.which!==KeyCode.enter&&e.which!==KeyCode.space||eventTargetContainsNode(e,["A"])||e.preventDefault()},this.menuAvailable=t,this.menuProvider=e,this.onActivate=o,this.width=new ObservableValue(a),this.refs=n};export{ColumnMoreWidths,ColumnMore};