profile-plus/lib/cjs/components/ProfilePreview.js

### IOS

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ProfilePreview = void 0;
const react_1 = __importDefault(require("react"));
const ProfilePreview_module_css_1 = __importDefault(require("./ProfilePreview.module.css"));
const package_js_1 = require("../package.js");
const Person_js_1 = require("../shapes/Person.js");
const ClassNames_1 = require("lincd/utils/ClassNames");
const LinkedFileStorage_1 = require("lincd/utils/LinkedFileStorage");
const helper_js_1 = require("../utils/helper.js");
const DEFAULT_SRC = (0, LinkedFileStorage_1.asset)('/images/no-profile-picture.png');
const query = Person_js_1.Person.query((person) => ({
    profilePictureCropped: person.profilePicture.cropped.contentUrl,
    profilePictureFull: person.profilePicture.image.contentUrl,
    givenName: person.givenName,
    birthDate: person.birthDate,
}));
exports.ProfilePreview = (0, package_js_1.linkedComponent)(query, ({ profilePictureFull, profilePictureCropped, givenName, birthDate, onClick, subText, className, badgeOption, showData, rightIcon, leftIcon, }) => {
    //TODO: make it possible to add a top level className
    // check: can we use this to style the image, or other nested elements? (without using !important)
    var _a, _b;
    let src = ((_a = profilePictureCropped === null || profilePictureCropped === void 0 ? void 0 : profilePictureCropped.cropped) === null || _a === void 0 ? void 0 : _a.contentUrl) ||
        ((_b = profilePictureFull === null || profilePictureFull === void 0 ? void 0 : profilePictureFull.image) === null || _b === void 0 ? void 0 : _b.contentUrl) ||
        DEFAULT_SRC;
    // android development path fix
    const imageSource = (0, helper_js_1.replaceLocalhostWithSiteRoot)(src);
    return (react_1.default.createElement("div", { onClick: onClick, className: (0, ClassNames_1.cl)(ProfilePreview_module_css_1.default.profileCard, className) },
        react_1.default.createElement("div", { className: ProfilePreview_module_css_1.default.profileCardImage },
            badgeOption && badgeOption,
            react_1.default.createElement("div", { className: ProfilePreview_module_css_1.default.profileCardImageWrap },
                react_1.default.createElement("img", { src: imageSource, className: `${ProfilePreview_module_css_1.default.profileImage}`, alt: givenName || 'Profile Image' }))),
        (givenName || birthDate) && showData !== false && (react_1.default.createElement("div", { className: ProfilePreview_module_css_1.default.profileDataContainer },
            rightIcon && rightIcon,
            react_1.default.createElement("div", null,
                react_1.default.createElement("h1", { className: ProfilePreview_module_css_1.default.profileText },
                    givenName,
                    birthDate ? ', ' + Person_js_1.Person.getAge(birthDate) : ''),
                subText && react_1.default.createElement("h2", { className: ProfilePreview_module_css_1.default.profileSmallText }, subText)),
            leftIcon && leftIcon))));
});
//register all components in this file
// registerPackageModule(module);
//# sourceMappingURL=ProfilePreview.js.map