@progress/kendo-vue-form 5.3.0-dev.202410141143 → 5.3.0-develop.2

package/dist/esm/Form.js

@@ -1,424 +0,0 @@
-var __assign = this && this.__assign || function () {
-  __assign = Object.assign || function (t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) {
-        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-      }
-    }
-    return t;
-  };
-  return __assign.apply(this, arguments);
-};
-var __spreadArray = this && this.__spreadArray || function (to, from, pack) {
-  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-    if (ar || !(i in from)) {
-      if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-      ar[i] = from[i];
-    }
-  }
-  return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { canUseDOM, clone, cloneObject, guid, validatePackage } from '@progress/kendo-vue-common';
-import { packageMetadata } from './package-metadata.js';
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-import { getDefaultSlots } from '@progress/kendo-vue-common';
-/**
- * @hidden
- */
-var FORCEUPDATE_ACCUMULATOR_TIMEOUT = 0;
-/**
- * @hidden
- */
-var FormVue2 = {
-  name: 'KendoForm',
-  inheritAttrs: false,
-  props: {
-    renderForm: [Object, Function],
-    initialValues: Object,
-    validator: Function,
-    ignoreModified: Boolean
-  },
-  // @ts-ignore
-  emits: {
-    submitclick: null,
-    submit: null
-  },
-  created: function created() {
-    this._accumulatorTimeout = undefined;
-    validatePackage(packageMetadata);
-    this.form.values = clone(this.$props.initialValues);
-  },
-  mounted: function mounted() {
-    this.form.errors = this.getErrors();
-    this.form.allowSubmit = this.allowSubmit();
-    this.form.valid = this.isValid();
-  },
-  destroyed: !!isV3 ? undefined : function () {
-    this.onDestroy();
-  },
-  // @ts-ignore
-  unmounted: function unmounted() {
-    this.onDestroy();
-  },
-  data: function data() {
-    return {
-      validatorsByField: {},
-      fields: [],
-      unmounted: false,
-      form: {
-        id: this.id,
-        errors: {},
-        values: {},
-        modifiedByField: {},
-        touchedByField: {},
-        visitedByField: {},
-        valid: false,
-        modified: false,
-        touched: false,
-        visited: false,
-        submitted: false,
-        valueGetter: this.valueGetter,
-        allowSubmit: false,
-        validate: this.validate,
-        onChange: this.onChange,
-        onSubmit: this.onSubmit,
-        onFormReset: this.resetForm,
-        registerField: this.onFieldRegister,
-        onFocus: this.onFocus,
-        onBlur: this.onBlur,
-        onUnshift: this.onUnshift,
-        onPush: this.onPush,
-        onInsert: this.onInsert,
-        onPop: this.onPop,
-        onRemove: this.onRemove,
-        onReplace: this.onReplace,
-        onMove: this.onMove
-      }
-    };
-  },
-  provide: function provide() {
-    return {
-      kendoForm: this.$data.form
-    };
-  },
-  watch: {
-    'form.values': function formValues() {
-      this.form.errors = this.getErrors();
-      this.form.allowSubmit = this.allowSubmit();
-      this.form.valid = this.isValid();
-    },
-    'form.touchedByField': function formTouchedByField(newValue) {
-      this.form.touched = this.isFormTouched(newValue, this.fields);
-      this.form.allowSubmit = this.allowSubmit();
-    },
-    'form.modifiedByField': function formModifiedByField(newValue) {
-      this.form.modified = this.isFormModified(newValue, this.fields);
-      this.form.allowSubmit = this.allowSubmit();
-    },
-    'form.visitedByField': function formVisitedByField(newValue) {
-      this.form.visited = this.isFormVisited(newValue, this.fields);
-    }
-  },
-  methods: {
-    isValid: function isValid() {
-      return this.isFormValid(this.form.errors);
-    },
-    formErrors: function formErrors() {
-      if (this.$props.validator) {
-        return this.$props.validator(this.form.values, this.valueGetter);
-      }
-    },
-    getErrors: function getErrors() {
-      var _this = this;
-      var errors = {};
-      var validatorsByField = this.validatorsByField;
-      Object.keys(this.fields).forEach(function (fieldName) {
-        errors[fieldName] = '';
-        if (validatorsByField[fieldName]) {
-          var validators_1 = [];
-          validatorsByField[fieldName].forEach(function (validator) {
-            if (Array.isArray(validator)) {
-              validators_1.push.apply(validators_1, validator);
-            } else {
-              validators_1.push(validator);
-            }
-          });
-          // find first validation error
-          validators_1.find(function (validator) {
-            if (validator) {
-              var result = validator(_this.valueGetter(fieldName), _this.valueGetter, {
-                name: fieldName
-              });
-              if (result) {
-                errors[fieldName] = result;
-                return true;
-              }
-            }
-            return false;
-          });
-        }
-      });
-      var formErrors = this.formErrors();
-      if (formErrors) {
-        cloneObject(this.formErrors(), errors);
-      }
-      return errors;
-    },
-    /**
-     * @hidden
-     */
-    accumulatedForceUpdate: function accumulatedForceUpdate() {
-      var _this = this;
-      // IMPORTANT:
-      // Should only be used for updates not coming from editors as it
-      // will cause cursor jump as vue will reset the editor to old value
-      if (this._accumulatorTimeout) {
-        clearTimeout(this._accumulatorTimeout);
-      }
-      if (canUseDOM) {
-        this._accumulatorTimeout = window.setTimeout(function () {
-          _this._accumulatorTimeout = undefined;
-        }, FORCEUPDATE_ACCUMULATOR_TIMEOUT);
-      }
-    },
-    /**
-     * @hidden
-     */
-    resetForm: function resetForm() {
-      this.form.values = clone(this.$props.initialValues);
-      this.id = guid();
-      this.form.touchedByField = {};
-      this.form.visitedByField = {};
-      this.form.modifiedByField = {};
-      // this.validatorsByField = {};
-      // this.fields = [];
-      this.form.submitted = false;
-    },
-    /**
-     * Method for resetting the form state outside the form component.
-     *
-     * > Use `onReset` only if you cannot achieve the desired behavior
-     *  through the Field component or by FormRenderProps.
-     */
-    onReset: function onReset() {
-      this.resetForm();
-    },
-    addField: function addField(field) {
-      this.fields[field] = true;
-    },
-    validate: function validate(fields) {
-      var touchedVisited = {};
-      var fieldsToValidate = fields || this.fields;
-      Object.keys(fieldsToValidate).forEach(function (fieldName) {
-        touchedVisited[fieldName] = true;
-      });
-      this.form.touchedByField = __assign({}, touchedVisited);
-    },
-    onSubmit: function onSubmit(event) {
-      var touchedVisited = {};
-      var fields = this.fields;
-      if (event) {
-        if (typeof event.preventDefault === 'function') {
-          event.preventDefault();
-        }
-        if (typeof event.stopPropagation === 'function') {
-          event.stopPropagation();
-        }
-      }
-      Object.keys(fields).forEach(function (fieldName) {
-        touchedVisited[fieldName] = true;
-      });
-      // show validations
-      this.form.visitedByField = __assign({}, touchedVisited);
-      this.form.touchedByField = __assign({}, touchedVisited);
-      var values = this.form.values;
-      var isValid = this.isValid();
-      var isModified = this.isFormModified(this.form.modifiedByField, fields);
-      this.$emit('submitclick', {
-        values: values,
-        isValid: isValid,
-        isModified: isModified,
-        event: event
-      });
-      if (isValid && (this.$props.ignoreModified || isModified)) {
-        this.form.submitted = true;
-        this.$emit('submit', values, event);
-      }
-    },
-    /**
-     * Method for emitting changes to a specific field outside the form component.
-     *
-     * > Use `onChange` only if you cannot achieve the desired behavior
-     *  through the Field component by FormRenderProps.
-     */
-    onChange: function onChange(name, options) {
-      var _a;
-      var value = options.value;
-      this.addField(name);
-      if (!this.form.modifiedByField[name]) {
-        this.form.modifiedByField = __assign(__assign({}, this.form.modifiedByField), (_a = {}, _a[name] = true, _a));
-      }
-      this.valueSetter(name, value);
-    },
-    onFocus: function onFocus(name) {
-      var _a;
-      if (this.form.visitedByField[name]) {
-        return;
-      }
-      this.form.visitedByField = __assign(__assign({}, this.form.visitedByField), (_a = {}, _a[name] = true, _a));
-    },
-    onBlur: function onBlur(name) {
-      var _a;
-      if (this.form.touchedByField[name]) {
-        return;
-      }
-      this.onFocus(name);
-      this.form.touchedByField = __assign(__assign({}, this.form.touchedByField), (_a = {}, _a[name] = true, _a));
-    },
-    onFieldRegister: function onFieldRegister(name, validator) {
-      var _a;
-      var _this = this;
-      this.addField(name);
-      // The sole reason for using class props over state - nextIndex, needed for destroying validators
-      var oldValidators = this.validatorsByField[name] || [];
-      var nextIndex = oldValidators.length;
-      this.validatorsByField = __assign(__assign({}, this.validatorsByField), (_a = {}, _a[name] = __spreadArray(__spreadArray([], oldValidators, true), [validator], false), _a));
-      this.accumulatedForceUpdate();
-      return function () {
-        var _a;
-        // onFieldUnregister:
-        if (_this._unmounted) {
-          return;
-        }
-        var newValidators = __spreadArray([], _this.validatorsByField[name] || [], true);
-        var validatorIsUnregistered = Boolean(newValidators[nextIndex]);
-        newValidators[nextIndex] = undefined;
-        _this.validatorsByField = __assign(__assign({}, _this.validatorsByField), (_a = {}, _a[name] = newValidators, _a));
-        if (validatorIsUnregistered) {
-          _this.accumulatedForceUpdate();
-        }
-      };
-    },
-    isFormValid: function isFormValid(errors) {
-      return !Object.keys(errors).some(function (fieldName) {
-        return Boolean(errors[fieldName]);
-      });
-    },
-    isFormModified: function isFormModified(modified, fields) {
-      return Object.keys(fields).some(function (fieldName) {
-        return modified[fieldName];
-      });
-    },
-    isFormHasNotTouched: function isFormHasNotTouched(touched, fields) {
-      return Object.keys(fields).some(function (fieldName) {
-        return !touched[fieldName];
-      });
-    },
-    isFormTouched: function isFormTouched(touched, fields) {
-      return Object.keys(fields).some(function (fieldName) {
-        return touched[fieldName];
-      });
-    },
-    isFormVisited: function isFormVisited(visited, fields) {
-      return Object.keys(fields).some(function (fieldName) {
-        return visited[fieldName];
-      });
-    },
-    formHasNotTouched: function formHasNotTouched() {
-      return this.isFormHasNotTouched(this.form.touchedByField, this.fields);
-    },
-    // 1. The form is not touched, but has errors - allow submit to force validation.
-    // 2. The form is valid and modified - if not modified, disable submit.
-    allowSubmit: function allowSubmit() {
-      return this.formHasNotTouched() && !this.isValid() || this.isValid() && (this.$props.ignoreModified || this.isFormModified(this.form.modifiedByField, this.fields));
-    },
-    valueGetter: function valueGetter(fieldName) {
-      return this.form.values[fieldName];
-    },
-    valueSetter: function valueSetter(fieldName, value) {
-      var _a;
-      this.form.values = __assign(__assign({}, this.form.values), (_a = {}, _a[fieldName] = value, _a));
-    },
-    onArrayAction: function onArrayAction(name) {
-      var _a;
-      this.addField(name);
-      if (!this.form.modifiedByField[name]) {
-        this.form.modifiedByField = __assign(__assign({}, this.form.modifiedByField), (_a = {}, _a[name] = true, _a));
-      }
-      this.onBlur(name, true);
-    },
-    onInsert: function onInsert(name, options) {
-      this.onArrayAction(name);
-      var newArray = __spreadArray([], this.valueGetter(name) || [], true);
-      newArray.splice(options.index, 0, options.value);
-      this.valueSetter(name, newArray);
-    },
-    onUnshift: function onUnshift(name, options) {
-      this.onInsert(name, {
-        value: options.value,
-        index: 0
-      });
-    },
-    onPush: function onPush(name, options) {
-      this.onArrayAction(name);
-      var newArray = __spreadArray(__spreadArray([], this.valueGetter(name) || [], true), [options.value], false);
-      this.valueSetter(name, newArray);
-    },
-    onPop: function onPop(name) {
-      this.onArrayAction(name);
-      var newArray = __spreadArray([], this.valueGetter(name) || [], true);
-      var value = newArray.pop();
-      this.valueSetter(name, newArray);
-      return value;
-    },
-    onRemove: function onRemove(name, options) {
-      this.onArrayAction(name);
-      var newArray = __spreadArray([], this.valueGetter(name) || [], true);
-      var value = newArray.splice(options.index, 1);
-      this.valueSetter(name, newArray);
-      return value;
-    },
-    onReplace: function onReplace(name, options) {
-      this.onArrayAction(name);
-      var newArray = __spreadArray([], this.valueGetter(name) || [], true);
-      newArray.splice(options.index, 1, options.value);
-      this.valueSetter(name, newArray);
-    },
-    onMove: function onMove(name, options) {
-      this.onArrayAction(name);
-      var newArray = __spreadArray([], this.valueGetter(name) || [], true);
-      var value = newArray[options.prevIndex];
-      newArray.splice(options.prevIndex, 1);
-      newArray.splice(options.nextIndex, 0, value);
-      this.valueSetter(name, newArray);
-    },
-    onDestroy: function onDestroy() {
-      this.unmounted = true;
-      if (this._accumulatorTimeout) {
-        clearTimeout(this._accumulatorTimeout);
-      }
-    }
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    return {
-      v3: v3
-    };
-  },
-  render: function render(createElement) {
-    var h = gh || createElement;
-    var defaultSlots = getDefaultSlots(this);
-    return defaultSlots;
-  }
-};
-/**
- * @hidden
- */
-var Form = FormVue2;
-export { Form, FormVue2 };

