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

### IOS

import React from 'react';
import style from './ProfilePreview.module.css';
import { linkedComponent } from '../package.js';
import { Person } from '../shapes/Person.js';
import { cl } from 'lincd/utils/ClassNames';
import { asset } from 'lincd/utils/LinkedFileStorage';
import { replaceLocalhostWithSiteRoot } from '../utils/helper.js';
const DEFAULT_SRC = asset('/images/no-profile-picture.png');
const query = Person.query((person) => ({
    profilePictureCropped: person.profilePicture.cropped.contentUrl,
    profilePictureFull: person.profilePicture.image.contentUrl,
    givenName: person.givenName,
    birthDate: person.birthDate,
}));
export const ProfilePreview = 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 = replaceLocalhostWithSiteRoot(src);
    return (React.createElement("div", { onClick: onClick, className: cl(style.profileCard, className) },
        React.createElement("div", { className: style.profileCardImage },
            badgeOption && badgeOption,
            React.createElement("div", { className: style.profileCardImageWrap },
                React.createElement("img", { src: imageSource, className: `${style.profileImage}`, alt: givenName || 'Profile Image' }))),
        (givenName || birthDate) && showData !== false && (React.createElement("div", { className: style.profileDataContainer },
            rightIcon && rightIcon,
            React.createElement("div", null,
                React.createElement("h1", { className: style.profileText },
                    givenName,
                    birthDate ? ', ' + Person.getAge(birthDate) : ''),
                subText && React.createElement("h2", { className: style.profileSmallText }, subText)),
            leftIcon && leftIcon))));
});
//register all components in this file
// registerPackageModule(module);
//# sourceMappingURL=ProfilePreview.js.map