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

React components for building web UI in Azure DevOps

import{__assign,__extends}from"tslib";import"../../CommonImports";import"../../Core/core.css";import"./Checkbox.css";import*as React from"react";import{ObservableLike}from"../../Core/Observable";import{FocusGroupContext}from"../../FocusGroup";import{FocusZoneContext}from"../../FocusZone";import{Icon,IconSize}from"../../Icon";import{Observer}from"../../Observer";import{Tooltip}from"../../TooltipEx";import{css,getSafeId,KeyCode}from"../../Util";import{getTabIndex}from"../../Utilities/Focus";var checkboxId=1,TriStateCheckbox=function(o){function e(e){var t=o.call(this,e)||this;return t.checkboxElement=React.createRef(),t.animationClassName="",t.onClick=function(e){t.focus(),t.onChange(e)},t.onFocus=function(){var e=t.props.id;e&&t.context.onFocus(e)},t.onKeyDown=function(e){e.defaultPrevented||t.props.disabled||e.which===KeyCode.space&&(t.onChange(e),e.preventDefault())},t.onChange=function(e){var o;t.props.onChange&&(o=!1===(o=ObservableLike.getValue(t.props.checked))||!0===o&&!!t.props.triState&&void 0,t.props.onChange(e,o))},t.labelId="checkbox-".concat(checkboxId++,"-label"),t}return __extends(e,o),e.prototype.render=function(){var r=this,e=this.props,c=e.disabled,n=e.label,a=e.labelId,s=e.tooltipProps;return React.createElement(FocusZoneContext.Consumer,null,function(t){return React.createElement(Observer,{checked:r.props.checked},function(e){"presentation"!==r.props.role&&(o=void 0===e.checked?"mixed":e.checked?"true":"false");var o=React.createElement("div",{"aria-checked":o,"aria-describedby":getSafeId(r.props.ariaDescribedBy),"aria-disabled":r.props.disabled,"aria-label":r.props.ariaLabel,"aria-labelledby":r.props.ariaLabel?void 0:getSafeId(r.props.ariaLabelledBy),className:css(r.props.className,"bolt-checkbox cursor-pointer",!1!==e.checked&&"checked",c?"disabled":"enabled","bolt-focus-treatment",n&&"labelled"),"data-focuszone":!c&&css(r.props.focuszoneId,r.props.excludeFocusZone?void 0:t.focuszoneId),id:getSafeId(r.props.id),onClick:c?void 0:r.onClick,onFocus:r.onFocus,onKeyDown:r.onKeyDown,ref:r.checkboxElement,role:r.props.role||"checkbox",tabIndex:getTabIndex(r.props,r.context)},React.createElement("div",{className:"bolt-checkmark justify-center flex-row flex-noshrink scroll-hidden"},Icon({className:r.animationClassName,iconName:void 0===e.checked?"SkypeMinus":"CheckMark",size:IconSize.small})),n&&React.createElement("div",{className:"bolt-checkbox-label",id:getSafeId(a||r.labelId)},n),r.props.children);return o=s?React.createElement(Tooltip,__assign({addAriaDescribedBy:!0},s),o):o})})},e.prototype.componentDidMount=function(){this.animationClassName="animation-ready"},e.prototype.focus=function(){this.checkboxElement.current&&this.checkboxElement.current.focus()},e.contextType=FocusGroupContext,e}(React.Component),Checkbox=function(e){function o(){return null!==e&&e.apply(this,arguments)||this}return __extends(o,e),o.defaultProps={checked:!1},o}(TriStateCheckbox);export{TriStateCheckbox,Checkbox};