@dialpad/dialtone-vue
Version:
Vue component library for Dialpad's design system Dialtone
50 lines (49 loc) • 2.1 kB
JavaScript
;
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const top_banner_info_constants = require("./top_banner_info_constants.cjs");
const _pluginVue2_normalizer = require("../../../_virtual/_plugin-vue2_normalizer.cjs");
const _sfc_main = {
name: "DtRecipeTopBannerInfo",
props: {
/**
* color of the banner background
*/
colorCode: {
type: String,
default: "green300",
validator: function(kind) {
return top_banner_info_constants.COLOR_CODES.includes(kind);
}
}
},
computed: {
bannerInfoClass() {
const bgColors = {
// these are too specific, so for now I'm at least updating the resultant semantic value
// TODO: breaking change: update to be more abstract
green100: "d-recipe-top-banner-info--success",
green300: "d-recipe-top-banner-info--success",
red100: "d-recipe-top-banner-info--critical",
red200: "d-recipe-top-banner-info--critical",
gold100: "d-recipe-top-banner-info--warning",
gold200: "d-recipe-top-banner-info--warning",
black100: "d-recipe-top-banner-info--info",
white: "d-recipe-top-banner-info--primary"
};
return [bgColors[this.colorCode]];
}
}
};
var _sfc_render = function render() {
var _vm = this, _c = _vm._self._c;
return _c("div", { staticClass: "d-recipe-top-banner-info", class: _vm.bannerInfoClass, attrs: { "data-qa": "banner-info" } }, [_c("div", { staticClass: "d-recipe-top-banner-info__left" }, [_vm._t("left")], 2), _c("div", { staticClass: "d-recipe-top-banner-info__middle", attrs: { "data-qa": "banner-info--middle" } }, [_vm._t("default")], 2), _c("div", { staticClass: "d-recipe-top-banner-info__right" }, [_vm._t("right")], 2)]);
};
var _sfc_staticRenderFns = [];
var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
_sfc_main,
_sfc_render,
_sfc_staticRenderFns
);
const top_banner_info = __component__.exports;
exports.default = top_banner_info;
//# sourceMappingURL=top_banner_info.vue.cjs.map