@dialpad/dialtone-vue
Version:
Vue component library for Dialpad's design system Dialtone
70 lines (69 loc) • 1.88 kB
JavaScript
import { BREADCRUMBS_INVERTED_MODIFIER as d } from "./breadcrumbs-constants.js";
import m from "./breadcrumb-item.js";
import i from "../../common/utils/index.js";
import { DialtoneLocalization as o } from "../../localization/index.js";
import { n as s } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
const u = {
name: "DtBreadcrumbs",
components: {
DtBreadcrumbItem: m
},
props: {
/**
* A provided list of breadcrumbs. Overridden by default slot
*/
breadcrumbs: {
type: Array,
default: () => [],
validate(t) {
return t.every(({ href: e, label: r }) => e !== void 0 && r !== 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: d,
i18n: new o()
};
},
methods: {
getBreadcrumbItemKey(t) {
return `breadcrumbs-item-${t}-${i.getUniqueString()}`;
}
}
};
var c = function() {
var e = this, r = e._self._c;
return r("nav", { class: [
"d-breadcrumbs",
{ [e.BREADCRUMBS_INVERTED_MODIFIER]: e.inverted }
], attrs: { "aria-label": e.ariaLabel || e.i18n.$t("DIALTONE_BREADCRUMBS_ARIA_LABEL"), "data-qa": "dt-breadcrumbs" } }, [r("ol", [e._t("default", function() {
return e._l(e.breadcrumbs, function(a, n) {
return r("dt-breadcrumb-item", e._g(e._b({ key: e.getBreadcrumbItemKey(n), attrs: { inverted: e.inverted } }, "dt-breadcrumb-item", a, !1), e.$listeners));
});
})], 2)]);
}, _ = [], b = /* @__PURE__ */ s(
u,
c,
_
);
const R = b.exports;
export {
R as default
};
//# sourceMappingURL=breadcrumbs.js.map