@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
86 lines (85 loc) • 2.6 kB
JavaScript
import { validationMessageValidator as l } from "../../common/validators/index.js";
import { getUniqueString as g, filterFormattedMessages as m, getValidationState as u } from "../../common/utils/index.js";
import { openBlock as t, createElementBlock as i, Fragment as c, renderList as _, normalizeClass as p, createElementVNode as M, createCommentVNode as f } from "vue";
import { _ as v } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
const y = {
compatConfig: { MODE: 3 },
name: "DtValidationMessages",
props: {
/**
* The id of the validation message
*/
id: {
type: String,
default() {
return g();
}
},
/**
* Array of validation messages. Each message has the following structure:
* `{ message: "Some informative message", type: "error|warning|success"}`
*/
validationMessages: {
type: Array,
default: () => [],
validator: (e) => l(e)
},
/**
* Show Validation messages
* @values true, false
*/
showMessages: {
type: Boolean,
default: !0
}
},
computed: {
isFilteredValidationMessagesEmpty() {
return this.filteredValidationMessages.length === 0;
},
filteredValidationMessages() {
return m(this.validationMessages);
},
validationState() {
return u(this.validationMessages);
}
},
methods: {
getMessageKey(e, a) {
return `validation-message-${e}-${a}-${this.id}`;
},
messageTypeClass(e) {
return {
error: "base-input__message--error d-validation-message--error",
warning: "base-input__message--warning d-validation-message--warning",
success: "base-input__message--success d-validation-message--success"
}[e];
}
}
}, h = {
key: 0,
class: "base-input__messages d-validation-message__container",
"data-qa": "validation-messages-container"
}, V = ["innerHTML"];
function C(e, a, n, T, b, s) {
return n.showMessages && !s.isFilteredValidationMessagesEmpty ? (t(), i("div", h, [
(t(!0), i(c, null, _(s.filteredValidationMessages, ({ message: o, type: r }, d) => (t(), i("div", {
key: s.getMessageKey(r, d),
role: "status",
"aria-live": "polite",
"data-qa": "validation-message",
class: p([
"base-input__message",
"d-validation-message",
s.messageTypeClass(r)
])
}, [
M("p", { innerHTML: o }, null, 8, V)
], 2))), 128))
])) : f("", !0);
}
const S = /* @__PURE__ */ v(y, [["render", C]]);
export {
S as default
};
//# sourceMappingURL=validation-messages.js.map