cosmo-ui
Version:
Common React components
45 lines • 2.31 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = require("react");
var cx = require("classnames");
var utils_1 = require("../utils");
var column_1 = require("./column");
var icon_1 = require("./icon");
var row_1 = require("./row");
var styles = require('../../src/styles/components/action-box.scss');
var display = require('../../src/styles/common/display.scss');
var ActionBox = (function (_super) {
tslib_1.__extends(ActionBox, _super);
function ActionBox() {
return _super !== null && _super.apply(this, arguments) || this;
}
ActionBox.prototype.render = function () {
var hidden = this.props.hidden;
return (React.createElement(row_1.Row, { className: cx(styles.container), style: {
display: hidden ? 'none' : undefined,
} }, this.actionNodes()));
};
ActionBox.prototype.actionNodes = function () {
var actions = this.props.actions;
return actions.map(function (action) {
return React.createElement(ActionNode, tslib_1.__assign({ key: action.className }, action));
});
};
return ActionBox;
}(React.Component));
exports.ActionBox = ActionBox;
var ActionNode = function (_a) {
var className = _a.className, icon = _a.icon, tooltip = _a.tooltip, onClick = _a.onClick, disabled = _a.disabled, strokeIcon = _a.strokeIcon, iconProps = _a.iconProps;
return React.createElement(column_1.Column, { className: cx("action-" + className, styles.item), onClick: utils_1.mkNonPropagatingClick(onClick), style: { position: 'relative' }, "data-tooltip": tooltip, "data-tooltip-pos": "down" },
React.createElement(icon_1.Icon, tslib_1.__assign({ icon: icon, size: 18, stroke: strokeIcon ? 'primary' : 'none', fill: strokeIcon ? 'none' : 'primary', containerClassName: cx(styles.icon, (_b = {},
_b[styles.disabled] = disabled && !strokeIcon,
_b[styles.disabledStroke] = disabled && strokeIcon,
_b)) }, iconProps)),
disabled
? (React.createElement("div", { className: styles.statusIcon },
React.createElement(icon_1.Icon, { icon: "warning-triangle", size: 12 })))
: null);
var _b;
};
//# sourceMappingURL=action-box.js.map