iglooform 2.5.10 → 2.5.13

package/es/form/element/index.js

@@ -162,9 +162,16 @@ var Element = function Element(_ref) {
 
   useEffect(function () {
     if (!formItemProps.name || preview || !formItemProps.copiedValue.copied) return;
+    var originalValue = form === null || form === void 0 ? void 0 : form.getFieldValue(formItemProps.name);
+    var value = formItemProps.copiedValue.value;
+
+    if (_typeof(originalValue) === 'object' && _typeof(value) === 'object') {
+      value = Object.assign(originalValue, formItemProps.copiedValue.value);
+    }
+
     form && form.setFields([{
       name: formItemProps.name,
-      value: formItemProps.copiedValue.value,
+      value: value,
       errors: []
     }]);
   }, [formItemProps.copiedValue.value]);

package/es/form/elements.js

@@ -1,7 +1,7 @@
 import { useMemo } from 'react';
 import Button from '../button';
 import Radio, { RadioGroup, RadioGroupWithOther } from '../radio';
-import Input, { PhoneNumber, Amount, Email, Password, InputNumber, TextArea, InputDate, CreditCard, Otp, ExpiryDate } from '../input';
+import Input, { PhoneNumber, Amount, Email, Password, InputNumber, TextArea, InputDate, CreditCard, Otp, ExpiryDate, InputId } from '../input';
 import DatePicker, { IglooBuddhistDatePicker as BuddhistDatePicker, IglooRangePicker as RangePicker, IglooWeekPicker as WeekPicker, IglooMonthPicker as MonthPicker } from '../date-picker';
 import Confirmation from '../confirmation';
 import { AttachedSelect as Select, TimeSelect } from '../select';
@@ -18,6 +18,7 @@ var elementMap = {
   PhoneNumber: PhoneNumber,
   Amount: Amount,
   InputNumber: InputNumber,
+  InputId: InputId,
   TextArea: TextArea,
   DatePicker: DatePicker,
   CreditCard: CreditCard,

package/es/free-form/element/index.js

@@ -156,9 +156,16 @@ var Element = function Element(props) {
 
   useEffect(function () {
     if (!formItemProps.name || preview || !formItemProps.copiedValue.copied) return;
+    var originalValue = form === null || form === void 0 ? void 0 : form.getFieldValue(formItemProps.name);
+    var value = formItemProps.copiedValue.value;
+
+    if (_typeof(originalValue) === 'object' && _typeof(value) === 'object') {
+      value = Object.assign(originalValue, formItemProps.copiedValue.value);
+    }
+
     form && form.setFields([{
       name: formItemProps.name,
-      value: formItemProps.copiedValue.value,
+      value: value,
       errors: []
     }]);
   }, [formItemProps.copiedValue.value]);

package/es/index.d.ts

@@ -1,7 +1,7 @@
 export { default as Form } from './form';
 export { default as Button, GreenButton, YellowButton, RedButton, } from './button';
 export { default as DatePicker, IglooBuddhistDatePicker as BuddhistDatePicker, IglooRangePicker as RangePicker, IglooWeekPicker as WeekPicker, IglooMonthPicker as MonthPicker, } from './date-picker';
-export { default as Input, PhoneNumber, Amount, Password, Email, InputNumber, TextArea, InputDate, CreditCard, ExpiryDate, } from './input';
+export { default as Input, PhoneNumber, Amount, Password, Email, InputNumber, TextArea, InputDate, CreditCard, ExpiryDate, InputId, } from './input';
 export { default as Select, TimeSelect, AttachedSelect } from './select';
 export { default as Radio, RadioGroup, RadioGroupWithOther } from './radio';
 export { default as Example } from './example';

package/es/index.js

@@ -1,7 +1,7 @@
 export { default as Form } from './form';
 export { default as Button, GreenButton, YellowButton, RedButton } from './button';
 export { default as DatePicker, IglooBuddhistDatePicker as BuddhistDatePicker, IglooRangePicker as RangePicker, IglooWeekPicker as WeekPicker, IglooMonthPicker as MonthPicker } from './date-picker';
-export { default as Input, PhoneNumber, Amount, Password, Email, InputNumber, TextArea, InputDate, CreditCard, ExpiryDate } from './input';
+export { default as Input, PhoneNumber, Amount, Password, Email, InputNumber, TextArea, InputDate, CreditCard, ExpiryDate, InputId } from './input';
 export { default as Select, TimeSelect, AttachedSelect } from './select';
 export { default as Radio, RadioGroup, RadioGroupWithOther } from './radio';
 export { default as Example } from './example';

package/es/input/index.d.ts

@@ -8,5 +8,6 @@ export { default as InputDate } from './input-date';
 export { default as CreditCard } from './credit-card';
 export { default as Otp } from './otp';
 export { default as ExpiryDate } from './expiry-date';
+export { default as InputId } from './input-id';
 import IglooInput from './input';
 export default IglooInput;

package/es/input/index.js

@@ -8,5 +8,6 @@ export { default as InputDate } from './input-date';
 export { default as CreditCard } from './credit-card';
 export { default as Otp } from './otp';
 export { default as ExpiryDate } from './expiry-date';
+export { default as InputId } from './input-id';
 import IglooInput from './input';
 export default IglooInput;

package/es/input/input-id.d.ts

@@ -0,0 +1,6 @@
+import { InputProps } from 'antd/es/input';
+import { FC, IglooComponentProps } from '../types';
+import './style/index.less';
+declare type Props = InputProps & IglooComponentProps;
+declare const InputId: FC<Props>;
+export default InputId;

package/es/input/input-id.js

@@ -0,0 +1,112 @@
+import "antd/es/input/style";
+import _Input from "antd/es/input";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import { jsx as _jsx } from "react/jsx-runtime";
+import omit from 'omit.js';
+import formMethods from '../utils/form-methods';
+import { staticFormatMessage as formatMessage } from '../locale';
+import './style/index.less';
+
+var InputId = function InputId(props) {
+  return _jsx(_Input, _objectSpread(_objectSpread({
+    className: "igloo-input"
+  }, omit(props, formMethods)), {}, {
+    type: "number"
+  }));
+};
+
+InputId.formItemPropsHandler = function (config) {
+  var length = config.length,
+      maxLength = config.maxLength,
+      minLength = config.minLength,
+      label = config.label,
+      idType = config.idType;
+  var rules = [];
+
+  if (length !== undefined) {
+    rules.push({
+      validator: function validator(_, value) {
+        if (value === undefined || value === null || String(value).length === length) return Promise.resolve();
+        return Promise.reject(formatMessage({
+          id: '{label} must be {length} digits.',
+          values: {
+            length: length,
+            label: label
+          }
+        }));
+      }
+    });
+  }
+
+  if (maxLength !== undefined && minLength !== undefined) {
+    rules.push({
+      validator: function validator(_, value) {
+        if (value === undefined || value === null || String(value).length >= minLength && String(value).length <= maxLength) return Promise.resolve();
+        return Promise.reject(formatMessage({
+          id: '{label} must be {minLength} - {maxLength} digits.',
+          values: {
+            maxLength: maxLength,
+            minLength: minLength,
+            label: label
+          }
+        }));
+      }
+    });
+  }
+
+  if (maxLength !== undefined && minLength === undefined) {
+    rules.push({
+      validator: function validator(_, value) {
+        if (value === undefined || value === null || String(value).length <= maxLength) return Promise.resolve();
+        return Promise.reject(formatMessage({
+          id: '{label} must be less than {maxLength} digits.',
+          values: {
+            maxLength: maxLength,
+            label: label
+          }
+        }));
+      }
+    });
+  }
+
+  if (maxLength === undefined && minLength !== undefined) {
+    rules.push({
+      validator: function validator(_, value) {
+        if (value === undefined || value === null || String(value).length >= minLength) return Promise.resolve();
+        return Promise.reject(formatMessage({
+          id: '{label} must be at least {minLength} digits.',
+          values: {
+            minLength: minLength,
+            label: label
+          }
+        }));
+      }
+    });
+  }
+
+  if (idType === 'KTP') {
+    rules.push({
+      validator: function validator(rule, value) {
+        if (!/^((1[1-9])|(21)|([37][1-6])|(5[1-4])|(6[1-5])|([8-9][1-2]))[0-9]{4}(([0-6][0-9])|(7[0-1]))((0[1-9])|(1[0-2]))[0-9]{6}$/.test(value)) {
+          return Promise.reject(formatMessage({
+            id: 'Invalid KTP Number.'
+          }));
+        }
+
+        return Promise.resolve();
+      }
+    });
+  }
+
+  return {
+    rules: rules
+  };
+};
+
+export default InputId;

package/es/input/input-number.js

@@ -108,20 +108,6 @@ IglooInputNumber.formItemPropsHandler = function (config) {
     });
   }
 
-  if (idType === 'KTP') {
-    rules.push({
-      validator: function validator(rule, value) {
-        if (!/^((1[1-9])|(21)|([37][1-6])|(5[1-4])|(6[1-5])|([8-9][1-2]))[0-9]{4}(([0-6][0-9])|(7[0-1]))((0[1-9])|(1[0-2]))[0-9]{6}$/.test(value)) {
-          return Promise.reject(staticFormatMessage({
-            id: 'Invalid KTP Number.'
-          }));
-        }
-
-        return Promise.resolve();
-      }
-    });
-  }
-
   return {
     getValueFromEvent: function getValueFromEvent(e) {
       var value = e.target.value;

package/es/locale/en-US/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "I agree to the Igloo",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.",
   "Import": "Import",
+  "Invalid KTP Number.": "Invalid KTP Number.",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.",
   "Last 7 Days": "Last 7 Days",
   "Last Day": "Last Day",

package/es/locale/id-ID/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "Saya setuju dengan Igloo",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "Saya menyatakan bahwa pernyataan yang saya jelaskan di atas adalah benar. Selanjutnya saya nyatakan bahwa kerugian yang terjadi merupakan ketidaksengajaan,  dan terjadi tanpa perencanaan atau hasil musyawarah dengan pihak lain.",
   "Import": "Impor",
+  "Invalid KTP Number.": "Số KTP không hợp lệ.",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "Direkomendasikan untuk memilih tidak lebih dari {colMax} metrik untuk memastikan sudut pandang default dari setiap isi kolom.",
   "Last 7 Days": "7 hari terakhir",
   "Last Day": "hari terakhir",

package/es/locale/th-TH/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "ฉันเห็นด้วยกับกระท่อมน้ำแข็ง",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "ข้าพเจ้ายืนยันว่าข้อความที่ข้าพเจ้าได้อธิบายข้างต้นนั้นเป็นความจริง และยืนยันว่าความเสียหายที่เกิดขึ้นนั้นเกิดจากอุบัติเหตุ ปราศจากการวางแผน หรือ การเห็นพ้องร่วมกันกับฝ่ายอื่น",
   "Import": "นำเข้า",
+  "Invalid KTP Number.": "",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "แนะนำให้เลือกจำนวนไม่เกิน {colMax} เพื่อให้แน่ใจว่ามองเห็นค่าเริ่มต้นของข้อมูลแต่ละคอลัมน์",
   "Last 7 Days": "เมื่อ 7 วันที่แล้ว",
   "Last Day": "วันสุดท้าย",

package/es/locale/vi-VN/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "Tôi đồng ý với Igloo",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "Tôi tuyên bố rằng những điều tôi đã mô tả ở trên là đúng sự thật. Tôi tuyên bố thêm rằng tổn thất xảy ra là do ngẫu nhiên, không có kế hoạch hoặc sự đồng thuận với các bên khác.",
   "Import": "Nhập",
+  "Invalid KTP Number.": "",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "Vui lòng chọn không quá {colMax} cột.",
   "Last 7 Days": "7 ngày gần nhất",
   "Last Day": "ngày cuối",

package/es/locale/zh-CN/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "我同意Igloo",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "我承诺上述信息均真实有效，并且物品遗失纯属意外。",
   "Import": "导入",
+  "Invalid KTP Number.": "",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "建议不要选择超过{colMax}个字段，以确保最佳展示效果。",
   "Last 7 Days": "过去7天",
   "Last Day": "昨天",

package/es/locale/zh-TW/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "我聲明我上面描述的陳述是真的。我進一步宣布發生損失是偶然的，沒有規劃或與其他方的共識。",
   "Import": "導入",
+  "Invalid KTP Number.": "",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "建議選擇不超過{colMax}指標以確保每個列輸入的默認可見性。",
   "Last 7 Days": "過去7天",
   "Last Day": "過去1天",

package/es/select/attached-select.js

@@ -43,7 +43,7 @@ import LocaleContext from '../locale/locale-context';
 import Button from '../button';
 import Input from '../input';
 import './style';
-import { compareOptions, optionsHOC } from '../utils/option-utils';
+import { compareOptions, compareSelected, optionsHOC } from '../utils/option-utils';
 var Option = _Select.Option,
     OptGroup = _Select.OptGroup;
 export { Option, OptGroup };
@@ -84,7 +84,7 @@ var IglooSelect = function IglooSelect(_ref) {
 
   var originOptions = useRef(options);
   useEffect(function () {
-    typeof rest.onChange === 'function' && valueProp !== selected && rest.onChange(selected, selectedOptions);
+    typeof rest.onChange === 'function' && compareSelected(selected, valueProp) && rest.onChange(selected, selectedOptions);
   }, [selected]);
   useEffect(function () {
     valueProp !== selected && setSelected(valueProp);

package/es/select/select.js

@@ -59,7 +59,10 @@ var IglooSelect = function IglooSelect(_ref) {
   return _jsx(_Select, _objectSpread(_objectSpread({
     placeholder: placeholder || formatMessage({
       id: 'Please select'
-    })
+    }),
+    getPopupContainer: function getPopupContainer(trigger) {
+      return trigger.parentNode;
+    }
   }, omit(rest, formMethods)), {}, {
     options: children ? void 0 : options,
     value: value,
@@ -82,9 +85,6 @@ var IglooSelect = function IglooSelect(_ref) {
         }
       })]
     }),
-    getPopupContainer: function getPopupContainer(trigger) {
-      return trigger.parentNode;
-    },
     className: classnames('igloo-select', className),
     onDropdownVisibleChange: function onDropdownVisibleChange(open) {
       setOpen(open);

package/es/upload/index.js

@@ -566,7 +566,8 @@ var IglooUpload = function IglooUpload(props) {
       handleReUpload: handleReUpload,
       handlePreview: handlePreview,
       handleDelete: handleDelete,
-      containerRef: containerRef
+      containerRef: containerRef,
+      disabled: props.disabled
     })]
   });
 };
