@daracl/form 0.0.3 → 0.0.5

package/dist/vendors-node_modules_daracl_datetimepicker_dist_index_js.daracl.form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vendors-node_modules_daracl_datetimepicker_dist_index_js.daracl.form.js","mappings":";;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA,2DAA2D,aAAa;AACxE;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,UAAU;AAC3B;AACA;AACA,oCAAoC;AACpC;AACA;AACA;AACA;AACA;AACA,iBAAiB,QAAQ;AACzB,mBAAmB;AACnB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK,oBAAoB;AACzB;AACA;AACA,KAAK;AACL;AACA,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB;AACjB,gBAAgB;AAChB,gBAAgB;AAChB,kBAAkB;AAClB,iBAAiB;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAW;AACX;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA,WAAW;AACX;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA,wBAAwB,gBAAgB;AACxC;AACA;AACA;AACA;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA,IAAI;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,sBAAsB,SAAS;AAC/B;AACA;AACA,eAAe,OAAO;AACtB;AACA;AACA;AACA;AACA,cAAc;AACd;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,sBAAsB,SAAS;AAC/B;AACA;AACA,eAAe,OAAO;AACtB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,EAAE;AACnB,gBAAgB,EAAE;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,uCAAuC;AACvC;AACA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA,6BAA6B,UAAU;AACvC;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA,UAAU;AACV;AACA,UAAU;AACV;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA,YAAY;AACZ;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,2EAA2E,iBAAiB;AAC5F,UAAU;AACV;AACA;AACA;AACA,sEAAsE,iBAAiB;AACvF,2DAA2D,qBAAqB;AAChF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,0BAA0B,OAAW,CAAC;AACtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB,OAAO;AAC/B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO;AACP;AACA;AACA;AACA,iBAAiB,GAAG;AACpB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;AACT;AACA;AACA,SAAS;AACT;AACA;AACA,SAAS;AACT;AACA;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;AACT;AACA;AACA;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;AACT;AACA;AACA;AACA,SAAS;AACT;AACA;AACA;AACA;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,uBAAuB;AACxC;AACA;AACA,0CAA0C;AAC1C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA,YAAY;AACZ;AACA;AACA;AACA,sDAAsD,+CAA+C,OAAO,MAAM,IAAI,GAAG,OAAO,KAAK,GAAG,UAAU,oBAAoB;AACtK;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAW;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAW;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,4DAA4D,gCAAgC,eAAe,eAAe;AAC1H;AACA,+BAA+B,8DAA8D;AAC7F,+BAA+B,8DAA8D;;AAE7F;AACA,yCAAyC;AACzC;AACA;AACA,yCAAyC;AACzC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wDAAwD,kCAAkC,IAAI,mDAAmD;AACjJ,wDAAwD,kCAAkC,IAAI,mDAAmD;AACjJ,wDAAwD,kCAAkC,IAAI,mDAAmD;AACjJ,wDAAwD,kCAAkC,IAAI,mDAAmD;AACjJ,wDAAwD,kCAAkC,IAAI,mDAAmD;AACjJ,wDAAwD,kCAAkC,IAAI,mDAAmD;AACjJ,wDAAwD,kCAAkC,IAAI,mDAAmD;AACjJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA,0DAA0D,gBAAgB,EAAE,iDAAiD,EAAE,6CAA6C,qCAAqC;AACjN;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wEAAwE,kCAAkC;AAC1G;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iFAAiF,WAAW,IAAI,eAAe;AAC/G;AACA;AACA;AACA,wBAAwB,QAAQ;AAChC;AACA;AACA;AACA;AACA;AACA,6CAA6C,kCAAkC;AAC/E;AACA;AACA,0CAA0C,QAAQ;AAClD;AACA,gDAAgD,eAAe,eAAe,KAAK,IAAI,QAAQ,GAAG,KAAK;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAW;AACX,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iFAAiF,KAAK;AACtF;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAa;AACb;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc;AACd;AACA;AACA,WAAW;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB,QAAQ;AAChC;AACA;AACA;AACA;AACA,6CAA6C,kDAAkD;AAC/F;AACA;AACA,0CAA0C,QAAQ;AAClD;AACA,iDAAiD,eAAe,gBAAgB,EAAE,IAAI,QAAQ,GAAG,6CAA6C;AAC9I;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAW;AACX,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA,wBAAwB,QAAQ;AAChC;AACA;AACA;AACA,YAAY;AACZ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc;AACd;AACA;AACA;AACA;AACA;AACA;AACA;AACA,6CAA6C,8EAA8E;AAC3H;AACA;AACA;AACA,0CAA0C,QAAQ;AAClD;AACA,8CAA8C,eAAe,cAAc,uBAAuB,IAAI,QAAQ;AAC9G,gCAAgC,qBAAqB;AACrD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,iEAAe,aAAa,EAAC;AAC7B","sources":["webpack://Daracl.form/./node_modules/@daracl/datetimepicker/dist/index.js"],"sourcesContent":["var __getOwnPropNames = Object.getOwnPropertyNames;\nvar __esm = (fn, res) => function __init() {\n  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;\n};\nvar __commonJS = (cb, mod) => function __require() {\n  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;\n};\n\n// src/Lanauage.ts\nvar localeMessage, Language, Lanauage_default;\nvar init_Lanauage = __esm({\n  \"src/Lanauage.ts\"() {\n    \"use strict\";\n    localeMessage = {\n      year: \"Year\",\n      month: \"Month\",\n      day: \"Day\",\n      am: \"AM\",\n      pm: \"PM\",\n      today: \"Today\",\n      ok: \"Ok\",\n      months: {\n        full: [\"January\", \"February\", \"March\", \"April\", \"May\", \"June\", \"July\", \"August\", \"September\", \"October\", \"November\", \"December\"],\n        abbr: [\"Jan\", \"Feb\", \"Mar\", \"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\"]\n      },\n      weeks: {\n        full: [\"Sunday\", \"Monday\", \"Tuesday\", \"Wednesday\", \"Thursday\", \"Friday\", \"Saturday\"],\n        abbr: [\"Sun\", \"Mon\", \"Tue\", \"Wed\", \"Thu\", \"Fri\", \"Sat\"]\n      }\n    };\n    Language = class {\n      constructor() {\n        this.lang = localeMessage;\n      }\n      setDefaultMessage(lang) {\n        localeMessage = Object.assign(localeMessage, lang);\n      }\n      /**\n       * 다국어 메시지 등록\n       *\n       * @public\n       * @param {?Message} [lang] 둥록할 메시지\n       */\n      set(lang) {\n        this.lang = Object.assign({}, localeMessage, lang);\n      }\n      /**\n       * 메시지 얻기\n       *\n       * @public\n       * @param {string} messageKey 메시지 키\n       * @returns {*}\n       */\n      getMessage(messageKey) {\n        return this.lang[messageKey];\n      }\n      getMonthsMessage(idx, mode = \"abbr\") {\n        return this.lang.months[mode][idx] || \"\";\n      }\n      getWeeksMessage(idx, mode = \"abbr\") {\n        return this.lang.weeks[mode][idx] || \"\";\n      }\n      getMonthsIdx(val, mode = \"abbr\") {\n        return mode == \"full\" ? this.lang.months.full.indexOf(val) : this.lang.months.abbr.indexOf(val);\n      }\n      getWeeksIdx(val, mode = \"abbr\") {\n        return mode == \"full\" ? this.lang.weeks.full.indexOf(val) : this.lang.weeks.abbr.indexOf(val);\n      }\n    };\n    Lanauage_default = new Language();\n  }\n});\n\n// src/constants.ts\nvar EXPRESSIONS_FORMAT, MAX_CHAR_LENGTH, DEFAULT_FORMAT, DAY_STYLE_CLASS, DateViewMode;\nvar init_constants = __esm({\n  \"src/constants.ts\"() {\n    \"use strict\";\n    EXPRESSIONS_FORMAT = [\"YY\", \"YYYY\", \"MMMM\", \"MMM\", \"MM\", \"M\", \"dddd\", \"ddd\", \"dd\", \"d\", \"DD\", \"D\", \"S\", \"HH\", \"H\", \"hh\", \"h\", \"mm\", \"m\", \"ss\", \"s\", \"SSS\", \"zzzz\", \"zzz\", \"zz\", \"z\", \"a\", \"A\"];\n    MAX_CHAR_LENGTH = 0;\n    DEFAULT_FORMAT = {\n      year: \"YYYY\",\n      month: \"YYYY-MM\",\n      date: \"YYYY-MM-DD\",\n      time: \"HH:mm\",\n      datetime: \"YYYY-MM-DD HH:mm\"\n    };\n    DAY_STYLE_CLASS = [\"sun\", \"mon\", \"tue\", \"wed\", \"thu\", \"fri\", \"sat\"];\n    DateViewMode = /* @__PURE__ */ ((DateViewMode2) => {\n      DateViewMode2[\"year\"] = \"year\";\n      DateViewMode2[\"month\"] = \"month\";\n      DateViewMode2[\"date\"] = \"date\";\n      DateViewMode2[\"datetime\"] = \"datetime\";\n      DateViewMode2[\"time\"] = \"time\";\n      return DateViewMode2;\n    })(DateViewMode || {});\n    EXPRESSIONS_FORMAT.forEach((item) => {\n      MAX_CHAR_LENGTH = Math.max(item.length, MAX_CHAR_LENGTH);\n    });\n  }\n});\n\n// src/util/utils.ts\nvar xssFilter, utils_default;\nvar init_utils = __esm({\n  \"src/util/utils.ts\"() {\n    \"use strict\";\n    xssFilter = {\n      \"&\": \"&amp;\",\n      \"<\": \"&lt;\",\n      \">\": \"&gt;\",\n      '\"': \"&quot;\",\n      \"'\": \"&#39;\"\n    };\n    utils_default = {\n      replace(str) {\n        let returnText = str;\n        if (returnText) {\n          Object.keys(xssFilter).forEach((key) => {\n            returnText = returnText.replaceAll(key, xssFilter[key]);\n          });\n        }\n        return returnText;\n      },\n      unReplace(inputText) {\n        let returnText = inputText;\n        if (returnText) {\n          Object.keys(xssFilter).forEach((key) => {\n            returnText = returnText.replaceAll(xssFilter[key], key);\n          });\n        }\n        return returnText;\n      },\n      unFieldName(fieldName) {\n        if (fieldName) {\n          return this.unReplace(fieldName).replaceAll('\"', '\\\\\"');\n        }\n        return \"\";\n      },\n      isBlank(value) {\n        if (value === null)\n          return true;\n        if (value === \"\")\n          return true;\n        if (typeof value === \"undefined\")\n          return true;\n        if (typeof value === \"string\" && (value === \"\" || value.replace(/\\s/g, \"\") === \"\"))\n          return true;\n        return false;\n      },\n      isUndefined(value) {\n        return typeof value === \"undefined\";\n      },\n      isFunction(value) {\n        return typeof value === \"function\";\n      },\n      isString(value) {\n        return typeof value === \"string\";\n      },\n      isNumber(value) {\n        if (this.isBlank(value)) {\n          return false;\n        }\n        return !isNaN(value);\n      },\n      isArray(value) {\n        return Array.isArray(value);\n      },\n      getHashCode(str) {\n        let hash = 0;\n        if (str.length == 0)\n          return hash;\n        for (let i = 0; i < str.length; i++) {\n          let tmpChar = str.charCodeAt(i);\n          hash = (hash << 5) - hash + tmpChar;\n          hash = hash & hash;\n        }\n        return hash;\n      },\n      pad(str, length) {\n        str = String(str);\n        while (str.length < length) {\n          str = \"0\" + str;\n        }\n        return str;\n      },\n      closestElement(el, checkElement) {\n        let currentEl = el;\n        while (currentEl) {\n          if (currentEl == checkElement) {\n            return true;\n          }\n          currentEl = currentEl.parentElement;\n        }\n        return false;\n      }\n    };\n  }\n});\n\n// src/format/index.ts\nfunction getH(date) {\n  let hour = date.getHours();\n  if (hour > 12) {\n    hour -= 12;\n  } else if (hour < 1) {\n    hour = 12;\n  }\n  return hour;\n}\nfunction getMeridiem(date, isUpper, isShort) {\n  const hour = date.getHours();\n  let m = hour < 12 ? \"am\" : \"pm\";\n  m = Lanauage_default.getMessage(m);\n  m = isUpper ? m.toUpperCase() : m;\n  return m;\n}\nvar format_default, expressionsFunction;\nvar init_format = __esm({\n  \"src/format/index.ts\"() {\n    \"use strict\";\n    init_Lanauage();\n    init_constants();\n    init_utils();\n    format_default = (date, format) => {\n      format = format || \"YYYY-MM-DD\";\n      const len = format.length;\n      let result = [];\n      for (let i = 0; i < len; ) {\n        let minLen = Math.min(MAX_CHAR_LENGTH, len - i);\n        let j = minLen;\n        for (; j > 0; j--) {\n          const v = format.substring(i, i + j);\n          if (EXPRESSIONS_FORMAT.includes(v)) {\n            try {\n              result.push(expressionsFunction[v](date));\n            } catch (e) {\n              console.log(EXPRESSIONS_FORMAT.includes(v), v, e);\n            }\n            break;\n          }\n        }\n        if (j < 1) {\n          result.push(format.substring(i, i + 1));\n          i += 1;\n        } else {\n          i += j;\n        }\n      }\n      return result.join(\"\");\n    };\n    expressionsFunction = {\n      YY: (date) => {\n        return String(date.getFullYear()).slice(-2);\n      },\n      YYYY: (date) => {\n        return String(date.getFullYear());\n      },\n      M: (date) => {\n        return String(date.getMonth() + 1);\n      },\n      MM: (date) => {\n        return utils_default.pad(date.getMonth() + 1, 2);\n      },\n      MMM: (date) => {\n        return Lanauage_default.getMonthsMessage(date.getMonth());\n      },\n      MMMM: (date) => {\n        return Lanauage_default.getMonthsMessage(date.getMonth(), \"full\");\n      },\n      D: (date) => {\n        return String(date.getDate());\n      },\n      DD: (date) => {\n        return utils_default.pad(date.getDate(), 2);\n      },\n      d: (date) => {\n        return String(date.getDate());\n      },\n      dd: (date) => {\n        return utils_default.pad(date.getDate(), 2);\n      },\n      ddd: (date) => {\n        return Lanauage_default.getWeeksMessage(date.getDay());\n      },\n      dddd: (date) => {\n        return Lanauage_default.getWeeksMessage(date.getDay(), \"full\");\n      },\n      H: (date) => {\n        return String(date.getHours());\n      },\n      HH: (date) => {\n        return utils_default.pad(date.getHours(), 2);\n      },\n      h: (date) => {\n        return getH(date);\n      },\n      hh: (date) => {\n        return utils_default.pad(getH(date), 2);\n      },\n      a: (date) => {\n        return String(date.getFullYear()).slice(-2);\n      },\n      A: (date) => {\n        return getMeridiem(date, true, true);\n      },\n      m: (date) => {\n        return String(date.getMinutes());\n      },\n      mm: (date) => {\n        return utils_default.pad(date.getMinutes(), 2);\n      },\n      s: (date) => {\n        return String(date.getSeconds());\n      },\n      ss: (date) => {\n        return utils_default.pad(date.getSeconds(), 2);\n      },\n      SSS: (date) => {\n        return utils_default.pad(date.getMilliseconds(), 3);\n      }\n    };\n  }\n});\n\n// src/util/parser.ts\nvar parser_default, matchFind, digitsCheck, word, expressionsFunction2;\nvar init_parser = __esm({\n  \"src/util/parser.ts\"() {\n    \"use strict\";\n    init_Lanauage();\n    init_constants();\n    parser_default = (dateStr, format) => {\n      if (dateStr.length > 1e3) {\n        return null;\n      }\n      format = format || DEFAULT_FORMAT.date;\n      const dateInfo = {\n        year: (/* @__PURE__ */ new Date()).getFullYear(),\n        month: 0,\n        day: 1,\n        hour: 0,\n        minute: 0,\n        second: 0,\n        millisecond: 0,\n        isPm: false,\n        isH: false,\n        charIdx: 0\n      };\n      const len = format.length;\n      let startIdx = 0;\n      for (let i = 0; i < len; ) {\n        let minLen = Math.min(MAX_CHAR_LENGTH, len - i);\n        let j = minLen;\n        for (; j > 0; j--) {\n          const v = format.substring(i, i + j);\n          if (EXPRESSIONS_FORMAT.includes(v)) {\n            const expInfo = expressionsFunction2[v];\n            const val = matchFind(dateStr.substring(startIdx), expInfo[0]);\n            expInfo[1](dateInfo, val);\n            startIdx += val.length;\n            break;\n          }\n        }\n        if (j < 1) {\n          i += 1;\n          startIdx += 1;\n        } else {\n          i += j;\n        }\n      }\n      if (dateInfo.hour != null && !dateInfo.isH) {\n        if (dateInfo.isPm && +dateInfo.hour !== 12) {\n          dateInfo.hour = +dateInfo.hour + 12;\n        } else if (!dateInfo.isPm && +dateInfo.hour === 12) {\n          dateInfo.hour = 0;\n        }\n      }\n      let date;\n      date = new Date(dateInfo.year, dateInfo.month, dateInfo.day, dateInfo.hour, dateInfo.minute, dateInfo.second, dateInfo.millisecond);\n      return date;\n    };\n    matchFind = (val, regexp) => {\n      const match = regexp.exec(val);\n      return match == null ? \"\" : match[0];\n    };\n    digitsCheck = {\n      twoOptional: /\\d\\d?/,\n      two: /\\d\\d/,\n      three: /\\d{3}/,\n      four: /\\d{4}/\n    };\n    word = /[^\\s]+/;\n    expressionsFunction2 = {\n      YY: [\n        digitsCheck[\"two\"],\n        (dateInfo, val) => {\n          dateInfo.year = +((\"\" + (/* @__PURE__ */ new Date()).getFullYear()).substring(0, 2) + val);\n          return dateInfo;\n        }\n      ],\n      YYYY: [\n        digitsCheck[\"four\"],\n        (dateInfo, val) => {\n          dateInfo.year = +val;\n          return dateInfo;\n        }\n      ],\n      M: [\n        digitsCheck[\"twoOptional\"],\n        (dateInfo, val) => {\n          dateInfo.month = +val - 1;\n          return dateInfo;\n        }\n      ],\n      MM: [\n        digitsCheck[\"two\"],\n        (dateInfo, val) => {\n          dateInfo.month = +val - 1;\n          return dateInfo;\n        }\n      ],\n      MMM: [\n        word,\n        (dateInfo, val) => {\n          dateInfo.month = Lanauage_default.getMonthsIdx(val, \"abbr\");\n          return dateInfo;\n        }\n      ],\n      MMMM: [\n        word,\n        (dateInfo, val) => {\n          dateInfo.month = Lanauage_default.getMonthsIdx(val, \"full\");\n          return dateInfo;\n        }\n      ],\n      D: [\n        digitsCheck[\"twoOptional\"],\n        (dateInfo, val) => {\n          dateInfo.day = +val;\n          return dateInfo;\n        }\n      ],\n      DD: [\n        digitsCheck[\"two\"],\n        (dateInfo, val) => {\n          dateInfo.day = +val;\n          return dateInfo;\n        }\n      ],\n      d: [\n        digitsCheck[\"twoOptional\"],\n        (dateInfo, val) => {\n          dateInfo.day = +val;\n          return dateInfo;\n        }\n      ],\n      dd: [\n        digitsCheck[\"two\"],\n        (dateInfo, val) => {\n          dateInfo.day = +val;\n          return dateInfo;\n        }\n      ],\n      ddd: [\n        word,\n        (dateInfo, val) => {\n          return dateInfo;\n        }\n      ],\n      dddd: [\n        word,\n        (dateInfo, val) => {\n          return dateInfo;\n        }\n      ],\n      H: [\n        digitsCheck[\"twoOptional\"],\n        (dateInfo, val) => {\n          dateInfo.hour = +val;\n          dateInfo.isH = true;\n          return dateInfo;\n        }\n      ],\n      HH: [\n        digitsCheck[\"two\"],\n        (dateInfo, val) => {\n          dateInfo.hour = +val;\n          dateInfo.isH = true;\n          return dateInfo;\n        }\n      ],\n      h: [\n        digitsCheck[\"twoOptional\"],\n        (dateInfo, val) => {\n          dateInfo.hour = +val;\n          return dateInfo;\n        }\n      ],\n      hh: [\n        digitsCheck[\"two\"],\n        (dateInfo, val) => {\n          dateInfo.hour = +val;\n          return dateInfo;\n        }\n      ],\n      a: [\n        word,\n        (dateInfo, val) => {\n          if (Lanauage_default.getMessage(\"am\") != val.toLowerCase()) {\n            dateInfo.isPm = true;\n          }\n          return dateInfo;\n        }\n      ],\n      A: [\n        word,\n        (dateInfo, val) => {\n          if (Lanauage_default.getMessage(\"am\") != val.toLowerCase()) {\n            dateInfo.isPm = true;\n          }\n          return dateInfo;\n        }\n      ],\n      m: [\n        digitsCheck[\"twoOptional\"],\n        (dateInfo, val) => {\n          dateInfo.minute = +val;\n          return dateInfo;\n        }\n      ],\n      mm: [\n        digitsCheck[\"two\"],\n        (dateInfo, val) => {\n          dateInfo.minute = +val;\n          return dateInfo;\n        }\n      ],\n      s: [\n        digitsCheck[\"twoOptional\"],\n        (dateInfo, val) => {\n          dateInfo.second = +val;\n          return dateInfo;\n        }\n      ],\n      ss: [\n        digitsCheck[\"two\"],\n        (dateInfo, val) => {\n          dateInfo.second = +val;\n          return dateInfo;\n        }\n      ],\n      SSS: [\n        digitsCheck[\"three\"],\n        (dateInfo, val) => {\n          dateInfo.millisecond = +val;\n          return dateInfo;\n        }\n      ]\n    };\n  }\n});\n\n// src/DaraDate.ts\nvar DaraDate;\nvar init_DaraDate = __esm({\n  \"src/DaraDate.ts\"() {\n    \"use strict\";\n    init_format();\n    DaraDate = class _DaraDate {\n      constructor(dt) {\n        this.date = dt;\n      }\n      setYear(num) {\n        this.date.setFullYear(num);\n        return this;\n      }\n      addYear(num) {\n        this.date.setFullYear(this.date.getFullYear() + num);\n        return this;\n      }\n      addMonth(num) {\n        this.date.setMonth(this.date.getMonth() + num);\n        return this;\n      }\n      setMonth(num) {\n        this.date.setMonth(num);\n        return this;\n      }\n      setDate(num) {\n        this.date.setDate(num);\n        return this;\n      }\n      addDate(num) {\n        this.date.setDate(this.date.getDate() + num);\n        return this;\n      }\n      addWeek(num) {\n        this.date.setDate(this.date.getDate() + num * 7);\n        return this;\n      }\n      addHours(num) {\n        this.date.setHours(this.date.getHours() + num);\n        return this;\n      }\n      setHour(num) {\n        this.date.setHours(num);\n        return this;\n      }\n      addMinutes(num) {\n        this.date.setMinutes(this.date.getMinutes() + num);\n        return this;\n      }\n      setMinutes(num) {\n        this.date.setMinutes(num);\n        return this;\n      }\n      addSeconds(num) {\n        this.date.setSeconds(this.date.getSeconds() + num);\n        return this;\n      }\n      addMilliseconds(num) {\n        this.date.setMilliseconds(this.date.getMilliseconds() + num);\n        return this;\n      }\n      compare(date) {\n        if (this.date.valueOf() < date.valueOf()) {\n          return -1;\n        } else if (this.date.valueOf() > date.valueOf()) {\n          return 1;\n        }\n        return 0;\n      }\n      getYear() {\n        return this.date.getFullYear();\n      }\n      getMonth() {\n        return this.date.getMonth() + 1;\n      }\n      getDate() {\n        return this.date.getDate();\n      }\n      getDay() {\n        return this.date.getDay();\n      }\n      getTime() {\n        return this.date.getTime();\n      }\n      format(format) {\n        return format_default(this.date, format);\n      }\n      clone() {\n        return new _DaraDate(new Date(this.date.valueOf()));\n      }\n    };\n  }\n});\n\n// src/DateTimePicker.ts\nfunction hiddenElement() {\n  if (document.getElementById(\"hiddenDaraDatetimeElement\") == null) {\n    document.querySelector(\"body\")?.insertAdjacentHTML(\"beforeend\", `<div id=\"hiddenDaraDatetimeElement\" class=\"daracl-datetime-hidden\"></div>`);\n  }\n  return document.getElementById(\"hiddenDaraDatetimeElement\");\n}\nfunction getDocSize() {\n  return {\n    clientHeight: Math.max(document.documentElement.clientHeight, window.innerHeight || 0),\n    clientWidth: Math.max(document.documentElement.clientWidth, window.innerWidth || 0)\n  };\n}\nvar DEFAULT_OPTIONS, daraDatetimeIdx, DateTimePicker;\nvar init_DateTimePicker = __esm({\n  \"src/DateTimePicker.ts\"() {\n    \"use strict\";\n    init_format();\n    init_parser();\n    init_Lanauage();\n    init_utils();\n    init_DaraDate();\n    init_constants();\n    DEFAULT_OPTIONS = {\n      inline: false,\n      // layer or innerhtml\n      weekStartDay: 0,\n      initialDate: \"\",\n      autoClose: true,\n      isRTL: false,\n      mode: \"date\" /* date */,\n      enableTodayBtn: true,\n      showMonthAfterYear: false,\n      isPositionFixed: false,\n      format: \"\",\n      zIndex: 1e3,\n      minDate: \"\",\n      maxDate: \"\",\n      beforeDrawDate: (dt) => {\n        return {\n          check: false,\n          style: \"\",\n          tooltip: \"\"\n        };\n      }\n    };\n    daraDatetimeIdx = 0;\n    DateTimePicker = class _DateTimePicker {\n      constructor(selector, options, message) {\n        this.isInput = false;\n        this.isVisible = false;\n        this.minYear = -1;\n        this.maxYear = -1;\n        this.minMonth = -1;\n        this.maxMonth = -1;\n        // 요일 순서.\n        this.dayOrder = [0, 1, 2, 3, 4, 5, 6];\n        /**\n         * 바탕 클릭시 캘린더 숨김 처리.\n         *\n         * @param e\n         */\n        this._documentClickEvent = (e) => {\n          if (this.isVisible && e.target != this.targetElement && !utils_default.closestElement(e.target, this.datetimeElement)) {\n            this.hide();\n          }\n        };\n        this.options = Object.assign({}, DEFAULT_OPTIONS, options);\n        daraDatetimeIdx += 1;\n        let selectorElement;\n        if (typeof selector === \"string\") {\n          selectorElement = document.querySelector(selector);\n        } else {\n          selectorElement = selector;\n        }\n        if (!selectorElement) {\n          throw new Error(`${selector} datetimepicker element not found`);\n        }\n        this._viewMode = Object.keys(DateViewMode).includes(this.options.mode) ? this.options.mode : \"date\" /* date */;\n        this.initMode = this._viewMode;\n        Lanauage_default.set(message);\n        if (this.initMode == \"year\" /* year */) {\n          this.dateFormat = this.options.format || DEFAULT_FORMAT.year;\n        } else if (this.initMode == \"month\" /* month */) {\n          this.dateFormat = this.options.format || DEFAULT_FORMAT.month;\n        } else if (this.initMode == \"time\" /* time */) {\n          this.dateFormat = this.options.format || DEFAULT_FORMAT.time;\n        } else if (this.initMode == \"datetime\" /* datetime */) {\n          this.dateFormat = this.options.format || DEFAULT_FORMAT.datetime;\n        } else {\n          this.dateFormat = this.options.format || DEFAULT_FORMAT.date;\n        }\n        let viewDate;\n        if (this.options.initialDate) {\n          if (typeof this.options.initialDate === \"string\") {\n            viewDate = new DaraDate(parser_default(this.options.initialDate, this.dateFormat) || /* @__PURE__ */ new Date());\n          } else {\n            viewDate = new DaraDate(this.options.initialDate);\n          }\n        } else {\n          viewDate = new DaraDate(/* @__PURE__ */ new Date());\n          this.options.initialDate = viewDate.format(this.dateFormat);\n        }\n        this.setWeekDays();\n        this.todayDate = viewDate.format(DEFAULT_FORMAT.date);\n        this.currentDate = viewDate;\n        this.targetElement = selectorElement;\n        this.minDate = this._minDate();\n        this.maxDate = this._maxDate();\n        if (this.options.inline) {\n          this.datetimeElement = selectorElement;\n          this.datetimeElement.className = `daracl-datetime-wrapper ddtp-${daraDatetimeIdx} embed`;\n        } else {\n          this.isInput = true;\n          this.targetElement.setAttribute(\"value\", viewDate.format(this.dateFormat));\n          const datetimeElement = document.createElement(\"div\");\n          datetimeElement.className = `daracl-datetime-wrapper ddtp-${daraDatetimeIdx} layer`;\n          datetimeElement.setAttribute(\"style\", `z-index:${this.options.zIndex};`);\n          hiddenElement()?.appendChild(datetimeElement);\n          this.datetimeElement = datetimeElement;\n          this.initTargetEvent();\n        }\n        this.createDatetimeTemplate();\n        if (this.isTimeMode()) {\n          this.hourInputEle = this.datetimeElement.querySelector(\".ddtp-hour\");\n          this.minuteInputEle = this.datetimeElement.querySelector(\".ddtp-minute\");\n        } else {\n          this.hourInputEle = {};\n          this.minuteInputEle = {};\n        }\n        this.changeViewMode(this._viewMode);\n        this.initHeaderEvent();\n        this.initDateEvent();\n        this.initTimeEvent();\n      }\n      static {\n        this.VERSION = `${APP_VERSION}`;\n      }\n      static {\n        this.format = format_default;\n      }\n      static {\n        this.parser = parser_default;\n      }\n      setWeekDays() {\n        let weekStartDay = this.options.weekStartDay;\n        if (weekStartDay == 0)\n          return;\n        if (weekStartDay < 0 || weekStartDay > 6) {\n          weekStartDay = 0;\n        }\n        for (let i = 0; i < 7; i++) {\n          let day = weekStartDay + i;\n          this.dayOrder[i] = day < 7 ? day : day - 7;\n        }\n      }\n      static create(selector, options, message) {\n        return new _DateTimePicker(selector, options, message);\n      }\n      /**\n       * default date format setting\n       * @example\n       ```\n      setDefaultFormat({\n        year: \"YYYY\",\n        month: \"YYYY-MM\",\n        date: \"YYYY-MM-DD\",\n        time: \"HH:mm\",\n        datetime: \"YYYY-MM-DD HH:mm\",\n      });\n       ```\n       * @public\n       * @static\n       * @param {*} dateFormat\n       */\n      static setDefaultFormat(dateFormat) {\n        Object.assign(DEFAULT_FORMAT, dateFormat);\n      }\n      _minDate() {\n        let minDate = this.options.minDate;\n        if (minDate != \"\") {\n          if (typeof minDate === \"string\") {\n            const dt = parser_default(minDate, this.dateFormat);\n            if (!dt) {\n              return -1;\n            }\n            minDate = dt;\n          }\n          this.minYear = minDate.getFullYear();\n          this.minMonth = +(this.minYear + utils_default.pad(minDate.getMonth(), 2));\n          return new Date(minDate.getFullYear(), minDate.getMonth(), minDate.getDate(), 0, 0).getTime();\n        }\n        return -1;\n      }\n      _maxDate() {\n        let maxDate = this.options.maxDate;\n        if (maxDate != \"\") {\n          if (typeof maxDate === \"string\") {\n            const dt = parser_default(maxDate, this.dateFormat);\n            if (!dt) {\n              return -1;\n            }\n            maxDate = dt;\n          }\n          this.maxYear = maxDate.getFullYear();\n          this.maxMonth = +(this.maxYear + utils_default.pad(maxDate.getMonth(), 2));\n          return new Date(maxDate.getFullYear(), maxDate.getMonth(), maxDate.getDate(), 23, 59).getTime();\n        }\n        return -1;\n      }\n      set viewMode(mode) {\n        if (this._viewMode === mode) {\n          return;\n        }\n        this._viewMode = mode;\n        this.changeViewMode(mode);\n      }\n      get viewMode() {\n        return this._viewMode;\n      }\n      /**\n       * 모드  change\n       * @param mode\n       */\n      changeViewMode(mode) {\n        this.datetimeElement.querySelector(\".ddtp-datetime\")?.setAttribute(\"view-mode\", mode);\n        if (mode === \"year\") {\n          this.yearDraw();\n        } else if (mode === \"month\") {\n          this.monthDraw();\n        } else {\n          this.dayDraw();\n        }\n      }\n      /**\n       * init header event\n       *\n       * @public\n       */\n      initHeaderEvent() {\n        const isRTL = this.options.isRTL;\n        this.datetimeElement.querySelector(\".ddtp-move-btn.prev\")?.addEventListener(\"click\", (e) => {\n          this.moveDate(isRTL ? \"next\" : \"prev\", e);\n        });\n        this.datetimeElement.querySelector(\".ddtp-move-btn.next\")?.addEventListener(\"click\", (e) => {\n          this.moveDate(isRTL ? \"prev\" : \"next\", e);\n        });\n        this.datetimeElement.querySelector(\".ddtp-header-year\")?.addEventListener(\"click\", (e) => {\n          this.viewMode = \"year\" /* year */;\n        });\n        this.datetimeElement.querySelector(\".ddtp-header-month\")?.addEventListener(\"click\", (e) => {\n          this.viewMode = \"month\" /* month */;\n        });\n      }\n      /**\n       * 날짜 달력 이벤트처리.\n       */\n      initDateEvent() {\n        this.datetimeElement.querySelector(\".ddtp-day-body\")?.addEventListener(\"click\", (e) => {\n          const targetEle = e.target;\n          if (targetEle.classList.contains(\"ddtp-day\") || targetEle.closest(\".ddtp-day\")) {\n            const selectDate = targetEle.getAttribute(\"data-day\") || \"1\";\n            const mmDD = selectDate.split(\",\");\n            this.currentDate.setMonth(+mmDD[0] - 1);\n            this.currentDate.setDate(+mmDD[1]);\n            if (this.isDayDisabled(this.currentDate)) {\n              return;\n            }\n            this.datetimeElement.querySelector(\".select\")?.classList.remove(\"select\");\n            targetEle.classList.add(\"select\");\n            if (this.isTimeMode()) {\n              this.currentDate.setHour(+this.hourInputEle.value);\n              this.currentDate.setMinutes(+this.minuteInputEle.value);\n            }\n            this.dateChangeEvent(e);\n          }\n        });\n        this.datetimeElement.querySelector(\".time-today\")?.addEventListener(\"click\", (e) => {\n          const initDate = new DaraDate(parser_default(this.todayDate, DEFAULT_FORMAT.date) || /* @__PURE__ */ new Date());\n          this.currentDate.setYear(initDate.getYear());\n          this.currentDate.setMonth(initDate.getMonth() - 1);\n          this.currentDate.setDate(initDate.getDate());\n          this.changeViewMode(this.initMode);\n        });\n      }\n      isTimeMode() {\n        return this._viewMode === \"time\" /* time */ || this._viewMode === \"datetime\" /* datetime */;\n      }\n      /**\n       * 시간 분 설정 이벤트 처리.\n       *\n       * @public\n       */\n      initTimeEvent() {\n        if (!this.isTimeMode())\n          return;\n        let hh = this.currentDate.format(\"HH\");\n        const hourInputEle = this.datetimeElement.querySelector(\".ddtp-hour\");\n        const hourRangeEle = this.datetimeElement.querySelector(\".ddtp-hour-range\");\n        hourInputEle.value = hh;\n        hourRangeEle.value = hh;\n        hourInputEle.addEventListener(\"input\", (e) => {\n          const targetElement = e.target;\n          const addVal = utils_default.pad(targetElement.value, 2);\n          hourInputEle.value = addVal;\n          hourRangeEle.value = addVal;\n        });\n        hourRangeEle.addEventListener(\"input\", (e) => {\n          const targetElement = e.target;\n          hourInputEle.value = utils_default.pad(targetElement.value, 2);\n        });\n        let mm = this.currentDate.format(\"mm\");\n        const minuteInputEle = this.datetimeElement.querySelector(\".ddtp-minute\");\n        const minuteRangeEle = this.datetimeElement.querySelector(\".ddtp-minute-range\");\n        minuteInputEle.value = mm;\n        minuteRangeEle.value = mm;\n        minuteInputEle.addEventListener(\"input\", (e) => {\n          const targetElement = e.target;\n          const addVal = utils_default.pad(targetElement.value, 2);\n          minuteInputEle.value = addVal;\n          minuteRangeEle.value = addVal;\n        });\n        minuteRangeEle.addEventListener(\"input\", (e) => {\n          const targetElement = e.target;\n          minuteInputEle.value = utils_default.pad(targetElement.value, 2);\n        });\n        this.datetimeElement.querySelector(\".time-select\")?.addEventListener(\"click\", (e) => {\n          this.currentDate.setHour(+hourInputEle.value);\n          this.currentDate.setMinutes(+minuteInputEle.value);\n          this.dateChangeEvent(e);\n        });\n      }\n      /**\n       * 날짜 이동\n       * @param moveMode // 앞뒤 이동 prev, next\n       * @returns\n       */\n      moveDate(moveMode, e) {\n        if (this._viewMode === \"date\" /* date */ || this._viewMode === \"datetime\" /* datetime */) {\n          this.currentDate.setDate(1);\n          this.currentDate.addMonth(\"prev\" === moveMode ? -1 : 1);\n          this.dayDraw();\n          return;\n        }\n        if (this._viewMode === \"month\" /* month */) {\n          this.currentDate.setDate(1);\n          this.currentDate.addYear(\"prev\" === moveMode ? -1 : 1);\n          this.monthDraw();\n          return;\n        }\n        if (this._viewMode === \"year\" /* year */) {\n          this.currentDate.setDate(1);\n          this.currentDate.addYear(\"prev\" === moveMode ? -16 : 16);\n          this.yearDraw();\n        }\n      }\n      /**\n       * get date value\n       *\n       * @returns\n       */\n      getDateValue() {\n        return this.currentDate.format(this.dateFormat);\n      }\n      /**\n       * 옵션 셋팅\n       * @static\n       * @param {DateTimePickerOptions} options\n       */\n      static setOptions(options) {\n        DEFAULT_OPTIONS = Object.assign({}, DEFAULT_OPTIONS, options);\n      }\n      /**\n       * 달력 보이기 처리.\n       *\n       * @returns\n       */\n      show() {\n        if (this.isVisible) {\n          return;\n        }\n        this.isVisible = true;\n        const docSize = getDocSize();\n        this.datetimeElement.classList.remove(\"hide\");\n        this.datetimeElement.classList.add(\"show\");\n        const rect = this.targetElement.getBoundingClientRect();\n        const scrollTop = window.scrollY || document.documentElement.scrollTop;\n        const scrollLeft = window.scrollX || document.documentElement.scrollLeft;\n        const elementHeight = this.datetimeElement.offsetHeight;\n        const targetElementHeight = this.targetElement.offsetHeight + 2;\n        let left = rect.left + scrollLeft;\n        let top = 0;\n        if (this.options.isPositionFixed) {\n          top = rect.top + targetElementHeight;\n          left = rect.left;\n        } else {\n          if (rect.top + targetElementHeight + elementHeight > docSize.clientHeight && rect.top >= elementHeight) {\n            top = scrollTop + rect.top - elementHeight - 2;\n          } else {\n            top = scrollTop + rect.top + targetElementHeight;\n          }\n        }\n        this.datetimeElement.setAttribute(\"style\", `${this.options.isPositionFixed ? \"position:fixed;\" : \"\"}top:${top}px;left:${left}px;z-index:${this.options.zIndex}`);\n        document.addEventListener(\"click\", this._documentClickEvent);\n      }\n      /**\n       * 달력 숨기기\n       */\n      hide() {\n        this.isVisible = false;\n        if (this.options.onClose) {\n          if (this.options.onClose() === false) {\n            return;\n          }\n        }\n        this.datetimeElement.classList.remove(\"show\");\n        this.datetimeElement.classList.add(\"hide\");\n        document.removeEventListener(\"click\", this._documentClickEvent);\n      }\n      /**\n       * 타켓 이벤트 처리.\n       */\n      initTargetEvent() {\n        if (this.targetElement) {\n          this.targetElement.addEventListener(\"click\", (e) => {\n            this.show();\n          });\n        }\n      }\n      /**\n       * 날짜 변경후 이벤트\n       */\n      afterChangeDatepicker() {\n        const formatValue = this.currentDate.format(this.dateFormat);\n        if (this.options.afterChangeDatepicker && utils_default.isFunction(this.options.afterChangeDatepicker)) {\n          this.options.afterChangeDatepicker(formatValue, this.viewMode);\n        }\n      }\n      /**\n       * 날짜 변경 전 이벤트.\n       * @returns void\n       */\n      beforeChangeDatepicker() {\n        const formatValue = this.currentDate.format(this.dateFormat);\n        if (this.options.beforeChangeDatepicker && utils_default.isFunction(this.options.beforeChangeDatepicker)) {\n          const reval = this.options.beforeChangeDatepicker(formatValue, (result) => {\n            if (result === false) {\n              return;\n            }\n            this.refresh(false);\n          });\n          if (reval === false) {\n            return;\n          }\n          this.refresh(false);\n          return;\n        }\n        this.refresh(false);\n      }\n      dateChangeEvent(e) {\n        const formatValue = this.currentDate.format(this.dateFormat);\n        if (this.options.onSelect) {\n          if (this.options.onSelect(formatValue, this.viewMode, e) === false) {\n            return;\n          }\n        }\n        if (this.isInput) {\n          this.targetElement.setAttribute(\"value\", formatValue);\n        }\n        if (!this.options.inline && this.options.autoClose) {\n          this.hide();\n        }\n      }\n      /**\n       *  datepicker template  그리기\n       */\n      createDatetimeTemplate() {\n        const showMonthAfterYear = this.options.showMonthAfterYear;\n        let datetimeTemplate = `<div class=\"ddtp-datetime ${this.options.isRTL ? \"rtl\" : \"\"}\" view-mode=\"${this._viewMode}\">\n\t\t\t<div class=\"ddtp-header\">\n                <span class=\"${showMonthAfterYear ? \"ddtp-header-year\" : \"ddtp-header-month\"}\"></span>\n                <span class=\"${showMonthAfterYear ? \"ddtp-header-month\" : \"ddtp-header-year\"}\"></span>\n\n                <span class=\"ddtp-date-move\">  \n                    <a href=\"javascript:;\" class=\"ddtp-move-btn prev\">\n                        <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z\"/></svg>\n                    </a>\n                    <a href=\"javascript:;\" class=\"ddtp-move-btn next\">\n                        <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\"/></svg>\n                    </a> \n                </span>\n\t\t\t</div>\n            <div class=\"ddtp-body\">\n                <table class=\"ddtp-days\">\n                    <thead class=\"ddtp-day-header\">\n                        <tr>\t\t\n                            <td class=\"ddtp-day-label ${DAY_STYLE_CLASS[this.dayOrder[0]]}\">${Lanauage_default.getWeeksMessage(this.dayOrder[0])}</td>\t\t\n                            <td class=\"ddtp-day-label ${DAY_STYLE_CLASS[this.dayOrder[1]]}\">${Lanauage_default.getWeeksMessage(this.dayOrder[1])}</td>\t\t\n                            <td class=\"ddtp-day-label ${DAY_STYLE_CLASS[this.dayOrder[2]]}\">${Lanauage_default.getWeeksMessage(this.dayOrder[2])}</td>\t\t\n                            <td class=\"ddtp-day-label ${DAY_STYLE_CLASS[this.dayOrder[3]]}\">${Lanauage_default.getWeeksMessage(this.dayOrder[3])}</td>\t\t\n                            <td class=\"ddtp-day-label ${DAY_STYLE_CLASS[this.dayOrder[4]]}\">${Lanauage_default.getWeeksMessage(this.dayOrder[4])}</td>\t\t\n                            <td class=\"ddtp-day-label ${DAY_STYLE_CLASS[this.dayOrder[5]]}\">${Lanauage_default.getWeeksMessage(this.dayOrder[5])}</td>\t\t\n                            <td class=\"ddtp-day-label ${DAY_STYLE_CLASS[this.dayOrder[6]]}\">${Lanauage_default.getWeeksMessage(this.dayOrder[6])}</td>\t\t\n                        </tr>\n                    </thead>\n                    <tbody class=\"ddtp-day-body\">\n                    </tbody>\n                    \n                    <tfoot class=\"ddtp-day-footer\">\n                        <td colspan=\"7\">\n                            <div style=\"text-align:center;margin-top: 5px;${this.options.enableTodayBtn ? \"\" : \"display:none;\"}\"><button type=\"button\" class=\"time-today\">${Lanauage_default.getMessage(\"today\")}</button></div>\n                            <div class=\"footer-tooltip\"></div>\n                        </td>\n                    </tfoot>\n                </table>\n\n                <div class=\"ddtp-times\">\n                        <div class=\"time-container\">\n                            <div class=\"ddtp-time\">\n                                <span>H: </span><input type=\"number\" class=\"ddtp-hour\" min=\"0\" max=\"23\">\n                                <input type=\"range\" min=\"0\" max=\"23\" class=\"ddtp-hour-range\">\n                            </div>\n                            <div class=\"ddtp-time\">\n                                <span>M: </span><input type=\"number\" class=\"ddtp-minute\" min=\"0\" max=\"59\">\n                                <input type=\"range\" min=\"0\" max=\"59\" class=\"ddtp-minute-range\">\n                            </div>\n                        </div>\n                        <div class=\"time-btn\">\n                            <button type=\"button\" class=\"time-select\">${Lanauage_default.getMessage(\"ok\")}</button>\n                        </div>\n                </div>\n\n                <div class=\"ddtp-months\">\n                </div>\n\n                <div class=\"ddtp-years\">\n                </div>\n            </div>\n        </div>`;\n        this.datetimeElement.innerHTML = datetimeTemplate;\n      }\n      refresh(beforeChangeDatepickerCheck) {\n        if (this._viewMode === \"date\" /* date */ || this._viewMode === \"datetime\" /* datetime */) {\n          this.dayDraw(beforeChangeDatepickerCheck);\n          return;\n        }\n        if (this._viewMode === \"month\" /* month */) {\n          this.monthDraw(beforeChangeDatepickerCheck);\n          return;\n        }\n        if (this._viewMode === \"year\" /* year */) {\n          this.yearDraw(beforeChangeDatepickerCheck);\n        }\n      }\n      /**\n       * 년 달력 그리기\n       */\n      yearDraw(beforeChangeDatepickerCheck) {\n        const currentYear = this.currentDate.format(\"YYYY\");\n        if (beforeChangeDatepickerCheck !== false && this.initMode == \"year\" /* year */) {\n          this.beforeChangeDatepicker();\n          return;\n        }\n        const startYear = +currentYear - 8;\n        this.datetimeElement.querySelector(\".ddtp-header-year\").textContent = `${startYear} ~ ${startYear + 15}`;\n        const beforeDrawDateFlag = utils_default.isFunction(this.options.beforeDrawDate);\n        const beforeDrawDateFn = beforeDrawDateFlag ? this.options.beforeDrawDate : false;\n        const calHTML = [];\n        for (let i = 0; i < 16; i++) {\n          const year = startYear + i;\n          const disabled = this.isYearDisabled(year);\n          let addStylceClass = disabled ? \" disabled\" : \"\";\n          let tooltip = \"\";\n          if (beforeDrawDateFlag && beforeDrawDateFn) {\n            const reval = beforeDrawDateFn({ mode: this._viewMode, date: year });\n            addStylceClass += reval.style ? \" \" + reval.style : \"\";\n            tooltip = reval.tooltip;\n            tooltip = tooltip ? `title=\"${tooltip}\"` : \"\";\n          }\n          calHTML.push(`<div class=\"ddtp-year ${addStylceClass}\" data-year=\"${year}\" ${tooltip}>${year}</div>`);\n        }\n        this.datetimeElement.querySelector(\".ddtp-years\").innerHTML = calHTML.join(\"\");\n        if (this.initMode == \"year\" /* year */) {\n          this.afterChangeDatepicker();\n        }\n        this.datetimeElement.querySelectorAll(\".ddtp-year\")?.forEach((yearEle) => {\n          yearEle.addEventListener(\"click\", (e) => {\n            const targetEle = e.target;\n            if (targetEle) {\n              const year = targetEle.getAttribute(\"data-year\");\n              if (year) {\n                const numYear = +year;\n                if (this.isYearDisabled(numYear)) {\n                  return;\n                }\n                if (this.initMode == \"year\" /* year */) {\n                  if (this.isYearDisabled(numYear)) {\n                    return;\n                  }\n                  this.currentDate.setYear(numYear);\n                  this.dateChangeEvent(e);\n                  return;\n                }\n                this.currentDate.setYear(numYear);\n                this.viewMode = this.initMode;\n              }\n            }\n          });\n        });\n      }\n      /**\n       * 월 달력 그리기\n       */\n      monthDraw(beforeChangeDatepickerCheck) {\n        if (beforeChangeDatepickerCheck !== false && this.initMode == \"month\" /* month */) {\n          this.beforeChangeDatepicker();\n          return;\n        }\n        const year = this.currentDate.format(\"YYYY\");\n        this.datetimeElement.querySelector(\".ddtp-header-year\").textContent = `${year}`;\n        const monthElements = this.datetimeElement.querySelectorAll(\".ddtp-months > .ddtp-month\");\n        if (monthElements.length > 0) {\n          if (this.isYearDisabled(+year)) {\n            monthElements.forEach((monthEle) => {\n              if (!monthEle.classList.contains(\"disabled\")) {\n                monthEle.classList.add(\"disabled\");\n              }\n            });\n            return;\n          }\n          monthElements.forEach((monthEle, idx) => {\n            if (this.isMonthDisabled(+year, idx)) {\n              if (!monthEle.classList.contains(\"disabled\")) {\n                monthEle.classList.add(\"disabled\");\n              }\n            } else {\n              monthEle.classList.remove(\"disabled\");\n            }\n          });\n          if (this.initMode == \"month\" /* month */) {\n            this.afterChangeDatepicker();\n          }\n          return;\n        }\n        this.datetimeElement.querySelector(\".ddtp-header-month\").textContent = this.currentDate.format(\"MMMM\");\n        const beforeDrawDateFlag = utils_default.isFunction(this.options.beforeDrawDate);\n        const beforeDrawDateFn = beforeDrawDateFlag ? this.options.beforeDrawDate : false;\n        const calHTML = [];\n        for (let i = 0; i < 12; i++) {\n          const disabled = this.isMonthDisabled(+year, i);\n          let addStylceClass = disabled ? \" disabled\" : \"\";\n          let tooltip = \"\";\n          if (beforeDrawDateFlag && beforeDrawDateFn) {\n            const reval = beforeDrawDateFn({ mode: this._viewMode, date: year + \"/\" + (i + 1) });\n            addStylceClass += reval.style ? \" \" + reval.style : \"\";\n            tooltip = reval.tooltip;\n            tooltip = tooltip ? `title=\"${tooltip}\"` : \"\";\n          }\n          calHTML.push(`<div class=\"ddtp-month ${addStylceClass}\" data-month=\"${i}\" ${tooltip}>${Lanauage_default.getMonthsMessage(i, \"abbr\")}</div>`);\n        }\n        this.datetimeElement.querySelector(\".ddtp-months\").innerHTML = calHTML.join(\"\");\n        if (this.initMode == \"month\" /* month */) {\n          this.afterChangeDatepicker();\n        }\n        this.datetimeElement.querySelectorAll(\".ddtp-month\")?.forEach((monthEle) => {\n          monthEle.addEventListener(\"click\", (e) => {\n            const targetEle = e.target;\n            if (targetEle) {\n              const month = targetEle.getAttribute(\"data-month\");\n              if (month) {\n                if (this.isMonthDisabled(this.currentDate.getYear(), +month)) {\n                  return false;\n                }\n                if (this.initMode == \"month\" /* month */) {\n                  this.currentDate.setMonth(+month);\n                  this.dateChangeEvent(e);\n                  return;\n                }\n                this.currentDate.setMonth(+month);\n                this.viewMode = this.initMode;\n                this.dayDraw();\n              }\n            }\n          });\n        });\n      }\n      /**\n       * 날짜 그리기\n       */\n      dayDraw(beforeChangeDatepickerCheck) {\n        if (beforeChangeDatepickerCheck !== false && (this.initMode == \"date\" /* date */ || this.initMode == \"datetime\" /* datetime */)) {\n          this.beforeChangeDatepicker();\n          return;\n        }\n        let monthFirstDate = this.currentDate.clone();\n        const currentMonth = monthFirstDate.getMonth();\n        monthFirstDate.setDate(1);\n        this.datetimeElement.querySelector(\".ddtp-header-year\").textContent = monthFirstDate.format(\"YYYY\");\n        this.datetimeElement.querySelector(\".ddtp-header-month\").textContent = monthFirstDate.format(\"MMMM\");\n        let day = monthFirstDate.getDay();\n        day = day - this.dayOrder[0];\n        if (day >= 0) {\n          monthFirstDate.addDate(-day);\n        } else {\n          monthFirstDate.addDate(-(7 + day));\n        }\n        const beforeDrawDateFlag = utils_default.isFunction(this.options.beforeDrawDate);\n        const beforeDrawDateFn = beforeDrawDateFlag ? this.options.beforeDrawDate : false;\n        const calHTML = [];\n        for (let i = 0; i < 42; i++) {\n          let dateItem;\n          if (i == 0) {\n            dateItem = monthFirstDate;\n          } else {\n            dateItem = monthFirstDate.clone().addDate(i);\n          }\n          const dateItemFormat = dateItem.format(DEFAULT_FORMAT.date);\n          if (i % 7 == 0) {\n            calHTML.push((i == 0 ? \"\" : \"</tr>\") + \"<tr>\");\n          }\n          let disabled = this.isDayDisabled(dateItem);\n          let addStylceClass = DAY_STYLE_CLASS[this.dayOrder[i % 7]];\n          const dateItemMonth = dateItem.getMonth();\n          if (dateItemMonth != currentMonth) {\n            if (dateItemMonth < currentMonth) {\n              addStylceClass += dateItemMonth == 1 ? \" new\" : \" old\";\n            } else {\n              addStylceClass += currentMonth == 1 && dateItemMonth == 12 ? \" old\" : \" new\";\n            }\n          }\n          addStylceClass += this.todayDate == dateItemFormat ? \" today\" : \"\";\n          addStylceClass += disabled ? \" disabled\" : \"\";\n          let tooltip = \"\";\n          if (beforeDrawDateFlag && beforeDrawDateFn) {\n            const reval = beforeDrawDateFn({ mode: this._viewMode, item: dateItem, date: dateItem.format(this.dateFormat) });\n            addStylceClass += reval.style ? \" \" + reval.style : \"\";\n            addStylceClass += reval.check ? \" event\" : \"\";\n            tooltip = reval.tooltip;\n            tooltip = tooltip ? `title=\"${tooltip}\"` : \"\";\n          }\n          calHTML.push(`<td class=\"ddtp-day ${addStylceClass}\" data-day=\"${dateItem.format(\"M,D\")}\" ${tooltip}>`);\n          calHTML.push(`<span>${dateItem.format(\"d\")}</span>`);\n          calHTML.push(\"</td>\");\n        }\n        calHTML.push(\"</tr>\");\n        this.datetimeElement.querySelector(\".ddtp-day-body\").innerHTML = calHTML.join(\"\");\n        if (this.initMode == \"date\" /* date */ || this.initMode == \"datetime\" /* datetime */) {\n          this.afterChangeDatepicker();\n        }\n      }\n      isDayDisabled(dateItem) {\n        if (this.minDate != -1 && this.minDate > dateItem.getTime() || this.maxDate != -1 && this.maxDate < dateItem.getTime()) {\n          return true;\n        }\n        return false;\n      }\n      isYearDisabled(year) {\n        if (this.minYear != -1 && this.minYear > year || this.maxYear != -1 && this.maxYear < year) {\n          return true;\n        }\n        return false;\n      }\n      isMonthDisabled(year, month) {\n        if (this.isYearDisabled(year)) {\n          return true;\n        }\n        let yearMonth = +(year + utils_default.pad(month, 2));\n        if (this.minMonth != -1 && this.minMonth > yearMonth || this.maxMonth != -1 && this.maxMonth < yearMonth) {\n          return true;\n        }\n        return false;\n      }\n      static setMessage(message) {\n        Lanauage_default.setDefaultMessage(message);\n      }\n    };\n  }\n});\n\n// style/daracl.datetimepicker.scss\nvar init_daracl_datetimepicker = __esm({\n  \"style/daracl.datetimepicker.scss\"() {\n  }\n});\n\n// src/index.ts\nvar require_src = __commonJS({\n  \"src/index.ts\"(exports, module) {\n    init_DateTimePicker();\n    init_daracl_datetimepicker();\n    module.exports = DateTimePicker;\n  }\n});\nexport default require_src();\n//# sourceMappingURL=index.js.map\n"],"names":[],"sourceRoot":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@daracl/form",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "sideEffects": false,
   "description": "Daracl form validation ",
   "author": {
@@ -38,15 +38,15 @@
   "exports": {
     ".": "./dist/index.js",
     "./dist/": "./dist/",
-    "./style/": "./style/"
+    "./style/": "./style/",
+    "./src/": "./src/"
   },
   "files": [
     "dist",
-    "style"
+    "style",
+    "src"
   ],
   "dependencies": {
-    "@daracl/datetimepicker": "^0.0.2",
-    "@daracl/toast": "^0.0.5",
     "init": "^0.1.2",
     "ink-docstrap": "^1.3.2",
     "preact": "^10.13.2",
@@ -107,19 +107,22 @@
     "material-icons": "^1.13.8",
     "mini-css-extract-plugin": "^2.7.6",
     "prettier": "^2.8.8",
-    "sass-loader": "^13.3.2",
+    "sass": "^1.80.2",
+    "sass-loader": "^16.0.2",
     "style-loader": "^3.3.3",
     "terser-webpack-plugin": "^5.3.9",
     "ts-jest": "^29.1.0",
     "ts-loader": "^9.4.2",
-    "typedoc": "^0.24.8",
+    "typedoc": "^0.26.7",
     "typescript": "^5.1.6",
     "url-loader": "^4.1.1",
     "webpack": "^5.73.0",
     "webpack-bundle-analyzer": "^4.9.0",
     "webpack-cli": "^4.10.0",
     "webpack-dev-server": "^4.9.2",
-    "webpack-node-externals": "^3.0.0"
+    "webpack-node-externals": "^3.0.0",
+    "@daracl/datetimepicker": "^0.0.5",
+    "@daracl/toast": "^0.0.7"
   },
   "scripts": {
     "prepack": "yarn build",

package/src/DaraForm.ts

@@ -0,0 +1,431 @@
+import { FormOptions } from "@t/FormOptions";
+import { FormField } from "@t/FormField";
+import * as utils from "./util/utils";
+import { ValidResult } from "@t/ValidResult";
+import { Message } from "@t/Message";
+import Lanauage from "./util/Lanauage";
+import { stringValidator } from "./rule/stringValidator";
+import { numberValidator } from "./rule/numberValidator";
+import { regexpValidator } from "./rule/regexpValidator";
+import FieldInfoMap from "src/FieldInfoMap";
+import FormTemplate from "./FormTemplate";
+import { FORM_MODE } from "./constants";
+
+declare const APP_VERSION: string;
+
+const defaultOptions = {
+  style: {
+    width: "100%",
+    labelWidth: 3,
+    valueWidth: 9,
+    position: "left-right",
+  },
+  mode: "new",
+  useTypeValue: true,
+  autoCreate: true,
+  notValidMessage: "This form is not valid.",
+  fields: [],
+} as FormOptions;
+
+interface FieldMap {
+  [key: string]: FormField;
+}
+
+interface DaraFormMap {
+  [key: string]: DaraForm;
+}
+
+// all instance
+const allInstance: DaraFormMap = {};
+
+const SEQ_ATTR_KEY = "data-form-uid";
+
+let DARA_FORM_SEQ = 0;
+/**
+ * DaraForm class
+ *
+ * @class DaraForm
+ * @typedef {DaraForm}
+ */
+export default class DaraForm {
+  public static VERSION = `${APP_VERSION}`;
+
+  private readonly options;
+
+  private orginFormStyleClass;
+
+  private selector: string;
+  private formElement: Element;
+
+  private fieldInfoMap: FieldInfoMap;
+
+  private formValue: any = {};
+
+  public formTemplate: FormTemplate;
+
+  constructor(formElement: Element, options: FormOptions, message?: Message) {
+    this.options = utils.merge({}, defaultOptions, options) as FormOptions;
+
+    Lanauage.set(message);
+
+    if (formElement) {
+      this.orginFormStyleClass = formElement.className;
+      formElement.classList.add("daracl-form");
+
+      this.selector = `df_${++DARA_FORM_SEQ}`;
+      formElement.setAttribute("name", this.selector);
+      formElement.setAttribute(SEQ_ATTR_KEY, this.selector);
+
+      if (this.options.style.width) {
+        formElement.setAttribute("style", `width:${this.options.style.width};`);
+      }
+
+      this.formElement = formElement;
+      this.changeMode(this.options.mode ?? "new");
+      this.createForm(this.options.fields);
+
+      if (this.options.autoCreate !== false) {
+        allInstance[this.selector] = this;
+      }
+    } else {
+      throw new Error(`${formElement} form selector not found`);
+    }
+  }
+
+  public static create(formElement: Element, options: FormOptions, message?: Message): DaraForm {
+    return new DaraForm(formElement, options, message);
+  }
+
+  public static setMessage(message: Message): void {
+    Lanauage.set(message);
+  }
+
+  private createForm(fields: FormField[]) {
+    this.fieldInfoMap = new FieldInfoMap(this.selector, this);
+    //this.formElement.innerHTML = "";
+    this.formTemplate = new FormTemplate(this, this.formElement, this.fieldInfoMap);
+
+    if (this.options.autoCreate === false) {
+      return;
+    }
+
+    fields.forEach((field) => {
+      this.formTemplate.addRow(field);
+    });
+    this.conditionCheck();
+
+    if (this.options.onMounted) {
+      this.options.onMounted.call(this);
+    }
+  }
+
+  /**
+   * change mode
+   *
+   * @param mode form_mode default new
+   */
+  public changeMode = (mode: FORM_MODE): void => {
+    this.options.mode = mode;
+    this.formElement.setAttribute("data-df-mode", mode);
+  };
+
+  /**
+   * 폼 데이터 reset
+   */
+  public resetForm = () => {
+    const fieldMap = this.fieldInfoMap.getAllFieldInfo();
+    for (const seq in fieldMap) {
+      const fieldInfo = fieldMap[seq];
+      const renderInfo = fieldInfo.$instance;
+
+      if (renderInfo && typeof renderInfo.reset === "function") {
+        renderInfo.reset();
+      }
+    }
+    this.formValue = {};
+    this.conditionCheck();
+  };
+
+  /**
+   * field 값 reset
+   * @param fieldName 필드명
+   */
+  public resetField = (fieldName: string) => {
+    this.fieldInfoMap.getFieldName(fieldName).$instance.reset();
+    this.formValue[fieldName] = "";
+    this.conditionCheck();
+  };
+
+  /**
+   * 필드 element 얻기
+   *
+   * @param {string} fieldName
+   * @returns {*}
+   */
+  public getFieldElement(fieldName: string) {
+    const field = this.fieldInfoMap.getFieldName(fieldName);
+
+    if (field?.$instance) {
+      return field.$instance.getElement();
+    }
+
+    return null;
+  }
+
+  public getField(fieldName: string): FormField {
+    return this.fieldInfoMap.getFieldName(fieldName);
+  }
+
+  /**
+   * field 값 얻기
+   *
+   * @param fieldName  필드명
+   * @returns
+   */
+  public getFieldValue = (fieldName: string) => {
+    const field = this.fieldInfoMap.getFieldName(fieldName);
+
+    if (field) {
+      return field.$instance.getValue();
+    }
+    return null;
+  };
+
+  /**
+   * 폼 필드 값 얻기
+   * @param isValid 폼 유효성 검사 여부 default:false|undefined true일경우 검사.
+   * @returns
+   */
+  public getValue = (isValid: boolean): any => {
+    return this.fieldInfoMap.getAllFieldValue(this.formValue, isValid);
+  };
+
+  public getFormDataValue = (isValid: boolean): any => {
+    return this.fieldInfoMap.getFormDataValue(this.formValue, isValid);
+  };
+
+  /**
+   * 폼 필드 value 셋팅
+   * @param values
+   */
+  public setValue = (values: any, dataClear?: boolean | undefined) => {
+    if (dataClear !== false) {
+      this.resetForm();
+    }
+
+    Object.keys(values).forEach((fieldName) => {
+      this._setFieldValue(fieldName, values[fieldName]);
+    });
+    this.conditionCheck();
+  };
+
+  public setFieldValue = (fieldName: string, value: any) => {
+    this._setFieldValue(fieldName, value);
+    this.conditionCheck();
+  };
+
+  private _setFieldValue(fieldName: string, value: any) {
+    this.formValue[fieldName] = value;
+    const fieldInfo = this.fieldInfoMap.getFieldName(fieldName);
+
+    if (fieldInfo) {
+      fieldInfo.$instance.setValue(value);
+    }
+  }
+
+  public setFieldItems = (fieldName: string, values: any) => {
+    const field = this.fieldInfoMap.getFieldName(fieldName);
+
+    if (field) {
+      return field.$instance.setValueItems(values);
+    }
+  };
+
+  /**
+   * field 추가
+   *
+   * @param {FormField} field
+   */
+  public addField = (field: FormField) => {
+    this.options.fields.push(field);
+    this.formTemplate.addRow(field);
+    this.conditionCheck();
+  };
+
+  /**
+   * field 제거
+   *
+   * @param {string} fieldName
+   */
+  public removeField = (fieldName: string) => {
+    const element = this.getFieldElement(fieldName);
+
+    if (element != null) {
+      element.closest(".df-row")?.remove();
+    }
+
+    this.fieldInfoMap.removeFieldInfo(fieldName);
+  };
+
+  /**
+   * 폼 유효성 검증 여부
+   *
+   * @returns {boolean}
+   */
+  public isValidForm = (): boolean => {
+    const result = this.validForm();
+
+    return result.length < 1;
+  };
+
+  /**
+   * 유효성 검증 폼 검증여부 리턴
+   *
+   * @returns {any[]}
+   */
+  public validForm = (): any[] => {
+    let validResult = [] as any;
+    let autoFocusFlag = this.options.autoFocus !== false;
+    let firstFlag = true;
+
+    const fieldMap = this.fieldInfoMap.getAllFieldInfo();
+    for (const fieldKey in fieldMap) {
+      const fieldInfo = fieldMap[fieldKey];
+
+      let fieldValid = this.fieldInfoMap.getFieldValidation(fieldInfo, autoFocusFlag);
+
+      if (fieldValid !== true) {
+        autoFocusFlag = false;
+
+        if (utils.isGridType(fieldInfo)) {
+          validResult = validResult.concat(fieldValid);
+        } else {
+          if (firstFlag) {
+            this.validTabCheck(fieldInfo);
+            firstFlag = false;
+          }
+          validResult.push(fieldValid);
+        }
+      }
+    }
+
+    return validResult;
+  };
+
+  private validTabCheck(fieldInfo: FormField) {
+    if (fieldInfo.$parent) {
+      if (fieldInfo.$parent.renderType == "tab") {
+        fieldInfo.$parent.$instance.setActive(fieldInfo.$key);
+      }
+      this.validTabCheck(fieldInfo.$parent);
+    }
+  }
+
+  public isValidField = (fieldName: string): boolean => {
+    const fieldInfo = this.fieldInfoMap.getFieldName(fieldName);
+
+    if (utils.isUndefined(fieldInfo)) {
+      throw new Error(`Field name [${fieldName}] not found`);
+    }
+
+    const renderInfo = fieldInfo.$instance;
+    if (renderInfo) {
+      return renderInfo.valid() === true;
+    }
+
+    return true;
+  };
+
+  /**
+   * 설정 옵션 얻기
+   */
+  public getOptions = () => {
+    return this.options;
+  };
+
+  public conditionCheck() {
+    this.fieldInfoMap.conditionCheck();
+  }
+
+  public setFieldDisabled(fieldName: string, flag: boolean) {
+    const fieldInfo = this.fieldInfoMap.getFieldName(fieldName);
+    fieldInfo.$instance.setDisabled(flag);
+  }
+
+  /**
+   * 설명 추가
+   *
+   * @public
+   * @param {string} fieldName
+   * @param {string} desc
+   */
+  public setFieldDescription(fieldName: string, desc: string) {
+    const fieldInfo = this.fieldInfoMap.getFieldName(fieldName);
+    fieldInfo.$instance.setDescription(desc);
+  }
+
+  public destroy = () => {
+    this.formElement.className = this.orginFormStyleClass;
+    this.formElement.replaceChildren();
+
+    for (const key in this) {
+      if (utils.hasOwnProp(this, key)) {
+        delete this[key];
+        delete allInstance[this.selector];
+      }
+    }
+  };
+
+  public static validator = {
+    string: (value: string, field: FormField) => {
+      return stringValidator(value, field);
+    },
+    number: (value: string, field: FormField) => {
+      return numberValidator(value, field);
+    },
+    regexp: (value: string, field: FormField) => {
+      let result: ValidResult = { name: field.name, constraint: [] };
+      return regexpValidator(value, field, result);
+    },
+  };
+
+  public static instance(ele: Element | String) {
+    let element;
+    if (utils.isString(ele)) {
+      element = document.querySelector(ele);
+    } else {
+      element = ele;
+    }
+    element = element as Element;
+    let selector = element.getAttribute(SEQ_ATTR_KEY);
+
+    if (utils.isUndefined(selector) || utils.isBlank(selector)) {
+      const keys = Object.keys(allInstance);
+      if (keys.length > 1) {
+        throw new Error(`selector empty : [${selector}]`);
+      }
+      selector = keys[0];
+
+      return allInstance[selector];
+    }
+  }
+  /**
+   * 모든 field 얻기
+   */
+  public getFields = (): any[] => {
+    return this.options.fields;
+  };
+
+  /**
+   * field setting
+   * @param fields
+   */
+  public setFields = (fields: any[]) => {
+    this.options.fields = fields;
+    this.createForm(fields);
+  };
+
+  public getFieldInfoMap() {
+    return this.fieldInfoMap;
+  }
+}