@djb25/digit-ui-module-ekyc 1.0.0 → 1.0.1

package/dist/index.modern.js

@@ -0,0 +1,2965 @@
+import React, { createContext, useCallback, useRef, useState, useEffect, useMemo, isValidElement, cloneElement, createElement, useContext } from 'react';
+import { Link, useHistory, useRouteMatch, useLocation, Switch } from 'react-router-dom';
+import { PersonIcon, EmployeeModuleCard, Label, Dropdown, TextInput, SubmitBar, LinkLabel, Card, Header, Table, Loader, DetailsCard, CardHeader, LabelFieldPair, CardLabel, ActionBar, StatusTable, Row, Modal, RadioButtons, TickMark, PropertyHouse, LocationIcon, InfoBannerIcon, HomeIcon, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute } from '@djb25/digit-ui-react-components';
+import { useTranslation } from 'react-i18next';
+
+const EKYCCard = () => {
+  const {
+    t
+  } = useTranslation();
+  const propsForModuleCard = {
+    Icon: /*#__PURE__*/React.createElement(PersonIcon, null),
+    moduleName: t("ACTION_TEST_EKYC"),
+    kpis: [{
+      count: "-",
+      label: t("TOTAL_EKYC"),
+      link: `/digit-ui/employee/ekyc/dashboard`
+    }],
+    links: [{
+      label: t("EKYC_DASHBOARD"),
+      link: `/digit-ui/employee/ekyc/dashboard`
+    }, {
+      label: t("EKYC_CREATE_KYC"),
+      link: `/digit-ui/employee/ekyc/create-kyc`
+    }]
+  };
+  return /*#__PURE__*/React.createElement(EmployeeModuleCard, propsForModuleCard);
+};
+
+var isHTMLElement = value => value instanceof HTMLElement;
+const EVENTS = {
+  BLUR: 'blur',
+  CHANGE: 'change',
+  INPUT: 'input'
+};
+const VALIDATION_MODE = {
+  onBlur: 'onBlur',
+  onChange: 'onChange',
+  onSubmit: 'onSubmit',
+  onTouched: 'onTouched',
+  all: 'all'
+};
+const SELECT = 'select';
+const UNDEFINED = 'undefined';
+const INPUT_VALIDATION_RULES = {
+  max: 'max',
+  min: 'min',
+  maxLength: 'maxLength',
+  minLength: 'minLength',
+  pattern: 'pattern',
+  required: 'required',
+  validate: 'validate'
+};
+function attachEventListeners({
+  ref
+}, shouldAttachChangeEvent, handleChange) {
+  if (isHTMLElement(ref) && handleChange) {
+    ref.addEventListener(shouldAttachChangeEvent ? EVENTS.CHANGE : EVENTS.INPUT, handleChange);
+    ref.addEventListener(EVENTS.BLUR, handleChange);
+  }
+}
+var isNullOrUndefined = value => value == null;
+const isObjectType = value => typeof value === 'object';
+var isObject = value => !isNullOrUndefined(value) && !Array.isArray(value) && isObjectType(value) && !(value instanceof Date);
+var isKey = value => /^\w*$/.test(value);
+var compact = value => value.filter(Boolean);
+var stringToPath = input => compact(input.replace(/["|']/g, '').replace(/\[/g, '.').replace(/\]/g, '').split('.'));
+function set(object, path, value) {
+  let index = -1;
+  const tempPath = isKey(path) ? [path] : stringToPath(path);
+  const length = tempPath.length;
+  const lastIndex = length - 1;
+  while (++index < length) {
+    const key = tempPath[index];
+    let newValue = value;
+    if (index !== lastIndex) {
+      const objValue = object[key];
+      newValue = isObject(objValue) || Array.isArray(objValue) ? objValue : !isNaN(+tempPath[index + 1]) ? [] : {};
+    }
+    object[key] = newValue;
+    object = object[key];
+  }
+  return object;
+}
+var transformToNestObject = (data, value = {}) => {
+  for (const key in data) {
+    !isKey(key) ? set(value, key, data[key]) : value[key] = data[key];
+  }
+  return value;
+};
+var isUndefined = val => val === undefined;
+var get = (obj = {}, path, defaultValue) => {
+  const result = compact(path.split(/[,[\].]+?/)).reduce((result, key) => isNullOrUndefined(result) ? result : result[key], obj);
+  return isUndefined(result) || result === obj ? isUndefined(obj[path]) ? defaultValue : obj[path] : result;
+};
+var focusOnErrorField = (fields, fieldErrors) => {
+  for (const key in fields) {
+    if (get(fieldErrors, key)) {
+      const field = fields[key];
+      if (field) {
+        if (field.ref.focus && isUndefined(field.ref.focus())) {
+          break;
+        } else if (field.options) {
+          field.options[0].ref.focus();
+          break;
+        }
+      }
+    }
+  }
+};
+var removeAllEventListeners = (ref, validateWithStateUpdate) => {
+  if (isHTMLElement(ref) && ref.removeEventListener) {
+    ref.removeEventListener(EVENTS.INPUT, validateWithStateUpdate);
+    ref.removeEventListener(EVENTS.CHANGE, validateWithStateUpdate);
+    ref.removeEventListener(EVENTS.BLUR, validateWithStateUpdate);
+  }
+};
+const defaultReturn = {
+  isValid: false,
+  value: null
+};
+var getRadioValue = options => Array.isArray(options) ? options.reduce((previous, option) => option && option.ref.checked ? {
+  isValid: true,
+  value: option.ref.value
+} : previous, defaultReturn) : defaultReturn;
+var getMultipleSelectValue = options => [...options].filter(({
+  selected
+}) => selected).map(({
+  value
+}) => value);
+var isRadioInput = element => element.type === 'radio';
+var isFileInput = element => element.type === 'file';
+var isCheckBoxInput = element => element.type === 'checkbox';
+var isMultipleSelect = element => element.type === `${SELECT}-multiple`;
+const defaultResult = {
+  value: false,
+  isValid: false
+};
+const validResult = {
+  value: true,
+  isValid: true
+};
+var getCheckboxValue = options => {
+  if (Array.isArray(options)) {
+    if (options.length > 1) {
+      const values = options.filter(option => option && option.ref.checked).map(({
+        ref: {
+          value
+        }
+      }) => value);
+      return {
+        value: values,
+        isValid: !!values.length
+      };
+    }
+    const {
+      checked,
+      value,
+      attributes
+    } = options[0].ref;
+    return checked ? attributes && !isUndefined(attributes.value) ? isUndefined(value) || value === '' ? validResult : {
+      value: value,
+      isValid: true
+    } : validResult : defaultResult;
+  }
+  return defaultResult;
+};
+function getFieldValue(fieldsRef, name, shallowFieldsStateRef, excludeDisabled, shouldKeepRawValue) {
+  const field = fieldsRef.current[name];
+  if (field) {
+    const {
+      ref: {
+        value,
+        disabled
+      },
+      ref,
+      valueAsNumber,
+      valueAsDate,
+      setValueAs
+    } = field;
+    if (disabled && excludeDisabled) {
+      return;
+    }
+    if (isFileInput(ref)) {
+      return ref.files;
+    }
+    if (isRadioInput(ref)) {
+      return getRadioValue(field.options).value;
+    }
+    if (isMultipleSelect(ref)) {
+      return getMultipleSelectValue(ref.options);
+    }
+    if (isCheckBoxInput(ref)) {
+      return getCheckboxValue(field.options).value;
+    }
+    return shouldKeepRawValue ? value : valueAsNumber ? value === '' ? NaN : +value : valueAsDate ? ref.valueAsDate : setValueAs ? setValueAs(value) : value;
+  }
+  if (shallowFieldsStateRef) {
+    return get(shallowFieldsStateRef.current, name);
+  }
+}
+function isDetached(element) {
+  if (!element) {
+    return true;
+  }
+  if (!(element instanceof HTMLElement) || element.nodeType === Node.DOCUMENT_NODE) {
+    return false;
+  }
+  return isDetached(element.parentNode);
+}
+var isEmptyObject = value => isObject(value) && !Object.keys(value).length;
+var isBoolean = value => typeof value === 'boolean';
+function baseGet(object, updatePath) {
+  const length = updatePath.slice(0, -1).length;
+  let index = 0;
+  while (index < length) {
+    object = isUndefined(object) ? index++ : object[updatePath[index++]];
+  }
+  return object;
+}
+function unset(object, path) {
+  const updatePath = isKey(path) ? [path] : stringToPath(path);
+  const childObject = updatePath.length == 1 ? object : baseGet(object, updatePath);
+  const key = updatePath[updatePath.length - 1];
+  let previousObjRef;
+  if (childObject) {
+    delete childObject[key];
+  }
+  for (let k = 0; k < updatePath.slice(0, -1).length; k++) {
+    let index = -1;
+    let objectRef;
+    const currentPaths = updatePath.slice(0, -(k + 1));
+    const currentPathsLength = currentPaths.length - 1;
+    if (k > 0) {
+      previousObjRef = object;
+    }
+    while (++index < currentPaths.length) {
+      const item = currentPaths[index];
+      objectRef = objectRef ? objectRef[item] : object[item];
+      if (currentPathsLength === index && (isObject(objectRef) && isEmptyObject(objectRef) || Array.isArray(objectRef) && !objectRef.filter(data => isObject(data) && !isEmptyObject(data) || isBoolean(data)).length)) {
+        previousObjRef ? delete previousObjRef[item] : delete object[item];
+      }
+      previousObjRef = objectRef;
+    }
+  }
+  return object;
+}
+const isSameRef = (fieldValue, ref) => fieldValue && fieldValue.ref === ref;
+function findRemovedFieldAndRemoveListener(fieldsRef, handleChange, field, shallowFieldsStateRef, shouldUnregister, forceDelete) {
+  const {
+    ref,
+    ref: {
+      name
+    }
+  } = field;
+  const fieldRef = fieldsRef.current[name];
+  if (!shouldUnregister) {
+    const value = getFieldValue(fieldsRef, name, shallowFieldsStateRef);
+    !isUndefined(value) && set(shallowFieldsStateRef.current, name, value);
+  }
+  if (!ref.type || !fieldRef) {
+    delete fieldsRef.current[name];
+    return;
+  }
+  if (isRadioInput(ref) || isCheckBoxInput(ref)) {
+    if (Array.isArray(fieldRef.options) && fieldRef.options.length) {
+      compact(fieldRef.options).forEach((option = {}, index) => {
+        if (isDetached(option.ref) && isSameRef(option, option.ref) || forceDelete) {
+          removeAllEventListeners(option.ref, handleChange);
+          unset(fieldRef.options, `[${index}]`);
+        }
+      });
+      if (fieldRef.options && !compact(fieldRef.options).length) {
+        delete fieldsRef.current[name];
+      }
+    } else {
+      delete fieldsRef.current[name];
+    }
+  } else if (isDetached(ref) && isSameRef(fieldRef, ref) || forceDelete) {
+    removeAllEventListeners(ref, handleChange);
+    delete fieldsRef.current[name];
+  }
+}
+var isPrimitive = value => isNullOrUndefined(value) || !isObjectType(value);
+function deepMerge(target, source) {
+  if (isPrimitive(target) || isPrimitive(source)) {
+    return source;
+  }
+  for (const key in source) {
+    const targetValue = target[key];
+    const sourceValue = source[key];
+    try {
+      target[key] = isObject(targetValue) && isObject(sourceValue) || Array.isArray(targetValue) && Array.isArray(sourceValue) ? deepMerge(targetValue, sourceValue) : sourceValue;
+    } catch (_a) {}
+  }
+  return target;
+}
+function deepEqual(object1, object2, isErrorObject) {
+  if (isPrimitive(object1) || isPrimitive(object2) || object1 instanceof Date || object2 instanceof Date) {
+    return object1 === object2;
+  }
+  if (!isValidElement(object1)) {
+    const keys1 = Object.keys(object1);
+    const keys2 = Object.keys(object2);
+    if (keys1.length !== keys2.length) {
+      return false;
+    }
+    for (const key of keys1) {
+      const val1 = object1[key];
+      if (!(isErrorObject && key === 'ref')) {
+        const val2 = object2[key];
+        if ((isObject(val1) || Array.isArray(val1)) && (isObject(val2) || Array.isArray(val2)) ? !deepEqual(val1, val2, isErrorObject) : val1 !== val2) {
+          return false;
+        }
+      }
+    }
+  }
+  return true;
+}
+function setDirtyFields(values, defaultValues, dirtyFields, parentNode, parentName) {
+  let index = -1;
+  while (++index < values.length) {
+    for (const key in values[index]) {
+      if (Array.isArray(values[index][key])) {
+        !dirtyFields[index] && (dirtyFields[index] = {});
+        dirtyFields[index][key] = [];
+        setDirtyFields(values[index][key], get(defaultValues[index] || {}, key, []), dirtyFields[index][key], dirtyFields[index], key);
+      } else {
+        deepEqual(get(defaultValues[index] || {}, key), values[index][key]) ? set(dirtyFields[index] || {}, key) : dirtyFields[index] = Object.assign(Object.assign({}, dirtyFields[index]), {
+          [key]: true
+        });
+      }
+    }
+    parentNode && !dirtyFields.length && delete parentNode[parentName];
+  }
+  return dirtyFields;
+}
+var setFieldArrayDirtyFields = (values, defaultValues, dirtyFields) => deepMerge(setDirtyFields(values, defaultValues, dirtyFields.slice(0, values.length)), setDirtyFields(defaultValues, values, dirtyFields.slice(0, values.length)));
+var isString = value => typeof value === 'string';
+var getFieldsValues = (fieldsRef, shallowFieldsState, shouldUnregister, excludeDisabled, search) => {
+  const output = {};
+  for (const name in fieldsRef.current) {
+    if (isUndefined(search) || (isString(search) ? name.startsWith(search) : Array.isArray(search) && search.find(data => name.startsWith(data)))) {
+      output[name] = getFieldValue(fieldsRef, name, undefined, excludeDisabled);
+    }
+  }
+  return shouldUnregister ? transformToNestObject(output) : deepMerge(shallowFieldsState, transformToNestObject(output));
+};
+var isErrorStateChanged = ({
+  errors,
+  name,
+  error,
+  validFields,
+  fieldsWithValidation
+}) => {
+  const isValid = isUndefined(error);
+  const previousError = get(errors, name);
+  return isValid && !!previousError || !isValid && !deepEqual(previousError, error, true) || isValid && get(fieldsWithValidation, name) && !get(validFields, name);
+};
+var isRegex = value => value instanceof RegExp;
+var getValueAndMessage = validationData => isObject(validationData) && !isRegex(validationData) ? validationData : {
+  value: validationData,
+  message: ''
+};
+var isFunction = value => typeof value === 'function';
+var isMessage = value => isString(value) || isValidElement(value);
+function getValidateError(result, ref, type = 'validate') {
+  if (isMessage(result) || isBoolean(result) && !result) {
+    return {
+      type,
+      message: isMessage(result) ? result : '',
+      ref
+    };
+  }
+}
+var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => validateAllFieldCriteria ? Object.assign(Object.assign({}, errors[name]), {
+  types: Object.assign(Object.assign({}, errors[name] && errors[name].types ? errors[name].types : {}), {
+    [type]: message || true
+  })
+}) : {};
+var validateField = async (fieldsRef, validateAllFieldCriteria, {
+  ref,
+  ref: {
+    value
+  },
+  options,
+  required,
+  maxLength,
+  minLength,
+  min,
+  max,
+  pattern,
+  validate
+}, shallowFieldsStateRef) => {
+  const name = ref.name;
+  const error = {};
+  const isRadio = isRadioInput(ref);
+  const isCheckBox = isCheckBoxInput(ref);
+  const isRadioOrCheckbox = isRadio || isCheckBox;
+  const isEmpty = value === '';
+  const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);
+  const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {
+    const message = exceedMax ? maxLengthMessage : minLengthMessage;
+    error[name] = Object.assign({
+      type: exceedMax ? maxType : minType,
+      message,
+      ref
+    }, exceedMax ? appendErrorsCurry(maxType, message) : appendErrorsCurry(minType, message));
+  };
+  if (required && (!isRadio && !isCheckBox && (isEmpty || isNullOrUndefined(value)) || isBoolean(value) && !value || isCheckBox && !getCheckboxValue(options).isValid || isRadio && !getRadioValue(options).isValid)) {
+    const {
+      value: _value,
+      message
+    } = isMessage(required) ? {
+      value: !!required,
+      message: required
+    } : getValueAndMessage(required);
+    if (_value) {
+      error[name] = Object.assign({
+        type: INPUT_VALIDATION_RULES.required,
+        message,
+        ref: isRadioOrCheckbox ? ((fieldsRef.current[name].options || [])[0] || {}).ref : ref
+      }, appendErrorsCurry(INPUT_VALIDATION_RULES.required, message));
+      if (!validateAllFieldCriteria) {
+        return error;
+      }
+    }
+  }
+  if ((!isNullOrUndefined(min) || !isNullOrUndefined(max)) && value !== '') {
+    let exceedMax;
+    let exceedMin;
+    const maxOutput = getValueAndMessage(max);
+    const minOutput = getValueAndMessage(min);
+    if (!isNaN(value)) {
+      const valueNumber = ref.valueAsNumber || parseFloat(value);
+      if (!isNullOrUndefined(maxOutput.value)) {
+        exceedMax = valueNumber > maxOutput.value;
+      }
+      if (!isNullOrUndefined(minOutput.value)) {
+        exceedMin = valueNumber < minOutput.value;
+      }
+    } else {
+      const valueDate = ref.valueAsDate || new Date(value);
+      if (isString(maxOutput.value)) {
+        exceedMax = valueDate > new Date(maxOutput.value);
+      }
+      if (isString(minOutput.value)) {
+        exceedMin = valueDate < new Date(minOutput.value);
+      }
+    }
+    if (exceedMax || exceedMin) {
+      getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);
+      if (!validateAllFieldCriteria) {
+        return error;
+      }
+    }
+  }
+  if (isString(value) && !isEmpty && (maxLength || minLength)) {
+    const maxLengthOutput = getValueAndMessage(maxLength);
+    const minLengthOutput = getValueAndMessage(minLength);
+    const exceedMax = !isNullOrUndefined(maxLengthOutput.value) && value.length > maxLengthOutput.value;
+    const exceedMin = !isNullOrUndefined(minLengthOutput.value) && value.length < minLengthOutput.value;
+    if (exceedMax || exceedMin) {
+      getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
+      if (!validateAllFieldCriteria) {
+        return error;
+      }
+    }
+  }
+  if (isString(value) && pattern && !isEmpty) {
+    const {
+      value: patternValue,
+      message
+    } = getValueAndMessage(pattern);
+    if (isRegex(patternValue) && !patternValue.test(value)) {
+      error[name] = Object.assign({
+        type: INPUT_VALIDATION_RULES.pattern,
+        message,
+        ref
+      }, appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message));
+      if (!validateAllFieldCriteria) {
+        return error;
+      }
+    }
+  }
+  if (validate) {
+    const fieldValue = getFieldValue(fieldsRef, name, shallowFieldsStateRef, false, true);
+    const validateRef = isRadioOrCheckbox && options ? options[0].ref : ref;
+    if (isFunction(validate)) {
+      const result = await validate(fieldValue);
+      const validateError = getValidateError(result, validateRef);
+      if (validateError) {
+        error[name] = Object.assign(Object.assign({}, validateError), appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message));
+        if (!validateAllFieldCriteria) {
+          return error;
+        }
+      }
+    } else if (isObject(validate)) {
+      let validationResult = {};
+      for (const [key, validateFunction] of Object.entries(validate)) {
+        if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
+          break;
+        }
+        const validateResult = await validateFunction(fieldValue);
+        const validateError = getValidateError(validateResult, validateRef, key);
+        if (validateError) {
+          validationResult = Object.assign(Object.assign({}, validateError), appendErrorsCurry(key, validateError.message));
+          if (validateAllFieldCriteria) {
+            error[name] = validationResult;
+          }
+        }
+      }
+      if (!isEmptyObject(validationResult)) {
+        error[name] = Object.assign({
+          ref: validateRef
+        }, validationResult);
+        if (!validateAllFieldCriteria) {
+          return error;
+        }
+      }
+    }
+  }
+  return error;
+};
+const getPath = (rootPath, values, paths = []) => {
+  for (const property in values) {
+    const rootName = rootPath + (isObject(values) ? `.${property}` : `[${property}]`);
+    isPrimitive(values[property]) ? paths.push(rootName) : getPath(rootName, values[property], paths);
+  }
+  return paths;
+};
+var assignWatchFields = (fieldValues, fieldName, watchFields, inputValue, isSingleField) => {
+  let value = undefined;
+  watchFields.add(fieldName);
+  if (!isEmptyObject(fieldValues)) {
+    value = get(fieldValues, fieldName);
+    if (isObject(value) || Array.isArray(value)) {
+      getPath(fieldName, value).forEach(name => watchFields.add(name));
+    }
+  }
+  return isUndefined(value) ? isSingleField ? inputValue : get(inputValue, fieldName) : value;
+};
+var skipValidation = ({
+  isOnBlur,
+  isOnChange,
+  isOnTouch,
+  isTouched,
+  isReValidateOnBlur,
+  isReValidateOnChange,
+  isBlurEvent,
+  isSubmitted,
+  isOnAll
+}) => {
+  if (isOnAll) {
+    return false;
+  } else if (!isSubmitted && isOnTouch) {
+    return !(isTouched || isBlurEvent);
+  } else if (isSubmitted ? isReValidateOnBlur : isOnBlur) {
+    return !isBlurEvent;
+  } else if (isSubmitted ? isReValidateOnChange : isOnChange) {
+    return isBlurEvent;
+  }
+  return true;
+};
+var getFieldArrayParentName = name => name.substring(0, name.indexOf('['));
+const isMatchFieldArrayName = (name, searchName) => RegExp(`^${searchName}([|.)\\d+`.replace(/\[/g, '\\[').replace(/\]/g, '\\]')).test(name);
+var isNameInFieldArray = (names, name) => [...names].some(current => isMatchFieldArrayName(name, current));
+var isSelectInput = element => element.type === `${SELECT}-one`;
+function onDomRemove(fieldsRef, removeFieldEventListenerAndRef) {
+  const observer = new MutationObserver(() => {
+    for (const field of Object.values(fieldsRef.current)) {
+      if (field && field.options) {
+        for (const option of field.options) {
+          if (option && option.ref && isDetached(option.ref)) {
+            removeFieldEventListenerAndRef(field);
+          }
+        }
+      } else if (field && isDetached(field.ref)) {
+        removeFieldEventListenerAndRef(field);
+      }
+    }
+  });
+  observer.observe(window.document, {
+    childList: true,
+    subtree: true
+  });
+  return observer;
+}
+var isWeb = typeof window !== UNDEFINED && typeof document !== UNDEFINED;
+function cloneObject(data) {
+  var _a;
+  let copy;
+  if (isPrimitive(data) || isWeb && (data instanceof File || isHTMLElement(data))) {
+    return data;
+  }
+  if (!['Set', 'Map', 'Object', 'Date', 'Array'].includes((_a = data.constructor) === null || _a === void 0 ? void 0 : _a.name)) {
+    return data;
+  }
+  if (data instanceof Date) {
+    copy = new Date(data.getTime());
+    return copy;
+  }
+  if (data instanceof Set) {
+    copy = new Set();
+    for (const item of data) {
+      copy.add(item);
+    }
+    return copy;
+  }
+  if (data instanceof Map) {
+    copy = new Map();
+    for (const key of data.keys()) {
+      copy.set(key, cloneObject(data.get(key)));
+    }
+    return copy;
+  }
+  copy = Array.isArray(data) ? [] : {};
+  for (const key in data) {
+    copy[key] = cloneObject(data[key]);
+  }
+  return copy;
+}
+var modeChecker = mode => ({
+  isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,
+  isOnBlur: mode === VALIDATION_MODE.onBlur,
+  isOnChange: mode === VALIDATION_MODE.onChange,
+  isOnAll: mode === VALIDATION_MODE.all,
+  isOnTouch: mode === VALIDATION_MODE.onTouched
+});
+var isRadioOrCheckboxFunction = ref => isRadioInput(ref) || isCheckBoxInput(ref);
+const isWindowUndefined = typeof window === UNDEFINED;
+const isProxyEnabled = isWeb ? 'Proxy' in window : typeof Proxy !== UNDEFINED;
+function useForm({
+  mode = VALIDATION_MODE.onSubmit,
+  reValidateMode = VALIDATION_MODE.onChange,
+  resolver,
+  context,
+  defaultValues = {},
+  shouldFocusError = true,
+  shouldUnregister = true,
+  criteriaMode
+} = {}) {
+  const fieldsRef = useRef({});
+  const fieldArrayDefaultValuesRef = useRef({});
+  const fieldArrayValuesRef = useRef({});
+  const watchFieldsRef = useRef(new Set());
+  const useWatchFieldsRef = useRef({});
+  const useWatchRenderFunctionsRef = useRef({});
+  const fieldsWithValidationRef = useRef({});
+  const validFieldsRef = useRef({});
+  const defaultValuesRef = useRef(defaultValues);
+  const isUnMount = useRef(false);
+  const isWatchAllRef = useRef(false);
+  const handleChangeRef = useRef();
+  const shallowFieldsStateRef = useRef({});
+  const resetFieldArrayFunctionRef = useRef({});
+  const contextRef = useRef(context);
+  const resolverRef = useRef(resolver);
+  const fieldArrayNamesRef = useRef(new Set());
+  const modeRef = useRef(modeChecker(mode));
+  const {
+    isOnSubmit,
+    isOnTouch
+  } = modeRef.current;
+  const isValidateAllFieldCriteria = criteriaMode === VALIDATION_MODE.all;
+  const [formState, setFormState] = useState({
+    isDirty: false,
+    isValidating: false,
+    dirtyFields: {},
+    isSubmitted: false,
+    submitCount: 0,
+    touched: {},
+    isSubmitting: false,
+    isSubmitSuccessful: false,
+    isValid: !isOnSubmit,
+    errors: {}
+  });
+  const readFormStateRef = useRef({
+    isDirty: !isProxyEnabled,
+    dirtyFields: !isProxyEnabled,
+    touched: !isProxyEnabled || isOnTouch,
+    isValidating: !isProxyEnabled,
+    isSubmitting: !isProxyEnabled,
+    isValid: !isProxyEnabled
+  });
+  const formStateRef = useRef(formState);
+  const observerRef = useRef();
+  const {
+    isOnBlur: isReValidateOnBlur,
+    isOnChange: isReValidateOnChange
+  } = useRef(modeChecker(reValidateMode)).current;
+  contextRef.current = context;
+  resolverRef.current = resolver;
+  formStateRef.current = formState;
+  shallowFieldsStateRef.current = shouldUnregister ? {} : isEmptyObject(shallowFieldsStateRef.current) ? cloneObject(defaultValues) : shallowFieldsStateRef.current;
+  const updateFormState = useCallback((state = {}) => {
+    if (!isUnMount.current) {
+      formStateRef.current = Object.assign(Object.assign({}, formStateRef.current), state);
+      setFormState(formStateRef.current);
+    }
+  }, []);
+  const updateIsValidating = () => readFormStateRef.current.isValidating && updateFormState({
+    isValidating: true
+  });
+  const shouldRenderBaseOnError = useCallback((name, error, shouldRender = false, state = {}, isValid) => {
+    let shouldReRender = shouldRender || isErrorStateChanged({
+      errors: formStateRef.current.errors,
+      error,
+      name,
+      validFields: validFieldsRef.current,
+      fieldsWithValidation: fieldsWithValidationRef.current
+    });
+    const previousError = get(formStateRef.current.errors, name);
+    if (error) {
+      unset(validFieldsRef.current, name);
+      shouldReRender = shouldReRender || !previousError || !deepEqual(previousError, error, true);
+      set(formStateRef.current.errors, name, error);
+    } else {
+      if (get(fieldsWithValidationRef.current, name) || resolverRef.current) {
+        set(validFieldsRef.current, name, true);
+        shouldReRender = shouldReRender || previousError;
+      }
+      unset(formStateRef.current.errors, name);
+    }
+    if (shouldReRender && !isNullOrUndefined(shouldRender) || !isEmptyObject(state) || readFormStateRef.current.isValidating) {
+      updateFormState(Object.assign(Object.assign(Object.assign({}, state), resolverRef.current ? {
+        isValid: !!isValid
+      } : {}), {
+        isValidating: false
+      }));
+    }
+  }, []);
+  const setFieldValue = useCallback((name, rawValue) => {
+    const {
+      ref,
+      options
+    } = fieldsRef.current[name];
+    const value = isWeb && isHTMLElement(ref) && isNullOrUndefined(rawValue) ? '' : rawValue;
+    if (isRadioInput(ref)) {
+      (options || []).forEach(({
+        ref: radioRef
+      }) => radioRef.checked = radioRef.value === value);
+    } else if (isFileInput(ref) && !isString(value)) {
+      ref.files = value;
+    } else if (isMultipleSelect(ref)) {
+      [...ref.options].forEach(selectRef => selectRef.selected = value.includes(selectRef.value));
+    } else if (isCheckBoxInput(ref) && options) {
+      options.length > 1 ? options.forEach(({
+        ref: checkboxRef
+      }) => checkboxRef.checked = Array.isArray(value) ? !!value.find(data => data === checkboxRef.value) : value === checkboxRef.value) : options[0].ref.checked = !!value;
+    } else {
+      ref.value = value;
+    }
+  }, []);
+  const isFormDirty = useCallback((name, data) => {
+    if (readFormStateRef.current.isDirty) {
+      const formValues = getValues();
+      name && data && set(formValues, name, data);
+      return !deepEqual(formValues, defaultValuesRef.current);
+    }
+    return false;
+  }, []);
+  const updateAndGetDirtyState = useCallback((name, shouldRender = true) => {
+    if (readFormStateRef.current.isDirty || readFormStateRef.current.dirtyFields) {
+      const isFieldDirty = !deepEqual(get(defaultValuesRef.current, name), getFieldValue(fieldsRef, name, shallowFieldsStateRef));
+      const isDirtyFieldExist = get(formStateRef.current.dirtyFields, name);
+      const previousIsDirty = formStateRef.current.isDirty;
+      isFieldDirty ? set(formStateRef.current.dirtyFields, name, true) : unset(formStateRef.current.dirtyFields, name);
+      const state = {
+        isDirty: isFormDirty(),
+        dirtyFields: formStateRef.current.dirtyFields
+      };
+      const isChanged = readFormStateRef.current.isDirty && previousIsDirty !== state.isDirty || readFormStateRef.current.dirtyFields && isDirtyFieldExist !== get(formStateRef.current.dirtyFields, name);
+      isChanged && shouldRender && updateFormState(state);
+      return isChanged ? state : {};
+    }
+    return {};
+  }, []);
+  const executeValidation = useCallback(async (name, skipReRender) => {
+    if (process.env.NODE_ENV !== 'production') {
+      if (!fieldsRef.current[name]) {
+        console.warn('📋 Field is missing with `name` attribute: ', name);
+        return false;
+      }
+    }
+    const error = (await validateField(fieldsRef, isValidateAllFieldCriteria, fieldsRef.current[name], shallowFieldsStateRef))[name];
+    shouldRenderBaseOnError(name, error, skipReRender);
+    return isUndefined(error);
+  }, [shouldRenderBaseOnError, isValidateAllFieldCriteria]);
+  const executeSchemaOrResolverValidation = useCallback(async names => {
+    const {
+      errors
+    } = await resolverRef.current(getValues(), contextRef.current, isValidateAllFieldCriteria);
+    const previousFormIsValid = formStateRef.current.isValid;
+    if (Array.isArray(names)) {
+      const isInputsValid = names.map(name => {
+        const error = get(errors, name);
+        error ? set(formStateRef.current.errors, name, error) : unset(formStateRef.current.errors, name);
+        return !error;
+      }).every(Boolean);
+      updateFormState({
+        isValid: isEmptyObject(errors),
+        isValidating: false
+      });
+      return isInputsValid;
+    } else {
+      const error = get(errors, names);
+      shouldRenderBaseOnError(names, error, previousFormIsValid !== isEmptyObject(errors), {}, isEmptyObject(errors));
+      return !error;
+    }
+  }, [shouldRenderBaseOnError, isValidateAllFieldCriteria]);
+  const trigger = useCallback(async name => {
+    const fields = name || Object.keys(fieldsRef.current);
+    updateIsValidating();
+    if (resolverRef.current) {
+      return executeSchemaOrResolverValidation(fields);
+    }
+    if (Array.isArray(fields)) {
+      !name && (formStateRef.current.errors = {});
+      const result = await Promise.all(fields.map(async data => await executeValidation(data, null)));
+      updateFormState({
+        isValidating: false
+      });
+      return result.every(Boolean);
+    }
+    return await executeValidation(fields);
+  }, [executeSchemaOrResolverValidation, executeValidation]);
+  const setInternalValues = useCallback((name, value, {
+    shouldDirty,
+    shouldValidate
+  }) => {
+    const data = {};
+    set(data, name, value);
+    for (const fieldName of getPath(name, value)) {
+      if (fieldsRef.current[fieldName]) {
+        setFieldValue(fieldName, get(data, fieldName));
+        shouldDirty && updateAndGetDirtyState(fieldName);
+        shouldValidate && trigger(fieldName);
+      }
+    }
+  }, [trigger, setFieldValue, updateAndGetDirtyState]);
+  const setInternalValue = useCallback((name, value, config) => {
+    !shouldUnregister && !isPrimitive(value) && set(shallowFieldsStateRef.current, name, Array.isArray(value) ? [...value] : Object.assign({}, value));
+    if (fieldsRef.current[name]) {
+      setFieldValue(name, value);
+      config.shouldDirty && updateAndGetDirtyState(name);
+      config.shouldValidate && trigger(name);
+    } else if (!isPrimitive(value)) {
+      setInternalValues(name, value, config);
+      if (fieldArrayNamesRef.current.has(name)) {
+        const parentName = getFieldArrayParentName(name) || name;
+        set(fieldArrayDefaultValuesRef.current, name, value);
+        resetFieldArrayFunctionRef.current[parentName]({
+          [parentName]: get(fieldArrayDefaultValuesRef.current, parentName)
+        });
+        if ((readFormStateRef.current.isDirty || readFormStateRef.current.dirtyFields) && config.shouldDirty) {
+          set(formStateRef.current.dirtyFields, name, setFieldArrayDirtyFields(value, get(defaultValuesRef.current, name, []), get(formStateRef.current.dirtyFields, name, [])));
+          updateFormState({
+            isDirty: !deepEqual(Object.assign(Object.assign({}, getValues()), {
+              [name]: value
+            }), defaultValuesRef.current)
+          });
+        }
+      }
+    }
+    !shouldUnregister && set(shallowFieldsStateRef.current, name, value);
+  }, [updateAndGetDirtyState, setFieldValue, setInternalValues]);
+  const isFieldWatched = name => isWatchAllRef.current || watchFieldsRef.current.has(name) || watchFieldsRef.current.has((name.match(/\w+/) || [])[0]);
+  const renderWatchedInputs = name => {
+    let found = true;
+    if (!isEmptyObject(useWatchFieldsRef.current)) {
+      for (const key in useWatchFieldsRef.current) {
+        if (!name || !useWatchFieldsRef.current[key].size || useWatchFieldsRef.current[key].has(name) || useWatchFieldsRef.current[key].has(getFieldArrayParentName(name))) {
+          useWatchRenderFunctionsRef.current[key]();
+          found = false;
+        }
+      }
+    }
+    return found;
+  };
+  function setValue(name, value, config) {
+    setInternalValue(name, value, config || {});
+    isFieldWatched(name) && updateFormState();
+    renderWatchedInputs(name);
+  }
+  handleChangeRef.current = handleChangeRef.current ? handleChangeRef.current : async ({
+    type,
+    target
+  }) => {
+    let name = target.name;
+    const field = fieldsRef.current[name];
+    let error;
+    let isValid;
+    if (field) {
+      const isBlurEvent = type === EVENTS.BLUR;
+      const shouldSkipValidation = skipValidation(Object.assign({
+        isBlurEvent,
+        isReValidateOnChange,
+        isReValidateOnBlur,
+        isTouched: !!get(formStateRef.current.touched, name),
+        isSubmitted: formStateRef.current.isSubmitted
+      }, modeRef.current));
+      let state = updateAndGetDirtyState(name, false);
+      let shouldRender = !isEmptyObject(state) || !isBlurEvent && isFieldWatched(name);
+      if (isBlurEvent && !get(formStateRef.current.touched, name) && readFormStateRef.current.touched) {
+        set(formStateRef.current.touched, name, true);
+        state = Object.assign(Object.assign({}, state), {
+          touched: formStateRef.current.touched
+        });
+      }
+      if (!shouldUnregister && isCheckBoxInput(target)) {
+        set(shallowFieldsStateRef.current, name, getFieldValue(fieldsRef, name));
+      }
+      if (shouldSkipValidation) {
+        !isBlurEvent && renderWatchedInputs(name);
+        return (!isEmptyObject(state) || shouldRender && isEmptyObject(state)) && updateFormState(state);
+      }
+      updateIsValidating();
+      if (resolverRef.current) {
+        const {
+          errors
+        } = await resolverRef.current(getValues(), contextRef.current, isValidateAllFieldCriteria);
+        const previousFormIsValid = formStateRef.current.isValid;
+        error = get(errors, name);
+        if (isCheckBoxInput(target) && !error && resolverRef.current) {
+          const parentNodeName = getFieldArrayParentName(name);
+          const currentError = get(errors, parentNodeName, {});
+          currentError.type && currentError.message && (error = currentError);
+          if (parentNodeName && (currentError || get(formStateRef.current.errors, parentNodeName))) {
+            name = parentNodeName;
+          }
+        }
+        isValid = isEmptyObject(errors);
+        previousFormIsValid !== isValid && (shouldRender = true);
+      } else {
+        error = (await validateField(fieldsRef, isValidateAllFieldCriteria, field, shallowFieldsStateRef))[name];
+      }
+      !isBlurEvent && renderWatchedInputs(name);
+      shouldRenderBaseOnError(name, error, shouldRender, state, isValid);
+    }
+  };
+  function setFieldArrayDefaultValues(data) {
+    if (!shouldUnregister) {
+      let copy = cloneObject(data);
+      for (const value of fieldArrayNamesRef.current) {
+        if (isKey(value) && !copy[value]) {
+          copy = Object.assign(Object.assign({}, copy), {
+            [value]: []
+          });
+        }
+      }
+      return copy;
+    }
+    return data;
+  }
+  function getValues(payload) {
+    if (isString(payload)) {
+      return getFieldValue(fieldsRef, payload, shallowFieldsStateRef);
+    }
+    if (Array.isArray(payload)) {
+      const data = {};
+      for (const name of payload) {
+        set(data, name, getFieldValue(fieldsRef, name, shallowFieldsStateRef));
+      }
+      return data;
+    }
+    return setFieldArrayDefaultValues(getFieldsValues(fieldsRef, cloneObject(shallowFieldsStateRef.current), shouldUnregister));
+  }
+  const validateResolver = useCallback(async (values = {}) => {
+    const newDefaultValues = isEmptyObject(fieldsRef.current) ? defaultValuesRef.current : {};
+    const {
+      errors
+    } = (await resolverRef.current(Object.assign(Object.assign(Object.assign({}, newDefaultValues), getValues()), values), contextRef.current, isValidateAllFieldCriteria)) || {};
+    const isValid = isEmptyObject(errors);
+    formStateRef.current.isValid !== isValid && updateFormState({
+      isValid
+    });
+  }, [isValidateAllFieldCriteria]);
+  const removeFieldEventListener = useCallback((field, forceDelete) => {
+    findRemovedFieldAndRemoveListener(fieldsRef, handleChangeRef.current, field, shallowFieldsStateRef, shouldUnregister, forceDelete);
+    if (shouldUnregister) {
+      unset(validFieldsRef.current, field.ref.name);
+      unset(fieldsWithValidationRef.current, field.ref.name);
+    }
+  }, [shouldUnregister]);
+  const updateWatchedValue = useCallback(name => {
+    if (isWatchAllRef.current) {
+      updateFormState();
+    } else {
+      for (const watchField of watchFieldsRef.current) {
+        if (watchField.startsWith(name)) {
+          updateFormState();
+          break;
+        }
+      }
+      renderWatchedInputs(name);
+    }
+  }, []);
+  const removeFieldEventListenerAndRef = useCallback((field, forceDelete) => {
+    if (field) {
+      removeFieldEventListener(field, forceDelete);
+      if (shouldUnregister && !compact(field.options || []).length) {
+        unset(formStateRef.current.errors, field.ref.name);
+        set(formStateRef.current.dirtyFields, field.ref.name, true);
+        updateFormState({
+          isDirty: isFormDirty()
+        });
+        readFormStateRef.current.isValid && resolverRef.current && validateResolver();
+        updateWatchedValue(field.ref.name);
+      }
+    }
+  }, [validateResolver, removeFieldEventListener]);
+  function clearErrors(name) {
+    name && (Array.isArray(name) ? name : [name]).forEach(inputName => fieldsRef.current[inputName] && isKey(inputName) ? delete formStateRef.current.errors[inputName] : unset(formStateRef.current.errors, inputName));
+    updateFormState({
+      errors: name ? formStateRef.current.errors : {}
+    });
+  }
+  function setError(name, error) {
+    const ref = (fieldsRef.current[name] || {}).ref;
+    set(formStateRef.current.errors, name, Object.assign(Object.assign({}, error), {
+      ref
+    }));
+    updateFormState({
+      isValid: false
+    });
+    error.shouldFocus && ref && ref.focus && ref.focus();
+  }
+  const watchInternal = useCallback((fieldNames, defaultValue, watchId) => {
+    const watchFields = watchId ? useWatchFieldsRef.current[watchId] : watchFieldsRef.current;
+    let fieldValues = getFieldsValues(fieldsRef, cloneObject(shallowFieldsStateRef.current), shouldUnregister, false, fieldNames);
+    if (isString(fieldNames)) {
+      const parentNodeName = getFieldArrayParentName(fieldNames) || fieldNames;
+      if (fieldArrayNamesRef.current.has(parentNodeName)) {
+        fieldValues = Object.assign(Object.assign({}, fieldArrayValuesRef.current), fieldValues);
+      }
+      return assignWatchFields(fieldValues, fieldNames, watchFields, isUndefined(get(defaultValuesRef.current, fieldNames)) ? defaultValue : get(defaultValuesRef.current, fieldNames), true);
+    }
+    const combinedDefaultValues = isUndefined(defaultValue) ? defaultValuesRef.current : defaultValue;
+    if (Array.isArray(fieldNames)) {
+      return fieldNames.reduce((previous, name) => Object.assign(Object.assign({}, previous), {
+        [name]: assignWatchFields(fieldValues, name, watchFields, combinedDefaultValues)
+      }), {});
+    }
+    isWatchAllRef.current = isUndefined(watchId);
+    return transformToNestObject(!isEmptyObject(fieldValues) && fieldValues || combinedDefaultValues);
+  }, []);
+  function watch(fieldNames, defaultValue) {
+    return watchInternal(fieldNames, defaultValue);
+  }
+  function unregister(name) {
+    for (const fieldName of Array.isArray(name) ? name : [name]) {
+      removeFieldEventListenerAndRef(fieldsRef.current[fieldName], true);
+    }
+  }
+  function registerFieldRef(ref, options = {}) {
+    if (process.env.NODE_ENV !== 'production') {
+      if (!ref.name) {
+        return console.warn('📋 Field is missing `name` attribute', ref, `https://react-hook-form.com/api#useForm`);
+      }
+      if (fieldArrayNamesRef.current.has(ref.name.split(/\[\d+\]$/)[0]) && !RegExp(`^${ref.name.split(/\[\d+\]$/)[0]}[\\d+].\\w+`.replace(/\[/g, '\\[').replace(/\]/g, '\\]')).test(ref.name)) {
+        return console.warn('📋 `name` prop should be in object shape: name="test[index].name"', ref, 'https://react-hook-form.com/api#useFieldArray');
+      }
+    }
+    const {
+      name,
+      type,
+      value
+    } = ref;
+    const fieldRefAndValidationOptions = Object.assign({
+      ref
+    }, options);
+    const fields = fieldsRef.current;
+    const isRadioOrCheckbox = isRadioOrCheckboxFunction(ref);
+    const isFieldArray = isNameInFieldArray(fieldArrayNamesRef.current, name);
+    const compareRef = currentRef => isWeb && (!isHTMLElement(ref) || currentRef === ref);
+    let field = fields[name];
+    let isEmptyDefaultValue = true;
+    let defaultValue;
+    if (field && (isRadioOrCheckbox ? Array.isArray(field.options) && compact(field.options).find(option => {
+      return value === option.ref.value && compareRef(option.ref);
+    }) : compareRef(field.ref))) {
+      fields[name] = Object.assign(Object.assign({}, field), options);
+      return;
+    }
+    if (type) {
+      field = isRadioOrCheckbox ? Object.assign({
+        options: [...compact(field && field.options || []), {
+          ref
+        }],
+        ref: {
+          type,
+          name
+        }
+      }, options) : Object.assign({}, fieldRefAndValidationOptions);
+    } else {
+      field = fieldRefAndValidationOptions;
+    }
+    fields[name] = field;
+    const isEmptyUnmountFields = isUndefined(get(shallowFieldsStateRef.current, name));
+    if (!isEmptyObject(defaultValuesRef.current) || !isEmptyUnmountFields) {
+      defaultValue = get(isEmptyUnmountFields ? defaultValuesRef.current : shallowFieldsStateRef.current, name);
+      isEmptyDefaultValue = isUndefined(defaultValue);
+      if (!isEmptyDefaultValue && !isFieldArray) {
+        setFieldValue(name, defaultValue);
+      }
+    }
+    if (!isEmptyObject(options)) {
+      set(fieldsWithValidationRef.current, name, true);
+      if (!isOnSubmit && readFormStateRef.current.isValid) {
+        validateField(fieldsRef, isValidateAllFieldCriteria, field, shallowFieldsStateRef).then(error => {
+          const previousFormIsValid = formStateRef.current.isValid;
+          isEmptyObject(error) ? set(validFieldsRef.current, name, true) : unset(validFieldsRef.current, name);
+          previousFormIsValid !== isEmptyObject(error) && updateFormState();
+        });
+      }
+    }
+    if (shouldUnregister && !(isFieldArray && isEmptyDefaultValue)) {
+      !isFieldArray && unset(formStateRef.current.dirtyFields, name);
+    }
+    if (type) {
+      attachEventListeners(isRadioOrCheckbox && field.options ? field.options[field.options.length - 1] : field, isRadioOrCheckbox || isSelectInput(ref), handleChangeRef.current);
+    }
+  }
+  function register(refOrRegisterOptions, options) {
+    if (!isWindowUndefined) {
+      if (isString(refOrRegisterOptions)) {
+        registerFieldRef({
+          name: refOrRegisterOptions
+        }, options);
+      } else if (isObject(refOrRegisterOptions) && 'name' in refOrRegisterOptions) {
+        registerFieldRef(refOrRegisterOptions, options);
+      } else {
+        return ref => ref && registerFieldRef(ref, refOrRegisterOptions);
+      }
+    }
+  }
+  const handleSubmit = useCallback((onValid, onInvalid) => async e => {
+    if (e && e.preventDefault) {
+      e.preventDefault();
+      e.persist();
+    }
+    let fieldErrors = {};
+    let fieldValues = setFieldArrayDefaultValues(getFieldsValues(fieldsRef, cloneObject(shallowFieldsStateRef.current), shouldUnregister, true));
+    readFormStateRef.current.isSubmitting && updateFormState({
+      isSubmitting: true
+    });
+    try {
+      if (resolverRef.current) {
+        const {
+          errors,
+          values
+        } = await resolverRef.current(fieldValues, contextRef.current, isValidateAllFieldCriteria);
+        formStateRef.current.errors = fieldErrors = errors;
+        fieldValues = values;
+      } else {
+        for (const field of Object.values(fieldsRef.current)) {
+          if (field) {
+            const {
+              name
+            } = field.ref;
+            const fieldError = await validateField(fieldsRef, isValidateAllFieldCriteria, field, shallowFieldsStateRef);
+            if (fieldError[name]) {
+              set(fieldErrors, name, fieldError[name]);
+              unset(validFieldsRef.current, name);
+            } else if (get(fieldsWithValidationRef.current, name)) {
+              unset(formStateRef.current.errors, name);
+              set(validFieldsRef.current, name, true);
+            }
+          }
+        }
+      }
+      if (isEmptyObject(fieldErrors) && Object.keys(formStateRef.current.errors).every(name => name in fieldsRef.current)) {
+        updateFormState({
+          errors: {},
+          isSubmitting: true
+        });
+        await onValid(fieldValues, e);
+      } else {
+        formStateRef.current.errors = Object.assign(Object.assign({}, formStateRef.current.errors), fieldErrors);
+        onInvalid && (await onInvalid(formStateRef.current.errors, e));
+        shouldFocusError && focusOnErrorField(fieldsRef.current, formStateRef.current.errors);
+      }
+    } finally {
+      formStateRef.current.isSubmitting = false;
+      updateFormState({
+        isSubmitted: true,
+        isSubmitting: false,
+        isSubmitSuccessful: isEmptyObject(formStateRef.current.errors),
+        submitCount: formStateRef.current.submitCount + 1
+      });
+    }
+  }, [shouldFocusError, isValidateAllFieldCriteria]);
+  const resetRefs = ({
+    errors,
+    isDirty,
+    isSubmitted,
+    touched,
+    isValid,
+    submitCount,
+    dirtyFields
+  }) => {
+    if (!isValid) {
+      validFieldsRef.current = {};
+      fieldsWithValidationRef.current = {};
+    }
+    fieldArrayDefaultValuesRef.current = {};
+    watchFieldsRef.current = new Set();
+    isWatchAllRef.current = false;
+    updateFormState({
+      submitCount: submitCount ? formStateRef.current.submitCount : 0,
+      isDirty: isDirty ? formStateRef.current.isDirty : false,
+      isSubmitted: isSubmitted ? formStateRef.current.isSubmitted : false,
+      isValid: isValid ? formStateRef.current.isValid : false,
+      dirtyFields: dirtyFields ? formStateRef.current.dirtyFields : {},
+      touched: touched ? formStateRef.current.touched : {},
+      errors: errors ? formStateRef.current.errors : {},
+      isSubmitting: false,
+      isSubmitSuccessful: false
+    });
+  };
+  const reset = (values, omitResetState = {}) => {
+    if (isWeb) {
+      for (const field of Object.values(fieldsRef.current)) {
+        if (field) {
+          const {
+            ref,
+            options
+          } = field;
+          const inputRef = isRadioOrCheckboxFunction(ref) && Array.isArray(options) ? options[0].ref : ref;
+          if (isHTMLElement(inputRef)) {
+            try {
+              inputRef.closest('form').reset();
+              break;
+            } catch (_a) {}
+          }
+        }
+      }
+    }
+    fieldsRef.current = {};
+    defaultValuesRef.current = Object.assign({}, values || defaultValuesRef.current);
+    values && renderWatchedInputs('');
+    Object.values(resetFieldArrayFunctionRef.current).forEach(resetFieldArray => isFunction(resetFieldArray) && resetFieldArray());
+    shallowFieldsStateRef.current = shouldUnregister ? {} : cloneObject(values || defaultValuesRef.current);
+    resetRefs(omitResetState);
+  };
+  useEffect(() => {
+    resolver && readFormStateRef.current.isValid && validateResolver();
+    observerRef.current = observerRef.current || !isWeb ? observerRef.current : onDomRemove(fieldsRef, removeFieldEventListenerAndRef);
+  }, [removeFieldEventListenerAndRef, defaultValuesRef.current]);
+  useEffect(() => () => {
+    observerRef.current && observerRef.current.disconnect();
+    isUnMount.current = true;
+    if (process.env.NODE_ENV !== 'production') {
+      return;
+    }
+    Object.values(fieldsRef.current).forEach(field => removeFieldEventListenerAndRef(field, true));
+  }, []);
+  if (!resolver && readFormStateRef.current.isValid) {
+    formState.isValid = deepEqual(validFieldsRef.current, fieldsWithValidationRef.current) && isEmptyObject(formStateRef.current.errors);
+  }
+  const commonProps = {
+    trigger,
+    setValue: useCallback(setValue, [setInternalValue, trigger]),
+    getValues: useCallback(getValues, []),
+    register: useCallback(register, [defaultValuesRef.current]),
+    unregister: useCallback(unregister, []),
+    formState: isProxyEnabled ? new Proxy(formState, {
+      get: (obj, prop) => {
+        if (process.env.NODE_ENV !== 'production') {
+          if (prop === 'isValid' && isOnSubmit) {
+            console.warn('📋 `formState.isValid` is applicable with `onTouched`, `onChange` or `onBlur` mode. https://react-hook-form.com/api#formState');
+          }
+        }
+        if (prop in obj) {
+          readFormStateRef.current[prop] = true;
+          return obj[prop];
+        }
+        return undefined;
+      }
+    }) : formState
+  };
+  const control = useMemo(() => Object.assign({
+    isFormDirty,
+    updateWatchedValue,
+    shouldUnregister,
+    updateFormState,
+    removeFieldEventListener,
+    watchInternal,
+    mode: modeRef.current,
+    reValidateMode: {
+      isReValidateOnBlur,
+      isReValidateOnChange
+    },
+    validateResolver: resolver ? validateResolver : undefined,
+    fieldsRef,
+    resetFieldArrayFunctionRef,
+    useWatchFieldsRef,
+    useWatchRenderFunctionsRef,
+    fieldArrayDefaultValuesRef,
+    validFieldsRef,
+    fieldsWithValidationRef,
+    fieldArrayNamesRef,
+    readFormStateRef,
+    formStateRef,
+    defaultValuesRef,
+    shallowFieldsStateRef,
+    fieldArrayValuesRef
+  }, commonProps), [defaultValuesRef.current, updateWatchedValue, shouldUnregister, removeFieldEventListener, watchInternal]);
+  return Object.assign({
+    watch,
+    control,
+    handleSubmit,
+    reset: useCallback(reset, []),
+    clearErrors: useCallback(clearErrors, []),
+    setError: useCallback(setError, []),
+    errors: formState.errors
+  }, commonProps);
+}
+function __rest(s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+}
+const FormContext = createContext(null);
+FormContext.displayName = 'RHFContext';
+const useFormContext = () => useContext(FormContext);
+var getInputValue = event => isPrimitive(event) || !isObject(event.target) || isObject(event.target) && !event.type ? event : isUndefined(event.target.value) ? event.target.checked : event.target.value;
+function useController({
+  name,
+  rules,
+  defaultValue,
+  control,
+  onFocus
+}) {
+  const methods = useFormContext();
+  if (process.env.NODE_ENV !== 'production') {
+    if (!control && !methods) {
+      throw new Error('📋 Controller is missing `control` prop. https://react-hook-form.com/api#Controller');
+    }
+  }
+  const {
+    defaultValuesRef,
+    setValue,
+    register,
+    unregister,
+    trigger,
+    mode,
+    reValidateMode: {
+      isReValidateOnBlur,
+      isReValidateOnChange
+    },
+    formState,
+    formStateRef: {
+      current: {
+        isSubmitted,
+        touched,
+        errors
+      }
+    },
+    updateFormState,
+    readFormStateRef,
+    fieldsRef,
+    fieldArrayNamesRef,
+    shallowFieldsStateRef
+  } = control || methods.control;
+  const isNotFieldArray = !isNameInFieldArray(fieldArrayNamesRef.current, name);
+  const getInitialValue = () => !isUndefined(get(shallowFieldsStateRef.current, name)) && isNotFieldArray ? get(shallowFieldsStateRef.current, name) : isUndefined(defaultValue) ? get(defaultValuesRef.current, name) : defaultValue;
+  const [value, setInputStateValue] = useState(getInitialValue());
+  const valueRef = useRef(value);
+  const ref = useRef({
+    focus: () => null
+  });
+  const onFocusRef = useRef(onFocus || (() => {
+    if (isFunction(ref.current.focus)) {
+      ref.current.focus();
+    }
+    if (process.env.NODE_ENV !== 'production') {
+      if (!isFunction(ref.current.focus)) {
+        console.warn(`📋 'ref' from Controller render prop must be attached to a React component or a DOM Element whose ref provides a 'focus()' method`);
+      }
+    }
+  }));
+  const shouldValidate = useCallback(isBlurEvent => !skipValidation(Object.assign({
+    isBlurEvent,
+    isReValidateOnBlur,
+    isReValidateOnChange,
+    isSubmitted,
+    isTouched: !!get(touched, name)
+  }, mode)), [isReValidateOnBlur, isReValidateOnChange, isSubmitted, touched, name, mode]);
+  const commonTask = useCallback(([event]) => {
+    const data = getInputValue(event);
+    setInputStateValue(data);
+    valueRef.current = data;
+    return data;
+  }, []);
+  const registerField = useCallback(shouldUpdateValue => {
+    if (process.env.NODE_ENV !== 'production') {
+      if (!name) {
+        return console.warn('📋 Field is missing `name` prop. https://react-hook-form.com/api#Controller');
+      }
+    }
+    if (fieldsRef.current[name]) {
+      fieldsRef.current[name] = Object.assign({
+        ref: fieldsRef.current[name].ref
+      }, rules);
+    } else {
+      register(Object.defineProperties({
+        name,
+        focus: onFocusRef.current
+      }, {
+        value: {
+          set(data) {
+            setInputStateValue(data);
+            valueRef.current = data;
+          },
+          get() {
+            return valueRef.current;
+          }
+        }
+      }), rules);
+      shouldUpdateValue = isUndefined(get(defaultValuesRef.current, name));
+    }
+    shouldUpdateValue && isNotFieldArray && setInputStateValue(getInitialValue());
+  }, [rules, name, register]);
+  useEffect(() => () => unregister(name), [name]);
+  useEffect(() => {
+    if (process.env.NODE_ENV !== 'production') {
+      if (isUndefined(value)) {
+        console.warn(`📋 ${name} is missing in the 'defaultValue' prop of either its Controller (https://react-hook-form.com/api#Controller) or useForm (https://react-hook-form.com/api#useForm)`);
+      }
+      if (!isNotFieldArray && isUndefined(defaultValue)) {
+        console.warn('📋 Controller is missing `defaultValue` prop when using `useFieldArray`. https://react-hook-form.com/api#Controller');
+      }
+    }
+    registerField();
+  }, [registerField]);
+  useEffect(() => {
+    !fieldsRef.current[name] && registerField(true);
+  });
+  const onBlur = useCallback(() => {
+    if (readFormStateRef.current.touched && !get(touched, name)) {
+      set(touched, name, true);
+      updateFormState({
+        touched
+      });
+    }
+    shouldValidate(true) && trigger(name);
+  }, [name, updateFormState, shouldValidate, trigger, readFormStateRef]);
+  const onChange = useCallback((...event) => setValue(name, commonTask(event), {
+    shouldValidate: shouldValidate(),
+    shouldDirty: true
+  }), [setValue, name, shouldValidate]);
+  return {
+    field: {
+      onChange,
+      onBlur,
+      name,
+      value,
+      ref
+    },
+    meta: Object.defineProperties({
+      invalid: !!get(errors, name)
+    }, {
+      isDirty: {
+        get() {
+          return !!get(formState.dirtyFields, name);
+        }
+      },
+      isTouched: {
+        get() {
+          return !!get(formState.touched, name);
+        }
+      }
+    })
+  };
+}
+const Controller = props => {
+  const {
+      rules,
+      as,
+      render,
+      defaultValue,
+      control,
+      onFocus
+    } = props,
+    rest = __rest(props, ["rules", "as", "render", "defaultValue", "control", "onFocus"]);
+  const {
+    field,
+    meta
+  } = useController(props);
+  const componentProps = Object.assign(Object.assign({}, rest), field);
+  return as ? isValidElement(as) ? cloneElement(as, componentProps) : createElement(as, componentProps) : render ? render(field, meta) : null;
+};
+
+const SearchApplication = ({
+  onSearch,
+  searchFields,
+  searchParams
+}) => {
+  const {
+    t
+  } = useTranslation();
+  const {
+    register,
+    handleSubmit,
+    reset,
+    watch,
+    control
+  } = useForm({
+    defaultValues: searchParams
+  });
+  const onSubmitInput = data => {
+    onSearch(data);
+  };
+  function clearSearch() {
+    const resetValues = searchFields.reduce((acc, field) => ({
+      ...acc,
+      [field === null || field === void 0 ? void 0 : field.name]: ""
+    }), {});
+    reset(resetValues);
+    onSearch({
+      ...resetValues
+    });
+  }
+  return /*#__PURE__*/React.createElement("form", {
+    onSubmit: handleSubmit(onSubmitInput),
+    className: "ekyc-search-container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "search-inner"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "search-field-wrapper"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "search-fields-container"
+  }, searchFields === null || searchFields === void 0 ? void 0 : searchFields.map(input => /*#__PURE__*/React.createElement("div", {
+    key: input.name,
+    className: "search-field"
+  }, /*#__PURE__*/React.createElement(Label, null, input.label), input.type === "dropdown" ? /*#__PURE__*/React.createElement(Controller, {
+    control: control,
+    name: input.name,
+    render: props => /*#__PURE__*/React.createElement(Dropdown, {
+      selected: props.value,
+      select: val => {
+        props.onChange(val);
+      },
+      onBlur: props.onBlur,
+      option: input.options,
+      optionKey: input.optionsKey,
+      t: t
+    })
+  }) : /*#__PURE__*/React.createElement(TextInput, Object.assign({}, input, {
+    inputRef: register,
+    watch: watch
+  }))))), /*#__PURE__*/React.createElement("div", {
+    className: "search-action-container"
+  }, /*#__PURE__*/React.createElement(SubmitBar, {
+    label: t("ES_COMMON_SEARCH"),
+    submit: true
+  }), /*#__PURE__*/React.createElement(LinkLabel, {
+    onClick: clearSearch
+  }, t("ES_COMMON_CLEAR_ALL"))))));
+};
+
+const StatusCards = ({
+  countData
+}) => {
+  const {
+    t
+  } = useTranslation();
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-status-container"
+  }, /*#__PURE__*/React.createElement(Card, {
+    className: "ekyc-status-card"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "count"
+  }, (countData === null || countData === void 0 ? void 0 : countData.total) || 0), /*#__PURE__*/React.createElement("div", {
+    className: "label"
+  }, t("EKYC_TOTAL"))), /*#__PURE__*/React.createElement(Card, {
+    className: "ekyc-status-card"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "count pending"
+  }, (countData === null || countData === void 0 ? void 0 : countData.pending) || 0), /*#__PURE__*/React.createElement("div", {
+    className: "label"
+  }, t("EKYC_PENDING"))), /*#__PURE__*/React.createElement(Card, {
+    className: "ekyc-status-card"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "count completed"
+  }, (countData === null || countData === void 0 ? void 0 : countData.completed) || 0), /*#__PURE__*/React.createElement("div", {
+    className: "label"
+  }, t("EKYC_COMPLETED"))));
+};
+
+const DesktopInbox = ({
+  data,
+  isLoading,
+  onSort,
+  onNextPage,
+  onPrevPage,
+  currentPage,
+  pageSizeLimit,
+  onPageSizeChange,
+  parentRoute,
+  searchParams,
+  sortParams,
+  totalRecords,
+  countData,
+  onSearch,
+  searchFields
+}) => {
+  const {
+    t
+  } = useTranslation();
+  const columns = useMemo(() => [{
+    Header: t("EKYC_APPLICATION_NO"),
+    accessor: "applicationNumber",
+    Cell: ({
+      row
+    }) => {
+      var _row$original;
+      const applicationNumber = ((_row$original = row.original) === null || _row$original === void 0 ? void 0 : _row$original.applicationNumber) || "NA";
+      return /*#__PURE__*/React.createElement(Link, {
+        to: `${parentRoute}/application-details/${applicationNumber}`
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "ekyc-application-link"
+      }, applicationNumber));
+    }
+  }, {
+    Header: t("EKYC_CITIZEN_NAME"),
+    accessor: "citizenName",
+    Cell: ({
+      row
+    }) => {
+      var _row$original2;
+      return /*#__PURE__*/React.createElement("span", null, ((_row$original2 = row.original) === null || _row$original2 === void 0 ? void 0 : _row$original2.citizenName) || "NA");
+    }
+  }, {
+    Header: t("EKYC_MOBILE_NO"),
+    accessor: "mobileNumber",
+    Cell: ({
+      row
+    }) => {
+      var _row$original3;
+      return /*#__PURE__*/React.createElement("span", null, ((_row$original3 = row.original) === null || _row$original3 === void 0 ? void 0 : _row$original3.mobileNumber) || "NA");
+    }
+  }, {
+    Header: t("EKYC_STATUS"),
+    accessor: "status",
+    Cell: ({
+      row
+    }) => {
+      var _row$original4;
+      const status = ((_row$original4 = row.original) === null || _row$original4 === void 0 ? void 0 : _row$original4.status) || "DEFAULT";
+      return /*#__PURE__*/React.createElement("span", {
+        className: `ekyc-status-tag ${status}`
+      }, t(`EKYC_STATUS_${status}`));
+    }
+  }], [t, parentRoute]);
+  const tableData = useMemo(() => {
+    return (data === null || data === void 0 ? void 0 : data.items) || [];
+  }, [data]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "inbox-wrapper"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-header-container module-header"
+  }, /*#__PURE__*/React.createElement(Header, {
+    className: "title"
+  }, t("EKYC_INBOX_HEADER")), /*#__PURE__*/React.createElement(Link, {
+    to: `${parentRoute}/create-kyc`
+  }, /*#__PURE__*/React.createElement(SubmitBar, {
+    label: t("EKYC_CREATE_KYC"),
+    style: {
+      borderRadius: "8px"
+    }
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-metrics-section"
+  }, /*#__PURE__*/React.createElement(StatusCards, {
+    countData: countData
+  })), /*#__PURE__*/React.createElement(Card, {
+    className: "ekyc-search-card"
+  }, /*#__PURE__*/React.createElement(SearchApplication, {
+    onSearch: onSearch,
+    searchFields: searchFields,
+    searchParams: searchParams
+  })), /*#__PURE__*/React.createElement(Card, {
+    className: "ekyc-table-card"
+  }, /*#__PURE__*/React.createElement(Table, {
+    t: t,
+    data: tableData,
+    columns: columns,
+    isLoading: isLoading,
+    onSort: onSort,
+    sortParams: sortParams,
+    totalRecords: totalRecords,
+    onNextPage: onNextPage,
+    onPrevPage: onPrevPage,
+    currentPage: currentPage,
+    pageSizeLimit: pageSizeLimit,
+    onPageSizeChange: onPageSizeChange,
+    getCellProps: cellInfo => {
+      return {
+        className: "ekyc-table-cell"
+      };
+    }
+  })));
+};
+
+const MobileInbox = ({
+  data,
+  isLoading,
+  onSearch,
+  searchFields,
+  searchParams,
+  parentRoute,
+  countData
+}) => {
+  var _data$items;
+  const {
+    t
+  } = useTranslation();
+  const mobileData = (data === null || data === void 0 ? void 0 : (_data$items = data.items) === null || _data$items === void 0 ? void 0 : _data$items.map(item => ({
+    [t("EKYC_APPLICATION_NO")]: item.applicationNumber,
+    [t("EKYC_CITIZEN_NAME")]: item.citizenName,
+    [t("EKYC_MOBILE_NO")]: item.mobileNumber,
+    [t("EKYC_STATUS")]: /*#__PURE__*/React.createElement("span", {
+      className: `ekyc-status-tag ${item.status}`
+    }, t(`EKYC_STATUS_${item.status}`))
+  }))) || [];
+  return /*#__PURE__*/React.createElement("div", {
+    className: "inbox-wrapper"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-header-container module-header"
+  }, /*#__PURE__*/React.createElement(Header, {
+    className: "title"
+  }, t("EKYC_INBOX_HEADER")), /*#__PURE__*/React.createElement(Link, {
+    to: `${parentRoute}/create-kyc`
+  }, /*#__PURE__*/React.createElement(SubmitBar, {
+    label: t("EKYC_CREATE_KYC")
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-metrics-section"
+  }, /*#__PURE__*/React.createElement(StatusCards, {
+    countData: countData
+  })), /*#__PURE__*/React.createElement(Card, {
+    className: "ekyc-search-card"
+  }, /*#__PURE__*/React.createElement(SearchApplication, {
+    onSearch: onSearch,
+    searchFields: searchFields,
+    searchParams: searchParams
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "mobile-data-container"
+  }, isLoading ? /*#__PURE__*/React.createElement(Loader, null) : (mobileData === null || mobileData === void 0 ? void 0 : mobileData.length) > 0 ? /*#__PURE__*/React.createElement(DetailsCard, {
+    data: mobileData,
+    t: t,
+    serviceRequestIdKey: t("EKYC_APPLICATION_NO"),
+    linkPrefix: `${parentRoute}/application-details/`
+  }) : /*#__PURE__*/React.createElement(Card, null, t("ES_COMMON_NO_DATA").split("\\n").map((text, index) => /*#__PURE__*/React.createElement("p", {
+    key: index,
+    style: {
+      textAlign: "center"
+    }
+  }, text)))));
+};
+
+const MOCK_DATA_ITEMS = [{
+  applicationNumber: "EKYC-2024-001",
+  citizenName: "Rahul Sharma",
+  mobileNumber: "9876543210",
+  status: "COMPLETED"
+}, {
+  applicationNumber: "EKYC-2024-002",
+  citizenName: "Anjali Devi",
+  mobileNumber: "9123456789",
+  status: "PENDING"
+}, {
+  applicationNumber: "EKYC-2024-003",
+  citizenName: "Amit Kumar",
+  mobileNumber: "8888888888",
+  status: "REJECTED"
+}, {
+  applicationNumber: "EKYC-2024-004",
+  citizenName: "Priya Singh",
+  mobileNumber: "7777777777",
+  status: "COMPLETED"
+}, {
+  applicationNumber: "EKYC-2024-005",
+  citizenName: "Suresh Gupta",
+  mobileNumber: "6666666666",
+  status: "PENDING"
+}];
+const Inbox = ({
+  parentRoute,
+  businessService: _businessService = "EKYC",
+  initialStates: _initialStates = {},
+  filterComponent,
+  isInbox
+}) => {
+  const tenantId = Digit.ULBService.getCurrentTenantId();
+  const {
+    t
+  } = useTranslation();
+  const [pageOffset, setPageOffset] = useState(_initialStates.pageOffset || 0);
+  const [pageSize, setPageSize] = useState(_initialStates.pageSize || 10);
+  const [sortParams, setSortParams] = useState(_initialStates.sortParams || [{
+    id: "createdTime",
+    desc: true
+  }]);
+  const defaultStatusOption = useMemo(() => ({
+    label: t("EKYC_STATUS_ALL"),
+    value: ""
+  }), [t]);
+  const [searchParams, setSearchParams] = useState(_initialStates.searchParams || {
+    status: defaultStatusOption
+  });
+  const filteredStaticData = useMemo(() => {
+    return MOCK_DATA_ITEMS.filter(item => {
+      var _searchParams$status;
+      let match = true;
+      const currentStatus = ((_searchParams$status = searchParams.status) === null || _searchParams$status === void 0 ? void 0 : _searchParams$status.value) !== undefined ? searchParams.status.value : searchParams.status;
+      if (currentStatus && item.status !== currentStatus) {
+        match = false;
+      }
+      return match;
+    });
+  }, [searchParams]);
+  const staticCountData = useMemo(() => {
+    return {
+      total: MOCK_DATA_ITEMS.length,
+      completed: MOCK_DATA_ITEMS.filter(i => i.status === "COMPLETED").length,
+      pending: MOCK_DATA_ITEMS.filter(i => i.status === "PENDING").length,
+      rejected: MOCK_DATA_ITEMS.filter(i => i.status === "REJECTED").length
+    };
+  }, []);
+  const handleSearch = useCallback(filterParam => {
+    setSearchParams(prev => ({
+      ...prev,
+      ...filterParam
+    }));
+    setPageOffset(0);
+  }, []);
+  const fetchNextPage = () => setPageOffset(prev => prev + pageSize);
+  const fetchPrevPage = () => setPageOffset(prev => Math.max(prev - pageSize, 0));
+  const handlePageSizeChange = e => {
+    const newSize = Number(e.target.value);
+    setPageSize(newSize);
+    setPageOffset(0);
+  };
+  const handleSort = useCallback(args => {
+    if (args.length > 0) setSortParams(args);
+  }, []);
+  const searchFields = useMemo(() => [{
+    label: t("EKYC_STATUS"),
+    name: "status",
+    type: "dropdown",
+    options: [{
+      label: t("CHOOSE_STATUS"),
+      value: ""
+    }, {
+      label: t("EKYC_STATUS_COMPLETED"),
+      value: "COMPLETED"
+    }, {
+      label: t("EKYC_STATUS_PENDING"),
+      value: "PENDING"
+    }, {
+      label: t("EKYC_STATUS_REJECTED"),
+      value: "REJECTED"
+    }],
+    optionsKey: "label"
+  }], [t]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-employee-container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "inbox-main-container"
+  }, Digit.Utils.browser.isMobile() ? /*#__PURE__*/React.createElement(MobileInbox, {
+    data: {
+      items: filteredStaticData,
+      totalCount: filteredStaticData.length
+    },
+    isLoading: false,
+    onSearch: handleSearch,
+    searchFields: searchFields,
+    searchParams: searchParams,
+    parentRoute: parentRoute,
+    countData: staticCountData
+  }) : /*#__PURE__*/React.createElement(DesktopInbox, {
+    businessService: _businessService,
+    data: {
+      items: filteredStaticData,
+      totalCount: filteredStaticData.length
+    },
+    isLoading: false,
+    searchFields: searchFields,
+    onSearch: handleSearch,
+    onSort: handleSort,
+    onNextPage: fetchNextPage,
+    onPrevPage: fetchPrevPage,
+    currentPage: Math.floor(pageOffset / pageSize),
+    pageSizeLimit: pageSize,
+    onPageSizeChange: handlePageSizeChange,
+    parentRoute: parentRoute,
+    searchParams: searchParams,
+    sortParams: sortParams,
+    totalRecords: filteredStaticData.length,
+    countData: staticCountData
+  })));
+};
+
+const Create = () => {
+  const {
+    t
+  } = useTranslation();
+  const history = useHistory();
+  const {
+    path
+  } = useRouteMatch();
+  const [kNumber, setKNumber] = useState("");
+  const [kName, setKName] = useState("");
+  const handleContinue = () => {
+    const parentPath = path.replace("/create-kyc", "");
+    history.push(`${parentPath}/k-details`, {
+      kNumber,
+      kName
+    });
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-employee-container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-create-container",
+    style: {
+      padding: "24px"
+    }
+  }, /*#__PURE__*/React.createElement(Card, {
+    className: "ekyc-create-card"
+  }, /*#__PURE__*/React.createElement(CardHeader, null, t("EKYC_ENTER_DETAILS_HEADER")), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_K_NUMBER")), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: kNumber,
+    onChange: e => setKNumber(e.target.value),
+    placeholder: t("EKYC_K_NUMBER_PLACEHOLDER"),
+    style: {
+      borderRadius: "8px"
+    }
+  }))), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_K_NAME")), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: kName,
+    onChange: e => setKName(e.target.value),
+    placeholder: t("EKYC_K_NAME_PLACEHOLDER"),
+    style: {
+      borderRadius: "12px"
+    }
+  })))), /*#__PURE__*/React.createElement(ActionBar, null, /*#__PURE__*/React.createElement(SubmitBar, {
+    label: t("ES_COMMON_CONTINUE"),
+    onSubmit: handleContinue,
+    style: {
+      borderRadius: "8px"
+    }
+  }))));
+};
+
+const KDetails = () => {
+  const {
+    t
+  } = useTranslation();
+  const location = useLocation();
+  const history = useHistory();
+  const {
+    path
+  } = useRouteMatch();
+  const {
+    kNumber,
+    kName
+  } = location.state || {
+    kNumber: "EKYC-12345",
+    kName: "Mock Name"
+  };
+  const [showModal, setShowModal] = useState(false);
+  const [selectedOption, setSelectedOption] = useState({
+    code: "SELF",
+    name: "EKYC_SELF"
+  });
+  const options = [{
+    code: "SELF",
+    name: "EKYC_SELF"
+  }, {
+    code: "OTHER",
+    name: "EKYC_OTHER"
+  }];
+  const connectionDetails = {
+    consumerName: "Rahul Sharma",
+    address: "123, Street Name, City",
+    connectionType: "Domestic",
+    meterNo: "MTR-987654",
+    phoneNo: "9876543210",
+    email: "rahul@example.com",
+    status: "ACTIVE"
+  };
+  const handleStartVerification = () => {
+    setShowModal(true);
+  };
+  const onModalConfirm = () => {
+    const parentPath = path.replace("/k-details", "");
+    history.push(`${parentPath}/aadhaar-verification`, {
+      kNumber,
+      selectedOption
+    });
+    setShowModal(false);
+  };
+  const handleRaiseCorrection = () => {
+    console.log("Raise Correction clicked");
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-employee-container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-kdetails-container",
+    style: {
+      padding: "24px"
+    }
+  }, /*#__PURE__*/React.createElement(Card, {
+    className: "ekyc-create-card"
+  }, /*#__PURE__*/React.createElement(CardHeader, null, t("EKYC_K_NUMBER_DETAILS")), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_K_NUMBER")), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: kNumber,
+    disable: true,
+    style: {
+      borderRadius: "12px"
+    }
+  }))), /*#__PURE__*/React.createElement(CardHeader, {
+    style: {
+      marginTop: "24px"
+    }
+  }, t("EKYC_CONNECTION_DETAILS")), /*#__PURE__*/React.createElement(StatusTable, null, /*#__PURE__*/React.createElement(Row, {
+    label: t("EKYC_CONSUMER_NAME"),
+    text: connectionDetails.consumerName
+  }), /*#__PURE__*/React.createElement(Row, {
+    label: t("EKYC_ADDRESS"),
+    text: connectionDetails.address
+  }), /*#__PURE__*/React.createElement(Row, {
+    label: t("EKYC_CONNECTION_TYPE"),
+    text: connectionDetails.connectionType
+  }), /*#__PURE__*/React.createElement(Row, {
+    label: t("EKYC_METER_NO"),
+    text: connectionDetails.meterNo
+  }), /*#__PURE__*/React.createElement(Row, {
+    label: t("EKYC_PHONE_NO"),
+    text: connectionDetails.phoneNo
+  }), /*#__PURE__*/React.createElement(Row, {
+    label: t("EKYC_EMAIL"),
+    text: connectionDetails.email
+  }), /*#__PURE__*/React.createElement(Row, {
+    label: t("EKYC_STATUS"),
+    text: connectionDetails.status
+  })))), /*#__PURE__*/React.createElement(ActionBar, null, /*#__PURE__*/React.createElement(SubmitBar, {
+    label: t("EKYC_START_VERIFICATION"),
+    onSubmit: handleStartVerification,
+    style: {
+      borderRadius: "12px"
+    }
+  }), /*#__PURE__*/React.createElement("button", {
+    className: "submit-bar",
+    style: {
+      marginLeft: "10px",
+      background: "#f47738",
+      border: "none",
+      color: "#fff",
+      padding: "10px 24px",
+      borderRadius: "12px",
+      fontWeight: "600",
+      cursor: "pointer",
+      boxShadow: "0 2px 4px rgba(0,0,0,0.1)"
+    },
+    onClick: handleRaiseCorrection
+  }, t("EKYC_RAISE_CORRECTION"))), showModal && /*#__PURE__*/React.createElement(Modal, {
+    headerBarMain: t("EKYC_SELECT_VERIFICATION_TYPE"),
+    headerBarEnd: /*#__PURE__*/React.createElement("span", {
+      onClick: () => setShowModal(false),
+      style: {
+        cursor: "pointer",
+        padding: "8px"
+      }
+    }, "X"),
+    actionSaveLabel: t("ES_COMMON_CONFIRM"),
+    actionSaveOnSubmit: onModalConfirm,
+    actionCancelLabel: t("ES_COMMON_CANCEL"),
+    actionCancelOnSubmit: () => setShowModal(false),
+    style: {
+      borderRadius: "12px"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      padding: "24px"
+    }
+  }, /*#__PURE__*/React.createElement(RadioButtons, {
+    options: options,
+    optionsKey: "name",
+    selectedOption: selectedOption,
+    onSelect: setSelectedOption,
+    t: t
+  }))));
+};
+
+const AadhaarVerification = () => {
+  const {
+    t
+  } = useTranslation();
+  const location = useLocation();
+  const history = useHistory();
+  const [aadhaarLastFour, setAadhaarLastFour] = useState("");
+  const [isAadhaarVerified, setIsAadhaarVerified] = useState(false);
+  const [nameCorrect, setNameCorrect] = useState({
+    code: "NO",
+    name: "CORE_COMMON_NO"
+  });
+  const [userName, setUserName] = useState("");
+  const [mobileChange, setMobileChange] = useState({
+    code: "NO",
+    name: "CORE_COMMON_NO"
+  });
+  const [mobileNumber, setMobileNumber] = useState("");
+  const [whatsappNumber, setWhatsappNumber] = useState("");
+  const [email, setEmail] = useState("");
+  const [noOfPersons, setNoOfPersons] = useState("");
+  const yesNoOptions = [{
+    code: "YES",
+    name: "CORE_COMMON_YES"
+  }, {
+    code: "NO",
+    name: "CORE_COMMON_NO"
+  }];
+  const handleVerifyAadhaar = () => {
+    if (aadhaarLastFour.length === 4) {
+      setIsAadhaarVerified(true);
+    }
+  };
+  const handleSaveAndContinue = () => {
+    history.push("/digit-ui/employee/ekyc/address-details");
+  };
+  const FingerprintIcon = () => /*#__PURE__*/React.createElement("svg", {
+    width: "24",
+    height: "24",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M17.81 4.47c-.08 0-.16-.02-.23-.06C15.66 3.42 14 3 12.01 3c-1.98 0-3.86.47-5.57 1.41-.24.13-.54.04-.67-.2-.13-.24-.04-.55.2-.68C7.82 2.52 9.86 2 12.01 2c2.13 0 3.96.46 5.57 1.41.24.13.33.43.2.67-.09.13-.24.39-.39.39zM12 21c-.28 0-.5-.22-.5-.5v-4.42c-2.33-.21-4.44-1.35-5.94-3.21-1.5-1.86-2.22-4.18-2.02-6.52.05-.59.55-1.03 1.14-.98s1.03.55.98 1.14c-.15 1.76.39 3.51 1.52 4.91 1.12 1.4 2.7 2.26 4.45 2.42.21.02.37.19.37.4v6.26c0 .28-.22.5-.5.5zm4.83-9.17c-.59.05-1.03-.55-.98-1.14.39-4.59-2.03-8.86-6.17-10.87-.25-.12-.35-.43-.23-.68s.42-.36.67-.24c4.61 2.24 7.31 7 6.87 12.1-.05.27-.27.48-.54.5v.33z",
+    fill: "#505A5F"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M12 11c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm-5.17-3.66c-.15 1.76.39 3.51 1.52 4.91 1.13 1.4 2.71 2.26 4.45 2.42.06 0 .11.01.17.01.24 0 .44-.17.48-.41.04-.27-.14-.53-.41-.58-1.46-.14-2.77-.85-3.71-2.01-.94-1.17-1.39-2.63-1.27-4.11.02-.28-.19-.51-.47-.53-.28-.02-.53.18-.55.46-.01.28.01.55.21.84z",
+    fill: "#505A5F"
+  }));
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-employee-container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-aadhaar-verification-container",
+    style: {
+      padding: "24px"
+    }
+  }, /*#__PURE__*/React.createElement(Card, {
+    className: "ekyc-create-card"
+  }, /*#__PURE__*/React.createElement(CardHeader, null, t("EKYC_AADHAAR_NUMBER_HEADER") || "Aadhaar Number"), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_LAST_4_DIGIT_AADHAAR") || "Last 4-Digit Aadhaar Number"), /*#__PURE__*/React.createElement("div", {
+    className: "field",
+    style: {
+      position: "relative"
+    }
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: aadhaarLastFour,
+    onChange: e => {
+      const val = e.target.value;
+      if (val.length <= 4 && /^\d*$/.test(val)) {
+        setAadhaarLastFour(val);
+      }
+    },
+    placeholder: t("EKYC_ENTER_LAST_4_DIGIT") || "Enter Last 4-digit Aadhaar number",
+    textInputStyle: {
+      paddingLeft: "40px",
+      borderRadius: "12px"
+    },
+    style: {
+      borderRadius: "12px"
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: "absolute",
+      left: "10px",
+      top: "50%",
+      transform: "translateY(-50%)"
+    }
+  }, /*#__PURE__*/React.createElement(FingerprintIcon, null)), isAadhaarVerified && /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: "absolute",
+      right: "10px",
+      top: "50%",
+      transform: "translateY(-50%)"
+    }
+  }, /*#__PURE__*/React.createElement(TickMark, {
+    fillColor: "#00703C"
+  })))), !isAadhaarVerified && /*#__PURE__*/React.createElement(SubmitBar, {
+    label: t("EKYC_VERIFY_AADHAAR_BTN") || "Verify Aadhaar",
+    onSubmit: handleVerifyAadhaar,
+    style: {
+      borderRadius: "12px"
+    }
+  }), isAadhaarVerified && /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#E7F4EE",
+      padding: "20px",
+      borderRadius: "12px",
+      marginTop: "16px",
+      marginBottom: "24px",
+      border: "1px solid #D1E9DB"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      alignItems: "center",
+      gap: "10px",
+      marginBottom: "16px"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#D1E9DB",
+      padding: "4px",
+      borderRadius: "50%",
+      display: "flex"
+    }
+  }, /*#__PURE__*/React.createElement(TickMark, {
+    fillColor: "#00703C"
+  })), /*#__PURE__*/React.createElement("span", {
+    style: {
+      fontWeight: "700",
+      color: "#00703C",
+      fontSize: "18px"
+    }
+  }, t("EKYC_AADHAAR_VERIFIED") || "Aadhaar Verified")), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "12px"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      flexDirection: "column"
+    }
+  }, /*#__PURE__*/React.createElement("span", {
+    style: {
+      color: "#667085",
+      fontSize: "14px",
+      fontWeight: "500"
+    }
+  }, t("EKYC_NAME") || "Name"), /*#__PURE__*/React.createElement("span", {
+    style: {
+      fontWeight: "700",
+      fontSize: "16px",
+      color: "#101828"
+    }
+  }, "Rajesh Kumar Singh")), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      flexDirection: "column"
+    }
+  }, /*#__PURE__*/React.createElement("span", {
+    style: {
+      color: "#667085",
+      fontSize: "14px",
+      fontWeight: "500"
+    }
+  }, t("EKYC_ADDRESS") || "Address"), /*#__PURE__*/React.createElement("span", {
+    style: {
+      fontWeight: "400",
+      fontSize: "16px",
+      color: "#344054"
+    }
+  }, "House No. 45, Sector 12, New Delhi - 110001")))), /*#__PURE__*/React.createElement(CardHeader, {
+    style: {
+      marginTop: "24px"
+    }
+  }, t("EKYC_CONTACT_DETAILS_HEADER") || "Contact Details"), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_NAME_CORRECTION_PROMPT") || "Do you want to correct the Name?"), /*#__PURE__*/React.createElement(RadioButtons, {
+    options: yesNoOptions,
+    optionsKey: "name",
+    selectedOption: nameCorrect,
+    onSelect: setNameCorrect,
+    t: t,
+    innerStyles: {
+      display: "flex",
+      gap: "24px",
+      marginTop: "8px"
+    }
+  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_ENTER_NAME") || "Enter Name"), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: userName,
+    onChange: e => setUserName(e.target.value),
+    placeholder: t("EKYC_ENTER_NAME_PLACEHOLDER") || "Enter Enter name",
+    style: {
+      borderRadius: "12px"
+    }
+  }))), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_MOBILE_CHANGE_PROMPT") || "Change your mobile number?"), /*#__PURE__*/React.createElement(RadioButtons, {
+    options: yesNoOptions,
+    optionsKey: "name",
+    selectedOption: mobileChange,
+    onSelect: setMobileChange,
+    t: t,
+    innerStyles: {
+      display: "flex",
+      gap: "24px",
+      marginTop: "8px"
+    }
+  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_MOBILE_NUMBER") || "Mobile Number"), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: mobileNumber,
+    onChange: e => setMobileNumber(e.target.value),
+    placeholder: t("EKYC_ENTER_MOBILE_NUMBER") || "Enter Mobile number",
+    style: {
+      borderRadius: "12px"
+    }
+  }))), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_WHATSAPP_NUMBER") || "Whatsapp Number"), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: whatsappNumber,
+    onChange: e => setWhatsappNumber(e.target.value),
+    placeholder: t("EKYC_ENTER_WHATSAPP_NUMBER") || "Enter Whatsapp Number",
+    style: {
+      borderRadius: "12px"
+    }
+  }))), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_EMAIL_ADDRESS") || "Email address (Optional)"), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: email,
+    onChange: e => setEmail(e.target.value),
+    placeholder: t("EKYC_EMAIL_ADDRESS_PLACEHOLDER") || "Email address",
+    style: {
+      borderRadius: "12px"
+    }
+  }))), /*#__PURE__*/React.createElement(CardHeader, {
+    style: {
+      marginTop: "24px"
+    }
+  }, t("EKYC_FAMILY_DETAILS_HEADER") || "Family Details"), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
+    style: {
+      marginBottom: "8px",
+      fontWeight: "600"
+    }
+  }, t("EKYC_NO_OF_PERSONS") || "No Of Persons"), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: noOfPersons,
+    onChange: e => setNoOfPersons(e.target.value),
+    placeholder: t("EKYC_ENTER_NO_OF_PERSONS") || "Enter No of Persons",
+    style: {
+      borderRadius: "12px"
+    }
+  }))))), /*#__PURE__*/React.createElement(ActionBar, null, /*#__PURE__*/React.createElement(SubmitBar, {
+    label: t("ES_COMMON_SAVE_CONTINUE") || "Save & Continue",
+    onSubmit: handleSaveAndContinue,
+    style: {
+      borderRadius: "12px"
+    }
+  })));
+};
+
+const AddressDetails = () => {
+  const {
+    t
+  } = useTranslation();
+  const history = useHistory();
+  const [addressType, setAddressType] = useState({
+    code: "AADHAAR",
+    name: "EKYC_AADHAAR_ADDRESS"
+  });
+  const [correctAddress, setCorrectAddress] = useState({
+    code: "NO",
+    name: "CORE_COMMON_NO"
+  });
+  const [fullAddress, setFullAddress] = useState("");
+  const [flatNo, setFlatNo] = useState("");
+  const [building, setBuilding] = useState("");
+  const [landmark, setLandmark] = useState("");
+  const [pincode, setPincode] = useState("");
+  const addressOptions = [{
+    code: "AADHAAR",
+    name: "EKYC_AADHAAR_ADDRESS"
+  }, {
+    code: "OLD",
+    name: "EKYC_OLD_ADDRESS"
+  }];
+  const yesNoOptions = [{
+    code: "YES",
+    name: "CORE_COMMON_YES"
+  }, {
+    code: "NO",
+    name: "CORE_COMMON_NO"
+  }];
+  const handleCompleteVerification = () => {
+    console.log("Verification Completed");
+  };
+  const FlagIcon = () => /*#__PURE__*/React.createElement("svg", {
+    width: "24",
+    height: "24",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M14.4 6L13.6 4H5V21H7V14H12.6L13.4 16H20V6H14.4Z",
+    fill: "#00703C"
+  }));
+  const IdCardIcon = () => /*#__PURE__*/React.createElement("svg", {
+    width: "24",
+    height: "24",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M2 7V17C2 18.1 2.9 19 4 19H20C21.1 19 22 18.1 22 17V7C22 5.9 21.1 5 20 5H4C2.9 5 2 5.9 2 7ZM12 11H14V13H12V11ZM12 7H14V9H12V7ZM16 11H20V13H16V11ZM16 7H20V9H16V7ZM4 7H10V15H4V7ZM20 17H4V16H20V17Z",
+    fill: "#3D51B0"
+  }));
+  const CameraIcon = () => /*#__PURE__*/React.createElement("svg", {
+    width: "32",
+    height: "32",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M9 2L7.17 4H4C2.9 4 2 4.9 2 6V18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V6C22 4.9 21.1 4 20 4H16.83L15 2H9ZM12 17C9.24 17 7 14.76 7 12C7 9.24 9.24 7 12 7C14.76 7 17 9.24 17 12C17 14.76 14.76 17 12 17ZM12 9C10.34 9 9 10.34 9 12C9 13.66 10.34 15 12 15C13.66 15 15 13.66 15 12C15 10.34 13.66 9 12 9Z",
+    fill: "#3D51B0"
+  }));
+  const TargetIcon = () => /*#__PURE__*/React.createElement("svg", {
+    width: "24",
+    height: "24",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M12 8C9.79 8 8 9.79 8 12C8 14.21 9.79 16 12 16C14.21 16 16 14.21 16 12C16 9.79 14.21 8 12 8ZM20.94 11C20.48 6.83 17.17 3.52 13 3.06V1H11V3.06C6.83 3.52 3.52 6.83 3.06 11H1V13H3.06C3.52 17.17 6.83 20.48 11 20.94V23H13V20.94C17.17 20.48 20.48 17.17 20.94 13H23V11H20.94ZM12 19C8.13 19 5 15.87 5 12C5 8.13 8.13 5 12 5C15.87 5 19 8.13 19 12C19 15.87 15.87 19 12 19Z",
+    fill: "#3D51B0"
+  }));
+  const PincodeIcon = () => /*#__PURE__*/React.createElement("svg", {
+    width: "24",
+    height: "24",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M13 13V11H15V13H13ZM13 9V7H15V9H13ZM17 13V11H19V13H17ZM17 9V7H19V9H17ZM11 13V11H9V13H11ZM11 9V7H9V9H11ZM7 13V11H5V13H7ZM7 9V7H5V9H7ZM21 3H3C1.9 3 1 3.9 1 5V19C1 20.1 1.9 21 3 21H21C22.1 21 23 20.1 23 19V5C23 3.9 22.1 3 21 3ZM21 19H3V5H21V19Z",
+    fill: "#3D51B0"
+  }));
+  return /*#__PURE__*/React.createElement("div", {
+    className: "ekyc-address-details-container"
+  }, /*#__PURE__*/React.createElement(Header, null, t("EKYC_ADDRESS_DETAILS_HEADER") || "Address Details"), /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      justifyContent: "space-between",
+      marginBottom: "20px"
+    }
+  }, /*#__PURE__*/React.createElement(RadioButtons, {
+    options: addressOptions,
+    optionsKey: "name",
+    selectedOption: addressType,
+    onSelect: setAddressType,
+    t: t,
+    innerStyles: {
+      display: "flex",
+      gap: "10px",
+      width: "100%"
+    },
+    style: {
+      width: "48%"
+    }
+  })), addressType.code === "AADHAAR" && /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#E7F4EE",
+      padding: "16px",
+      borderRadius: "8px",
+      marginBottom: "24px",
+      border: "1px solid #C4E1D1"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "16px",
+      lineHeight: "1.5"
+    }
+  }, "H.No. 123, Sector 15, Rohini", /*#__PURE__*/React.createElement("br", null), "Delhi - 110085")), addressType.code === "OLD" && /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("EKYC_ADDRESS_CORRECTION_PROMPT") || "Do you want to correct the address?"), /*#__PURE__*/React.createElement(RadioButtons, {
+    options: yesNoOptions,
+    optionsKey: "name",
+    selectedOption: correctAddress,
+    onSelect: setCorrectAddress,
+    t: t,
+    innerStyles: {
+      display: "flex",
+      gap: "20px"
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    style: {
+      border: "1px solid #E0E0E0",
+      borderRadius: "8px",
+      padding: "12px",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      marginBottom: "20px",
+      cursor: "pointer"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      alignItems: "center",
+      gap: "12px"
+    }
+  }, /*#__PURE__*/React.createElement(TargetIcon, null), /*#__PURE__*/React.createElement("span", {
+    style: {
+      fontWeight: "bold"
+    }
+  }, t("EKYC_USE_CURRENT_LOCATION") || "Use Current Location")), /*#__PURE__*/React.createElement("span", {
+    style: {
+      fontSize: "20px"
+    }
+  }, "\u203A")), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("EKYC_FULL_ADDRESS") || "Full Address"), /*#__PURE__*/React.createElement("div", {
+    className: "field",
+    style: {
+      position: "relative"
+    }
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: fullAddress,
+    onChange: e => setFullAddress(e.target.value),
+    placeholder: t("EKYC_ENTER_FULL_ADDRESS") || "Enter Full Address",
+    textInputStyle: {
+      paddingLeft: "40px",
+      height: "80px"
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: "absolute",
+      left: "10px",
+      top: "20px"
+    }
+  }, /*#__PURE__*/React.createElement(PropertyHouse, {
+    styles: {
+      fill: "#3D51B0"
+    }
+  })))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      gap: "16px"
+    }
+  }, /*#__PURE__*/React.createElement(LabelFieldPair, {
+    style: {
+      flex: 1
+    }
+  }, /*#__PURE__*/React.createElement(CardLabel, null, t("EKYC_FLAT_HOUSE_NUMBER") || "Flat/House Number"), /*#__PURE__*/React.createElement("div", {
+    className: "field",
+    style: {
+      position: "relative"
+    }
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: flatNo,
+    onChange: e => setFlatNo(e.target.value),
+    placeholder: t("EKYC_ENTER_FLAT_NO") || "Enter Flat/...",
+    textInputStyle: {
+      paddingLeft: "40px"
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: "absolute",
+      left: "10px",
+      top: "50%",
+      transform: "translateY(-50%)"
+    }
+  }, /*#__PURE__*/React.createElement(PropertyHouse, {
+    styles: {
+      fill: "#3D51B0",
+      width: "20px",
+      height: "20px"
+    }
+  })))), /*#__PURE__*/React.createElement(LabelFieldPair, {
+    style: {
+      flex: 1
+    }
+  }, /*#__PURE__*/React.createElement(CardLabel, null, t("EKYC_BUILDING_TOWER") || "Building/Tower"), /*#__PURE__*/React.createElement("div", {
+    className: "field",
+    style: {
+      position: "relative"
+    }
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: building,
+    onChange: e => setBuilding(e.target.value),
+    placeholder: t("EKYC_ENTER_BUILDING") || "Enter Build...",
+    textInputStyle: {
+      paddingLeft: "40px"
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: "absolute",
+      left: "10px",
+      top: "50%",
+      transform: "translateY(-50%)"
+    }
+  }, /*#__PURE__*/React.createElement(PropertyHouse, {
+    styles: {
+      fill: "#3D51B0",
+      width: "20px",
+      height: "20px"
+    }
+  }))))), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("EKYC_LANDMARK") || "Landmark (Optional)"), /*#__PURE__*/React.createElement("div", {
+    className: "field",
+    style: {
+      position: "relative"
+    }
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: landmark,
+    onChange: e => setLandmark(e.target.value),
+    placeholder: t("EKYC_ENTER_LANDMARK") || "Enter Landmark (Optional)",
+    textInputStyle: {
+      paddingLeft: "40px"
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: "absolute",
+      left: "10px",
+      top: "50%",
+      transform: "translateY(-50%)"
+    }
+  }, /*#__PURE__*/React.createElement(LocationIcon, {
+    className: "icon",
+    styles: {
+      fill: "#3D51B0"
+    }
+  })))), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("EKYC_PINCODE") || "Pincode"), /*#__PURE__*/React.createElement("div", {
+    className: "field",
+    style: {
+      position: "relative"
+    }
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    value: pincode,
+    onChange: e => setPincode(e.target.value),
+    placeholder: t("EKYC_ENTER_PINCODE") || "Enter Pincode",
+    textInputStyle: {
+      paddingLeft: "40px"
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: "absolute",
+      left: "10px",
+      top: "50%",
+      transform: "translateY(-50%)"
+    }
+  }, /*#__PURE__*/React.createElement(PincodeIcon, null))))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      alignItems: "center",
+      gap: "10px",
+      marginTop: "20px",
+      marginBottom: "16px"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#E8EAF6",
+      padding: "8px",
+      borderRadius: "8px"
+    }
+  }, /*#__PURE__*/React.createElement("svg", {
+    width: "24",
+    height: "24",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M12 7V3H2V21H22V7H12ZM6 19H4V17H6V19ZM6 15H4V13H6V15ZM6 11H4V9H6V11ZM6 7H4V5H6V7ZM10 19H8V17H10V19ZM10 15H8V13H10V15ZM10 11H8V9H10V11ZM10 7H8V5H10V7ZM20 19H12V9H20V19ZM18 11H14V13H18V11ZM18 15H14V17H18V15Z",
+    fill: "#3D51B0"
+  }))), /*#__PURE__*/React.createElement(CardHeader, {
+    style: {
+      margin: 0
+    }
+  }, t("EKYC_ADMINISTRATIVE_DIVISION") || "Administrative Division")), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      flexDirection: "column",
+      gap: "12px"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#F1F8F4",
+      padding: "16px",
+      borderRadius: "8px",
+      display: "flex",
+      alignItems: "center",
+      gap: "16px",
+      border: "1px solid #C4E1D1"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#D0E7D8",
+      padding: "8px",
+      borderRadius: "8px"
+    }
+  }, /*#__PURE__*/React.createElement(FlagIcon, null)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+    style: {
+      color: "#00703C",
+      fontSize: "12px",
+      fontWeight: "bold"
+    }
+  }, t("EKYC_ASSEMBLY") || "ASSEMBLY"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "16px",
+      fontWeight: "bold"
+    }
+  }, "AC-12 Chandni Chowk"))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#F1F3F9",
+      padding: "16px",
+      borderRadius: "8px",
+      display: "flex",
+      alignItems: "center",
+      gap: "16px",
+      border: "1px solid #D1D8E5"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#D1D8E5",
+      padding: "8px",
+      borderRadius: "8px"
+    }
+  }, /*#__PURE__*/React.createElement(IdCardIcon, null)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+    style: {
+      color: "#3D51B0",
+      fontSize: "12px",
+      fontWeight: "bold"
+    }
+  }, t("EKYC_WARD") || "WARD"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "16px",
+      fontWeight: "bold"
+    }
+  }, "WARD-45 Civil Lines")))), /*#__PURE__*/React.createElement(CardHeader, {
+    style: {
+      marginTop: "24px"
+    }
+  }, t("EKYC_DOOR_PHOTO_HEADER") || "Door Photo with GPS Stamp"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      color: "#707070",
+      fontSize: "14px",
+      marginBottom: "16px"
+    }
+  }, t("EKYC_REQUIRED_FOR_VERIFICATION") || "Required for verification"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#FFF4E5",
+      padding: "12px",
+      borderRadius: "8px",
+      display: "flex",
+      alignItems: "center",
+      gap: "12px",
+      marginBottom: "20px",
+      border: "1px solid #FFD180"
+    }
+  }, /*#__PURE__*/React.createElement(InfoBannerIcon, {
+    fill: "#EF6C00"
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      color: "#EF6C00"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontWeight: "bold"
+    }
+  }, t("EKYC_IMPORTANT") || "Important"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontSize: "13px"
+    }
+  }, t("EKYC_CAPTURE_LIVE_CAMERA") || "Capture with live camera for GPS metadata"))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      border: "2px dashed #D1D8E5",
+      borderRadius: "12px",
+      padding: "40px 20px",
+      textAlign: "center",
+      cursor: "pointer"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      backgroundColor: "#F1F3F9",
+      width: "64px",
+      height: "64px",
+      borderRadius: "50%",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      margin: "0 auto 16px"
+    }
+  }, /*#__PURE__*/React.createElement(CameraIcon, null)), /*#__PURE__*/React.createElement("div", {
+    style: {
+      fontWeight: "bold",
+      fontSize: "16px",
+      marginBottom: "4px"
+    }
+  }, t("EKYC_TAP_TO_CAPTURE") || "Tap to Capture"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      color: "#707070",
+      fontSize: "14px"
+    }
+  }, t("EKYC_CAPTURE_DOOR_IMAGE") || "Capture Door Image"))), /*#__PURE__*/React.createElement(ActionBar, null, /*#__PURE__*/React.createElement(SubmitBar, {
+    label: t("EKYC_COMPLETE_VERIFICATION") || "Complete Verification",
+    onSubmit: handleCompleteVerification
+  })));
+};
+
+const EmployeeApp = ({
+  path
+}) => {
+  const {
+    t
+  } = useTranslation();
+  const location = useLocation();
+  sessionStorage.removeItem("revalidateddone");
+  const getBreadcrumbLabel = () => {
+    const pathname = location.pathname;
+    if (pathname.includes("/dashboard")) return "ES_COMMON_INBOX";
+    if (pathname.includes("/create-kyc")) return "EKYC_CREATE_KYC";
+    if (pathname.includes("/k-details")) return "EKYC_K_DETAILS";
+    if (pathname.includes("/aadhaar-verification")) return "EKYC_AADHAAR_VERIFICATION";
+    if (pathname.includes("/address-details")) return "EKYC_ADDRESS_DETAILS";
+    return "ES_COMMON_INBOX";
+  };
+  const breadcrumbs = [{
+    icon: HomeIcon,
+    path: "/digit-ui/employee"
+  }, {
+    label: t(getBreadcrumbLabel())
+  }];
+  return /*#__PURE__*/React.createElement(AppContainer, null, /*#__PURE__*/React.createElement("div", {
+    className: "ground-container employee-app-container"
+  }, /*#__PURE__*/React.createElement(ModuleHeader, {
+    leftContent: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ArrowLeft, {
+      className: "icon"
+    }), "Back"),
+    onLeftClick: () => window.history.back(),
+    breadcrumbs: breadcrumbs
+  }), /*#__PURE__*/React.createElement(Switch, null, /*#__PURE__*/React.createElement(PrivateRoute, {
+    path: `${path}/dashboard`,
+    component: () => /*#__PURE__*/React.createElement(Inbox, {
+      parentRoute: path,
+      businessService: "EKYC",
+      moduleCode: "EKYC",
+      isInbox: true
+    })
+  }), /*#__PURE__*/React.createElement(PrivateRoute, {
+    path: `${path}/create-kyc`,
+    component: () => /*#__PURE__*/React.createElement(Create, null)
+  }), /*#__PURE__*/React.createElement(PrivateRoute, {
+    path: `${path}/k-details`,
+    component: () => /*#__PURE__*/React.createElement(KDetails, null)
+  }), /*#__PURE__*/React.createElement(PrivateRoute, {
+    path: `${path}/aadhaar-verification`,
+    component: () => /*#__PURE__*/React.createElement(AadhaarVerification, null)
+  }), /*#__PURE__*/React.createElement(PrivateRoute, {
+    path: `${path}/address-details`,
+    component: () => /*#__PURE__*/React.createElement(AddressDetails, null)
+  }), /*#__PURE__*/React.createElement(PrivateRoute, {
+    path: `${path}/`,
+    component: () => /*#__PURE__*/React.createElement(Inbox, {
+      parentRoute: path,
+      businessService: "EKYC",
+      moduleCode: "EKYC",
+      isInbox: true
+    })
+  }))));
+};
+
+const EkycModule = ({
+  stateCode,
+  userType,
+  tenants
+}) => {
+  const {
+    path,
+    url
+  } = useRouteMatch();
+  const moduleCode = "EKYC";
+  const language = Digit.StoreData.getCurrentLanguage();
+  const {
+    isLoading,
+    data: store
+  } = Digit.Services.useStore({
+    stateCode,
+    moduleCode,
+    language
+  });
+  Digit.SessionStorage.set("EKYC_TENANTS", tenants);
+  if (isLoading) {
+    return null;
+  }
+  if (userType === "employee") {
+    return /*#__PURE__*/React.createElement(EmployeeApp, {
+      path: path,
+      url: url,
+      userType: userType,
+      tenants: tenants
+    });
+  } else return null;
+};
+const componentsToRegister = {
+  EKYCModule: EkycModule,
+  EKYCCard,
+  EKYCInbox: Inbox,
+  EKYCDesktopInbox: DesktopInbox,
+  EKYCMobileInbox: MobileInbox
+};
+const initEkycComponents = () => {
+  Object.entries(componentsToRegister).forEach(([key, value]) => {
+    Digit.ComponentRegistryService.setComponent(key, value);
+  });
+};
+
+export default EkycModule;
+export { EkycModule, initEkycComponents };
+//# sourceMappingURL=index.modern.js.map