@@ -577,7 +578,8 @@ var FileList = function FileList(_ref7) {
       limit = _ref7.limit,
       handleDelete = _ref7.handleDelete,
       handlePreview = _ref7.handlePreview,
-      handleReUpload = _ref7.handleReUpload;
+      handleReUpload = _ref7.handleReUpload,
+      disabled = _ref7.disabled;
 
   var _useState3 = useState(false),
       _useState4 = _slicedToArray(_useState3, 2),
@@ -648,10 +650,10 @@ var FileList = function FileList(_ref7) {
             style: {
               fontSize: 24,
               color: '#999999',
-              cursor: 'pointer'
+              cursor: disabled ? 'default' : 'pointer'
             },
             onClick: function onClick() {
-              return handleDelete(index);
+              return !disabled && handleDelete(index);
             }
           })]
         }), status === 'failed' && _jsxs("div", {
@@ -660,20 +662,20 @@ var FileList = function FileList(_ref7) {
             style: {
               fontSize: 24,
               color: '#999999',
-              cursor: 'pointer'
+              cursor: disabled ? 'default' : 'pointer'
             },
             onClick: function onClick() {
-              return handleReUpload(index);
+              return !disabled && handleReUpload(index);
             },
             className: 'igloo-upload-preview-item-operation-left-icon'
           }), _jsx(CrossOutlined, {
             style: {
               fontSize: 24,
               color: '#999999',
-              cursor: 'pointer'
+              cursor: disabled ? 'default' : 'pointer'
             },
             onClick: function onClick() {
-              return handleDelete(index);
+              return !disabled && handleDelete(index);
             }
           })]
         })]

