1 | "use strict";
|
2 | var __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 | })();
|
15 | var __importDefault = (this && this.__importDefault) || function (mod) {
|
16 | return (mod && mod.__esModule) ? mod : { "default": mod };
|
17 | };
|
18 | Object.defineProperty(exports, "__esModule", { value: true });
|
19 | exports.ToolbarMenuItem = exports.ToolbarMenu = void 0;
|
20 | var react_1 = __importDefault(require("react"));
|
21 | var 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));
|
72 | exports.ToolbarMenu = ToolbarMenu;
|
73 | var 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 | };
|
81 | exports.ToolbarMenuItem = ToolbarMenuItem;
|
82 | function preventDefault(e) {
|
83 | e.preventDefault();
|
84 | }
|
85 |
|
\ | No newline at end of file |