package/dist/esm/FormContext.d.ts

@@ -1,45 +0,0 @@
-import { FieldValidatorType } from './interfaces/FieldValidator';
-/** @hidden */
-export declare type FormContextType = {
-    onSubmit: (event: any) => void;
-    onChange: (name: string, options: {
-        value: any;
-    }) => void;
-    onFocus: (name: string) => void;
-    onBlur: (name: string) => void;
-    onUnshift: (name: string, options: {}) => void;
-    onPush: (name: string, options: {
-        value: any;
-    }) => void;
-    onInsert: (name: string, options: {
-        index: number;
-        value: any;
-    }) => void;
-    onPop: (name: string) => any;
-    onRemove: (name: string, options: {
-        index: number;
-    }) => any;
-    onReplace: (name: string, options: {
-        index: number;
-        value: any;
-    }) => void;
-    onMove: (name: string, options: {
-        prevIndex: number;
-        nextIndex: number;
-    }) => void;
-    registerField: (name: string, validator: FieldValidatorType | FieldValidatorType[] | undefined) => void;
-    valueGetter: (name: string) => any;
-    errors: {
-        [name: string]: string;
-    };
-    touched: {
-        [name: string]: boolean;
-    };
-    visited: {
-        [name: string]: boolean;
-    };
-    modified: {
-        [name: string]: boolean;
-    };
-    id: string;
-};

