azure-devops-ui
Version:
React components for building web UI in Azure DevOps
1 lines • 2.6 kB
JavaScript
import{__assign,__extends}from"tslib";import"../../CommonImports";import"../../Core/core.css";import*as React from"react";import{Button}from"../../Button";import{FilterBarItem}from"../../FilterBarItem";import*as Resources from"../../Resources.Input";import{TextField,TextFieldFocusTreatmentBehavior}from"../../TextField";import{css,KeyCode}from"../../Util";var DEFAULT_MAX_TEXT_LENGTH=200,DEFAULT_THROTTLE_WAIT=200,TextFilterBarItem=function(e){function t(){var r=null!==e&&e.apply(this,arguments)||this;return r.textField=React.createRef(),r.onClickClearButton=function(e){r.setFilterValue({value:""}),r.textField.current&&r.textField.current.focus()},r.onTextChanged=function(e,t){r.setFilterValue({value:t})},r.onKeyDown=function(e){if(r.props.filter){switch(e.which){case KeyCode.enter:r.props.filter.setFilterItemState(r.props.filterItemKey,{value:r.state.value}),r.props.filter.applyChanges();break;case KeyCode.escape:r.setFilterValue({value:""}),r.setState({value:""}),r.props.filter.applyChanges();break;default:return}e.preventDefault(),e.stopPropagation()}},r}return __extends(t,e),t.prototype.focus=function(){if(this.textField.current)return this.textField.current.focus()},t.prototype.render=function(){var t=this,e=this.state.value,r=this.props,o=r.className,l=r.clearable,a=r.placeholder,i=r.maxTextLength,n=r.inputClassName,s=r.style,c=r.width,r=r.ariaLabel,u={text:e||a,overflowOnly:!0,overflowDetected:this.overflowDetected},l=l&&e?{render:function(e){return React.createElement(Button,{ariaLabel:Resources.ClearFilter,className:css(e,"bolt-text-filterbaritem-clear"),iconProps:{iconName:"Cancel"},onClick:t.onClickClearButton})}}:void 0;return React.createElement(TextField,__assign({ariaLabel:r||a,className:css(o,"bolt-text-filterbaritem flex-grow"),containerClassName:"flex-grow",inputClassName:css(n,"bolt-text-filterbaritem-input"),inputType:"text",focusTreatment:TextFieldFocusTreatmentBehavior.keyboardOnly,maxLength:i||DEFAULT_MAX_TEXT_LENGTH,onChange:this.onTextChanged,onKeyDown:this.onKeyDown,placeholder:a,ref:this.textField,style:s,suffixIconProps:l,value:e||"",width:c,tooltipProps:u},this.getExtraTextFieldProps()))},t.prototype.overflowDetected=function(e){var t,r=!0;return e.value&&0<e.value.length?r=e.scrollWidth>e.clientWidth:(t=e.getAttribute("placeholder"),e.value=t||"",r=e.scrollWidth>e.clientWidth,e.value=""),r},t.prototype.getExtraTextFieldProps=function(){return null},t.prototype.getThrottleWait=function(){var e=this.props.throttleWait;return void 0===e?DEFAULT_THROTTLE_WAIT:e},t.defaultProps={isTextItem:!0},t}(FilterBarItem);export{TextFilterBarItem};