UNPKG

@atlaskit/status

Version:
108 lines 4.93 kB
/* color.tsx generated by @compiled/babel-plugin v0.39.1 */ import _classCallCheck from "@babel/runtime/helpers/classCallCheck"; import _createClass from "@babel/runtime/helpers/createClass"; import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn"; import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf"; import _inherits from "@babel/runtime/helpers/inherits"; import _defineProperty from "@babel/runtime/helpers/defineProperty"; import "./color.compiled.css"; import * as React from 'react'; import { ax, ix } from "@compiled/react/runtime"; function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); } function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } import EditorDoneIcon from '@atlaskit/icon/core/check-mark'; import { Pressable } from '@atlaskit/primitives/compiled'; import { PureComponent } from 'react'; import { FormattedMessage } from 'react-intl-next'; import { ANALYTICS_HOVER_DELAY } from '../constants'; import { messages } from '../i18n'; var styles = { button: "_2rko12b0 _19itia51 _1reo15vq _18m915vq _4t3i1tcg _1bsb1tcg _bfhki8nm _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _1e0c1ule" }; var buttonWrapperStyles = null; var Color = /*#__PURE__*/function (_PureComponent) { function Color() { var _this; _classCallCheck(this, Color); for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } _this = _callSuper(this, Color, [].concat(args)); _defineProperty(_this, "hoverStartTime", 0); _defineProperty(_this, "onMouseEnter", function () { _this.hoverStartTime = Date.now(); }); _defineProperty(_this, "onMouseLeave", function () { var onHover = _this.props.onHover; var delay = Date.now() - _this.hoverStartTime; if (delay >= ANALYTICS_HOVER_DELAY && onHover) { onHover(_this.props.value); } _this.hoverStartTime = 0; }); _defineProperty(_this, "onMouseDown", function (e) { e.preventDefault(); }); _defineProperty(_this, "onClick", function (e) { var _this$props = _this.props, onClick = _this$props.onClick, value = _this$props.value; e.preventDefault(); onClick(value); }); return _this; } _inherits(Color, _PureComponent); return _createClass(Color, [{ key: "render", value: function render() { var _this2 = this; var _this$props2 = this.props, tabIndex = _this$props2.tabIndex, backgroundColor = _this$props2.backgroundColor, isSelected = _this$props2.isSelected, borderColor = _this$props2.borderColor, iconColor = _this$props2.iconColor, value = _this$props2.value, setRef = _this$props2.setRef, onKeyDown = _this$props2.onKeyDown; return /*#__PURE__*/React.createElement("li", { className: ax(["_2rko12x7 _189ee4h9 _1dqonqa1 _1h6d1j28 _19pkze3t _2hwxv77o _otyrze3t _18u0v77o _1e0c1txw _4cvr1h6o _ca0qe4h9 _u5f3e4h9 _n3tde4h9 _19bve4h9 _bfw7ia51"]) }, /*#__PURE__*/React.createElement(FormattedMessage, messages["".concat(value, "Color")], function (labels) { return /*#__PURE__*/React.createElement(Pressable, { xcss: styles.button, onClick: _this2.onClick, onMouseEnter: _this2.onMouseEnter, onMouseLeave: _this2.onMouseLeave, onMouseDown: _this2.onMouseDown, onKeyDown: onKeyDown, tabIndex: tabIndex, title: labels[0] // button element does not support aria-selected. // For button selected (to be precise pressed) or not // use aria-pressed as per // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role#associated_aria_roles_states_and_properties , "aria-pressed": isSelected, style: { backgroundColor: backgroundColor || 'transparent', // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop color: iconColor, // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766 borderColor: borderColor }, ref: setRef }, isSelected && /*#__PURE__*/React.createElement(EditorDoneIcon, { color: "currentColor", label: labels[0] })); })); } }, { key: "componentWillUnmount", value: function componentWillUnmount() { this.hoverStartTime = 0; } }]); }(PureComponent); export { Color as default };