UNPKG

@gooddata/react-components

Version:

GoodData.UI - A powerful JavaScript library for building analytical applications

55 lines 3.01 kB
"use strict"; var __extends = (this && this.__extends) || (function () { var extendStatics = function (d, b) { 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 extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; })(); Object.defineProperty(exports, "__esModule", { value: true }); // (C) 2020 GoodData Corporation var React = require("react"); var Overlay_1 = require("@gooddata/goodstrap/lib/core/Overlay"); var DropdownItem_1 = require("./DropdownItem"); var DropdownToggleButton_1 = require("./DropdownToggleButton"); var FormatTemplatesDropdown = /** @class */ (function (_super) { __extends(FormatTemplatesDropdown, _super); function FormatTemplatesDropdown() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.state = { isOpened: false, }; _this.closeDropdown = function () { _this.setState({ isOpened: false }); }; _this.onSelect = function (selectedPreset) { _this.props.onChange(selectedPreset.format); setTimeout(function () { _this.closeDropdown(); }); }; _this.toggleDropdown = function () { _this.setState(function (state) { return ({ isOpened: !state.isOpened }); }); }; return _this; } FormatTemplatesDropdown.prototype.render = function () { var _this = this; var isOpened = this.state.isOpened; var _a = this.props, templates = _a.templates, separators = _a.separators; return (React.createElement("div", { className: "gd-measure-format-templates" }, React.createElement(DropdownToggleButton_1.default, { toggleDropdown: this.toggleDropdown, isOpened: isOpened }), isOpened && (React.createElement(Overlay_1.default, { closeOnOutsideClick: true, closeOnParentScroll: true, alignTo: ".gd-measure-custom-format-dialog-section-title", alignPoints: [{ align: "br tr" }, { align: "cr cl", offset: { x: 10 } }], onClose: this.closeDropdown }, React.createElement("div", { className: "gd-dropdown overlay" }, React.createElement("div", { className: "gd-measure-number-format-dropdown-body s-measure-number-format-templates-dropdown" }, templates.map(function (template) { return (React.createElement(DropdownItem_1.default, { key: template.localIdentifier, template: template, onClick: _this.onSelect, separators: separators })); }))))))); }; return FormatTemplatesDropdown; }(React.Component)); exports.FormatTemplatesDropdown = FormatTemplatesDropdown; //# sourceMappingURL=FormatTemplatesDropdown.js.map