@ozen-ui/kit
Version:
React component library
35 lines (34 loc) • 2.36 kB
JavaScript
Object.defineProperty(exports, "__esModule", { value: true });
exports.Avatar = exports.cnAvatar = void 0;
var tslib_1 = require("tslib");
require("./Avatar.css");
var react_1 = tslib_1.__importStar(require("react"));
var useThemeProps_1 = require("../../hooks/useThemeProps");
var classname_1 = require("../../utils/classname");
var Indicator_1 = require("../Indicator");
var constants_1 = require("./constants");
var get_hash_number_1 = require("./get-hash-number");
var utils_1 = require("./utils");
exports.cnAvatar = (0, classname_1.cn)('Avatar');
exports.Avatar = (0, react_1.forwardRef)(function (inProps, ref) {
var props = (0, useThemeProps_1.useThemeProps)({ props: inProps, name: 'Avatar' });
var _a = props.size, size = _a === void 0 ? constants_1.AVATAR_DEFAULT_SIZE : _a, _b = props.online, online = _b === void 0 ? constants_1.AVATAR_DEFAULT_ONLINE : _b, _c = props.hue, hue = _c === void 0 ? constants_1.AVATAR_DEFAULT_HUE : _c, src = props.src, nameProp = props.name, className = props.className, indicatorProps = props.indicatorProps, children = props.children, other = tslib_1.__rest(props, ["size", "online", "hue", "src", "name", "className", "indicatorProps", "children"]);
var name = nameProp || '';
var indicatorSize = utils_1.matchSizeIndicatorToAvatar[size];
var colorShades = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
var color = "".concat(colorShades[(0, get_hash_number_1.getHashNumber)(name, colorShades.length)]).concat(hue);
var renderContent = function () {
if (src) {
return react_1.default.createElement("img", { src: src, alt: name, className: (0, exports.cnAvatar)('Image') });
}
if (children) {
return children;
}
return (0, utils_1.getInitials)(name);
};
return (react_1.default.createElement("div", tslib_1.__assign({ className: (0, exports.cnAvatar)({ size: size, color: !src && color }, [className]) }, other, { ref: ref }),
renderContent(),
online && (react_1.default.createElement(Indicator_1.Indicator, tslib_1.__assign({ variant: "success", size: indicatorSize, border: true }, indicatorProps, { className: (0, exports.cnAvatar)('Online', indicatorProps === null || indicatorProps === void 0 ? void 0 : indicatorProps.className) })))));
});
exports.Avatar.displayName = 'Avatar';
;