@shoelace-style/shoelace
Version:
A forward-thinking library of web components.
50 lines (47 loc) • 1.23 kB
JavaScript
import {
card_styles_default
} from "./chunk.G227ZG7E.js";
import {
HasSlotController
} from "./chunk.NYIIDP5N.js";
import {
e
} from "./chunk.UZVKBFXH.js";
import {
component_styles_default
} from "./chunk.K23QWHWK.js";
import {
ShoelaceElement
} from "./chunk.QAHCGRIS.js";
import {
x
} from "./chunk.CXZZ2LVK.js";
// src/components/card/card.component.ts
var SlCard = class extends ShoelaceElement {
constructor() {
super(...arguments);
this.hasSlotController = new HasSlotController(this, "footer", "header", "image");
}
render() {
return x`
<div
part="base"
class=${e({
card: true,
"card--has-footer": this.hasSlotController.test("footer"),
"card--has-image": this.hasSlotController.test("image"),
"card--has-header": this.hasSlotController.test("header")
})}
>
<slot name="image" part="image" class="card__image"></slot>
<slot name="header" part="header" class="card__header"></slot>
<slot part="body" class="card__body"></slot>
<slot name="footer" part="footer" class="card__footer"></slot>
</div>
`;
}
};
SlCard.styles = [component_styles_default, card_styles_default];
export {
SlCard
};