package/es/upload-photo/index.d.ts

@@ -17,6 +17,7 @@ export interface Props extends IglooComponentProps {
     id?: string;
     bizKey?: string;
     capture?: boolean;
+    disabled?: boolean;
 }
 export declare type Sample = {
     src: string;

package/es/upload-photo/index.js

@@ -721,6 +721,10 @@ var UploadPhoto = function UploadPhoto(props) {
   };
 
   var getBadge = function getBadge(status, index, limit) {
+    if (props.disabled) {
+      return null;
+    }
+
     if (status === 'progress') {
       return _jsx("div", {
         children: _jsx(LoadingOutlined, {

package/es/utils/option-utils.d.ts

@@ -3,6 +3,7 @@ import { FormInstance } from 'antd/es/form';
 import { NamePath } from 'antd/es/form/interface';
 import { SelectProps, SelectValue } from 'antd/es/select';
 export declare const compareOptions: (newOptions: any[], oldOptions?: any[] | undefined) => boolean;
+export declare const compareSelected: (newValue: any | any[], oldValue: any | any[]) => boolean;
 declare type Options = SelectProps<SelectValue>['options'];
 export interface HOCProps extends IglooComponentProps {
     options?: Options;

package/es/utils/option-utils.js

@@ -14,8 +14,6 @@ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symb
 
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
@@ -36,6 +34,8 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useState, useContext, useRef } from 'react';
 import FormContext from '../form-context';
@@ -62,6 +62,25 @@ export var compareOptions = function compareOptions(newOptions, oldOptions) {
 
   return false;
 };
+export var compareSelected = function compareSelected(newValue, oldValue) {
+  if (_typeof(newValue) !== _typeof(oldValue)) {
+    return true;
+  }
+
+  if (Array.isArray(newValue) && Array.isArray(oldValue)) {
+    if (newValue.length !== oldValue.length) {
+      return true;
+    }
+
+    return newValue.every(function (v) {
+      return oldValue.find(function (ov) {
+        return v === ov;
+      });
+    });
+  }
+
+  return newValue !== oldValue;
+};
 export function optionsHOC(Component) {
   return function (props) {
     var options = props.options,

package/lib/form/element/index.js

@@ -191,9 +191,16 @@ var Element = function Element(_ref) {
 
   (0, _react.useEffect)(function () {
     if (!formItemProps.name || preview || !formItemProps.copiedValue.copied) return;
+    var originalValue = form === null || form === void 0 ? void 0 : form.getFieldValue(formItemProps.name);
+    var value = formItemProps.copiedValue.value;
+
+    if (_typeof(originalValue) === 'object' && _typeof(value) === 'object') {
+      value = Object.assign(originalValue, formItemProps.copiedValue.value);
+    }
+
     form && form.setFields([{
       name: formItemProps.name,
-      value: formItemProps.copiedValue.value,
+      value: value,
       errors: []
     }]);
   }, [formItemProps.copiedValue.value]);

package/lib/form/elements.js

@@ -48,6 +48,7 @@ var elementMap = {
   PhoneNumber: _input.PhoneNumber,
   Amount: _input.Amount,
   InputNumber: _input.InputNumber,
+  InputId: _input.InputId,
   TextArea: _input.TextArea,
   DatePicker: _datePicker.default,
   CreditCard: _input.CreditCard,

package/lib/free-form/element/index.js

@@ -182,9 +182,16 @@ var Element = function Element(props) {
 
   (0, _react.useEffect)(function () {
     if (!formItemProps.name || preview || !formItemProps.copiedValue.copied) return;
+    var originalValue = form === null || form === void 0 ? void 0 : form.getFieldValue(formItemProps.name);
+    var value = formItemProps.copiedValue.value;
+
+    if (_typeof(originalValue) === 'object' && _typeof(value) === 'object') {
+      value = Object.assign(originalValue, formItemProps.copiedValue.value);
+    }
+
     form && form.setFields([{
       name: formItemProps.name,
-      value: formItemProps.copiedValue.value,
+      value: value,
       errors: []
     }]);
   }, [formItemProps.copiedValue.value]);

package/lib/index.d.ts

@@ -1,7 +1,7 @@
 export { default as Form } from './form';
 export { default as Button, GreenButton, YellowButton, RedButton, } from './button';
 export { default as DatePicker, IglooBuddhistDatePicker as BuddhistDatePicker, IglooRangePicker as RangePicker, IglooWeekPicker as WeekPicker, IglooMonthPicker as MonthPicker, } from './date-picker';
-export { default as Input, PhoneNumber, Amount, Password, Email, InputNumber, TextArea, InputDate, CreditCard, ExpiryDate, } from './input';
+export { default as Input, PhoneNumber, Amount, Password, Email, InputNumber, TextArea, InputDate, CreditCard, ExpiryDate, InputId, } from './input';
 export { default as Select, TimeSelect, AttachedSelect } from './select';
 export { default as Radio, RadioGroup, RadioGroupWithOther } from './radio';
 export { default as Example } from './example';

package/lib/index.js

@@ -26,6 +26,7 @@ var _exportNames = {
   InputDate: true,
   CreditCard: true,
   ExpiryDate: true,
+  InputId: true,
   Select: true,
   TimeSelect: true,
   AttachedSelect: true,
@@ -310,6 +311,12 @@ Object.defineProperty(exports, "InputDate", {
     return _input.InputDate;
   }
 });
+Object.defineProperty(exports, "InputId", {
+  enumerable: true,
+  get: function get() {
+    return _input.InputId;
+  }
+});
 Object.defineProperty(exports, "InputNumber", {
   enumerable: true,
   get: function get() {

package/lib/input/index.d.ts

@@ -8,5 +8,6 @@ export { default as InputDate } from './input-date';
 export { default as CreditCard } from './credit-card';
 export { default as Otp } from './otp';
 export { default as ExpiryDate } from './expiry-date';
+export { default as InputId } from './input-id';
 import IglooInput from './input';
 export default IglooInput;

package/lib/input/index.js

@@ -33,6 +33,12 @@ Object.defineProperty(exports, "InputDate", {
     return _inputDate.default;
   }
 });
+Object.defineProperty(exports, "InputId", {
+  enumerable: true,
+  get: function get() {
+    return _inputId.default;
+  }
+});
 Object.defineProperty(exports, "InputNumber", {
   enumerable: true,
   get: function get() {
@@ -85,6 +91,8 @@ var _otp = _interopRequireDefault(require("./otp"));
 
 var _expiryDate = _interopRequireDefault(require("./expiry-date"));
 
+var _inputId = _interopRequireDefault(require("./input-id"));
+
 var _input = _interopRequireDefault(require("./input"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/input/input-id.d.ts

@@ -0,0 +1,6 @@
+import { InputProps } from 'antd/es/input';
+import { FC, IglooComponentProps } from '../types';
+import './style/index.less';
+declare type Props = InputProps & IglooComponentProps;
+declare const InputId: FC<Props>;
+export default InputId;

package/lib/input/input-id.js

@@ -0,0 +1,127 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/input/style");
+
+var _input = _interopRequireDefault(require("antd/es/input"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _omit = _interopRequireDefault(require("omit.js"));
+
+var _formMethods = _interopRequireDefault(require("../utils/form-methods"));
+
+var _locale = require("../locale");
+
+require("./style/index.less");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var InputId = function InputId(props) {
+  return (0, _jsxRuntime.jsx)(_input.default, _objectSpread(_objectSpread({
+    className: "igloo-input"
+  }, (0, _omit.default)(props, _formMethods.default)), {}, {
+    type: "number"
+  }));
+};
+
+InputId.formItemPropsHandler = function (config) {
+  var length = config.length,
+      maxLength = config.maxLength,
+      minLength = config.minLength,
+      label = config.label,
+      idType = config.idType;
+  var rules = [];
+
+  if (length !== undefined) {
+    rules.push({
+      validator: function validator(_, value) {
+        if (value === undefined || value === null || String(value).length === length) return Promise.resolve();
+        return Promise.reject((0, _locale.staticFormatMessage)({
+          id: '{label} must be {length} digits.',
+          values: {
+            length: length,
+            label: label
+          }
+        }));
+      }
+    });
+  }
+
+  if (maxLength !== undefined && minLength !== undefined) {
+    rules.push({
+      validator: function validator(_, value) {
+        if (value === undefined || value === null || String(value).length >= minLength && String(value).length <= maxLength) return Promise.resolve();
+        return Promise.reject((0, _locale.staticFormatMessage)({
+          id: '{label} must be {minLength} - {maxLength} digits.',
+          values: {
+            maxLength: maxLength,
+            minLength: minLength,
+            label: label
+          }
+        }));
+      }
+    });
+  }
+
+  if (maxLength !== undefined && minLength === undefined) {
+    rules.push({
+      validator: function validator(_, value) {
+        if (value === undefined || value === null || String(value).length <= maxLength) return Promise.resolve();
+        return Promise.reject((0, _locale.staticFormatMessage)({
+          id: '{label} must be less than {maxLength} digits.',
+          values: {
+            maxLength: maxLength,
+            label: label
+          }
+        }));
+      }
+    });
+  }
+
+  if (maxLength === undefined && minLength !== undefined) {
+    rules.push({
+      validator: function validator(_, value) {
+        if (value === undefined || value === null || String(value).length >= minLength) return Promise.resolve();
+        return Promise.reject((0, _locale.staticFormatMessage)({
+          id: '{label} must be at least {minLength} digits.',
+          values: {
+            minLength: minLength,
+            label: label
+          }
+        }));
+      }
+    });
+  }
+
+  if (idType === 'KTP') {
+    rules.push({
+      validator: function validator(rule, value) {
+        if (!/^((1[1-9])|(21)|([37][1-6])|(5[1-4])|(6[1-5])|([8-9][1-2]))[0-9]{4}(([0-6][0-9])|(7[0-1]))((0[1-9])|(1[0-2]))[0-9]{6}$/.test(value)) {
+          return Promise.reject((0, _locale.staticFormatMessage)({
+            id: 'Invalid KTP Number.'
+          }));
+        }
+
+        return Promise.resolve();
+      }
+    });
+  }
+
+  return {
+    rules: rules
+  };
+};
+
+var _default = InputId;
+exports.default = _default;

package/lib/input/input-number.js

@@ -122,20 +122,6 @@ IglooInputNumber.formItemPropsHandler = function (config) {
     });
   }
 
-  if (idType === 'KTP') {
-    rules.push({
-      validator: function validator(rule, value) {
-        if (!/^((1[1-9])|(21)|([37][1-6])|(5[1-4])|(6[1-5])|([8-9][1-2]))[0-9]{4}(([0-6][0-9])|(7[0-1]))((0[1-9])|(1[0-2]))[0-9]{6}$/.test(value)) {
-          return Promise.reject((0, _locale.staticFormatMessage)({
-            id: 'Invalid KTP Number.'
-          }));
-        }
-
-        return Promise.resolve();
-      }
-    });
-  }
-
   return {
     getValueFromEvent: function getValueFromEvent(e) {
       var value = e.target.value;

package/lib/locale/en-US/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "I agree to the Igloo",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.",
   "Import": "Import",
+  "Invalid KTP Number.": "Invalid KTP Number.",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.",
   "Last 7 Days": "Last 7 Days",
   "Last Day": "Last Day",

package/lib/locale/id-ID/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "Saya setuju dengan Igloo",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "Saya menyatakan bahwa pernyataan yang saya jelaskan di atas adalah benar. Selanjutnya saya nyatakan bahwa kerugian yang terjadi merupakan ketidaksengajaan,  dan terjadi tanpa perencanaan atau hasil musyawarah dengan pihak lain.",
   "Import": "Impor",
+  "Invalid KTP Number.": "Số KTP không hợp lệ.",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "Direkomendasikan untuk memilih tidak lebih dari {colMax} metrik untuk memastikan sudut pandang default dari setiap isi kolom.",
   "Last 7 Days": "7 hari terakhir",
   "Last Day": "hari terakhir",

package/lib/locale/th-TH/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "ฉันเห็นด้วยกับกระท่อมน้ำแข็ง",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "ข้าพเจ้ายืนยันว่าข้อความที่ข้าพเจ้าได้อธิบายข้างต้นนั้นเป็นความจริง และยืนยันว่าความเสียหายที่เกิดขึ้นนั้นเกิดจากอุบัติเหตุ ปราศจากการวางแผน หรือ การเห็นพ้องร่วมกันกับฝ่ายอื่น",
   "Import": "นำเข้า",
+  "Invalid KTP Number.": "",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "แนะนำให้เลือกจำนวนไม่เกิน {colMax} เพื่อให้แน่ใจว่ามองเห็นค่าเริ่มต้นของข้อมูลแต่ละคอลัมน์",
   "Last 7 Days": "เมื่อ 7 วันที่แล้ว",
   "Last Day": "วันสุดท้าย",

package/lib/locale/vi-VN/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "Tôi đồng ý với Igloo",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "Tôi tuyên bố rằng những điều tôi đã mô tả ở trên là đúng sự thật. Tôi tuyên bố thêm rằng tổn thất xảy ra là do ngẫu nhiên, không có kế hoạch hoặc sự đồng thuận với các bên khác.",
   "Import": "Nhập",
+  "Invalid KTP Number.": "",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "Vui lòng chọn không quá {colMax} cột.",
   "Last 7 Days": "7 ngày gần nhất",
   "Last Day": "ngày cuối",

package/lib/locale/zh-CN/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "我同意Igloo",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "我承诺上述信息均真实有效，并且物品遗失纯属意外。",
   "Import": "导入",
+  "Invalid KTP Number.": "",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "建议不要选择超过{colMax}个字段，以确保最佳展示效果。",
   "Last 7 Days": "过去7天",
   "Last Day": "昨天",

package/lib/locale/zh-TW/messages.json

@@ -29,6 +29,7 @@
   "I agree to the Igloo": "",
   "I declare that the statements I have described above are true. I further declare that the loss occured was accidental, without planning or consensus with other parties.": "我聲明我上面描述的陳述是真的。我進一步宣布發生損失是偶然的，沒有規劃或與其他方的共識。",
   "Import": "導入",
+  "Invalid KTP Number.": "",
   "It is recommended to select no more than {colMax} metrics to ensure the default visibility of each column input.": "建議選擇不超過{colMax}指標以確保每個列輸入的默認可見性。",
   "Last 7 Days": "過去7天",
   "Last Day": "過去1天",

package/lib/select/attached-select.js

@@ -108,7 +108,7 @@ var IglooSelect = function IglooSelect(_ref) {
 
   var originOptions = (0, _react.useRef)(options);
   (0, _react.useEffect)(function () {
-    typeof rest.onChange === 'function' && valueProp !== selected && rest.onChange(selected, selectedOptions);
+    typeof rest.onChange === 'function' && (0, _optionUtils.compareSelected)(selected, valueProp) && rest.onChange(selected, selectedOptions);
   }, [selected]);
   (0, _react.useEffect)(function () {
     valueProp !== selected && setSelected(valueProp);

package/lib/select/select.js

@@ -79,7 +79,10 @@ var IglooSelect = function IglooSelect(_ref) {
   return (0, _jsxRuntime.jsx)(_select.default, _objectSpread(_objectSpread({
     placeholder: placeholder || formatMessage({
       id: 'Please select'
-    })
+    }),
+    getPopupContainer: function getPopupContainer(trigger) {
+      return trigger.parentNode;
+    }
   }, (0, _omit.default)(rest, _formMethods.default)), {}, {
     options: children ? void 0 : options,
     value: value,
@@ -102,9 +105,6 @@ var IglooSelect = function IglooSelect(_ref) {
         }
       })]
     }),
-    getPopupContainer: function getPopupContainer(trigger) {
-      return trigger.parentNode;
-    },
     className: (0, _classnames.default)('igloo-select', className),
     onDropdownVisibleChange: function onDropdownVisibleChange(open) {
       setOpen(open);

package/lib/upload/index.js

@@ -592,7 +592,8 @@ var IglooUpload = function IglooUpload(props) {
       handleReUpload: handleReUpload,
       handlePreview: handlePreview,
       handleDelete: handleDelete,
-      containerRef: containerRef
+      containerRef: containerRef,
+      disabled: props.disabled
     })]
   });
 };
@@ -603,7 +604,8 @@ var FileList = function FileList(_ref7) {
       limit = _ref7.limit,
       handleDelete = _ref7.handleDelete,
       handlePreview = _ref7.handlePreview,
-      handleReUpload = _ref7.handleReUpload;
+      handleReUpload = _ref7.handleReUpload,
+      disabled = _ref7.disabled;
 
   var _useState3 = (0, _react.useState)(false),
       _useState4 = _slicedToArray(_useState3, 2),
@@ -673,10 +675,10 @@ var FileList = function FileList(_ref7) {
             style: {
               fontSize: 24,
               color: '#999999',
-              cursor: 'pointer'
+              cursor: disabled ? 'default' : 'pointer'
             },
             onClick: function onClick() {
-              return handleDelete(index);
+              return !disabled && handleDelete(index);
             }
           })]
         }), status === 'failed' && (0, _jsxRuntime.jsxs)("div", {
@@ -685,20 +687,20 @@ var FileList = function FileList(_ref7) {
             style: {
               fontSize: 24,
               color: '#999999',
-              cursor: 'pointer'
+              cursor: disabled ? 'default' : 'pointer'
             },
             onClick: function onClick() {
-              return handleReUpload(index);
+              return !disabled && handleReUpload(index);
             },
             className: 'igloo-upload-preview-item-operation-left-icon'
           }), (0, _jsxRuntime.jsx)(_iglooicon.CrossOutlined, {
             style: {
               fontSize: 24,
               color: '#999999',
-              cursor: 'pointer'
+              cursor: disabled ? 'default' : 'pointer'
             },
             onClick: function onClick() {
-              return handleDelete(index);
+              return !disabled && handleDelete(index);
             }
           })]
         })]

package/lib/upload-photo/index.d.ts

@@ -17,6 +17,7 @@ export interface Props extends IglooComponentProps {
     id?: string;
     bizKey?: string;
     capture?: boolean;
+    disabled?: boolean;
 }
 export declare type Sample = {
     src: string;

package/lib/upload-photo/index.js

@@ -755,6 +755,10 @@ var UploadPhoto = function UploadPhoto(props) {
   };
 
   var getBadge = function getBadge(status, index, limit) {
+    if (props.disabled) {
+      return null;
+    }
+
     if (status === 'progress') {
       return (0, _jsxRuntime.jsx)("div", {
         children: (0, _jsxRuntime.jsx)(_iglooicon.LoadingOutlined, {

package/lib/utils/option-utils.d.ts

@@ -3,6 +3,7 @@ import { FormInstance } from 'antd/es/form';
 import { NamePath } from 'antd/es/form/interface';
 import { SelectProps, SelectValue } from 'antd/es/select';
 export declare const compareOptions: (newOptions: any[], oldOptions?: any[] | undefined) => boolean;
+export declare const compareSelected: (newValue: any | any[], oldValue: any | any[]) => boolean;
 declare type Options = SelectProps<SelectValue>['options'];
 export interface HOCProps extends IglooComponentProps {
     options?: Options;

package/lib/utils/option-utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.compareOptions = void 0;
+exports.compareSelected = exports.compareOptions = void 0;
 exports.optionsHOC = optionsHOC;
 
 var _jsxRuntime = require("react/jsx-runtime");
@@ -32,8 +32,6 @@ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symb
 
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
@@ -54,6 +52,8 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 var compareOptions = function compareOptions(newOptions, oldOptions) {
   if (!Array.isArray(oldOptions)) {
     return true;
@@ -79,6 +79,28 @@ var compareOptions = function compareOptions(newOptions, oldOptions) {
 
 exports.compareOptions = compareOptions;
 
+var compareSelected = function compareSelected(newValue, oldValue) {
+  if (_typeof(newValue) !== _typeof(oldValue)) {
+    return true;
+  }
+
+  if (Array.isArray(newValue) && Array.isArray(oldValue)) {
+    if (newValue.length !== oldValue.length) {
+      return true;
+    }
+
+    return newValue.every(function (v) {
+      return oldValue.find(function (ov) {
+        return v === ov;
+      });
+    });
+  }
+
+  return newValue !== oldValue;
+};
+
+exports.compareSelected = compareSelected;
+
 function optionsHOC(Component) {
   return function (props) {
     var options = props.options,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iglooform",
-  "version": "2.5.10",
+  "version": "2.5.13",
   "scripts": {
     "start": "dumi dev",
     "build-dev": "dumi build",