@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
77 lines (76 loc) • 2.17 kB
JavaScript
import { BREADCRUMBS_INVERTED_MODIFIER as c } from "./breadcrumbs-constants.js";
import u from "./breadcrumb-item.js";
import s from "../../common/utils/index.js";
import { DialtoneLocalization as b } from "../../localization/index.js";
import { resolveComponent as _, createElementBlock as o, openBlock as t, normalizeClass as f, createElementVNode as B, renderSlot as p, Fragment as E, renderList as D, createBlock as I, mergeProps as R } from "vue";
import { _ as v } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
const g = {
compatConfig: { MODE: 3 },
name: "DtBreadcrumbs",
components: {
DtBreadcrumbItem: u
},
props: {
/**
* A provided list of breadcrumbs. Overridden by default slot
*/
breadcrumbs: {
type: Array,
default: () => [],
validate(r) {
return r.every(({ href: a, label: e }) => a !== void 0 && e !== void 0);
}
},
/**
* Passed through to link. If true, applies inverted styles to the link.
* @values true, false
*/
inverted: {
type: Boolean,
default: !1
},
/**
* Descriptive label for the navigation content.
*/
ariaLabel: {
type: String,
default: ""
}
},
data() {
return {
BREADCRUMBS_INVERTED_MODIFIER: c,
i18n: new b()
};
},
methods: {
getBreadcrumbItemKey(r) {
return `breadcrumbs-item-${r}-${s.getUniqueString()}`;
}
}
}, y = ["aria-label"];
function A(r, a, e, L, n, m) {
const d = _("dt-breadcrumb-item");
return t(), o("nav", {
"aria-label": e.ariaLabel || n.i18n.$t("DIALTONE_BREADCRUMBS_ARIA_LABEL"),
"data-qa": "dt-breadcrumbs",
class: f([
"d-breadcrumbs",
{ [n.BREADCRUMBS_INVERTED_MODIFIER]: e.inverted }
])
}, [
B("ol", null, [
p(r.$slots, "default", {}, () => [
(t(!0), o(E, null, D(e.breadcrumbs, (i, l) => (t(), I(d, R({
key: m.getBreadcrumbItemKey(l),
inverted: e.inverted
}, i), null, 16, ["inverted"]))), 128))
])
])
], 10, y);
}
const U = /* @__PURE__ */ v(g, [["render", A]]);
export {
U as default
};
//# sourceMappingURL=breadcrumbs.js.map