package/dist/esm/FormContext.js

@@ -1 +0,0 @@
-export {};

package/dist/esm/FormElement.d.ts

@@ -1,75 +0,0 @@
-import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from './additionalTypes';
-declare type DefaultData<V> = object | ((this: V) => {});
-declare type DefaultMethods<V> = {
-    [key: string]: (this: V, ...args: any[]) => any;
-};
-import { FormContextType } from './FormContext';
-/**
- * Represents the props of the Kendo U for Vue FormElement component.
- */
-export interface FormElementProps {
-    /**
-     * Configures the `size` of the Form.
-     *
-     * The available options are:
-     * - small
-     * - medium
-     * - large
-     * - null&mdash;Does not set a size `class`.
-     *
-     * @default `medium`
-     */
-    size?: null | 'small' | 'medium' | 'large' | string;
-    /**
-     * If set to `true` enable the horizontal layout of the form editors.
-     */
-    horizontal?: boolean;
-    /**
-     * @hidden
-     */
-    [customProp: string]: any;
-}
-/**
- * Represent the `ref` of the FormElement component.
- */
-export interface FormElementHandle {
-    props: FormElementProps;
-    element: HTMLFormElement | null;
-}
-/**
- * @hidden
- */
-interface FormElementState {
-}
-/**
- * @hidden
- */
-interface FormElementData {
-}
-/**
- * @hidden
- */
-export interface FormElementMethods {
-    [key: string]: any;
-}
-/**
- * @hidden
- */
-export interface FormElementComputed {
-    [key: string]: any;
-    formElementClassName: object;
-}
-/**
- * @hidden
- */
-export interface FormElementAll extends FormElementMethods, FormElementState, FormElementData, FormElementComputed, FormContextType, Vue2type {
-}
-/**
- * @hidden
- */
-declare const FormElementVue2: ComponentOptions<Vue2type, DefaultData<FormElementData>, DefaultMethods<FormElementAll>, FormElementComputed, RecordPropsDefinition<FormElementProps>>;
-/**
- * @hidden
- */
-declare let FormElement: DefineComponent<FormElementProps, any, FormElementData, FormElementComputed, FormElementMethods, {}, {}, {}, string, FormElementProps, FormElementProps, {}>;
-export { FormElement, FormElementVue2 };

