@wolf-scope/wolf-ui
Version:
UI library for web applications using Lit
36 lines (35 loc) • 1.23 kB
JavaScript
import { property as m } from "lit/decorators.js";
import { unsafeCSS as n, LitElement as c, html as i } from "lit";
import "../typography/register.mjs";
import "../typography/typography.mjs";
const b = `:host{display:block}.breadcrumb{list-style:none;padding:0;margin:0;display:flex;align-items:center}.breadcrumb li{display:inline-block;margin-right:.5rem}.breadcrumb li:last-child{font-weight:700}.separator{margin:0 .5rem;color:var(--wolf-border-color)}
`;
var f = Object.defineProperty, u = Object.getOwnPropertyDescriptor, y = (l, e, t, s) => {
for (var r = s > 1 ? void 0 : s ? u(e, t) : e, o = l.length - 1, a; o >= 0; o--)
(a = l[o]) && (r = (s ? a(e, t, r) : a(r)) || r);
return s && r && f(e, t, r), r;
};
const w = "wolf-breadcrumb";
class p extends c {
constructor() {
super(...arguments), this.items = [];
}
render() {
return i`<ul class="breadcrumb">
${this.items.map(
(e, t) => i`
<li><wolf-typography>${e}</wolf-typography></li>
${t < this.items.length - 1 ? i`<span class="separator">/</span>` : ""}
`
)}
</ul>`;
}
}
p.styles = n(b);
y([
m({ type: Array })
], p.prototype, "items", 2);
export {
p as WolfBreadcrumb,
w as tagName
};