maille
Version:
Component library for MithrilJS
64 lines (63 loc) • 2 kB
JavaScript
;
// THIS FILE WAS AUTO-GENERATED FOR PACKAGING, DO NOT MODIFY
Object.defineProperty(exports, "__esModule", { value: true });
class Card {
view(vnode) {
const classes = new Set(["maille", "maille-card"]);
// Add styling classes
if (vnode.attrs.rounded) {
classes.add("rounded");
}
if (vnode.attrs.bordered) {
classes.add("bordered");
}
if (vnode.attrs.size) {
classes.add(`size-${vnode.attrs.size}`);
}
if (vnode.attrs.shadowed) {
classes.add("shadowed");
}
if (vnode.attrs.shadowedOnHover) {
classes.add("shadowed-on-hover");
}
// Add classnames from the vnode if present
if (vnode.attrs.className) {
vnode.attrs.className.split(" ").forEach(c => classes.add(c));
}
const className = [...classes].join(" ");
// Build card component
return m("div", { className }, [
this.buildHeader(vnode),
this.buildImage(vnode),
m(".maille-card-content", vnode.children),
this.buildFooter(vnode),
]);
}
buildFooter(vnode) {
if (!vnode.attrs.footer) {
return null;
}
return m(".maile-card-footer", vnode.attrs.footer);
}
buildHeader(vnode) {
if (!vnode.attrs.header) {
return null;
}
return m(".maile-card-header", vnode.attrs.header);
}
buildImage(vnode) {
if (!vnode || !vnode.attrs || !vnode.attrs.image) {
return null;
}
const image = vnode.attrs.image;
const imageClasses = [];
if (image.fullWidth) {
imageClasses.push("full-width");
}
const className = imageClasses.join(" ");
return m(".maille-card-image-container", [
m("img.maille-card-image-img", { className, src: image.src }),
]);
}
}
exports.default = Card;