UNPKG

kea-react

Version:

Componentes comunes de react

78 lines (77 loc) 3.34 kB
"use strict"; var __extends = (this && this.__extends) || (function () { var extendStatics = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; })(); var __assign = (this && this.__assign) || Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; Object.defineProperty(exports, "__esModule", { value: true }); var React = require("react"); var NavBarMenuItemComponent = /** @class */ (function (_super) { __extends(NavBarMenuItemComponent, _super); function NavBarMenuItemComponent(props) { var _this = _super.call(this, props) || this; _this.itemStyle = { paddingLeft: "20px", paddingRight: "20px", paddingTop: "3px", paddingBottom: "3px", whiteSpace: "nowrap", }; _this.handleOnMouseEnter = function () { _this.setState({ hover: true }); }; _this.handleOnMouseLeave = function () { _this.setState({ hover: false }); }; _this.state = { hover: false }; return _this; } NavBarMenuItemComponent.prototype.render = function () { var background = this.state.hover ? "rgba(47,164,231,1)" : "white"; var color = this.state.hover ? "white" : "#333"; var style = { background: background, color: color }; return (React.createElement("div", { onClick: this.props.onClick, style: __assign({}, this.itemStyle, style), onMouseEnter: this.handleOnMouseEnter, onMouseLeave: this.handleOnMouseLeave }, this.props.content)); }; return NavBarMenuItemComponent; }(React.PureComponent)); var NavBarMenu = /** @class */ (function (_super) { __extends(NavBarMenu, _super); function NavBarMenu() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.containerStyle = { position: "absolute", background: "white", top: (_this.props.height + 1) + "px", right: 0, left: "auto", paddingTop: "5px", paddingBottom: "5px", borderBottomLeftRadius: "5px", borderBottomRightRadius: "5px", minWidth: "100%", boxShadow: "rgba(0,0,0,0.2) 0 6px 20px ", zIndex: 10000 }; return _this; } NavBarMenu.prototype.render = function () { return (React.createElement("div", { style: this.containerStyle }, this.props.items .filter(function (x) { return x; }) .map(function (x, i) { return !(x.visible == false) && React.createElement(NavBarMenuItemComponent, { content: x.content, key: i, onClick: x.onClick }); }))); }; return NavBarMenu; }(React.PureComponent)); exports.NavBarMenu = NavBarMenu;