shelving/ui/block/Address.js

Toolkit for using data in JavaScript.

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { formatAddress } from "../../schema/AddressSchema.js";
import { Small } from "../inline/Small.js";
import { Strong } from "../inline/Strong.js";
import { getAlignClass } from "../style/Align.js";
import { getColorClass } from "../style/Color.js";
import { getSpacingClass } from "../style/Spacing.js";
import { getTypographyClass } from "../style/Typography.js";
import { getClass, getModuleClass } from "../util/css.js";
import styles from "./Address.module.css";
/** Show any kind of contact data. */
export function Address({ children, ...variants }) {
    return (_jsx("address", { className: getClass(getModuleClass(styles, "address"), getColorClass(variants), getAlignClass(variants), getSpacingClass(variants), getTypographyClass(variants)), children: children }));
}
/** Show an optional `AddressData` object correctly on screen. */
export function PhysicalAddress({ name, address }) {
    return (_jsxs(Address, { children: [name && _jsx(Strong, { children: name }), name && "\n", address ? formatAddress(address) : _jsx(Small, { children: "No address" })] }));
}
/** Show an optional email address string correctly on screen. */
export function EmailAddress({ name, email }) {
    return (_jsxs(Address, { children: [name && _jsx(Strong, { children: name }), name && "\n", email ? _jsx("a", { href: `mailto:${email}`, children: email }) : _jsx(Small, { children: "No email" })] }));
}