cosmo-ui
Version:
Common React components
59 lines • 2.49 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = require("react");
var cx = require("classnames");
var styles = require('../../src/styles/components/icon.scss');
var rotations = [90, 180, 270];
var Icon = (function (_super) {
tslib_1.__extends(Icon, _super);
function Icon() {
return _super !== null && _super.apply(this, arguments) || this;
}
Icon.prototype.render = function () {
var _a = this.props, id = _a.id, onClick = _a.onClick;
return (React.createElement("svg", { id: id, className: this.containerClassName(), style: this.containerStyles(), onClick: onClick },
React.createElement("use", { className: this.iconClassName(), xlinkHref: this.xLinkHref(), style: this.iconStyles() })));
};
Icon.prototype.containerClassName = function () {
var _a = this.props, className = _a.className, containerClassName = _a.containerClassName, rotate = _a.rotate;
return cx(styles.container, (_b = {},
_b[styles["rotate" + rotate]] = rotate !== undefined,
_b), containerClassName, className);
var _b;
};
Icon.prototype.containerStyles = function () {
var size = this.props.size;
var containerStyles = {};
var sizeStyles = {
width: size + "px",
height: size + "px",
};
return tslib_1.__assign({}, containerStyles, sizeStyles);
};
Icon.prototype.iconClassName = function () {
var _a = this.props, className = _a.className, stroke = _a.stroke, fill = _a.fill;
return cx(className, (_b = {},
_b[styles['primary-stroke']] = stroke === 'primary',
_b[styles['primary-fill']] = fill === 'primary',
_b));
var _b;
};
Icon.prototype.iconStyles = function () {
var _a = this.props, primary = _a.primary, stroke = _a.stroke, fill = _a.fill;
var iconStyles = {};
var strokeStyles = !primary && stroke ? { stroke: stroke } : {};
var fillStyles = !primary && fill ? { fill: fill } : {};
return tslib_1.__assign({}, iconStyles, strokeStyles, fillStyles);
};
Icon.prototype.xLinkHref = function () {
var _a = this.props, href = _a.href, icon = _a.icon;
return href || "#icon-" + icon;
};
return Icon;
}(React.Component));
Icon.defaultProps = {
size: 18,
};
exports.Icon = Icon;
//# sourceMappingURL=icon.js.map