@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
58 lines (57 loc) • 1.76 kB
JavaScript
;
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const vue3 = require("@dialpad/dialtone-icons/vue3");
const icon_constants = require("./icon_constants.cjs");
const vue = require("vue");
const _pluginVue_exportHelper = require("../../_virtual/_plugin-vue_export-helper.cjs");
const _sfc_main = {
compatConfig: { MODE: 3 },
name: "DtIcon",
props: {
/**
* The size of the icon.
* @values 100, 200, 300, 400, 500, 600, 700, 800
*/
size: {
type: String,
default: "500",
validator: (s) => Object.keys(icon_constants.ICON_SIZE_MODIFIERS).includes(s)
},
/**
* The icon name in kebab-case
*/
name: {
type: String,
required: true,
validator: (name) => icon_constants.ICON_NAMES.includes(name)
},
/**
* The label of the icon as read out by a screenreader. Leave this unset if your icon is purely presentational
*/
ariaLabel: {
type: String,
default: void 0
}
},
data() {
return {
iconLoaded: false
};
},
computed: {
icon() {
return vue3.icons[`./src/icons/${this.name}.vue`];
}
}
};
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return $options.icon ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($options.icon), {
key: 0,
size: $props.size,
"aria-label": $props.ariaLabel,
"data-qa": _ctx.$attrs["data-qa"] ?? "dt-icon"
}, null, 8, ["size", "aria-label", "data-qa"])) : vue.createCommentVNode("", true);
}
const icon = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render]]);
exports.default = icon;
//# sourceMappingURL=icon.vue.cjs.map