@progress/kendo-vue-form
Version:
103 lines (102 loc) • 3.13 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import { defineComponent as r, h as s } from "vue";
import { templateRendering as d, getListeners as a, getTemplate as h } from "@progress/kendo-vue-common";
const p = /* @__PURE__ */ r({
name: "KendoFieldArray",
props: {
value: [String, Number, Boolean, Object, Array],
component: [String, Number, Boolean, Object],
validationMessage: String,
touched: Boolean,
modified: Boolean,
validator: [Function, Array],
visited: Boolean,
valid: Boolean,
name: String,
id: String
},
created() {
return this.kendoForm ? this.kendoForm.registerField(this.$props.name, this.$props.validator) : void 0;
},
methods: {
onUnshift(e) {
this.kendoForm.onUnshift(this.$props.name, e);
},
onPush(e) {
this.kendoForm.onPush(this.$props.name, e);
},
onInsert(e) {
this.kendoForm.onInsert(this.$props.name, e);
},
onPop() {
this.kendoForm.onPop(this.$props.name);
},
onRemove(e) {
this.kendoForm.onRemove(this.$props.name, e);
},
onReplace(e) {
this.kendoForm.onReplace(this.$props.name, e);
},
onMove(e) {
this.kendoForm.onMove(this.$props.name, e);
}
},
inject: {
kendoForm: {
default: null
}
},
render() {
const {
name: e,
component: o,
id: n
} = this.$props;
if (!this.kendoForm)
return null;
const t = this.kendoForm.values[e];
if (o) {
const i = o ? d.call(this, o, a.call(this)) : null;
return h.call(this, {
h: s,
template: i,
additionalProps: {
value: t,
// meta
validationMessage: this.kendoForm.errors[e],
touched: this.kendoForm.touchedByField[e],
modified: this.kendoForm.modifiedByField[e],
visited: this.kendoForm.visitedByField[e],
// Our `valid` implementation requires double submit to show html5 validation errors,
// however it's NOT recommended to show html5 validation errors at all as:
// - There is no standard way to change validation look and feel with CSS.
// - Look different in each browser / OS
// - You can have a page in one language but an error message
// displayed in another language (not localizable)
valid: !(this.kendoForm.errors[e] && this.kendoForm.touchedByField[e]),
name: e,
id: n,
...this.$attrs
},
additionalListeners: {
unshift: this.onUnshift,
push: this.onPush,
insert: this.onInsert,
pop: this.onPop,
remove: this.onRemove,
replace: this.onReplace,
move: this.onMove
}
});
}
}
});
export {
p as FieldArray
};