@dnb/eufemia 10.44.0 → 10.46.0

package/es/components/upload/UploadVerify.js

@@ -7,9 +7,24 @@ export function verifyFiles(files, context) {
     errorLargeFile,
     errorUnsupportedFile
   } = context;
+  const getFileType = (file, listOfAcceptedFilesTypes) => {
+    return hasPreferredMimeType(listOfAcceptedFilesTypes, file) ? file.type : getFileTypeFromExtension(file) || file.type;
+  };
   const handleSize = file => {
-    if (fileMaxSize && file.size / BYTES_IN_A_MEGA_BYTE > fileMaxSize) {
-      return String(errorLargeFile).replace('%size', format(fileMaxSize).toString());
+    const validateFileSize = (fileSize, maxFileSize) => {
+      if (maxFileSize && fileSize / BYTES_IN_A_MEGA_BYTE > maxFileSize) {
+        return String(errorLargeFile).replace('%size', format(maxFileSize).toString());
+      }
+      return null;
+    };
+    if (isArrayOfStrings(acceptedFileTypes) || acceptedFileTypes.length === 0 || !acceptedFileTypes) {
+      return validateFileSize(file.size, fileMaxSize);
+    } else if (isArrayOfObjects(acceptedFileTypes)) {
+      const fileType = getFileType(file, getAcceptedFileTypesAsListOfStrings(acceptedFileTypes));
+      const acceptedFileTypeObj = acceptedFileTypes.find(item => {
+        return item.fileType === fileType;
+      });
+      return validateFileSize(file.size, acceptedFileTypeObj.fileMaxSize !== undefined ? acceptedFileTypeObj.fileMaxSize : fileMaxSize);
     }
     return null;
   };
@@ -17,8 +32,9 @@ export function verifyFiles(files, context) {
     if (acceptedFileTypes.length === 0) {
       return false;
     }
-    const fileType = hasPreferredMimeType(acceptedFileTypes, file) ? file.type : getFileTypeFromExtension(file) || file.type;
-    const foundType = extendWithAbbreviation(acceptedFileTypes).some(type => {
+    const listOfAcceptedFilesTypes = getAcceptedFileTypesAsListOfStrings(acceptedFileTypes);
+    const fileType = getFileType(file, listOfAcceptedFilesTypes);
+    const foundType = extendWithAbbreviation(listOfAcceptedFilesTypes).some(type => {
       return fileType.includes(type);
     });
     return !foundType ? errorUnsupportedFile : null;
@@ -39,11 +55,20 @@ export function getFileTypeFromExtension(file) {
   return file.name.includes('.') && file.name.replace(/.*\.([^.]+)$/, '$1') || null;
 }
 export function getAcceptedFileTypes(acceptedFileTypes) {
-  return extendWithAbbreviation(acceptedFileTypes).map(type => type.includes('/') ? type : `.${type}`).join(',');
+  return extendWithAbbreviation(getAcceptedFileTypesAsListOfStrings(acceptedFileTypes)).map(type => type.includes('/') ? type : `.${type}`).join(',');
 }
 export function hasPreferredMimeType(acceptedFileTypes, file) {
   return file.type.split('/')[1] && (!(acceptedFileTypes !== null && acceptedFileTypes !== void 0 && acceptedFileTypes.length) || (acceptedFileTypes === null || acceptedFileTypes === void 0 ? void 0 : acceptedFileTypes.some(type => type.toLowerCase() === file.type.toLowerCase())));
 }
+function getAcceptedFileTypesAsListOfStrings(acceptedFileTypes) {
+  return isArrayOfStrings(acceptedFileTypes) ? acceptedFileTypes : acceptedFileTypes.map(obj => obj.fileType);
+}
+export function isArrayOfStrings(arr) {
+  return Array.isArray(arr) && arr.length > 0 && arr.every(i => typeof i === 'string');
+}
+export function isArrayOfObjects(arr) {
+  return Array.isArray(arr) && arr.length > 0 && arr.every(i => typeof i === 'object');
+}
 export function extendWithAbbreviation(acceptedFileTypes, abbreviations = {
   jpg: 'jpeg'
 }) {

package/es/components/upload/UploadVerify.js.map

@@ -1 +1 @@
-{"version":3,"file":"UploadVerify.js","names":["format","BYTES_IN_A_MEGA_BYTE","verifyFiles","files","context","fileMaxSize","acceptedFileTypes","errorLargeFile","errorUnsupportedFile","handleSize","file","size","String","replace","toString","handleType","length","fileType","hasPreferredMimeType","type","getFileTypeFromExtension","foundType","extendWithAbbreviation","some","includes","cleanedFiles","map","item","errorMessage","name","getAcceptedFileTypes","join","split","toLowerCase","abbreviations","jpg","list","Object","entries","forEach","abbr","t","push"],"sources":["../../../../src/components/upload/UploadVerify.tsx"],"sourcesContent":["import { format } from '../number-format/NumberUtils'\nimport {\n  UploadFile,\n  UploadContextProps,\n  UploadAcceptedFileTypes,\n} from './types'\n\nexport const BYTES_IN_A_MEGA_BYTE = 1048576\n\nexport function verifyFiles(\n  files: UploadFile[],\n  context: Pick<\n    UploadContextProps,\n    | 'errorUnsupportedFile'\n    | 'errorLargeFile'\n    | 'acceptedFileTypes'\n    | 'fileMaxSize'\n  >\n) {\n  const {\n    fileMaxSize,\n    acceptedFileTypes,\n    errorLargeFile,\n    errorUnsupportedFile,\n  } = context\n\n  const handleSize = (file: File) => {\n    if (\n      fileMaxSize &&\n      // Converts from b (binary) to MB (decimal)\n      file.size / BYTES_IN_A_MEGA_BYTE > fileMaxSize\n    ) {\n      return String(errorLargeFile).replace(\n        '%size',\n        format(fileMaxSize).toString()\n      )\n    }\n    return null\n  }\n\n  const handleType = (file: File) => {\n    if (acceptedFileTypes.length === 0) {\n      return false\n    }\n    const fileType = hasPreferredMimeType(acceptedFileTypes, file)\n      ? file.type\n      : getFileTypeFromExtension(file) || file.type\n    const foundType = extendWithAbbreviation(acceptedFileTypes).some(\n      (type) => {\n        /**\n         * \"file.type\" can be e.g. \"images/png\"\n         */\n        return fileType.includes(type)\n      }\n    )\n    return !foundType ? errorUnsupportedFile : null\n  }\n\n  const cleanedFiles = files.map((item) => {\n    const { file } = item\n\n    const errorMessage = handleSize(file) || handleType(file)\n\n    if (errorMessage) {\n      item.errorMessage = errorMessage\n    }\n\n    return item\n  })\n\n  return cleanedFiles\n}\n\nexport function getFileTypeFromExtension(file: File) {\n  return (\n    (file.name.includes('.') && file.name.replace(/.*\\.([^.]+)$/, '$1')) ||\n    null\n  )\n}\n\nexport function getAcceptedFileTypes(\n  acceptedFileTypes: UploadAcceptedFileTypes\n) {\n  return extendWithAbbreviation(acceptedFileTypes)\n    .map((type) => (type.includes('/') ? type : `.${type}`))\n    .join(',')\n}\n\nexport function hasPreferredMimeType(\n  acceptedFileTypes: UploadAcceptedFileTypes,\n  file: File\n) {\n  return (\n    file.type.split('/')[1] &&\n    (!acceptedFileTypes?.length ||\n      acceptedFileTypes?.some(\n        (type) => type.toLowerCase() === file.type.toLowerCase()\n      ))\n  )\n}\n\nexport function extendWithAbbreviation(\n  acceptedFileTypes: UploadAcceptedFileTypes,\n  abbreviations = { jpg: 'jpeg' }\n) {\n  const list = [...acceptedFileTypes]\n\n  Object.entries(abbreviations).forEach(([type, abbr]) => {\n    if (list.some((t) => t === type) && !list.some((t) => t === abbr)) {\n      list.push(abbr)\n    }\n  })\n\n  return list\n}\n"],"mappings":"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"}
+{"version":3,"file":"UploadVerify.js","names":["format","BYTES_IN_A_MEGA_BYTE","verifyFiles","files","context","fileMaxSize","acceptedFileTypes","errorLargeFile","errorUnsupportedFile","getFileType","file","listOfAcceptedFilesTypes","hasPreferredMimeType","type","getFileTypeFromExtension","handleSize","validateFileSize","fileSize","maxFileSize","String","replace","toString","isArrayOfStrings","length","size","isArrayOfObjects","fileType","getAcceptedFileTypesAsListOfStrings","acceptedFileTypeObj","find","item","undefined","handleType","foundType","extendWithAbbreviation","some","includes","cleanedFiles","map","errorMessage","name","getAcceptedFileTypes","join","split","toLowerCase","obj","arr","Array","isArray","every","i","abbreviations","jpg","list","Object","entries","forEach","abbr","t","push"],"sources":["../../../../src/components/upload/UploadVerify.tsx"],"sourcesContent":["import { format } from '../number-format/NumberUtils'\nimport {\n  UploadFile,\n  UploadContextProps,\n  UploadAcceptedFileTypes,\n  UploadAcceptedFileTypesWithFileMaxSize,\n} from './types'\n\nexport const BYTES_IN_A_MEGA_BYTE = 1048576\n\nexport function verifyFiles(\n  files: UploadFile[],\n  context: Pick<\n    UploadContextProps,\n    | 'errorUnsupportedFile'\n    | 'errorLargeFile'\n    | 'acceptedFileTypes'\n    | 'fileMaxSize'\n  >\n) {\n  const {\n    fileMaxSize,\n    acceptedFileTypes,\n    errorLargeFile,\n    errorUnsupportedFile,\n  } = context\n\n  const getFileType = (\n    file: File,\n    listOfAcceptedFilesTypes: UploadAcceptedFileTypes\n  ) => {\n    return hasPreferredMimeType(listOfAcceptedFilesTypes, file)\n      ? file.type\n      : getFileTypeFromExtension(file) || file.type\n  }\n\n  const handleSize = (file: File) => {\n    const validateFileSize = (\n      fileSize: number,\n      maxFileSize: number | false\n    ) => {\n      if (\n        maxFileSize &&\n        // Converts from b (binary) to MB (decimal)\n        fileSize / BYTES_IN_A_MEGA_BYTE > maxFileSize\n      ) {\n        return String(errorLargeFile).replace(\n          '%size',\n          format(maxFileSize).toString()\n        )\n      }\n      return null\n    }\n\n    if (\n      isArrayOfStrings(acceptedFileTypes) ||\n      acceptedFileTypes.length === 0 ||\n      !acceptedFileTypes\n    ) {\n      return validateFileSize(file.size, fileMaxSize)\n    } else if (isArrayOfObjects(acceptedFileTypes)) {\n      const fileType = getFileType(\n        file,\n        getAcceptedFileTypesAsListOfStrings(acceptedFileTypes)\n      )\n\n      const acceptedFileTypeObj = (\n        acceptedFileTypes as UploadAcceptedFileTypesWithFileMaxSize\n      ).find((item) => {\n        return item.fileType === fileType\n      })\n\n      return validateFileSize(\n        file.size,\n        acceptedFileTypeObj.fileMaxSize !== undefined\n          ? acceptedFileTypeObj.fileMaxSize\n          : fileMaxSize\n      )\n    }\n    return null\n  }\n\n  const handleType = (file: File) => {\n    if (acceptedFileTypes.length === 0) {\n      return false\n    }\n\n    const listOfAcceptedFilesTypes =\n      getAcceptedFileTypesAsListOfStrings(acceptedFileTypes)\n    const fileType = getFileType(file, listOfAcceptedFilesTypes)\n    const foundType = extendWithAbbreviation(\n      listOfAcceptedFilesTypes\n    ).some((type) => {\n      /**\n       * \"file.type\" can be e.g. \"image/png\"\n       */\n      return fileType.includes(type)\n    })\n    return !foundType ? errorUnsupportedFile : null\n  }\n\n  const cleanedFiles = files.map((item) => {\n    const { file } = item\n\n    const errorMessage = handleSize(file) || handleType(file)\n\n    if (errorMessage) {\n      item.errorMessage = errorMessage\n    }\n\n    return item\n  })\n\n  return cleanedFiles\n}\n\nexport function getFileTypeFromExtension(file: File) {\n  return (\n    (file.name.includes('.') && file.name.replace(/.*\\.([^.]+)$/, '$1')) ||\n    null\n  )\n}\n\nexport function getAcceptedFileTypes(\n  acceptedFileTypes:\n    | UploadAcceptedFileTypes\n    | UploadAcceptedFileTypesWithFileMaxSize\n) {\n  return extendWithAbbreviation(\n    getAcceptedFileTypesAsListOfStrings(acceptedFileTypes)\n  )\n    .map((type) => (type.includes('/') ? type : `.${type}`))\n    .join(',')\n}\n\nexport function hasPreferredMimeType(\n  acceptedFileTypes: UploadAcceptedFileTypes,\n  file: File\n) {\n  return (\n    file.type.split('/')[1] &&\n    (!acceptedFileTypes?.length ||\n      acceptedFileTypes?.some(\n        (type) => type.toLowerCase() === file.type.toLowerCase()\n      ))\n  )\n}\n\nfunction getAcceptedFileTypesAsListOfStrings(\n  acceptedFileTypes:\n    | UploadAcceptedFileTypes\n    | UploadAcceptedFileTypesWithFileMaxSize\n) {\n  return isArrayOfStrings(acceptedFileTypes)\n    ? (acceptedFileTypes as UploadAcceptedFileTypes)\n    : (acceptedFileTypes as UploadAcceptedFileTypesWithFileMaxSize).map(\n        (obj) => obj.fileType\n      )\n}\n\nexport function isArrayOfStrings(arr) {\n  return (\n    Array.isArray(arr) &&\n    arr.length > 0 &&\n    arr.every((i) => typeof i === 'string')\n  )\n}\n\nexport function isArrayOfObjects(arr) {\n  return (\n    Array.isArray(arr) &&\n    arr.length > 0 &&\n    arr.every((i) => typeof i === 'object')\n  )\n}\n\nexport function extendWithAbbreviation(\n  acceptedFileTypes: UploadAcceptedFileTypes,\n  abbreviations = { jpg: 'jpeg' }\n) {\n  const list = [...acceptedFileTypes]\n\n  Object.entries(abbreviations).forEach(([type, abbr]) => {\n    if (list.some((t) => t === type) && !list.some((t) => t === abbr)) {\n      list.push(abbr)\n    }\n  })\n\n  return list\n}\n"],"mappings":"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"}

package/es/components/upload/style/dnb-upload.css

@@ -112,6 +112,21 @@
 .dnb-upload__text.dnb-p {
   color: var(--upload-text--secondary);
 }
+.dnb-upload__accepted-file-types-table.dnb-table {
+  width: -moz-fit-content;
+  width: fit-content;
+}
+.dnb-upload__accepted-file-types-table.dnb-table thead th {
+  font-weight: var(--font-weight-medium);
+  font-size: var(--font-size-basis);
+  padding-top: var(--spacing-small);
+}
+.dnb-upload__accepted-file-types-table.dnb-table thead th:first-child {
+  padding-left: 0;
+}
+.dnb-upload__accepted-file-types-table.dnb-table tbody td:first-child {
+  padding-left: 0;
+}
 .dnb-upload__subtitle.dnb-p {
   color: var(--upload-text--secondary);
 }

package/es/components/upload/style/dnb-upload.min.css

@@ -1 +1 @@
-.dnb-upload{--upload-background:#fff;--upload-background--active:#d3d3d3;--upload-border:gray;--upload-border--active:#000;--upload-list-border:#000;--upload-icon--default:#000;--upload-icon--warning:red;--upload-highlight:#ffffe0;--upload-text--primary:#000;--upload-text--secondary:#000;background-color:var(--upload-background);border-radius:.5rem;display:flex;flex-direction:column;padding:var(--spacing-medium);position:relative}@media screen and (max-width:40em){.dnb-upload{padding:var(--spacing-medium) var(--spacing-small)}}.dnb-upload__outline{stroke:var(--upload-border);stroke-width:.1875rem;border-radius:.5rem;content:"";height:100%;inset:0;pointer-events:none;position:absolute;width:100%}.dnb-upload--active .dnb-upload__outline{stroke:var(--upload-border--active);height:calc(100% + 2px);inset:-1px;width:calc(100% + 2px)}.dnb-upload--active .dnb-upload__outline rect{stroke-width:.25rem;stroke-dasharray:0}.dnb-upload--active{background-color:var(--upload-background--active)}.dnb-upload__file-input{position:absolute;visibility:hidden}.dnb-upload__file-list{list-style:none;margin-bottom:0;margin-top:var(--spacing-medium);padding:0;position:relative}.dnb-upload__file-cell:after,.dnb-upload__file-list:before{background-color:var(--upload-list-border);content:"";height:1px;inset:0;position:absolute}.dnb-upload__file-cell{padding:var(--spacing-small) 0;position:relative;transition:background-color;transition-duration:1.5s;transition-timing-function:var(--easing-default)}.dnb-upload__file-cell:after{top:auto}.dnb-upload__file-cell__content{justify-content:space-between}.dnb-upload__file-cell__content,.dnb-upload__file-cell__content__left{align-items:center;display:flex;flex-direction:row}.dnb-upload__file-cell__content__left .dnb-icon{color:var(--upload-icon--default)}.dnb-upload__file-cell--warning .dnb-upload__file-cell__content__left .dnb-icon{color:var(--upload-icon--warning)}.dnb-upload__file-cell--highlight{background-color:var(--upload-highlight)}.dnb-upload__file-cell__text-container{display:flex;flex-direction:column;margin-left:var(--spacing-small)}.dnb-upload__file-cell__text-container--loading{font-size:var(--font-size-basis)}.dnb-upload__subtitle.dnb-p,.dnb-upload__text.dnb-p{color:var(--upload-text--secondary)}
+.dnb-upload{--upload-background:#fff;--upload-background--active:#d3d3d3;--upload-border:gray;--upload-border--active:#000;--upload-list-border:#000;--upload-icon--default:#000;--upload-icon--warning:red;--upload-highlight:#ffffe0;--upload-text--primary:#000;--upload-text--secondary:#000;background-color:var(--upload-background);border-radius:.5rem;display:flex;flex-direction:column;padding:var(--spacing-medium);position:relative}@media screen and (max-width:40em){.dnb-upload{padding:var(--spacing-medium) var(--spacing-small)}}.dnb-upload__outline{stroke:var(--upload-border);stroke-width:.1875rem;border-radius:.5rem;content:"";height:100%;inset:0;pointer-events:none;position:absolute;width:100%}.dnb-upload--active .dnb-upload__outline{stroke:var(--upload-border--active);height:calc(100% + 2px);inset:-1px;width:calc(100% + 2px)}.dnb-upload--active .dnb-upload__outline rect{stroke-width:.25rem;stroke-dasharray:0}.dnb-upload--active{background-color:var(--upload-background--active)}.dnb-upload__file-input{position:absolute;visibility:hidden}.dnb-upload__file-list{list-style:none;margin-bottom:0;margin-top:var(--spacing-medium);padding:0;position:relative}.dnb-upload__file-cell:after,.dnb-upload__file-list:before{background-color:var(--upload-list-border);content:"";height:1px;inset:0;position:absolute}.dnb-upload__file-cell{padding:var(--spacing-small) 0;position:relative;transition:background-color;transition-duration:1.5s;transition-timing-function:var(--easing-default)}.dnb-upload__file-cell:after{top:auto}.dnb-upload__file-cell__content{justify-content:space-between}.dnb-upload__file-cell__content,.dnb-upload__file-cell__content__left{align-items:center;display:flex;flex-direction:row}.dnb-upload__file-cell__content__left .dnb-icon{color:var(--upload-icon--default)}.dnb-upload__file-cell--warning .dnb-upload__file-cell__content__left .dnb-icon{color:var(--upload-icon--warning)}.dnb-upload__file-cell--highlight{background-color:var(--upload-highlight)}.dnb-upload__file-cell__text-container{display:flex;flex-direction:column;margin-left:var(--spacing-small)}.dnb-upload__file-cell__text-container--loading{font-size:var(--font-size-basis)}.dnb-upload__text.dnb-p{color:var(--upload-text--secondary)}.dnb-upload__accepted-file-types-table.dnb-table{width:-moz-fit-content;width:fit-content}.dnb-upload__accepted-file-types-table.dnb-table thead th{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium);padding-top:var(--spacing-small)}.dnb-upload__accepted-file-types-table.dnb-table tbody td:first-child,.dnb-upload__accepted-file-types-table.dnb-table thead th:first-child{padding-left:0}.dnb-upload__subtitle.dnb-p{color:var(--upload-text--secondary)}

package/es/components/upload/style/dnb-upload.scss

@@ -145,6 +145,23 @@
     color: var(--upload-text--secondary);
   }
 
+  &__accepted-file-types-table {
+    &.dnb-table {
+      width: fit-content;
+      & thead th {
+        font-weight: var(--font-weight-medium);
+        font-size: var(--font-size-basis);
+        padding-top: var(--spacing-small);
+        &:first-child {
+          padding-left: 0;
+        }
+      }
+      & tbody td:first-child {
+        padding-left: 0;
+      }
+    }
+  }
+
   &__subtitle.dnb-p {
     color: var(--upload-text--secondary);
   }

package/es/components/upload/types.d.ts

@@ -2,6 +2,11 @@ import React from 'react';
 import type { SkeletonShow } from '../skeleton/Skeleton';
 import type { LocaleProps, SpacingProps } from '../../shared/types';
 export type UploadAcceptedFileTypes = string[];
+export type UploadAcceptedFileTypesWithFileMaxSize = UploadAcceptedFileTypeObject[];
+export type UploadAcceptedFileTypeObject = {
+    fileType: string;
+    fileMaxSize?: number | false;
+};
 export type UploadProps = {
     /**
      * unique id used with the useUpload hook to manage the files
@@ -10,7 +15,7 @@ export type UploadProps = {
     /**
      * list of accepted file types.
      */
-    acceptedFileTypes: UploadAcceptedFileTypes;
+    acceptedFileTypes: UploadAcceptedFileTypes | UploadAcceptedFileTypesWithFileMaxSize;
     /**
      * Skeleton should be applied when loading content
      * Default: null
@@ -43,6 +48,7 @@ export type UploadProps = {
      */
     title?: React.ReactNode;
     text?: React.ReactNode;
+    fileTypeTableCaption?: React.ReactNode;
     fileTypeDescription?: React.ReactNode;
     fileSizeDescription?: React.ReactNode;
     fileAmountDescription?: React.ReactNode;

package/es/components/upload/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/upload/types.ts"],"sourcesContent":["import React from 'react'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { LocaleProps, SpacingProps } from '../../shared/types'\n\nexport type UploadAcceptedFileTypes = string[]\n\nexport type UploadProps = {\n  /**\n   * unique id used with the useUpload hook to manage the files\n   */\n  id: string\n\n  /**\n   * list of accepted file types.\n   */\n  acceptedFileTypes: UploadAcceptedFileTypes\n\n  /**\n   * Skeleton should be applied when loading content\n   * Default: null\n   */\n  skeleton?: SkeletonShow\n\n  /**\n   * Defines the amount of files the user can select and upload\n   * Default: 100\n   */\n  filesAmountLimit?: number\n\n  /**\n   * Defines the max file size of each file in MB. Use either `0` or `false` to disable.\n   * Default: 5 MB\n   */\n  fileMaxSize?: number | false\n\n  /**\n   * will be called on `files` changes made by the user. Access the files with `{ files }`.\n   */\n  onChange?: ({ files }: { files: UploadFile[] }) => void\n\n  /**\n   * will be called once a file gets deleted by the user. Access the deleted file with `{ fileItem }`.\n   */\n  onFileDelete?: ({ fileItem }: { fileItem: UploadFile }) => void\n\n  /**\n   * Custom text properties\n   */\n  title?: React.ReactNode\n  text?: React.ReactNode\n  fileTypeDescription?: React.ReactNode\n  fileSizeDescription?: React.ReactNode\n  fileAmountDescription?: React.ReactNode\n  fileSizeContent?: React.ReactNode\n  buttonText?: React.ReactNode\n  errorLargeFile?: React.ReactNode\n  errorUnsupportedFile?: React.ReactNode\n  errorAmountLimit?: React.ReactNode\n  loadingText?: React.ReactNode\n  deleteButton?: React.ReactNode\n  fileListAriaLabel?: string\n  children?: React.ReactNode\n}\n\nexport type UploadAllProps = UploadProps &\n  SpacingProps &\n  LocaleProps &\n  Omit<React.HTMLProps<HTMLElement>, 'onChange' | 'title'>\n\nexport type UploadContextProps = {\n  id?: string\n  onInputUpload: (files: UploadFile[]) => void\n} & Partial<UploadProps>\n\nexport type UploadFile = {\n  file: File\n  errorMessage?: React.ReactNode\n  isLoading?: boolean\n  exists?: boolean\n  id?: string\n}\n"],"mappings":""}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/upload/types.ts"],"sourcesContent":["import React from 'react'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { LocaleProps, SpacingProps } from '../../shared/types'\n\nexport type UploadAcceptedFileTypes = string[]\n\nexport type UploadAcceptedFileTypesWithFileMaxSize =\n  UploadAcceptedFileTypeObject[]\n\nexport type UploadAcceptedFileTypeObject = {\n  fileType: string\n  fileMaxSize?: number | false\n}\n\nexport type UploadProps = {\n  /**\n   * unique id used with the useUpload hook to manage the files\n   */\n  id: string\n\n  /**\n   * list of accepted file types.\n   */\n  acceptedFileTypes:\n    | UploadAcceptedFileTypes\n    | UploadAcceptedFileTypesWithFileMaxSize\n\n  /**\n   * Skeleton should be applied when loading content\n   * Default: null\n   */\n  skeleton?: SkeletonShow\n\n  /**\n   * Defines the amount of files the user can select and upload\n   * Default: 100\n   */\n  filesAmountLimit?: number\n\n  /**\n   * Defines the max file size of each file in MB. Use either `0` or `false` to disable.\n   * Default: 5 MB\n   */\n  fileMaxSize?: number | false\n\n  /**\n   * will be called on `files` changes made by the user. Access the files with `{ files }`.\n   */\n  onChange?: ({ files }: { files: UploadFile[] }) => void\n\n  /**\n   * will be called once a file gets deleted by the user. Access the deleted file with `{ fileItem }`.\n   */\n  onFileDelete?: ({ fileItem }: { fileItem: UploadFile }) => void\n\n  /**\n   * Custom text properties\n   */\n  title?: React.ReactNode\n  text?: React.ReactNode\n  fileTypeTableCaption?: React.ReactNode\n  fileTypeDescription?: React.ReactNode\n  fileSizeDescription?: React.ReactNode\n  fileAmountDescription?: React.ReactNode\n  fileSizeContent?: React.ReactNode\n  buttonText?: React.ReactNode\n  errorLargeFile?: React.ReactNode\n  errorUnsupportedFile?: React.ReactNode\n  errorAmountLimit?: React.ReactNode\n  loadingText?: React.ReactNode\n  deleteButton?: React.ReactNode\n  fileListAriaLabel?: string\n  children?: React.ReactNode\n}\n\nexport type UploadAllProps = UploadProps &\n  SpacingProps &\n  LocaleProps &\n  Omit<React.HTMLProps<HTMLElement>, 'onChange' | 'title'>\n\nexport type UploadContextProps = {\n  id?: string\n  onInputUpload: (files: UploadFile[]) => void\n} & Partial<UploadProps>\n\nexport type UploadFile = {\n  file: File\n  errorMessage?: React.ReactNode\n  isLoading?: boolean\n  exists?: boolean\n  id?: string\n}\n"],"mappings":""}

package/es/extensions/forms/DataContext/Context.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Ajv } from '../utils/ajv';
-import { AllJSONSchemaVersions, CustomErrorMessagesWithPaths, SubmitState, Path, EventStateObject, EventReturnWithStateObject, Identifier, FieldProps, FormError, ValueProps } from '../types';
+import { AllJSONSchemaVersions, CustomErrorMessagesWithPaths, SubmitState, Path, EventStateObject, EventReturnWithStateObject, Identifier, FieldProps, FormError, ValueProps, OnChange } from '../types';
 import { Props as ProviderProps } from './Provider';
 type HandleSubmitProps = {
     formElement?: HTMLFormElement;
@@ -8,7 +8,7 @@ type HandleSubmitProps = {
 export type EventListenerCall = {
     path?: Path;
     type?: 'onSubmit';
-    callback: () => any;
+    callback: () => void;
 };
 export type FilterDataHandler<Data> = (data: Data, filter: FilterData) => Partial<Data>;
 export type FilterDataHandlerCallback<R> = (parameters: FilterDataHandlerParameters) => R;
@@ -27,6 +27,9 @@ export type FilterDataPathConditionParameters<Data = unknown> = {
 export type FilterDataPathObject<Data> = Record<Path, FilterDataPathCondition<Data> | boolean | undefined>;
 export type FilterData<Data = unknown> = FilterDataPathObject<Data> | FilterDataHandlerCallback<boolean | undefined>;
 export type TransformData = FilterDataHandlerCallback<unknown>;
+export type HandleSubmitCallback = ({ preventSubmit, }: {
+    preventSubmit: () => void;
+}) => void;
 export interface ContextState {
     id?: Identifier;
     hasContext: boolean;
@@ -55,7 +58,7 @@ export interface ContextState {
     handleUnMountField: (path: Path) => void;
     setFormState?: (state: SubmitState) => void;
     setSubmitState?: (state: EventStateObject) => void;
-    addOnChangeHandler?: (callback: (data: unknown) => void) => void;
+    addOnChangeHandler?: (callback: OnChange) => void;
     handleSubmitCall: ({ onSubmit, enableAsyncBehaviour, skipFieldValidation, skipErrorCheck, }: {
         onSubmit: () => EventReturnWithStateObject | void | Promise<EventReturnWithStateObject | void>;
         enableAsyncBehaviour: boolean;
@@ -64,10 +67,12 @@ export interface ContextState {
     }) => void;
     setFieldEventListener: (path: EventListenerCall['path'], type: EventListenerCall['type'], callback: EventListenerCall['callback']) => void;
     setHasVisibleError?: (path: Path, hasError: boolean) => void;
-    setFieldProps?: (path: Path, props: any) => void;
-    setValueProps?: (path: Path, props: any) => void;
+    setFieldProps?: (path: Path, props: unknown) => void;
+    setValueProps?: (path: Path, props: unknown) => void;
+    setHandleSubmit?: (callback: HandleSubmitCallback) => void;
     fieldPropsRef?: React.MutableRefObject<Record<string, FieldProps>>;
     valuePropsRef?: React.MutableRefObject<Record<string, ValueProps>>;
+    mountedFieldPathsRef?: React.MutableRefObject<Path[]>;
     showAllErrors: boolean;
     hasVisibleError: boolean;
     formState: SubmitState;

package/es/extensions/forms/DataContext/Context.js.map

@@ -1 +1 @@
-{"version":3,"file":"Context.js","names":["React","makeAjvInstance","defaultContextState","hasContext","data","undefined","schema","submitState","handlePathChange","handlePathChangeUnvalidated","updateDataValue","setData","validateData","handleSubmit","scrollToTop","showAllErrors","hasVisibleError","formState","setFormState","setSubmitState","setFieldEventListener","handleSubmitCall","setShowAllErrors","handleMountField","handleUnMountField","hasErrors","hasFieldState","hasFieldError","setFieldState","setFieldError","ajvInstance","contextErrorMessages","isInsideFormElement","props","Context","createContext"],"sources":["../../../../../src/extensions/forms/DataContext/Context.ts"],"sourcesContent":["import React from 'react'\nimport { Ajv, makeAjvInstance } from '../utils/ajv'\nimport {\n  AllJSONSchemaVersions,\n  CustomErrorMessagesWithPaths,\n  SubmitState,\n  Path,\n  EventStateObject,\n  EventReturnWithStateObject,\n  Identifier,\n  FieldProps,\n  FormError,\n  ValueProps,\n} from '../types'\nimport { Props as ProviderProps } from './Provider'\n\ntype HandleSubmitProps = {\n  formElement?: HTMLFormElement\n}\n\nexport type EventListenerCall = {\n  path?: Path\n  type?: 'onSubmit'\n  callback: () => any\n}\n\nexport type FilterDataHandler<Data> = (\n  data: Data,\n  filter: FilterData\n) => Partial<Data>\nexport type FilterDataHandlerCallback<R> = (\n  parameters: FilterDataHandlerParameters\n) => R\nexport type FilterDataHandlerParameters =\n  FilterDataPathConditionParameters & {\n    path: Path\n  }\nexport type FilterDataPathCondition<Data = unknown> = (\n  parameters: FilterDataPathConditionParameters<Data>\n) => boolean | undefined\nexport type FilterDataPathConditionParameters<Data = unknown> = {\n  value: unknown\n  props: FieldProps\n  data: Data\n  internal: {\n    error: Error | undefined\n  }\n}\nexport type FilterDataPathObject<Data> = Record<\n  Path,\n  FilterDataPathCondition<Data> | boolean | undefined\n>\nexport type FilterData<Data = unknown> =\n  | FilterDataPathObject<Data>\n  | FilterDataHandlerCallback<boolean | undefined>\nexport type TransformData = FilterDataHandlerCallback<unknown>\n\nexport interface ContextState {\n  id?: Identifier\n  hasContext: boolean\n  /** The dataset for the form / form wizard */\n  data: any\n  /** Should the form validate data before submitting? */\n  errors?: Record<string, Error>\n  /** Will set autoComplete=\"on\" on each nested Field.String and Field.Number */\n  autoComplete?: boolean\n  handlePathChange: (\n    path: Path,\n    value?: any\n  ) =>\n    | EventReturnWithStateObject\n    | unknown\n    | Promise<EventReturnWithStateObject | unknown>\n  handlePathChangeUnvalidated: (path: Path, value: any) => void\n  updateDataValue: (path: Path, value: any) => void\n  setData: (data: any) => void\n  mutateDataHandler?: (data: any, mutate: TransformData) => any\n  filterDataHandler?: (data: any, filter: FilterData) => any\n  validateData: () => void\n  handleSubmit: (props?: HandleSubmitProps) => any\n  scrollToTop: () => void\n  setShowAllErrors: (showAllErrors: boolean) => void\n  hasErrors: () => boolean\n  hasFieldState: (state: SubmitState) => boolean\n  hasFieldError: (path: Path) => boolean\n  setFieldState: (path: Path, fieldState: SubmitState) => void\n  setFieldError: (path: Path, error: Error | FormError) => void\n  handleMountField: (path: Path) => void\n  handleUnMountField: (path: Path) => void\n  setFormState?: (state: SubmitState) => void\n  setSubmitState?: (state: EventStateObject) => void\n  addOnChangeHandler?: (callback: (data: unknown) => void) => void\n  handleSubmitCall: ({\n    onSubmit,\n    enableAsyncBehaviour,\n    skipFieldValidation,\n    skipErrorCheck,\n  }: {\n    onSubmit: () =>\n      | EventReturnWithStateObject\n      | void\n      | Promise<EventReturnWithStateObject | void>\n    enableAsyncBehaviour: boolean\n    skipFieldValidation?: boolean\n    skipErrorCheck?: boolean\n  }) => void\n  setFieldEventListener: (\n    path: EventListenerCall['path'],\n    type: EventListenerCall['type'],\n    callback: EventListenerCall['callback']\n  ) => void\n  setHasVisibleError?: (path: Path, hasError: boolean) => void\n  setFieldProps?: (path: Path, props: any) => void\n  setValueProps?: (path: Path, props: any) => void\n  fieldPropsRef?: React.MutableRefObject<Record<string, FieldProps>>\n  valuePropsRef?: React.MutableRefObject<Record<string, ValueProps>>\n  showAllErrors: boolean\n  hasVisibleError: boolean\n  formState: SubmitState\n  ajvInstance: Ajv\n  contextErrorMessages: CustomErrorMessagesWithPaths\n  schema: AllJSONSchemaVersions\n  path?: Path\n  disabled?: boolean\n  required?: boolean\n  submitState: Partial<EventStateObject>\n  isInsideFormElement?: boolean\n  prerenderFieldProps?: boolean\n  props: ProviderProps<unknown>\n}\n\nexport const defaultContextState: ContextState = {\n  hasContext: false,\n  data: undefined,\n  schema: undefined,\n  submitState: undefined,\n  handlePathChange: () => null,\n  handlePathChangeUnvalidated: () => null,\n  updateDataValue: () => null,\n  setData: () => null,\n  validateData: () => null,\n  handleSubmit: () => null,\n  scrollToTop: () => null,\n  showAllErrors: false,\n  hasVisibleError: false,\n  formState: undefined,\n  setFormState: () => null,\n  setSubmitState: () => null,\n  setFieldEventListener: () => null,\n  handleSubmitCall: () => null,\n  setShowAllErrors: () => null,\n  handleMountField: () => null,\n  handleUnMountField: () => null,\n  hasErrors: () => false,\n  hasFieldState: () => false,\n  hasFieldError: () => false,\n  setFieldState: () => null,\n  setFieldError: () => null,\n  ajvInstance: makeAjvInstance(),\n  contextErrorMessages: undefined,\n  isInsideFormElement: false,\n  props: null,\n}\n\nconst Context = React.createContext<ContextState>(defaultContextState)\n\nexport default Context\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAAcC,eAAe,QAAQ,cAAc;AAkInD,OAAO,MAAMC,mBAAiC,GAAG;EAC/CC,UAAU,EAAE,KAAK;EACjBC,IAAI,EAAEC,SAAS;EACfC,MAAM,EAAED,SAAS;EACjBE,WAAW,EAAEF,SAAS;EACtBG,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,2BAA2B,EAAEA,CAAA,KAAM,IAAI;EACvCC,eAAe,EAAEA,CAAA,KAAM,IAAI;EAC3BC,OAAO,EAAEA,CAAA,KAAM,IAAI;EACnBC,YAAY,EAAEA,CAAA,KAAM,IAAI;EACxBC,YAAY,EAAEA,CAAA,KAAM,IAAI;EACxBC,WAAW,EAAEA,CAAA,KAAM,IAAI;EACvBC,aAAa,EAAE,KAAK;EACpBC,eAAe,EAAE,KAAK;EACtBC,SAAS,EAAEZ,SAAS;EACpBa,YAAY,EAAEA,CAAA,KAAM,IAAI;EACxBC,cAAc,EAAEA,CAAA,KAAM,IAAI;EAC1BC,qBAAqB,EAAEA,CAAA,KAAM,IAAI;EACjCC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,kBAAkB,EAAEA,CAAA,KAAM,IAAI;EAC9BC,SAAS,EAAEA,CAAA,KAAM,KAAK;EACtBC,aAAa,EAAEA,CAAA,KAAM,KAAK;EAC1BC,aAAa,EAAEA,CAAA,KAAM,KAAK;EAC1BC,aAAa,EAAEA,CAAA,KAAM,IAAI;EACzBC,aAAa,EAAEA,CAAA,KAAM,IAAI;EACzBC,WAAW,EAAE7B,eAAe,CAAC,CAAC;EAC9B8B,oBAAoB,EAAE1B,SAAS;EAC/B2B,mBAAmB,EAAE,KAAK;EAC1BC,KAAK,EAAE;AACT,CAAC;AAED,MAAMC,OAAO,GAAGlC,KAAK,CAACmC,aAAa,CAAejC,mBAAmB,CAAC;AAEtE,eAAegC,OAAO"}
+{"version":3,"file":"Context.js","names":["React","makeAjvInstance","defaultContextState","hasContext","data","undefined","schema","submitState","handlePathChange","handlePathChangeUnvalidated","updateDataValue","setData","validateData","handleSubmit","scrollToTop","showAllErrors","hasVisibleError","formState","setFormState","setSubmitState","setFieldEventListener","handleSubmitCall","setShowAllErrors","handleMountField","handleUnMountField","hasErrors","hasFieldState","hasFieldError","setFieldState","setFieldError","ajvInstance","contextErrorMessages","isInsideFormElement","props","Context","createContext"],"sources":["../../../../../src/extensions/forms/DataContext/Context.ts"],"sourcesContent":["import React from 'react'\nimport { Ajv, makeAjvInstance } from '../utils/ajv'\nimport {\n  AllJSONSchemaVersions,\n  CustomErrorMessagesWithPaths,\n  SubmitState,\n  Path,\n  EventStateObject,\n  EventReturnWithStateObject,\n  Identifier,\n  FieldProps,\n  FormError,\n  ValueProps,\n  OnChange,\n} from '../types'\nimport { Props as ProviderProps } from './Provider'\n\ntype HandleSubmitProps = {\n  formElement?: HTMLFormElement\n}\n\nexport type EventListenerCall = {\n  path?: Path\n  type?: 'onSubmit'\n  callback: () => void\n}\n\nexport type FilterDataHandler<Data> = (\n  data: Data,\n  filter: FilterData\n) => Partial<Data>\nexport type FilterDataHandlerCallback<R> = (\n  parameters: FilterDataHandlerParameters\n) => R\nexport type FilterDataHandlerParameters =\n  FilterDataPathConditionParameters & {\n    path: Path\n  }\nexport type FilterDataPathCondition<Data = unknown> = (\n  parameters: FilterDataPathConditionParameters<Data>\n) => boolean | undefined\nexport type FilterDataPathConditionParameters<Data = unknown> = {\n  value: unknown\n  props: FieldProps\n  data: Data\n  internal: {\n    error: Error | undefined\n  }\n}\nexport type FilterDataPathObject<Data> = Record<\n  Path,\n  FilterDataPathCondition<Data> | boolean | undefined\n>\nexport type FilterData<Data = unknown> =\n  | FilterDataPathObject<Data>\n  | FilterDataHandlerCallback<boolean | undefined>\nexport type TransformData = FilterDataHandlerCallback<unknown>\nexport type HandleSubmitCallback = ({\n  preventSubmit,\n}: {\n  preventSubmit: () => void\n}) => void\n\nexport interface ContextState {\n  id?: Identifier\n  hasContext: boolean\n  /** The dataset for the form / form wizard */\n  data: any\n  /** Should the form validate data before submitting? */\n  errors?: Record<string, Error>\n  /** Will set autoComplete=\"on\" on each nested Field.String and Field.Number */\n  autoComplete?: boolean\n  handlePathChange: (\n    path: Path,\n    value?: any\n  ) =>\n    | EventReturnWithStateObject\n    | unknown\n    | Promise<EventReturnWithStateObject | unknown>\n  handlePathChangeUnvalidated: (path: Path, value: any) => void\n  updateDataValue: (path: Path, value: any) => void\n  setData: (data: any) => void\n  mutateDataHandler?: (data: any, mutate: TransformData) => any\n  filterDataHandler?: (data: any, filter: FilterData) => any\n  validateData: () => void\n  handleSubmit: (props?: HandleSubmitProps) => any\n  scrollToTop: () => void\n  setShowAllErrors: (showAllErrors: boolean) => void\n  hasErrors: () => boolean\n  hasFieldState: (state: SubmitState) => boolean\n  hasFieldError: (path: Path) => boolean\n  setFieldState: (path: Path, fieldState: SubmitState) => void\n  setFieldError: (path: Path, error: Error | FormError) => void\n  handleMountField: (path: Path) => void\n  handleUnMountField: (path: Path) => void\n  setFormState?: (state: SubmitState) => void\n  setSubmitState?: (state: EventStateObject) => void\n  addOnChangeHandler?: (callback: OnChange) => void\n  handleSubmitCall: ({\n    onSubmit,\n    enableAsyncBehaviour,\n    skipFieldValidation,\n    skipErrorCheck,\n  }: {\n    onSubmit: () =>\n      | EventReturnWithStateObject\n      | void\n      | Promise<EventReturnWithStateObject | void>\n    enableAsyncBehaviour: boolean\n    skipFieldValidation?: boolean\n    skipErrorCheck?: boolean\n  }) => void\n  setFieldEventListener: (\n    path: EventListenerCall['path'],\n    type: EventListenerCall['type'],\n    callback: EventListenerCall['callback']\n  ) => void\n  setHasVisibleError?: (path: Path, hasError: boolean) => void\n  setFieldProps?: (path: Path, props: unknown) => void\n  setValueProps?: (path: Path, props: unknown) => void\n  setHandleSubmit?: (callback: HandleSubmitCallback) => void\n  fieldPropsRef?: React.MutableRefObject<Record<string, FieldProps>>\n  valuePropsRef?: React.MutableRefObject<Record<string, ValueProps>>\n  mountedFieldPathsRef?: React.MutableRefObject<Path[]>\n  showAllErrors: boolean\n  hasVisibleError: boolean\n  formState: SubmitState\n  ajvInstance: Ajv\n  contextErrorMessages: CustomErrorMessagesWithPaths\n  schema: AllJSONSchemaVersions\n  path?: Path\n  disabled?: boolean\n  required?: boolean\n  submitState: Partial<EventStateObject>\n  isInsideFormElement?: boolean\n  prerenderFieldProps?: boolean\n  props: ProviderProps<unknown>\n}\n\nexport const defaultContextState: ContextState = {\n  hasContext: false,\n  data: undefined,\n  schema: undefined,\n  submitState: undefined,\n  handlePathChange: () => null,\n  handlePathChangeUnvalidated: () => null,\n  updateDataValue: () => null,\n  setData: () => null,\n  validateData: () => null,\n  handleSubmit: () => null,\n  scrollToTop: () => null,\n  showAllErrors: false,\n  hasVisibleError: false,\n  formState: undefined,\n  setFormState: () => null,\n  setSubmitState: () => null,\n  setFieldEventListener: () => null,\n  handleSubmitCall: () => null,\n  setShowAllErrors: () => null,\n  handleMountField: () => null,\n  handleUnMountField: () => null,\n  hasErrors: () => false,\n  hasFieldState: () => false,\n  hasFieldError: () => false,\n  setFieldState: () => null,\n  setFieldError: () => null,\n  ajvInstance: makeAjvInstance(),\n  contextErrorMessages: undefined,\n  isInsideFormElement: false,\n  props: null,\n}\n\nconst Context = React.createContext<ContextState>(defaultContextState)\n\nexport default Context\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAAcC,eAAe,QAAQ,cAAc;AA0InD,OAAO,MAAMC,mBAAiC,GAAG;EAC/CC,UAAU,EAAE,KAAK;EACjBC,IAAI,EAAEC,SAAS;EACfC,MAAM,EAAED,SAAS;EACjBE,WAAW,EAAEF,SAAS;EACtBG,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,2BAA2B,EAAEA,CAAA,KAAM,IAAI;EACvCC,eAAe,EAAEA,CAAA,KAAM,IAAI;EAC3BC,OAAO,EAAEA,CAAA,KAAM,IAAI;EACnBC,YAAY,EAAEA,CAAA,KAAM,IAAI;EACxBC,YAAY,EAAEA,CAAA,KAAM,IAAI;EACxBC,WAAW,EAAEA,CAAA,KAAM,IAAI;EACvBC,aAAa,EAAE,KAAK;EACpBC,eAAe,EAAE,KAAK;EACtBC,SAAS,EAAEZ,SAAS;EACpBa,YAAY,EAAEA,CAAA,KAAM,IAAI;EACxBC,cAAc,EAAEA,CAAA,KAAM,IAAI;EAC1BC,qBAAqB,EAAEA,CAAA,KAAM,IAAI;EACjCC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,kBAAkB,EAAEA,CAAA,KAAM,IAAI;EAC9BC,SAAS,EAAEA,CAAA,KAAM,KAAK;EACtBC,aAAa,EAAEA,CAAA,KAAM,KAAK;EAC1BC,aAAa,EAAEA,CAAA,KAAM,KAAK;EAC1BC,aAAa,EAAEA,CAAA,KAAM,IAAI;EACzBC,aAAa,EAAEA,CAAA,KAAM,IAAI;EACzBC,WAAW,EAAE7B,eAAe,CAAC,CAAC;EAC9B8B,oBAAoB,EAAE1B,SAAS;EAC/B2B,mBAAmB,EAAE,KAAK;EAC1BC,KAAK,EAAE;AACT,CAAC;AAED,MAAMC,OAAO,GAAGlC,KAAK,CAACmC,aAAa,CAAejC,mBAAmB,CAAC;AAEtE,eAAegC,OAAO"}

package/es/extensions/forms/DataContext/FieldBoundary/FieldBoundaryContext.d.ts

@@ -17,6 +17,14 @@ export interface FieldBoundaryContextState {
      * Contains the nested field errors.
      */
     errorsRef?: React.RefObject<unknown>;
+    /**
+     * Will be set to true when the boundary context error state should be shown.
+     */
+    showBoundaryErrors?: boolean;
+    /**
+     * To set the boundary context error state.
+     */
+    setShowBoundaryErrors?: (showBoundaryErrors: boolean) => void;
     /**
      * To set the local error state.
      */

package/es/extensions/forms/DataContext/FieldBoundary/FieldBoundaryContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldBoundaryContext.js","names":["React","FieldBoundaryContext","createContext","undefined"],"sources":["../../../../../../src/extensions/forms/DataContext/FieldBoundary/FieldBoundaryContext.ts"],"sourcesContent":["import React from 'react'\nimport { Path } from '../../types'\n\nexport interface FieldBoundaryContextState {\n  /**\n   * Will be set to true when one or more nested fields are in error state.\n   */\n  hasError?: boolean\n\n  /**\n   * Will be set to true when the inherited data context has submit errors and the `hasError` has errors as well.\n   */\n  hasSubmitError?: boolean\n\n  /**\n   * Will be set to true when a nested field contains a visible error.\n   */\n  hasVisibleError?: boolean\n\n  /**\n   * Contains the nested field errors.\n   */\n  errorsRef?: React.RefObject<unknown>\n\n  /**\n   * To set the local error state.\n   */\n  setFieldError?: (path: Path, error: Error) => void\n}\n\nconst FieldBoundaryContext = React.createContext<\n  FieldBoundaryContextState | undefined\n>(undefined)\n\nexport default FieldBoundaryContext\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AA8BzB,MAAMC,oBAAoB,GAAGD,KAAK,CAACE,aAAa,CAE9CC,SAAS,CAAC;AAEZ,eAAeF,oBAAoB"}
+{"version":3,"file":"FieldBoundaryContext.js","names":["React","FieldBoundaryContext","createContext","undefined"],"sources":["../../../../../../src/extensions/forms/DataContext/FieldBoundary/FieldBoundaryContext.ts"],"sourcesContent":["import React from 'react'\nimport { Path } from '../../types'\n\nexport interface FieldBoundaryContextState {\n  /**\n   * Will be set to true when one or more nested fields are in error state.\n   */\n  hasError?: boolean\n\n  /**\n   * Will be set to true when the inherited data context has submit errors and the `hasError` has errors as well.\n   */\n  hasSubmitError?: boolean\n\n  /**\n   * Will be set to true when a nested field contains a visible error.\n   */\n  hasVisibleError?: boolean\n\n  /**\n   * Contains the nested field errors.\n   */\n  errorsRef?: React.RefObject<unknown>\n\n  /**\n   * Will be set to true when the boundary context error state should be shown.\n   */\n  showBoundaryErrors?: boolean\n\n  /**\n   * To set the boundary context error state.\n   */\n  setShowBoundaryErrors?: (showBoundaryErrors: boolean) => void\n\n  /**\n   * To set the local error state.\n   */\n  setFieldError?: (path: Path, error: Error) => void\n}\n\nconst FieldBoundaryContext = React.createContext<\n  FieldBoundaryContextState | undefined\n>(undefined)\n\nexport default FieldBoundaryContext\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAwCzB,MAAMC,oBAAoB,GAAGD,KAAK,CAACE,aAAa,CAE9CC,SAAS,CAAC;AAEZ,eAAeF,oBAAoB"}

package/es/extensions/forms/DataContext/FieldBoundary/FieldBoundaryProvider.js

@@ -1,16 +1,18 @@
 "use client";
 
-import React, { useCallback, useContext, useRef } from 'react';
+import React, { useCallback, useContext, useReducer, useRef } from 'react';
 import FieldBoundaryContext from './FieldBoundaryContext';
 import DataContext from '../Context';
 export default function FieldBoundaryProvider({
   children
 }) {
+  const [, forceUpdate] = useReducer(() => ({}), {});
   const {
     showAllErrors,
     hasVisibleError
   } = useContext(DataContext);
   const errorsRef = useRef({});
+  const showBoundaryErrorsRef = useRef(false);
   const hasError = Object.keys(errorsRef.current || {}).length > 0;
   const hasSubmitError = showAllErrors && hasError;
   const setFieldError = useCallback((path, error) => {
@@ -21,11 +23,17 @@ export default function FieldBoundaryProvider({
       (_errorsRef$current = errorsRef.current) === null || _errorsRef$current === void 0 ? true : delete _errorsRef$current[path];
     }
   }, []);
+  const setShowBoundaryErrors = useCallback(showBoundaryErrors => {
+    showBoundaryErrorsRef.current = showBoundaryErrors;
+    forceUpdate();
+  }, []);
   const context = {
     hasError,
     hasSubmitError,
     hasVisibleError,
     errorsRef,
+    showBoundaryErrors: showBoundaryErrorsRef.current,
+    setShowBoundaryErrors,
     setFieldError
   };
   return React.createElement(FieldBoundaryContext.Provider, {

package/es/extensions/forms/DataContext/FieldBoundary/FieldBoundaryProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldBoundaryProvider.js","names":["React","useCallback","useContext","useRef","FieldBoundaryContext","DataContext","FieldBoundaryProvider","children","showAllErrors","hasVisibleError","errorsRef","hasError","Object","keys","current","length","hasSubmitError","setFieldError","path","error","_errorsRef$current","context","createElement","Provider","value"],"sources":["../../../../../../src/extensions/forms/DataContext/FieldBoundary/FieldBoundaryProvider.tsx"],"sourcesContent":["import React, { useCallback, useContext, useRef } from 'react'\nimport FieldBoundaryContext, {\n  FieldBoundaryContextState,\n} from './FieldBoundaryContext'\nimport DataContext from '../Context'\nimport { Path } from '../../types'\n\nexport default function FieldBoundaryProvider({ children }) {\n  const { showAllErrors, hasVisibleError } = useContext(DataContext)\n\n  const errorsRef = useRef<Record<Path, boolean>>({})\n  const hasError = Object.keys(errorsRef.current || {}).length > 0\n  const hasSubmitError = showAllErrors && hasError\n\n  const setFieldError = useCallback((path: Path, error: Error) => {\n    if (error) {\n      errorsRef.current[path] = !!error\n    } else {\n      delete errorsRef.current?.[path]\n    }\n  }, [])\n\n  const context: FieldBoundaryContextState = {\n    hasError,\n    hasSubmitError,\n    hasVisibleError,\n    errorsRef,\n    setFieldError,\n  }\n\n  return (\n    <FieldBoundaryContext.Provider value={context}>\n      {children}\n    </FieldBoundaryContext.Provider>\n  )\n}\n"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,EAAEC,MAAM,QAAQ,OAAO;AAC9D,OAAOC,oBAAoB,MAEpB,wBAAwB;AAC/B,OAAOC,WAAW,MAAM,YAAY;AAGpC,eAAe,SAASC,qBAAqBA,CAAC;EAAEC;AAAS,CAAC,EAAE;EAC1D,MAAM;IAAEC,aAAa;IAAEC;EAAgB,CAAC,GAAGP,UAAU,CAACG,WAAW,CAAC;EAElE,MAAMK,SAAS,GAAGP,MAAM,CAAwB,CAAC,CAAC,CAAC;EACnD,MAAMQ,QAAQ,GAAGC,MAAM,CAACC,IAAI,CAACH,SAAS,CAACI,OAAO,IAAI,CAAC,CAAC,CAAC,CAACC,MAAM,GAAG,CAAC;EAChE,MAAMC,cAAc,GAAGR,aAAa,IAAIG,QAAQ;EAEhD,MAAMM,aAAa,GAAGhB,WAAW,CAAC,CAACiB,IAAU,EAAEC,KAAY,KAAK;IAC9D,IAAIA,KAAK,EAAE;MACTT,SAAS,CAACI,OAAO,CAACI,IAAI,CAAC,GAAG,CAAC,CAACC,KAAK;IACnC,CAAC,MAAM;MAAA,IAAAC,kBAAA;MACL,CAAAA,kBAAA,GAAOV,SAAS,CAACI,OAAO,cAAAM,kBAAA,qBAAxB,OAAOA,kBAAA,CAAoBF,IAAI,CAAC;IAClC;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,OAAkC,GAAG;IACzCV,QAAQ;IACRK,cAAc;IACdP,eAAe;IACfC,SAAS;IACTO;EACF,CAAC;EAED,OACEjB,KAAA,CAAAsB,aAAA,CAAClB,oBAAoB,CAACmB,QAAQ;IAACC,KAAK,EAAEH;EAAQ,GAC3Cd,QAC4B,CAAC;AAEpC"}
+{"version":3,"file":"FieldBoundaryProvider.js","names":["React","useCallback","useContext","useReducer","useRef","FieldBoundaryContext","DataContext","FieldBoundaryProvider","children","forceUpdate","showAllErrors","hasVisibleError","errorsRef","showBoundaryErrorsRef","hasError","Object","keys","current","length","hasSubmitError","setFieldError","path","error","_errorsRef$current","setShowBoundaryErrors","showBoundaryErrors","context","createElement","Provider","value"],"sources":["../../../../../../src/extensions/forms/DataContext/FieldBoundary/FieldBoundaryProvider.tsx"],"sourcesContent":["import React, { useCallback, useContext, useReducer, useRef } from 'react'\nimport FieldBoundaryContext, {\n  FieldBoundaryContextState,\n} from './FieldBoundaryContext'\nimport DataContext from '../Context'\nimport { Path } from '../../types'\n\nexport default function FieldBoundaryProvider({ children }) {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n  const { showAllErrors, hasVisibleError } = useContext(DataContext)\n\n  const errorsRef = useRef<Record<Path, boolean>>({})\n  const showBoundaryErrorsRef = useRef<boolean>(false)\n  const hasError = Object.keys(errorsRef.current || {}).length > 0\n  const hasSubmitError = showAllErrors && hasError\n\n  const setFieldError = useCallback((path: Path, error: Error) => {\n    if (error) {\n      errorsRef.current[path] = !!error\n    } else {\n      delete errorsRef.current?.[path]\n    }\n  }, [])\n\n  const setShowBoundaryErrors = useCallback(\n    (showBoundaryErrors: boolean) => {\n      showBoundaryErrorsRef.current = showBoundaryErrors\n      forceUpdate()\n    },\n    []\n  )\n\n  const context: FieldBoundaryContextState = {\n    hasError,\n    hasSubmitError,\n    hasVisibleError,\n    errorsRef,\n    showBoundaryErrors: showBoundaryErrorsRef.current,\n    setShowBoundaryErrors,\n    setFieldError,\n  }\n\n  return (\n    <FieldBoundaryContext.Provider value={context}>\n      {children}\n    </FieldBoundaryContext.Provider>\n  )\n}\n"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,EAAEC,UAAU,EAAEC,MAAM,QAAQ,OAAO;AAC1E,OAAOC,oBAAoB,MAEpB,wBAAwB;AAC/B,OAAOC,WAAW,MAAM,YAAY;AAGpC,eAAe,SAASC,qBAAqBA,CAAC;EAAEC;AAAS,CAAC,EAAE;EAC1D,MAAM,GAAGC,WAAW,CAAC,GAAGN,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;EAClD,MAAM;IAAEO,aAAa;IAAEC;EAAgB,CAAC,GAAGT,UAAU,CAACI,WAAW,CAAC;EAElE,MAAMM,SAAS,GAAGR,MAAM,CAAwB,CAAC,CAAC,CAAC;EACnD,MAAMS,qBAAqB,GAAGT,MAAM,CAAU,KAAK,CAAC;EACpD,MAAMU,QAAQ,GAAGC,MAAM,CAACC,IAAI,CAACJ,SAAS,CAACK,OAAO,IAAI,CAAC,CAAC,CAAC,CAACC,MAAM,GAAG,CAAC;EAChE,MAAMC,cAAc,GAAGT,aAAa,IAAII,QAAQ;EAEhD,MAAMM,aAAa,GAAGnB,WAAW,CAAC,CAACoB,IAAU,EAAEC,KAAY,KAAK;IAC9D,IAAIA,KAAK,EAAE;MACTV,SAAS,CAACK,OAAO,CAACI,IAAI,CAAC,GAAG,CAAC,CAACC,KAAK;IACnC,CAAC,MAAM;MAAA,IAAAC,kBAAA;MACL,CAAAA,kBAAA,GAAOX,SAAS,CAACK,OAAO,cAAAM,kBAAA,qBAAxB,OAAOA,kBAAA,CAAoBF,IAAI,CAAC;IAClC;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,qBAAqB,GAAGvB,WAAW,CACtCwB,kBAA2B,IAAK;IAC/BZ,qBAAqB,CAACI,OAAO,GAAGQ,kBAAkB;IAClDhB,WAAW,CAAC,CAAC;EACf,CAAC,EACD,EACF,CAAC;EAED,MAAMiB,OAAkC,GAAG;IACzCZ,QAAQ;IACRK,cAAc;IACdR,eAAe;IACfC,SAAS;IACTa,kBAAkB,EAAEZ,qBAAqB,CAACI,OAAO;IACjDO,qBAAqB;IACrBJ;EACF,CAAC;EAED,OACEpB,KAAA,CAAA2B,aAAA,CAACtB,oBAAoB,CAACuB,QAAQ;IAACC,KAAK,EAAEH;EAAQ,GAC3ClB,QAC4B,CAAC;AAEpC"}

package/es/extensions/forms/DataContext/Provider/Provider.d.ts

@@ -35,13 +35,9 @@ export interface Props<Data extends JsonObject> extends IsolationProviderProps<D
      */
     errorMessages?: CustomErrorMessagesWithPaths;
     /**
-     * Filter the `onSubmit` output data, based on your criteria: `({ path, value, data, props, internal }) => !props?.disabled`. It will iterate on each data entry (/path). Return false to exclude the entry.
+     * @deprecated Use the `filterData` in the second event parameter in the `onSubmit` or `onChange` events.
      */
     filterSubmitData?: FilterData;
-    /**
-     * @deprecated Use `filterSubmitData` instead
-     */
-    filterData?: FilterData;
     /**
      * Transform the data context (internally as well) based on your criteria: `({ path, value, data, props, internal }) => 'new value'`. It will iterate on each data entry (/path).
      */

package/es/extensions/forms/DataContext/Provider/Provider.js

@@ -2,7 +2,7 @@
 
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["id", "globalStatusId", "defaultData", "data", "schema", "onChange", "onPathChange", "onSubmit", "onSubmitRequest", "onSubmitComplete", "onCommit", "onClear", "scrollTopOnSubmit", "minimumAsyncBehaviorTime", "asyncSubmitTimeout", "sessionStorageId", "ajvInstance", "transformIn", "transformOut", "filterSubmitData", "filterData", "locale", "translations", "required", "errorMessages", "isolate", "children"];
+const _excluded = ["id", "globalStatusId", "defaultData", "data", "schema", "onChange", "onPathChange", "onSubmit", "onSubmitRequest", "onSubmitComplete", "onCommit", "onClear", "scrollTopOnSubmit", "minimumAsyncBehaviorTime", "asyncSubmitTimeout", "sessionStorageId", "ajvInstance", "transformIn", "transformOut", "filterSubmitData", "locale", "translations", "required", "errorMessages", "isolate", "children"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { useRef, useMemo, useCallback, useReducer, useEffect, useContext } from 'react';
@@ -43,7 +43,6 @@ export default function Provider(props) {
       transformIn,
       transformOut,
       filterSubmitData,
-      filterData,
       locale,
       translations,
       required,
@@ -238,12 +237,15 @@ export default function Provider(props) {
     }
     return data;
   }, []);
-  const filterDataHandler = useCallback((data, filter = filterData || filterSubmitData) => {
+  const filterDataHandler = useCallback((data, filter) => {
     if (filter) {
       return mutateDataHandler(data, filter, true);
     }
     return data;
-  }, [filterData, filterSubmitData, mutateDataHandler]);
+  }, [mutateDataHandler]);
+  const filterData = useCallback((filter, data = internalDataRef.current) => {
+    return filterDataHandler(data, filter);
+  }, [filterDataHandler]);
   const fieldPropsRef = useRef({});
   const valuePropsRef = useRef({});
   const setFieldProps = useCallback((path, props) => {
@@ -325,11 +327,11 @@ export default function Provider(props) {
         setShowAllErrors,
         setSubmitState
       });
-      if (filterData || filterSubmitData) {
+      if (filterSubmitData) {
         rerenderUseDataHook === null || rerenderUseDataHook === void 0 ? void 0 : rerenderUseDataHook();
       }
     }
-  }, [extendAttachment, filterData, filterDataHandler, filterSubmitData, hasErrors, hasFieldError, id, rerenderUseDataHook, setShowAllErrors, setSubmitState]);
+  }, [extendAttachment, filterDataHandler, filterSubmitData, hasErrors, hasFieldError, id, rerenderUseDataHook, setShowAllErrors, setSubmitState]);
   const storeInSession = useMemo(() => {
     return debounce(() => {
       var _window$sessionStorag2;
@@ -357,7 +359,7 @@ export default function Provider(props) {
     internalDataRef.current = newData;
     if (id) {
       extendSharedData === null || extendSharedData === void 0 ? void 0 : extendSharedData(newData);
-      if (filterData || filterSubmitData) {
+      if (filterSubmitData) {
         rerenderUseDataHook === null || rerenderUseDataHook === void 0 ? void 0 : rerenderUseDataHook();
       }
     }
@@ -365,7 +367,7 @@ export default function Provider(props) {
       storeInSession();
     }
     forceUpdate();
-  }, [extendSharedData, filterData, filterSubmitData, id, mutateDataHandler, rerenderUseDataHook, sessionStorageId, storeInSession, transformIn]);
+  }, [extendSharedData, filterSubmitData, id, mutateDataHandler, rerenderUseDataHook, sessionStorageId, storeInSession, transformIn]);
   const setData = useCallback(newData => {
     internalDataRef.current = newData;
     forceUpdate();
@@ -391,19 +393,22 @@ export default function Provider(props) {
     showAllErrorsRef.current = false;
     validateData();
     const data = internalDataRef.current;
+    const options = {
+      filterData
+    };
     const transformedData = transformOut ? mutateDataHandler(data, transformOut) : data;
     for (const cb of changeHandlerStackRef.current) {
       if (isAsync(onChange)) {
-        await cb(transformedData);
+        await cb(transformedData, options);
       } else {
-        cb(transformedData);
+        cb(transformedData, options);
       }
     }
     if (isAsync(onChange)) {
-      return await onChange(transformedData);
+      return await onChange(transformedData, options);
     }
-    return onChange === null || onChange === void 0 ? void 0 : onChange(transformedData);
-  }, [handlePathChangeUnvalidated, mutateDataHandler, onChange, transformOut, validateData]);
+    return onChange === null || onChange === void 0 ? void 0 : onChange(transformedData, options);
+  }, [filterData, handlePathChangeUnvalidated, mutateDataHandler, onChange, transformOut, validateData]);
   const changeHandlerStackRef = useRef([]);
   const addOnChangeHandler = useCallback(callback => {
     const exists = changeHandlerStackRef.current.some(cb => {
@@ -470,13 +475,7 @@ export default function Provider(props) {
       let result;
       try {
         if (isolate) {
-          const mounterData = {};
-          mountedFieldPathsRef.current.forEach(path => {
-            if (pointer.has(internalDataRef.current, path)) {
-              pointer.set(mounterData, path, pointer.get(internalDataRef.current, path));
-            }
-          });
-          result = await (onCommit === null || onCommit === void 0 ? void 0 : onCommit(mounterData, {
+          result = await (onCommit === null || onCommit === void 0 ? void 0 : onCommit(internalDataRef.current, {
             clearData
           }));
         } else {
@@ -520,15 +519,36 @@ export default function Provider(props) {
     }
     return internalDataRef.current;
   }, [clearData, hasErrors, hasFieldState, hasFieldWithAsyncValidator, isolate, onCommit, onSubmitRequest, setFormState, setShowAllErrors, setSubmitState]);
+  const handleSubmitListenersRef = useRef([]);
+  const setHandleSubmit = useCallback(callback => {
+    if (!handleSubmitListenersRef.current.includes(callback)) {
+      handleSubmitListenersRef.current.push(callback);
+    }
+  }, []);
+  const handleSubmitListeners = useCallback(() => {
+    let stop = false;
+    const preventSubmit = () => stop = true;
+    handleSubmitListenersRef.current.forEach(cb => {
+      cb({
+        preventSubmit
+      });
+    });
+    return stop;
+  }, []);
   const handleSubmit = useCallback(async ({
     formElement = null
   } = {}) => {
     handleSubmitCall({
       enableAsyncBehaviour: isAsync(onSubmit),
       onSubmit: async () => {
+        if (handleSubmitListeners()) {
+          return;
+        }
         const data = internalDataRef.current;
-        const filteredData = filterDataHandler(transformOut ? mutateDataHandler(data, transformOut) : data);
-        const opts = {
+        const mutatedData = transformOut ? mutateDataHandler(data, transformOut) : data;
+        const filteredData = filterSubmitData ? filterDataHandler(mutatedData, filterSubmitData) : mutatedData;
+        const options = {
+          filterData,
           resetForm: () => {
             var _formElement$reset;
             formElement === null || formElement === void 0 ? void 0 : (_formElement$reset = formElement.reset) === null || _formElement$reset === void 0 ? void 0 : _formElement$reset.call(formElement);
@@ -543,9 +563,9 @@ export default function Provider(props) {
         };
         let result = undefined;
         if (isAsync(onSubmit)) {
-          result = await onSubmit(filteredData, opts);
+          result = await onSubmit(filteredData, options);
         } else {
-          result = onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(filteredData, opts);
+          result = onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(filteredData, options);
         }
         const completeResult = await (onSubmitComplete === null || onSubmitComplete === void 0 ? void 0 : onSubmitComplete(filteredData, result));
         if (completeResult) {
@@ -557,7 +577,7 @@ export default function Provider(props) {
         return result;
       }
     });
-  }, [clearData, filterDataHandler, handleSubmitCall, mutateDataHandler, onSubmit, onSubmitComplete, scrollToTop, scrollTopOnSubmit, sessionStorageId, transformOut]);
+  }, [clearData, filterData, filterDataHandler, filterSubmitData, handleSubmitCall, handleSubmitListeners, mutateDataHandler, onSubmit, onSubmitComplete, scrollToTop, scrollTopOnSubmit, sessionStorageId, transformOut]);
   const fieldEventListenersRef = useRef([]);
   const setFieldEventListener = useCallback((path, type, callback) => {
     fieldEventListenersRef.current = fieldEventListenersRef.current.filter(({
@@ -638,6 +658,7 @@ export default function Provider(props) {
       setData,
       filterDataHandler,
       addOnChangeHandler,
+      setHandleSubmit,
       scrollToTop,
       schema,
       disabled,
@@ -651,6 +672,7 @@ export default function Provider(props) {
       hasVisibleError: Object.keys(hasVisibleErrorRef.current).length > 0,
       fieldPropsRef,
       valuePropsRef,
+      mountedFieldPathsRef,
       ajvInstance: ajvRef.current,
       id,
       data: internalDataRef.current,