@visactor/react-vtable/cjs/components/avatar/avatar.js

The react version of VTable

"use strict";

var __importDefault = this && this.__importDefault || function(mod) {
    return mod && mod.__esModule ? mod : {
        default: mod
    };
};

Object.defineProperty(exports, "__esModule", {
    value: !0
}), exports.Avatar = void 0;

const vrender_1 = require("@visactor/vtable/es/vrender"), vutils_1 = require("@visactor/vutils"), react_1 = __importDefault(require("react")), table_components_1 = require("../../table-components"), defaultProps = {
    textStyle: {
        fontSize: 14,
        fontFamily: "sans-serif",
        fill: "#FFF"
    },
    panelStyle: {
        visible: !0,
        fill: "rgb(201, 205, 212)",
        lineWidth: 1,
        cornerRadius: 2
    },
    size: 40,
    shape: "circle",
    autoFixFontSize: !0
};

function AvatarComponent(baseProps, ref) {
    const props = (0, vutils_1.merge)({}, defaultProps, baseProps), {size: size, children: children, onClick: onClick} = props;
    let avatarRef = react_1.default.useRef(null);
    avatarRef = ref || avatarRef;
    const handleClick = react_1.default.useCallback((event => {
        onClick && onClick(event);
    }), [ onClick ]), groupAttribute = getGroupAttribute(props);
    if ((0, vutils_1.isString)(children)) {
        const textAttribute = getTextAttribute(props);
        return react_1.default.createElement(table_components_1.Group, {
            ref: avatarRef,
            attribute: groupAttribute,
            onClick: handleClick
        }, react_1.default.createElement(table_components_1.Text, {
            attribute: textAttribute
        }));
    }
    return "image" === children.type && (children.props.attribute.width = size, children.props.attribute.height = size), 
    react_1.default.createElement(table_components_1.Group, {
        ref: avatarRef,
        attribute: groupAttribute,
        onClick: handleClick
    }, children);
}

function getTextAttribute(props) {
    const {textStyle: textStyle, size: size, children: children, autoFixFontSize: autoFixFontSize} = props, attribute = Object.assign({
        text: children
    }, textStyle);
    return autoFixFontSize && getAutoFixFontSize(size, attribute), attribute;
}

function getGroupAttribute(props) {
    var _a;
    const {panelStyle: panelStyle, size: size, shape: shape} = props;
    return Object.assign(Object.assign({}, panelStyle), {
        width: size,
        height: size,
        clip: !0,
        cornerRadius: "circle" === shape ? size / 2 : null !== (_a = panelStyle.cornerRadius) && void 0 !== _a ? _a : 2,
        display: "flex",
        alignItems: "center",
        justifyContent: "center",
        visibleAll: !0,
        path: void 0
    });
}

function getAutoFixFontSize(size, attribute) {
    const scale = size / ((0, vrender_1.measureTextSize)(attribute.text, attribute).width + 8), fontSize = Math.max(Math.floor(attribute.fontSize * scale), 6);
    attribute.fontSize = fontSize;
}

//# sourceMappingURL=avatar.js.map
exports.Avatar = react_1.default.forwardRef(AvatarComponent), exports.Avatar.displayName = "Avatar";