@utrecht/web-component-library-stencil
Version:
Stencil component library bundle for the Municipality of Utrecht based on the NL Design System architecture
70 lines (69 loc) • 2.82 kB
JavaScript
/**
* @license EUPL-1.2
* Copyright (c) 2020-2024 Frameless B.V.
* Copyright (c) 2021-2024 Gemeente Utrecht
*/
import { h } from "@stencil/core";
import clsx from "clsx";
export class BreadcrumbNav {
constructor() {
this.json = undefined;
this.variant = undefined;
}
render() {
const { json, variant } = this;
const items = json ? JSON.parse(json) : [];
return (h("nav", { key: 'd399bf3ea101cc6663bedaa0aed2d8e89c8cb83a', class: clsx('utrecht-breadcrumb-nav', variant === 'arrows' && 'utrecht-breadcrumb-nav--arrows') }, h("ol", { key: 'a191549267d47ff72187ba9806b4ca01f428472e', class: "utrecht-breadcrumb-nav__list utrecht-breadcrumb-nav__list--html-ol", itemscope: true, itemtype: "https://schema.org/BreadcrumbList" }, items.map(({ href, title, current }, index) => (h("li", { key: href, class: "utrecht-breadcrumb-nav__item", itemscope: true, itemtype: "https://schema.org/ListItem", itemprop: "itemListElement" }, h("a", { class: clsx('utrecht-breadcrumb-nav__link', 'utrecht-link', 'utrecht-link--html-a', current && 'utrecht-link--current'), href: href, "aria-current": current ? 'location' : null, itemprop: "item" }, h("span", { class: "utrecht-breadcrumb-nav__text", itemprop: "name" }, title), h("meta", { itemprop: "position", content: index + 1 }))))))));
}
static get is() { return "utrecht-breadcrumb-nav"; }
static get encapsulation() { return "shadow"; }
static get originalStyleUrls() {
return {
"$": ["breadcrumb-nav.scss"]
};
}
static get styleUrls() {
return {
"$": ["breadcrumb-nav.css"]
};
}
static get properties() {
return {
"json": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": ""
},
"attribute": "json",
"reflect": false
},
"variant": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": ""
},
"attribute": "variant",
"reflect": false
}
};
}
}
//# sourceMappingURL=breadcrumb-nav.js.map