choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
107 lines (84 loc) • 3.4 kB
JavaScript
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
var _react = _interopRequireWildcard(require("react"));
var _menu = _interopRequireDefault(require("../../../lib/menu"));
var _MentionsContext = require("./MentionsContext");
var Item = _menu["default"].Item;
/**
* We only use Menu to display the candidate.
* The focus is controlled by textarea to make accessibility easy.
*/
var DropdownMenu = /*#__PURE__*/function (_Component) {
(0, _inherits2["default"])(DropdownMenu, _Component);
var _super = (0, _createSuper2["default"])(DropdownMenu);
function DropdownMenu() {
var _this;
(0, _classCallCheck2["default"])(this, DropdownMenu);
_this = _super.apply(this, arguments);
_this.renderDropdown = function (_ref) {
var notFoundContent = _ref.notFoundContent,
activeIndex = _ref.activeIndex,
setActiveIndex = _ref.setActiveIndex,
selectOption = _ref.selectOption,
onFocus = _ref.onFocus,
onBlur = _ref.onBlur;
var options = _this.props.options;
var activeOption = options[activeIndex] || {};
var handleClick = function handleClick(_ref2) {
var key = _ref2.key;
var option = options.find(function (_ref3) {
var optionKey = _ref3.key;
return optionKey === key;
});
if (option) {
selectOption(option);
}
};
var selectedKeys = activeOption && activeOption.key ? [activeOption.key] : [];
return /*#__PURE__*/_react["default"].createElement(_menu["default"], {
selectedKeys: selectedKeys,
onClick: handleClick,
onFocus: onFocus,
onBlur: onBlur,
focusable: true
}, options.map(function (option, index) {
var key = option.key,
disabled = option.disabled,
children = option.children,
className = option.className,
style = option.style;
return /*#__PURE__*/_react["default"].createElement(Item, {
key: key,
disabled: disabled,
className: className,
style: style,
onMouseEnter: function onMouseEnter() {
setActiveIndex(index);
}
}, children);
}), !options.length && /*#__PURE__*/_react["default"].createElement(Item, {
disabled: true
}, notFoundContent));
};
return _this;
}
(0, _createClass2["default"])(DropdownMenu, [{
key: "render",
value: function render() {
return /*#__PURE__*/_react["default"].createElement(_MentionsContext.MentionsContextConsumer, null, this.renderDropdown);
}
}]);
return DropdownMenu;
}(_react.Component);
var _default = DropdownMenu;
exports["default"] = _default;
//# sourceMappingURL=DropdownMenu.js.map
;