@daracl/form 0.0.19 → 0.0.22

package/dist/daracl.form.umd.js

@@ -1,59 +1,112 @@
 (function(factory) {
   typeof define === "function" && define.amd ? define(factory) : factory();
-})(function() {
+})((function() {
   "use strict";
-  function isArray$1(value) {
+  function isArray(value) {
     return Array.isArray(value);
   }
-  function isNil(value) {
-    return value === null || value === void 0;
+  function isFunction$1(value) {
+    return typeof value === "function";
   }
-  function isString$1(value) {
-    return typeof value === "string" || value instanceof String;
+  function isPlainObject(value) {
+    return value !== null && typeof value === "object" && Object.getPrototypeOf(value) === Object.prototype;
   }
-  function isEmpty$1(value) {
-    if (isNil(value)) {
-      return true;
+  const isMergeObject = (value) => isPlainObject(value) || value !== null && typeof value === "object" && Object.getPrototypeOf(value) === null;
+  const hasOwn = (value, key) => Object.prototype.hasOwnProperty.call(value, key);
+  function setOwn(target, key, value) {
+    Object.defineProperty(target, key, { value, enumerable: true, writable: true, configurable: true });
+  }
+  function mergeSource(target, source, excludeKeys) {
+    const copies = /* @__PURE__ */ new WeakMap();
+    const tasks = [];
+    function copy2(value, current) {
+      if (value === null || typeof value !== "object") return value;
+      if (copies.has(value)) return copies.get(value);
+      let result;
+      if (isArray(value)) {
+        result = isArray(current) ? current : [];
+        tasks.push(() => mergeArray(result, value));
+      } else if (isMergeObject(value)) {
+        result = isMergeObject(current) ? current : Object.create(Object.getPrototypeOf(value));
+        tasks.push(() => mergeObject(result, value));
+      } else if (value instanceof Date) {
+        result = new Date(value.getTime());
+      } else if (value instanceof RegExp) {
+        result = new RegExp(value.source, value.flags);
+        result.lastIndex = value.lastIndex;
+      } else if (value instanceof Map) {
+        result = /* @__PURE__ */ new Map();
+        tasks.push(() => value.forEach((item, key) => result.set(copy2(key), copy2(item))));
+      } else if (value instanceof Set) {
+        result = /* @__PURE__ */ new Set();
+        tasks.push(() => value.forEach((item) => result.add(copy2(item))));
+      } else {
+        return value;
+      }
+      copies.set(value, result);
+      return result;
     }
-    if (isString$1(value)) {
-      return value.trim() === "";
+    function mergeObject(dst, src) {
+      for (const key of Object.keys(src)) {
+        if (excludeKeys.has(key) || key === "__proto__" || key === "constructor" || key === "prototype") continue;
+        const value = src[key];
+        if (value === void 0) continue;
+        setOwn(dst, key, copy2(value, hasOwn(dst, key) ? dst[key] : void 0));
+      }
+    }
+    function mergeArray(dst, src) {
+      const seen = new Set(dst);
+      for (const value of src) {
+        const item = copy2(value);
+        if (value !== null && typeof value === "object" || Number.isNaN(item) || !seen.has(item)) {
+          seen.add(item);
+          dst.push(item);
+        }
+      }
     }
-    if (Array.isArray(value)) {
-      return value.length === 0;
+    copies.set(source, target);
+    if (isArray(source) && isArray(target)) tasks.push(() => mergeArray(target, source));
+    else tasks.push(() => mergeObject(target, source));
+    while (tasks.length) tasks.pop()();
+  }
+  function objectDeepMerge(...values) {
+    if (values.length < 1) {
+      return values;
     }
-    if (typeof value === "object") {
-      return Object.keys(value).length === 0;
+    let excludeKeys = /* @__PURE__ */ new Set();
+    let sources = values;
+    const last = values[values.length - 1];
+    if (isMergeObject(last) && hasOwn(last, "_excludeKeys") && isArray(last._excludeKeys)) {
+      excludeKeys = new Set(last._excludeKeys.map(String));
+      sources = values.slice(0, -1);
     }
-    return false;
+    let result = {};
+    for (let index = 0; index < sources.length; index++) {
+      const value = sources[index];
+      if (isArray(value) || isMergeObject(value)) {
+        mergeSource(result, value, index === 0 ? /* @__PURE__ */ new Set() : excludeKeys);
+      }
+    }
+    return result;
   }
-  function isFunction$1(value) {
-    return typeof value === "function" || value instanceof Function;
+  function hasProperty(obj, prop) {
+    return obj != null && obj != void 0 && Object.prototype.hasOwnProperty.call(obj, prop);
   }
-  function isNumeric(value, typeIgnore = false) {
-    if (typeIgnore === true) return !Number.isNaN(value);
-    return (typeof value === "number" || isString$1(value) && value.trim() !== "" && !isNaN(parseFloat(value))) && isFinite(Number(value));
+  function isString$1(value) {
+    return typeof value === "string";
   }
-  function leftPad(str, len, ch = "0") {
-    return pad(str, len, ch, "l");
+  function isBlank(value) {
+    return value === null || value === void 0 || isString$1(value) && value.trim() === "";
   }
-  function leftPadClamp(str, len, ch = "0") {
-    return pad(str, len, ch, "l", true);
+  function isNil$1(value) {
+    return value === null || value === void 0;
   }
-  function pad(orginStr, size, ch, type = "l", clamp = false) {
-    let str = "";
-    if (isEmpty$1(orginStr)) {
-      str = "";
-    } else {
-      str = isString$1(orginStr) ? orginStr : `${orginStr}`;
-    }
-    const strLength = str.length;
-    if (strLength > size) {
-      return clamp ? str.slice(0, size) : str;
-    }
-    const len = size - strLength;
-    if (len < 1) return str;
-    const padStr = ch.repeat(len);
-    return type === "l" ? padStr + str : str + padStr;
+  function isNumeric$1(value, typeIgnore = false) {
+    if (typeIgnore === true) return !Number.isNaN(value);
+    return (typeof value === "number" || isString$1(value) && value.trim() !== "" && !isNaN(parseFloat(value))) && isFinite(Number(value));
+  }
+  function isUndefined(value) {
+    return typeof value === "undefined";
   }
   const xssFilter = {
     "&": "&amp;",
@@ -62,7 +115,7 @@
     '"': "&quot;",
     "'": "&#39;"
   };
-  const replaceXss = (inputText) => {
+  function xss(inputText) {
     let returnText = inputText;
     if (returnText) {
       Object.keys(xssFilter).forEach((key) => {
@@ -70,46 +123,37 @@
       });
     }
     return returnText;
+  }
+  function getHashCode(value) {
+    if (!value.length) return 0;
+    let hash = 0;
+    for (let index = 0; index < value.length; index++) hash = (hash << 5) - hash + value.charCodeAt(index) | 0;
+    return String(hash).replace(/-/g, "_");
+  }
+  const styleClassSplit = (styleClass) => {
+    return styleClass.trim().split(/\s+/).filter(Boolean);
   };
-  const hasOwnProp = (obj, key) => {
-    return obj.hasOwnProperty(key);
-  };
-  const isBlank = (value) => {
-    if (value === null) return true;
-    if (value === "") return true;
-    if (typeof value === "undefined") return true;
-    if (typeof value === "string" && (value === "" || value.replace(/\s/g, "") === "")) return true;
-    return false;
-  };
-  const isUndefined = (value) => {
-    return typeof value === "undefined";
-  };
-  const isFunction = (value) => {
-    return typeof value === "function";
-  };
-  const isString = (value) => {
-    return typeof value === "string";
-  };
+  function templateToElement(html) {
+    const template = document.createElement("template");
+    template.innerHTML = html;
+    return template.content.firstElementChild;
+  }
+  function resolveClassName(value, params) {
+    if (!value) return [];
+    return styleClassSplit(isFunction$1(value) ? value(params) : value);
+  }
   const isNumber = (value) => {
-    if (isBlank(value)) {
-      return false;
-    }
-    value = +value;
-    return !isNaN(value);
-  };
-  const isArray = (value) => {
-    return isArray$1(value);
+    return !isBlank(value) && isNumeric$1(+value, true);
   };
-  const isEmpty = (value) => isUndefined(value) || value == null;
   const isTabType = (field) => {
-    return field && field.renderType === "tab";
+    return (field == null ? void 0 : field.renderType) === "tab";
   };
   const isGridType = (field) => {
-    return field && field.renderType === "grid";
+    return (field == null ? void 0 : field.renderType) === "grid";
   };
   const replaceXssField = (field) => {
     field.$xssName = getXssFieldName(field);
-    field.label = replaceXss(field.label);
+    field.label = xss(field.label);
     return field;
   };
   const ignoreValueField = (field) => {
@@ -119,120 +163,17 @@
     if (isUndefined(field.$xssName)) {
       let returnText = field.name;
       if (returnText) {
-        Object.keys(xssFilter).forEach((key) => {
-          returnText = returnText.replaceAll(key, "_");
-        });
+        returnText = returnText.replace(/[&<>"']/g, "_");
       }
       return "df_" + returnText;
     }
     return field.$xssName;
   };
-  const getHashCode = (str) => {
-    let hash = 0;
-    if (str.length == 0) return hash;
-    for (let i = 0; i < str.length; i++) {
-      let tmpChar = str.charCodeAt(i);
-      hash = (hash << 5) - hash + tmpChar;
-      hash = hash & hash;
-    }
-    return String(hash).replaceAll(/-/g, "_");
-  };
-  const isHiddenField = (field) => {
-    if (field.renderType === "hidden") {
-      return true;
-    }
-    return false;
-  };
-  const templateToElement = (htmlTemplate) => {
-    const template = document.createElement("template");
-    template.innerHTML = htmlTemplate;
-    return template.content.firstElementChild;
-  };
-  function isPlainObject(obj) {
-    if (typeof obj !== "object" || obj === null) {
-      return false;
-    }
-    let proto = obj;
-    while (Object.getPrototypeOf(proto) !== null) {
-      proto = Object.getPrototypeOf(proto);
-    }
-    return Object.getPrototypeOf(obj) === proto;
-  }
-  function isObject(value) {
-    return typeof value === "object" && value !== null && !isArray(value);
-  }
-  function isDate(value) {
-    return value instanceof Date && !isNaN(value.valueOf());
-  }
-  const merge = (...value) => {
-    let reval = value[0];
-    if (!isPlainObject(reval) || isEmpty(reval)) {
-      return reval;
-    }
-    let i = 1;
-    if (Object.keys(reval).length > 0) {
-      i = 0;
-      reval = isArray(reval) ? [] : {};
-    }
-    const argLen = value.length;
-    for (; i < argLen; i += 1) {
-      cloneDeep(reval, value[i]);
-    }
-    return reval;
+  const isHiddenField = (field) => (field == null ? void 0 : field.renderType) === "hidden";
+  const merge = (...values) => {
+    if (!isPlainObject(values[0])) return values[0];
+    return objectDeepMerge(...values, {});
   };
-  function cloneDeep(dst, src) {
-    if (isObject(src)) {
-      return cloneObjectDeep(dst, src);
-    }
-    if (isArray(src)) {
-      return cloneArrayDeep(dst, src);
-    }
-    if (isDate(src)) {
-      return new src.constructor(src);
-    }
-    return src;
-  }
-  function cloneObjectDeep(dst, src) {
-    if (isFunction(src)) {
-      return src;
-    }
-    for (const key of Object.keys(src)) {
-      const val = src[key];
-      if (isUndefined(val)) {
-        continue;
-      }
-      if (val === null) {
-        dst[key] = val;
-      } else if (isFunction(val)) {
-        dst[key] = val;
-      } else if (isEmpty(dst[key])) {
-        dst[key] = cloneDeep(isArray(val) ? [] : {}, val);
-      } else if (!isObject(val)) {
-        dst[key] = val;
-      } else {
-        cloneDeep(dst[key], val);
-      }
-    }
-    return dst;
-  }
-  function cloneArrayDeep(dst, src) {
-    const isObj = isPlainObject(dst);
-    for (let i = 0; i < src.length; i += 1) {
-      const val = src[i];
-      let newVal;
-      if (val == null) {
-        newVal = val;
-      } else {
-        newVal = cloneDeep(isArray(val) ? [] : {}, val);
-      }
-      if (isObj) {
-        dst[i] = newVal;
-      } else {
-        dst.push(newVal);
-      }
-    }
-    return dst;
-  }
   class Render {
     constructor(form, field, rowElement) {
       var _a;
@@ -275,8 +216,8 @@
     setValueItems(value) {
     }
     static getDescriptionTemplate(field) {
-      const classNames = field.descriptionClass ? replaceXss(field.descriptionClass) : "";
-      const style = field.descriptionStyle ? 'style="' + replaceXss(field.descriptionStyle) + '"' : "";
+      const classNames = field.descriptionClass ? xss(field.descriptionClass) : "";
+      const style = field.descriptionStyle ? 'style="' + xss(field.descriptionStyle) + '"' : "";
       return field.description ? `<div class="df-description ${classNames}" ${style}>${field.description}</div>` : "";
     }
     changeEventCall(field, e, rederInfo, fieldValue) {
@@ -293,7 +234,7 @@
           const valueKey = Render.valuesValueKey(field);
           for (let val of field.listItem.list) {
             let changeVal = val[valueKey];
-            if (isString(fieldValue)) {
+            if (isString$1(fieldValue)) {
               if (changeVal == fieldValue) {
                 valuesItem.push(val);
                 break;
@@ -428,7 +369,7 @@
     if (field.different) {
       const diffFieldName = field.different.field;
       const diffField = field.$instance.getForm().getField(diffFieldName);
-      if (!isEmpty(diffField) && field.$instance.getValue() == diffField.$instance.getValue()) {
+      if (!isNil$1(diffField) && field.$instance.getValue() == diffField.$instance.getValue()) {
         result.message = field.different.message;
         return result;
       }
@@ -436,7 +377,7 @@
     if (field.identical) {
       const diffFieldName = field.identical.field;
       const diffField = field.$instance.getForm().getField(diffFieldName);
-      if (!isEmpty(diffField) && field.$instance.getValue() != diffField.$instance.getValue()) {
+      if (!isNil$1(diffField) && field.$instance.getValue() != diffField.$instance.getValue()) {
         result.message = field.identical.message;
         return result;
       }
@@ -919,17 +860,14 @@
         fieldStyle.valueClass = fieldStyle.labelStyle ? "df-col-full" : "";
       }
     }
-    fieldStyle.fieldClass = spaceReplace(fieldStyle.fieldClass);
-    fieldStyle.labelClass = spaceReplace(fieldStyle.labelClass);
-    fieldStyle.valueClass = spaceReplace(fieldStyle.valueClass);
+    fieldStyle.fieldClass = resolveClassName(fieldStyle.fieldClass).join(" ");
+    fieldStyle.labelClass = resolveClassName(fieldStyle.labelClass).join(" ");
+    fieldStyle.valueClass = resolveClassName(fieldStyle.valueClass).join(" ");
     return fieldStyle;
   }
   function orientationClassName(orientation) {
     return orientation === "horizontal" ? "df-horizontal" : "df-vertical";
   }
-  function spaceReplace(str) {
-    return str.replace(/\s+/g, " ").trim();
-  }
   class CheckboxRender extends Render {
     constructor(field, rowElement, daraForm) {
       var _a, _b;
@@ -988,11 +926,11 @@
       const valueKey = Render.valuesValueKey(field);
       templates.push(` <div class="df-field"><div class="df-field-group">`);
       (_b = (_a = field.listItem) == null ? void 0 : _a.list) == null ? void 0 : _b.forEach((val) => {
-        const checkVal = val[valueKey];
+        const checkVal = String(val[valueKey] ?? "");
         templates.push(`
           <span class="df-field-item ${orientationClassName(field.listItem.orientation ?? OrientationMap.horizontal)}">
               <label>
-                  <input type="checkbox" name="${fieldName}" value="${checkVal ? replaceXss(checkVal) : ""}" class="df-form-field df-checkbox" ${val.selected ? "checked" : ""} ${val.disabled ? "disabled" : ""}  />
+                  <input type="checkbox" name="${fieldName}" value="${checkVal ? xss(checkVal) : ""}" class="df-form-field df-checkbox" ${val.selected ? "checked" : ""} ${val.disabled ? "disabled" : ""}  />
                   ${Render.valuesLabelValue(labelKey, val)}
               </label>
           </span>
@@ -1470,7 +1408,7 @@
       this.setFileList(this.fileList, true);
     }
     setValue(value) {
-      if (isArray$1(value)) {
+      if (isArray(value)) {
         this.setValueItems(value);
       }
       this.element.value = "";
@@ -1511,7 +1449,7 @@
     }
     createField() {
       const field = this.field;
-      const fieldTemplate = isEmpty(field.template) ? "" : isString(field.template) ? field.template : field.template();
+      const fieldTemplate = isNil$1(field.template) ? "" : isString$1(field.template) ? field.template : field.template();
       const fieldContainerElement = this.rowElement.querySelector(".df-field-container");
       fieldContainerElement.innerHTML = ` <div class="df-field">
         ${fieldTemplate}
@@ -1718,6 +1656,56 @@
       return validResult;
     }
   }
+  function isFunction(value) {
+    return typeof value === "function";
+  }
+  function isString(value) {
+    return typeof value === "string";
+  }
+  function isNil(value) {
+    return value === null || value === void 0;
+  }
+  function isEmpty(value) {
+    if (isNil(value)) {
+      return true;
+    }
+    if (isString(value)) {
+      return value.trim() === "";
+    }
+    if (Array.isArray(value)) {
+      return value.length === 0;
+    }
+    if (typeof value === "object") {
+      return Object.keys(value).length === 0;
+    }
+    return false;
+  }
+  function isNumeric(value, typeIgnore = false) {
+    if (typeIgnore === true) return !Number.isNaN(value);
+    return (typeof value === "number" || isString(value) && value.trim() !== "" && !isNaN(parseFloat(value))) && isFinite(Number(value));
+  }
+  function leftPad(str, len, ch = "0") {
+    return pad(str, len, ch, "l");
+  }
+  function leftPadClamp(str, len, ch = "0") {
+    return pad(str, len, ch, "l", true);
+  }
+  function pad(orginStr, size, ch, type = "l", clamp2 = false) {
+    let str = "";
+    if (isEmpty(orginStr)) {
+      str = "";
+    } else {
+      str = isString(orginStr) ? orginStr : `${orginStr}`;
+    }
+    const strLength = str.length;
+    if (strLength > size) {
+      return clamp2 ? str.slice(0, size) : str;
+    }
+    const len = size - strLength;
+    if (len < 1) return str;
+    const padStr = ch.repeat(len);
+    return type === "l" ? padStr + str : str + padStr;
+  }
   let localeMessage$1 = {
     year: "Year",
     month: "Month",
@@ -2656,7 +2644,7 @@
      */
     afterChangeDatepicker() {
       const formatValue = this.currentDate.format(this.dateFormat);
-      if (this.options.afterChangeDatepicker && isFunction$1(this.options.afterChangeDatepicker)) {
+      if (this.options.afterChangeDatepicker && isFunction(this.options.afterChangeDatepicker)) {
         this.options.afterChangeDatepicker(formatValue, this.viewMode);
       }
     }
@@ -2666,7 +2654,7 @@
      */
     beforeChangeDatepicker() {
       const formatValue = this.currentDate.format(this.dateFormat);
-      if (this.options.beforeChangeDatepicker && isFunction$1(this.options.beforeChangeDatepicker)) {
+      if (this.options.beforeChangeDatepicker && isFunction(this.options.beforeChangeDatepicker)) {
         const reval = this.options.beforeChangeDatepicker(formatValue, (result) => {
           if (result === false) {
             return;
@@ -2788,7 +2776,7 @@
       }
       const startYear = +currentYear - 8;
       this.datetimeElement.querySelector(".ddtp-header-year").textContent = `${startYear} ~ ${startYear + 15}`;
-      const beforeDrawDateFlag = isFunction$1(this.options.beforeDrawDate);
+      const beforeDrawDateFlag = isFunction(this.options.beforeDrawDate);
       const beforeDrawDateFn = beforeDrawDateFlag ? this.options.beforeDrawDate : false;
       const calHTML = [];
       for (let i = 0; i < 16; i++) {
@@ -2869,7 +2857,7 @@
         return;
       }
       this.datetimeElement.querySelector(".ddtp-header-month").textContent = this.currentDate.format("MMMM");
-      const beforeDrawDateFlag = isFunction$1(this.options.beforeDrawDate);
+      const beforeDrawDateFlag = isFunction(this.options.beforeDrawDate);
       const beforeDrawDateFn = beforeDrawDateFlag ? this.options.beforeDrawDate : false;
       const calHTML = [];
       for (let i = 0; i < 12; i++) {
@@ -2930,7 +2918,7 @@
       } else {
         monthFirstDate.addDate(-(7 + day));
       }
-      const beforeDrawDateFlag = isFunction$1(this.options.beforeDrawDate);
+      const beforeDrawDateFlag = isFunction(this.options.beforeDrawDate);
       const beforeDrawDateFn = beforeDrawDateFlag ? this.options.beforeDrawDate : false;
       const calHTML = [];
       for (let i = 0; i < 42; i++) {
@@ -3021,7 +3009,7 @@
       let dateOnSelectEvent;
       this.field.rendererOptions = Object.assign({}, this.field.rendererOptions);
       if (typeof this.field.rendererOptions.onSelect !== "undefined") {
-        dateOnSelectEvent = typeof this.field.rendererOptions.onSelect;
+        dateOnSelectEvent = this.field.rendererOptions.onSelect;
       }
       if (isUndefined(this.field.rendererOptions.mode)) {
         if (this.field.renderType == "datemonth" || this.field.renderType == "datehour") {
@@ -3031,7 +3019,7 @@
         }
       }
       this.field.rendererOptions.onSelect = (dt, e) => {
-        if (dateOnSelectEvent) {
+        if (isFunction$1(dateOnSelectEvent)) {
           dateOnSelectEvent(dt, e);
         }
         this.setValue(dt);
@@ -3221,6 +3209,10 @@
       }
     }
     reset() {
+      var _a;
+      for (const childField of this.field.children ?? []) {
+        (_a = childField.$tabForm) == null ? void 0 : _a.resetForm();
+      }
     }
     getElement() {
       return this.rowElement;
@@ -3362,7 +3354,7 @@
       valueItem = valueItem ?? {};
       for (let columnField of addColumns) {
         columnField.$instance = new columnField.$renderType(columnField, addRowElement == null ? void 0 : addRowElement.querySelector(`#${columnField.$xssName}`), this.gridForm);
-        if (valueItem[columnField.$orgin.name]) {
+        if (hasProperty(valueItem, columnField.$orgin.name)) {
           columnField.$instance.setValue(valueItem[columnField.$orgin.name]);
         }
       }
@@ -3388,8 +3380,7 @@
      */
     removeFieldInfo(rowIdx) {
       let removeFieldArrs = [];
-      console.log("rowIdx : ", rowIdx);
-      if (isEmpty(rowIdx)) {
+      if (isNil$1(rowIdx)) {
         for (let key in this.allAddRowInfo) {
           removeFieldArrs = removeFieldArrs.concat(this.allAddRowInfo[key]);
         }
@@ -3899,7 +3890,7 @@
             formData[key] = value;
           }
         } else {
-          if (!isEmpty(fieldInfo.name)) {
+          if (!isNil$1(fieldInfo.name)) {
             formData[fieldInfo.name] = fieldValue;
           }
         }
@@ -3928,7 +3919,7 @@
             formData.set(key, value);
           }
         } else {
-          if (!isEmpty(fieldInfo.name)) {
+          if (!isNil$1(fieldInfo.name)) {
             formData.set(fieldInfo.$validName, fieldValue);
           }
         }
@@ -4004,7 +3995,7 @@
       rowElement.classList.add("df-row", parentFieldStyle.rowStyleClass ?? "");
       let idx = 0;
       for (const childField of field.children) {
-        if (isEmpty(childField)) {
+        if (isNil$1(childField)) {
           throw new Error(`parent field :[${field.$validName}], children index ${idx},  empty [${childField}]`);
         }
         childField.$parent = field;
@@ -4088,10 +4079,18 @@
   }
   function initFormOptions(options) {
     const opts = merge({}, DEFAULT_OPTIONS, options);
+    opts.fields = normalizeFields(opts.fields);
     return opts;
   }
   function setDefaultOptions(options) {
     DEFAULT_OPTIONS = merge({}, DEFAULT_OPTIONS, options);
+    DEFAULT_OPTIONS.fields = normalizeFields(DEFAULT_OPTIONS.fields);
+  }
+  function normalizeFields(fields) {
+    return (fields ?? []).filter((field) => field != null).map((field) => {
+      if (Array.isArray(field.children)) field.children = normalizeFields(field.children);
+      return field;
+    });
   }
   let DEFAULT_OPTIONS = {
     style: {
@@ -4187,6 +4186,7 @@
         }
       };
       this.addField = (field) => {
+        if (!normalizeFields([field]).length) return;
         this.options.fields.push(field);
         this.formTemplate.addRow(field);
         this.conditionCheck();
@@ -4255,10 +4255,10 @@
       this.destroy = () => {
         this.formElement.className = this.orginFormStyleClass;
         this.formElement.replaceChildren();
+        delete allInstance[this.selector];
         for (const key in this) {
-          if (hasOwnProp(this, key)) {
+          if (hasProperty(this, key)) {
             delete this[key];
-            delete allInstance[this.selector];
           }
         }
       };
@@ -4266,8 +4266,10 @@
         return this.options.fields;
       };
       this.setFields = (fields) => {
-        this.options.fields = fields;
-        this.createForm(fields);
+        this.options.fields = normalizeFields(fields);
+        this.formElement.replaceChildren();
+        this.formValue = {};
+        this.createForm(this.options.fields);
       };
       this.options = initFormOptions(options);
       Language$1.set(message2);
@@ -4454,28 +4456,21 @@
       fieldInfo.$instance.setDescription(desc);
     }
     static instance(ele) {
-      let element;
-      if (isString(ele)) {
-        element = document.querySelector(ele);
-      } else {
-        element = ele;
-      }
-      element = element;
+      const element = isString$1(ele) ? document.querySelector(ele) : ele;
+      if (!element) return void 0;
       let selector = element.getAttribute(SEQ_ATTR_KEY);
-      if (isUndefined(selector) || isBlank(selector)) {
+      if (isBlank(selector)) {
         const keys = Object.keys(allInstance);
-        if (keys.length > 1) {
-          throw new Error(`selector empty : [${selector}]`);
-        }
+        if (keys.length > 1) throw new Error(`selector empty : [${selector}]`);
         selector = keys[0];
-        return allInstance[selector];
       }
+      return selector ? allInstance[selector] : void 0;
     }
     getFieldInfoMap() {
       return this.fieldInfoMap;
     }
   };
-  _DaraForm.VERSION = `${"0.0.19"}`;
+  _DaraForm.VERSION = `${"0.0.22"}`;
   _DaraForm.validator = {
     string: (value, field) => {
       return stringValidator(value, field);
@@ -4493,5 +4488,5 @@
     window.Daracl = window.Daracl || {};
     window.Daracl.form = DaraForm;
   }
-});
+}));
 //# sourceMappingURL=daracl.form.umd.js.map