@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
80 lines (79 loc) • 2.65 kB
JavaScript
;
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const breadcrumbs_constants = require("./breadcrumbs_constants.cjs");
const breadcrumb_item = require("./breadcrumb_item.vue.cjs");
const common_utils = require("../../common/utils.cjs");
const vue = require("vue");
const _pluginVue_exportHelper = require("../../_virtual/_plugin-vue_export-helper.cjs");
const _sfc_main = {
compatConfig: { MODE: 3 },
name: "DtBreadcrumbs",
components: {
DtBreadcrumbItem: breadcrumb_item.default
},
props: {
/**
* A provided list of breadcrumbs. Overridden by default slot
*/
breadcrumbs: {
type: Array,
default: () => [],
validate(breadcrumbs2) {
return breadcrumbs2.every(({ href, label }) => {
return href !== void 0 && label !== void 0;
});
}
},
/**
* Passed through to link. If true, applies inverted styles to the link.
* @values true, false
*/
inverted: {
type: Boolean,
default: false
},
/**
* Descriptive label for the navigation content.
*/
ariaLabel: {
type: String,
default: "breadcrumb"
}
},
data() {
return {
BREADCRUMBS_INVERTED_MODIFIER: breadcrumbs_constants.BREADCRUMBS_INVERTED_MODIFIER
};
},
methods: {
getBreadcrumbItemKey(index) {
return `breadcrumbs-item-${index}-${common_utils.default.getUniqueString()}`;
}
}
};
const _hoisted_1 = ["aria-label"];
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_dt_breadcrumb_item = vue.resolveComponent("dt-breadcrumb-item");
return vue.openBlock(), vue.createElementBlock("nav", {
"aria-label": $props.ariaLabel,
"data-qa": "dt-breadcrumbs",
class: vue.normalizeClass([
"d-breadcrumbs",
{ [$data.BREADCRUMBS_INVERTED_MODIFIER]: $props.inverted }
])
}, [
vue.createElementVNode("ol", null, [
vue.renderSlot(_ctx.$slots, "default", {}, () => [
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.breadcrumbs, (item, index) => {
return vue.openBlock(), vue.createBlock(_component_dt_breadcrumb_item, vue.mergeProps({
key: $options.getBreadcrumbItemKey(index),
inverted: $props.inverted
}, item), null, 16, ["inverted"]);
}), 128))
])
])
], 10, _hoisted_1);
}
const breadcrumbs = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render]]);
exports.default = breadcrumbs;
//# sourceMappingURL=breadcrumbs.vue.cjs.map