ukelli-ui
Version:
Base on React's UI lib. Make frontend's dev simpler and faster.
78 lines (77 loc) • 3.36 kB
JavaScript
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 __());
};
})();
import React from "react";
import { Call } from 'basic-helper';
import { DropdownWrapper } from '../selector';
import { Tip } from '../tip';
import { UkePureComponent } from '../utils/uke-component';
/**
* Avatar
*
* @export
* @class Avatar
* @extends {PureComponent}
*/
var Avatar = /** @class */ (function (_super) {
__extends(Avatar, _super);
function Avatar(props) {
var _this = _super.call(this, props) || this;
_this.changeAvatar = function (res) {
var onChangeAvatar = _this.props.onChangeAvatar;
Call(onChangeAvatar, res);
};
_this.renderMoreOptions = function (_a) {
var hide = _a.hide;
var _b = _this.props.faceOptions, faceOptions = _b === void 0 ? [] : _b;
return (React.createElement("div", { className: "avatar-options" }, faceOptions.map(function (src, idx) { return (React.createElement("span", { key: idx, className: "img", onClick: function (e) {
_this.changeAvatar(src);
hide();
} },
React.createElement("img", { alt: "", src: src }))); })));
};
_this.state = {
isShow: false,
crop: false
};
return _this;
}
Avatar.prototype.render = function () {
var _a = this.props, text = _a.text, src = _a.src, size = _a.size, position = _a.position, changeAvatarable = _a.changeAvatarable, faceOptions = _a.faceOptions, tip = _a.tip, className = _a.className, color = _a.color, children = _a.children;
var sizeStyle = size ? {
width: size, height: size, fontSize: size / 1.5
} : {};
var _img = src && (React.createElement("div", { style: {
backgroundImage: "url(" + src + ")"
}, className: "img fixbg fill" }));
var child = children || text;
var _changeAvatarable = changeAvatarable && faceOptions && faceOptions.length > 0;
var avatarDOM = (React.createElement("span", { className: "__avatar " + className },
React.createElement("span", { className: "avatar fixbg " + color, style: sizeStyle },
React.createElement("span", { className: "c" }, child),
_img),
!!tip && (React.createElement(Tip, { animate: false, scale: 22, color: "red" }, tip))));
return _changeAvatarable ? (React.createElement(DropdownWrapper, { position: position, overlay: this.renderMoreOptions }, avatarDOM)) : avatarDOM;
};
Avatar.defaultProps = {
size: 50,
text: '',
tip: false,
color: 'theme',
className: '',
changeAvatarable: false,
faceOptions: []
};
return Avatar;
}(UkePureComponent));
export default Avatar;