package/dist/esm/FormElement.js

@@ -1,70 +0,0 @@
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-import { packageMetadata } from './package-metadata.js';
-import { getDefaultSlots, kendoThemeMaps, validatePackage } from '@progress/kendo-vue-common';
-/**
- * @hidden
- */
-var FormElementVue2 = {
-  name: 'KendoFormElement',
-  props: {
-    horizontal: Boolean,
-    size: {
-      type: String,
-      default: 'medium',
-      validator: function validator(value) {
-        return [null, 'small', 'medium', 'large'].includes(value);
-      }
-    }
-  },
-  created: function created() {
-    validatePackage(packageMetadata);
-  },
-  inject: {
-    kendoForm: {
-      default: null
-    }
-  },
-  computed: {
-    formElementClassName: function formElementClassName() {
-      var _a;
-      var size = this.$props.size;
-      return _a = {
-        'k-form': true
-      }, _a["k-form-".concat(kendoThemeMaps.sizeMap[size] || size)] = size, _a['k-form-horizontal'] = this.$props.horizontal === true, _a;
-    }
-  },
-  methods: {
-    handleSubmit: function handleSubmit(e) {
-      if (this.kendoForm) {
-        this.kendoForm.onSubmit(e);
-      }
-    }
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    return {
-      v3: v3
-    };
-  },
-  render: function render(createElement) {
-    var h = gh || createElement;
-    var defaultSlots = getDefaultSlots(this);
-    return h("form", {
-      "class": this.formElementClassName,
-      onSubmit: this.handleSubmit,
-      on: this.v3 ? undefined : {
-        "submit": this.handleSubmit
-      }
-    }, [defaultSlots]);
-  }
-};
-/**
- * @hidden
- */
-var FormElement = FormElementVue2;
-export { FormElement, FormElementVue2 };

