UNPKG

3.54 kBJavaScriptView Raw
1"use strict";
2var __extends = (this && this.__extends) || (function () {
3 var extendStatics = function (d, b) {
4 extendStatics = Object.setPrototypeOf ||
5 ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
6 function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
7 return extendStatics(d, b);
8 };
9 return function (d, b) {
10 extendStatics(d, b);
11 function __() { this.constructor = d; }
12 d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
13 };
14})();
15var __importDefault = (this && this.__importDefault) || function (mod) {
16 return (mod && mod.__esModule) ? mod : { "default": mod };
17};
18Object.defineProperty(exports, "__esModule", { value: true });
19exports.ToolbarMenuItem = exports.ToolbarMenu = void 0;
20var react_1 = __importDefault(require("react"));
21var ToolbarMenu = (function (_super) {
22 __extends(ToolbarMenu, _super);
23 function ToolbarMenu(props) {
24 var _this = _super.call(this, props) || this;
25 _this._node = null;
26 _this._listener = null;
27 _this.handleOpen = function (e) {
28 preventDefault(e);
29 _this.setState({ visible: true });
30 _this._subscribe();
31 };
32 _this.state = { visible: false };
33 return _this;
34 }
35 ToolbarMenu.prototype.componentWillUnmount = function () {
36 this._release();
37 };
38 ToolbarMenu.prototype.render = function () {
39 var _this = this;
40 var visible = this.state.visible;
41 return (react_1.default.createElement("a", { className: "toolbar-menu toolbar-button", onClick: this.handleOpen.bind(this), onMouseDown: preventDefault, ref: function (node) {
42 if (node) {
43 _this._node = node;
44 }
45 }, title: this.props.title },
46 this.props.label,
47 react_1.default.createElement("svg", { width: "14", height: "8" },
48 react_1.default.createElement("path", { fill: "#666", d: "M 5 1.5 L 14 1.5 L 9.5 7 z" })),
49 react_1.default.createElement("ul", { className: 'toolbar-menu-items' + (visible ? ' open' : '') }, this.props.children)));
50 };
51 ToolbarMenu.prototype._subscribe = function () {
52 if (!this._listener) {
53 this._listener = this.handleClick.bind(this);
54 document.addEventListener('click', this._listener);
55 }
56 };
57 ToolbarMenu.prototype._release = function () {
58 if (this._listener) {
59 document.removeEventListener('click', this._listener);
60 this._listener = null;
61 }
62 };
63 ToolbarMenu.prototype.handleClick = function (e) {
64 if (this._node !== e.target) {
65 e.preventDefault();
66 this.setState({ visible: false });
67 this._release();
68 }
69 };
70 return ToolbarMenu;
71}(react_1.default.Component));
72exports.ToolbarMenu = ToolbarMenu;
73var ToolbarMenuItem = function (_a) {
74 var onSelect = _a.onSelect, title = _a.title, label = _a.label;
75 return (react_1.default.createElement("li", { onMouseOver: function (e) {
76 e.currentTarget.className = 'hover';
77 }, onMouseOut: function (e) {
78 e.currentTarget.className = '';
79 }, onMouseDown: preventDefault, onMouseUp: onSelect, title: title }, label));
80};
81exports.ToolbarMenuItem = ToolbarMenuItem;
82function preventDefault(e) {
83 e.preventDefault();
84}
85//# sourceMappingURL=ToolbarMenu.js.map
\No newline at end of file