package/dist/esm/additionalTypes.ts

@@ -1,21 +0,0 @@
-// @ts-ignore
-import { DefineComponent } from 'vue';
-// @ts-ignore
-import * as Vue from 'vue';
-
-/**
- * @hidden
- */
-// @ts-ignore
-type Vue2type = Vue.default;
-
-/**
- * @hidden
- */
-// @ts-ignore
-import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
-/**
- * @hidden
- */
-// @ts-ignore
-export { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type };

package/dist/esm/interfaces/FieldArrayProps.d.ts

@@ -1,24 +0,0 @@
-import { FieldValidatorType } from './FieldValidator';
-/**
- * Represents the props of the FieldArray component that is used inside the Kendo U for Vue Form component.
- */
-export interface FieldArrayProps {
-    /**
-     * The name of the field in the Form state.
-     */
-    name: string;
-    /**
-     * Can be set to a Vue component.
-     * [`FieldArrayRenderProps`]({% slug api_form_fieldarrayprops %}).
-     */
-    component: any;
-    /**
-     * The validation functions for the FieldArray level.
-     * Currently, `validator` supports only synchronous functions.
-     */
-    validator?: FieldValidatorType | FieldValidatorType[];
-    /**
-     * @hidden
-     */
-    [customProp: string]: any;
-}

package/dist/esm/interfaces/FieldArrayProps.js

@@ -1 +0,0 @@
-export {};