@dnb/eufemia 10.43.0 → 10.45.0

package/cjs/components/upload/UploadInfo.js

@@ -12,7 +12,14 @@ var _Dl = _interopRequireDefault(require("../../elements/Dl"));
 var _Dt = _interopRequireDefault(require("../../elements/Dt"));
 var _Dd = _interopRequireDefault(require("../../elements/Dd"));
 var _NumberUtils = require("../number-format/NumberUtils");
+var _UploadVerify = require("./UploadVerify");
+var _Table = _interopRequireDefault(require("../Table"));
+var _TableTr = _interopRequireDefault(require("../table/TableTr"));
+var _TableTh = _interopRequireDefault(require("../table/TableTh"));
+var _TableTd = _interopRequireDefault(require("../table/TableTd"));
+var _UploadInfoAcceptedFi;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const prettifyAcceptedFileFormats = acceptedFileTypes => acceptedFileTypes.sort().join(', ').toUpperCase();
 const UploadInfo = () => {
   const context = _react.default.useContext(_UploadContext.UploadContext);
   const {
@@ -27,19 +34,64 @@ const UploadInfo = () => {
     fileMaxSize,
     children
   } = context;
-  const prettifiedAcceptedFileFormats = acceptedFileTypes.join(', ').toUpperCase();
+  const prettifiedAcceptedFileFormats = prettifyAcceptedFileFormats(acceptedFileTypes);
+  const isAcceptedFileTypeListOfStrings = (0, _UploadVerify.isArrayOfStrings)(acceptedFileTypes);
+  const displayAcceptedFileFormatsListItem = isAcceptedFileTypeListOfStrings && prettifiedAcceptedFileFormats;
+  const displayFileMaxSizeItem = isAcceptedFileTypeListOfStrings && fileMaxSize;
+  const displayFilesAmountLimitItem = filesAmountLimit < _UploadContext.defaultProps.filesAmountLimit;
+  const displayAcceptedFileFormatsTable = (0, _UploadVerify.isArrayOfObjects)(acceptedFileTypes);
+  const displayDl = displayAcceptedFileFormatsListItem || displayFileMaxSizeItem || displayFilesAmountLimitItem;
   return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Lead.default, {
     space: "0"
   }, title), _react.default.createElement(_P.default, {
     top: "xx-small",
     className: "dnb-upload__text"
-  }, text), children, _react.default.createElement(_Dl.default, {
+  }, text), children, displayDl && _react.default.createElement(_Dl.default, {
     top: "small",
     bottom: 0,
-    layout: "horizontal",
-    className: "dnb-upload__condition-list"
-  }, prettifiedAcceptedFileFormats && _react.default.createElement(_Dl.default.Item, null, _react.default.createElement(_Dt.default, null, fileTypeDescription), _react.default.createElement(_Dd.default, null, prettifiedAcceptedFileFormats)), _react.default.createElement(_Dl.default.Item, null, _react.default.createElement(_Dt.default, null, fileSizeDescription), _react.default.createElement(_Dd.default, null, String(fileSizeContent).replace('%size', (0, _NumberUtils.format)(fileMaxSize).toString()))), filesAmountLimit < _UploadContext.defaultProps.filesAmountLimit && _react.default.createElement(_Dl.default.Item, null, _react.default.createElement(_Dt.default, null, fileAmountDescription), _react.default.createElement(_Dd.default, null, filesAmountLimit))));
+    layout: "horizontal"
+  }, displayAcceptedFileFormatsListItem && _react.default.createElement(_Dl.default.Item, null, _react.default.createElement(_Dt.default, null, fileTypeDescription), _react.default.createElement(_Dd.default, null, prettifiedAcceptedFileFormats)), displayFileMaxSizeItem && _react.default.createElement(_Dl.default.Item, null, _react.default.createElement(_Dt.default, null, fileSizeDescription), _react.default.createElement(_Dd.default, null, String(fileSizeContent).replace('%size', (0, _NumberUtils.format)(fileMaxSize).toString()))), displayFilesAmountLimitItem && _react.default.createElement(_Dl.default.Item, null, _react.default.createElement(_Dt.default, null, fileAmountDescription), _react.default.createElement(_Dd.default, null, filesAmountLimit))), displayAcceptedFileFormatsTable && (_UploadInfoAcceptedFi || (_UploadInfoAcceptedFi = _react.default.createElement(UploadInfoAcceptedFileTypesTable, null))));
 };
+function UploadInfoAcceptedFileTypesTable() {
+  const context = _react.default.useContext(_UploadContext.UploadContext);
+  const {
+    acceptedFileTypes,
+    fileTypeTableCaption,
+    fileTypeDescription,
+    fileSizeDescription,
+    fileSizeContent,
+    fileMaxSize
+  } = context;
+  const groupByFileMaxSize = (acceptedFileTypes, fallBackFileMaxSize) => {
+    const fileMaxSizeIsFalseOrZero = fileMaxSize => {
+      return fileMaxSize === false || fileMaxSize === 0;
+    };
+    const group = {};
+    acceptedFileTypes.forEach(item => {
+      const itemFileMaxSize = item.fileMaxSize;
+      const groupName = itemFileMaxSize ? itemFileMaxSize : fileMaxSizeIsFalseOrZero(itemFileMaxSize) ? 0 : fileMaxSizeIsFalseOrZero(fallBackFileMaxSize) ? 0 : fallBackFileMaxSize;
+      group[groupName] = group[groupName] || [];
+      group[groupName].push(item);
+    });
+    return group;
+  };
+  const acceptedFileTypesGroupedByFileMaxSize = groupByFileMaxSize(acceptedFileTypes, fileMaxSize);
+  return _react.default.createElement(_Table.default, {
+    border: true,
+    className: "dnb-upload__accepted-file-types-table",
+    size: "small"
+  }, _react.default.createElement("caption", {
+    className: "dnb-sr-only"
+  }, fileTypeTableCaption), _react.default.createElement("thead", null, _react.default.createElement(_TableTr.default, {
+    variant: "odd",
+    cellSpacing: 0
+  }, _react.default.createElement(_TableTh.default, null, fileTypeDescription), _react.default.createElement(_TableTh.default, null, fileSizeDescription))), _react.default.createElement("tbody", null, Object.keys(acceptedFileTypesGroupedByFileMaxSize).sort((a, b) => Number(b) - Number(a)).map(key => {
+    return _react.default.createElement(_TableTr.default, {
+      variant: "odd",
+      key: key
+    }, _react.default.createElement(_TableTd.default, null, prettifyAcceptedFileFormats(acceptedFileTypesGroupedByFileMaxSize[key].map(acceptedFileTypesObj => acceptedFileTypesObj.fileType))), _react.default.createElement(_TableTd.default, null, key !== '0' && String(fileSizeContent).replace('%size', (0, _NumberUtils.format)(key).toString())));
+  })));
+}
 var _default = UploadInfo;
 exports.default = _default;
 //# sourceMappingURL=UploadInfo.js.map

package/cjs/components/upload/UploadInfo.js.map

@@ -1 +1 @@
-{"version":3,"file":"UploadInfo.js","names":["_react","_interopRequireDefault","require","_UploadContext","_Lead","_P","_Dl","_Dt","_Dd","_NumberUtils","obj","__esModule","default","UploadInfo","context","React","useContext","UploadContext","title","text","acceptedFileTypes","fileTypeDescription","fileSizeDescription","fileAmountDescription","fileSizeContent","filesAmountLimit","fileMaxSize","children","prettifiedAcceptedFileFormats","join","toUpperCase","createElement","Fragment","space","top","className","bottom","layout","Item","String","replace","format","toString","defaultProps","_default","exports"],"sources":["../../../../src/components/upload/UploadInfo.tsx"],"sourcesContent":["import React from 'react'\nimport { defaultProps, UploadContext } from './UploadContext'\nimport Lead from '../../elements/Lead'\nimport P from '../../elements/P'\nimport Dl from '../../elements/Dl'\nimport Dt from '../../elements/Dt'\nimport Dd from '../../elements/Dd'\nimport { format } from '../number-format/NumberUtils'\n\nconst UploadInfo = () => {\n  const context = React.useContext(UploadContext)\n\n  const {\n    title,\n    text,\n    acceptedFileTypes,\n    fileTypeDescription,\n    fileSizeDescription,\n    fileAmountDescription,\n    fileSizeContent,\n    filesAmountLimit,\n    fileMaxSize,\n    children,\n  } = context\n\n  const prettifiedAcceptedFileFormats = acceptedFileTypes\n    .join(', ')\n    .toUpperCase()\n\n  return (\n    <>\n      <Lead space=\"0\">{title}</Lead>\n\n      <P top=\"xx-small\" className=\"dnb-upload__text\">\n        {text}\n      </P>\n\n      {children}\n\n      <Dl\n        top=\"small\"\n        bottom={0}\n        layout=\"horizontal\"\n        className=\"dnb-upload__condition-list\"\n      >\n        {prettifiedAcceptedFileFormats && (\n          <Dl.Item>\n            <Dt>{fileTypeDescription}</Dt>\n            <Dd>{prettifiedAcceptedFileFormats}</Dd>\n          </Dl.Item>\n        )}\n\n        <Dl.Item>\n          <Dt>{fileSizeDescription}</Dt>\n          <Dd>\n            {String(fileSizeContent).replace(\n              '%size',\n              format(fileMaxSize).toString()\n            )}\n          </Dd>\n        </Dl.Item>\n\n        {filesAmountLimit < defaultProps.filesAmountLimit && (\n          <Dl.Item>\n            <Dt>{fileAmountDescription}</Dt>\n            <Dd>{filesAmountLimit}</Dd>\n          </Dl.Item>\n        )}\n      </Dl>\n    </>\n  )\n}\n\nexport default UploadInfo\n"],"mappings":"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"}
+{"version":3,"file":"UploadInfo.js","names":["_react","_interopRequireDefault","require","_UploadContext","_Lead","_P","_Dl","_Dt","_Dd","_NumberUtils","_UploadVerify","_Table","_TableTr","_TableTh","_TableTd","_UploadInfoAcceptedFi","obj","__esModule","default","prettifyAcceptedFileFormats","acceptedFileTypes","sort","join","toUpperCase","UploadInfo","context","React","useContext","UploadContext","title","text","fileTypeDescription","fileSizeDescription","fileAmountDescription","fileSizeContent","filesAmountLimit","fileMaxSize","children","prettifiedAcceptedFileFormats","isAcceptedFileTypeListOfStrings","isArrayOfStrings","displayAcceptedFileFormatsListItem","displayFileMaxSizeItem","displayFilesAmountLimitItem","defaultProps","displayAcceptedFileFormatsTable","isArrayOfObjects","displayDl","createElement","Fragment","space","top","className","bottom","layout","Item","String","replace","format","toString","UploadInfoAcceptedFileTypesTable","fileTypeTableCaption","groupByFileMaxSize","fallBackFileMaxSize","fileMaxSizeIsFalseOrZero","group","forEach","item","itemFileMaxSize","groupName","push","acceptedFileTypesGroupedByFileMaxSize","border","size","variant","cellSpacing","Object","keys","a","b","Number","map","key","acceptedFileTypesObj","fileType","_default","exports"],"sources":["../../../../src/components/upload/UploadInfo.tsx"],"sourcesContent":["import React from 'react'\nimport { defaultProps, UploadContext } from './UploadContext'\nimport Lead from '../../elements/Lead'\nimport P from '../../elements/P'\nimport Dl from '../../elements/Dl'\nimport Dt from '../../elements/Dt'\nimport Dd from '../../elements/Dd'\nimport { format } from '../number-format/NumberUtils'\nimport { isArrayOfObjects, isArrayOfStrings } from './UploadVerify'\nimport Table from '../Table'\nimport Tr from '../table/TableTr'\nimport Th from '../table/TableTh'\nimport Td from '../table/TableTd'\nimport { UploadAcceptedFileTypeObject, UploadProps } from './types'\n\nconst prettifyAcceptedFileFormats = (acceptedFileTypes) =>\n  acceptedFileTypes.sort().join(', ').toUpperCase()\n\nconst UploadInfo = () => {\n  const context = React.useContext(UploadContext)\n\n  const {\n    title,\n    text,\n    acceptedFileTypes,\n    fileTypeDescription,\n    fileSizeDescription,\n    fileAmountDescription,\n    fileSizeContent,\n    filesAmountLimit,\n    fileMaxSize,\n    children,\n  } = context\n\n  const prettifiedAcceptedFileFormats =\n    prettifyAcceptedFileFormats(acceptedFileTypes)\n\n  const isAcceptedFileTypeListOfStrings =\n    isArrayOfStrings(acceptedFileTypes)\n\n  const displayAcceptedFileFormatsListItem =\n    isAcceptedFileTypeListOfStrings && prettifiedAcceptedFileFormats\n\n  const displayFileMaxSizeItem =\n    isAcceptedFileTypeListOfStrings && fileMaxSize\n\n  const displayFilesAmountLimitItem =\n    filesAmountLimit < defaultProps.filesAmountLimit\n\n  const displayAcceptedFileFormatsTable =\n    isArrayOfObjects(acceptedFileTypes)\n\n  const displayDl =\n    displayAcceptedFileFormatsListItem ||\n    displayFileMaxSizeItem ||\n    displayFilesAmountLimitItem\n\n  return (\n    <>\n      <Lead space=\"0\">{title}</Lead>\n\n      <P top=\"xx-small\" className=\"dnb-upload__text\">\n        {text}\n      </P>\n\n      {children}\n\n      {displayDl && (\n        <Dl top=\"small\" bottom={0} layout=\"horizontal\">\n          {displayAcceptedFileFormatsListItem && (\n            <Dl.Item>\n              <Dt>{fileTypeDescription}</Dt>\n              <Dd>{prettifiedAcceptedFileFormats}</Dd>\n            </Dl.Item>\n          )}\n\n          {displayFileMaxSizeItem && (\n            <Dl.Item>\n              <Dt>{fileSizeDescription}</Dt>\n              <Dd>\n                {String(fileSizeContent).replace(\n                  '%size',\n                  format(fileMaxSize).toString()\n                )}\n              </Dd>\n            </Dl.Item>\n          )}\n\n          {displayFilesAmountLimitItem && (\n            <Dl.Item>\n              <Dt>{fileAmountDescription}</Dt>\n              <Dd>{filesAmountLimit}</Dd>\n            </Dl.Item>\n          )}\n        </Dl>\n      )}\n      {displayAcceptedFileFormatsTable && (\n        <UploadInfoAcceptedFileTypesTable />\n      )}\n    </>\n  )\n}\n\nfunction UploadInfoAcceptedFileTypesTable() {\n  const context = React.useContext(UploadContext)\n\n  const {\n    acceptedFileTypes,\n    fileTypeTableCaption,\n    fileTypeDescription,\n    fileSizeDescription,\n    fileSizeContent,\n    fileMaxSize,\n  } = context\n\n  const groupByFileMaxSize = (\n    acceptedFileTypes: UploadProps['acceptedFileTypes'],\n    fallBackFileMaxSize: UploadProps['fileMaxSize']\n  ) => {\n    const fileMaxSizeIsFalseOrZero = (\n      fileMaxSize: UploadProps['fileMaxSize']\n    ) => {\n      return fileMaxSize === false || fileMaxSize === 0\n    }\n\n    const group = {}\n    acceptedFileTypes.forEach((item) => {\n      const itemFileMaxSize = item.fileMaxSize\n      const groupName = itemFileMaxSize\n        ? itemFileMaxSize\n        : fileMaxSizeIsFalseOrZero(itemFileMaxSize)\n        ? 0\n        : fileMaxSizeIsFalseOrZero(fallBackFileMaxSize)\n        ? 0\n        : fallBackFileMaxSize\n\n      group[groupName] = group[groupName] || []\n      group[groupName].push(item)\n    })\n\n    return group\n  }\n\n  const acceptedFileTypesGroupedByFileMaxSize = groupByFileMaxSize(\n    acceptedFileTypes,\n    fileMaxSize\n  )\n\n  return (\n    <Table\n      border\n      className=\"dnb-upload__accepted-file-types-table\"\n      size=\"small\"\n    >\n      <caption className=\"dnb-sr-only\">{fileTypeTableCaption}</caption>\n      <thead>\n        <Tr variant=\"odd\" cellSpacing={0}>\n          <Th>{fileTypeDescription}</Th>\n          <Th>{fileSizeDescription}</Th>\n        </Tr>\n      </thead>\n      <tbody>\n        {Object.keys(acceptedFileTypesGroupedByFileMaxSize)\n          .sort((a, b) => Number(b) - Number(a))\n          .map((key) => {\n            return (\n              <Tr variant=\"odd\" key={key}>\n                <Td>\n                  {prettifyAcceptedFileFormats(\n                    acceptedFileTypesGroupedByFileMaxSize[key].map(\n                      (\n                        acceptedFileTypesObj: UploadAcceptedFileTypeObject\n                      ) => acceptedFileTypesObj.fileType\n                    )\n                  )}\n                </Td>\n                <Td>\n                  {key !== '0' &&\n                    String(fileSizeContent).replace(\n                      '%size',\n                      format(key).toString()\n                    )}\n                </Td>\n              </Tr>\n            )\n          })}\n      </tbody>\n    </Table>\n  )\n}\n\nexport default UploadInfo\n"],"mappings":"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"}

package/cjs/components/upload/UploadVerify.d.ts

@@ -1,9 +1,11 @@
-import { UploadFile, UploadContextProps, UploadAcceptedFileTypes } from './types';
+import { UploadFile, UploadContextProps, UploadAcceptedFileTypes, UploadAcceptedFileTypesWithFileMaxSize } from './types';
 export declare const BYTES_IN_A_MEGA_BYTE = 1048576;
 export declare function verifyFiles(files: UploadFile[], context: Pick<UploadContextProps, 'errorUnsupportedFile' | 'errorLargeFile' | 'acceptedFileTypes' | 'fileMaxSize'>): UploadFile[];
 export declare function getFileTypeFromExtension(file: File): string;
-export declare function getAcceptedFileTypes(acceptedFileTypes: UploadAcceptedFileTypes): string;
+export declare function getAcceptedFileTypes(acceptedFileTypes: UploadAcceptedFileTypes | UploadAcceptedFileTypesWithFileMaxSize): string;
 export declare function hasPreferredMimeType(acceptedFileTypes: UploadAcceptedFileTypes, file: File): boolean;
+export declare function isArrayOfStrings(arr: any): boolean;
+export declare function isArrayOfObjects(arr: any): boolean;
 export declare function extendWithAbbreviation(acceptedFileTypes: UploadAcceptedFileTypes, abbreviations?: {
     jpg: string;
 }): string[];

package/cjs/components/upload/UploadVerify.js

@@ -8,6 +8,8 @@ exports.extendWithAbbreviation = extendWithAbbreviation;
 exports.getAcceptedFileTypes = getAcceptedFileTypes;
 exports.getFileTypeFromExtension = getFileTypeFromExtension;
 exports.hasPreferredMimeType = hasPreferredMimeType;
+exports.isArrayOfObjects = isArrayOfObjects;
+exports.isArrayOfStrings = isArrayOfStrings;
 exports.verifyFiles = verifyFiles;
 var _NumberUtils = require("../number-format/NumberUtils");
 const BYTES_IN_A_MEGA_BYTE = 1048576;
@@ -19,15 +21,34 @@ function verifyFiles(files, context) {
     errorLargeFile,
     errorUnsupportedFile
   } = context;
+  const getFileType = (file, listOfAcceptedFilesTypes) => {
+    return hasPreferredMimeType(listOfAcceptedFilesTypes, file) ? file.type : getFileTypeFromExtension(file) || file.type;
+  };
   const handleSize = file => {
-    return file.size / BYTES_IN_A_MEGA_BYTE > fileMaxSize ? String(errorLargeFile).replace('%size', (0, _NumberUtils.format)(fileMaxSize).toString()) : null;
+    const validateFileSize = (fileSize, maxFileSize) => {
+      if (maxFileSize && fileSize / BYTES_IN_A_MEGA_BYTE > maxFileSize) {
+        return String(errorLargeFile).replace('%size', (0, _NumberUtils.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;
   };
   const handleType = file => {
     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;
@@ -48,11 +69,20 @@ function getFileTypeFromExtension(file) {
   return file.name.includes('.') && file.name.replace(/.*\.([^.]+)$/, '$1') || null;
 }
 function getAcceptedFileTypes(acceptedFileTypes) {
-  return extendWithAbbreviation(acceptedFileTypes).map(type => type.includes('/') ? type : `.${type}`).join(',');
+  return extendWithAbbreviation(getAcceptedFileTypesAsListOfStrings(acceptedFileTypes)).map(type => type.includes('/') ? type : `.${type}`).join(',');
 }
 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);
+}
+function isArrayOfStrings(arr) {
+  return Array.isArray(arr) && arr.length > 0 && arr.every(i => typeof i === 'string');
+}
+function isArrayOfObjects(arr) {
+  return Array.isArray(arr) && arr.length > 0 && arr.every(i => typeof i === 'object');
+}
 function extendWithAbbreviation(acceptedFileTypes) {
   let abbreviations = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
     jpg: 'jpeg'

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

@@ -1 +1 @@
-{"version":3,"file":"UploadVerify.js","names":["_NumberUtils","require","BYTES_IN_A_MEGA_BYTE","exports","verifyFiles","files","context","fileMaxSize","acceptedFileTypes","errorLargeFile","errorUnsupportedFile","handleSize","file","size","String","replace","format","toString","handleType","length","fileType","hasPreferredMimeType","type","getFileTypeFromExtension","foundType","extendWithAbbreviation","some","includes","cleanedFiles","map","item","errorMessage","name","getAcceptedFileTypes","join","split","toLowerCase","abbreviations","arguments","undefined","jpg","list","Object","entries","forEach","_ref","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    return (\n      // Converts from b (binary) to MB (decimal)\n      file.size / BYTES_IN_A_MEGA_BYTE > fileMaxSize\n        ? String(errorLargeFile).replace(\n            '%size',\n            format(fileMaxSize).toString()\n          )\n        : null\n    )\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":["_NumberUtils","require","BYTES_IN_A_MEGA_BYTE","exports","verifyFiles","files","context","fileMaxSize","acceptedFileTypes","errorLargeFile","errorUnsupportedFile","getFileType","file","listOfAcceptedFilesTypes","hasPreferredMimeType","type","getFileTypeFromExtension","handleSize","validateFileSize","fileSize","maxFileSize","String","replace","format","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","arguments","jpg","list","Object","entries","forEach","_ref","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/cjs/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/cjs/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/cjs/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/cjs/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
@@ -22,10 +27,10 @@ export type UploadProps = {
      */
     filesAmountLimit?: number;
     /**
-     * fileMaxSize is max size of each file in MB
+     * Defines the max file size of each file in MB. Use either `0` or `false` to disable.
      * Default: 5 MB
      */
-    fileMaxSize?: number;
+    fileMaxSize?: number | false;
     /**
      * will be called on `files` changes made by the user. Access the files with `{ files }`.
      */
@@ -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/cjs/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   * fileMaxSize is max size of each file in MB\n   * Default: 5 MB\n   */\n  fileMaxSize?: number\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/cjs/extensions/forms/DataContext/Context.d.ts

@@ -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;
@@ -64,16 +67,19 @@ 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;
     ajvInstance: Ajv;
     contextErrorMessages: CustomErrorMessagesWithPaths;
     schema: AllJSONSchemaVersions;
+    path?: Path;
     disabled?: boolean;
     required?: boolean;
     submitState: Partial<EventStateObject>;

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

@@ -1 +1 @@
-{"version":3,"file":"Context.js","names":["_react","_interopRequireDefault","require","_ajv","obj","__esModule","default","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","makeAjvInstance","contextErrorMessages","isInsideFormElement","props","exports","Context","React","createContext","_default"],"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  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,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,IAAA,GAAAD,OAAA;AAAmD,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAiI5C,MAAMG,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,EAAE,IAAAC,oBAAe,EAAC,CAAC;EAC9BC,oBAAoB,EAAE3B,SAAS;EAC/B4B,mBAAmB,EAAE,KAAK;EAC1BC,KAAK,EAAE;AACT,CAAC;AAAAC,OAAA,CAAAjC,mBAAA,GAAAA,mBAAA;AAED,MAAMkC,OAAO,GAAGC,cAAK,CAACC,aAAa,CAAepC,mBAAmB,CAAC;AAAA,IAAAqC,QAAA,GAEvDH,OAAO;AAAAD,OAAA,CAAAlC,OAAA,GAAAsC,QAAA"}
+{"version":3,"file":"Context.js","names":["_react","_interopRequireDefault","require","_ajv","obj","__esModule","default","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","makeAjvInstance","contextErrorMessages","isInsideFormElement","props","exports","Context","React","createContext","_default"],"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: () => 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: (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: 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,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,IAAA,GAAAD,OAAA;AAAmD,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAyI5C,MAAMG,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,EAAE,IAAAC,oBAAe,EAAC,CAAC;EAC9BC,oBAAoB,EAAE3B,SAAS;EAC/B4B,mBAAmB,EAAE,KAAK;EAC1BC,KAAK,EAAE;AACT,CAAC;AAAAC,OAAA,CAAAjC,mBAAA,GAAAA,mBAAA;AAED,MAAMkC,OAAO,GAAGC,cAAK,CAACC,aAAa,CAAepC,mBAAmB,CAAC;AAAA,IAAAqC,QAAA,GAEvDH,OAAO;AAAAD,OAAA,CAAAlC,OAAA,GAAAsC,QAAA"}

package/cjs/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/cjs/extensions/forms/DataContext/FieldBoundary/FieldBoundaryContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldBoundaryContext.js","names":["_react","_interopRequireDefault","require","obj","__esModule","default","FieldBoundaryContext","React","createContext","undefined","_default","exports"],"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,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAyB,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AA8BzB,MAAMG,oBAAoB,GAAGC,cAAK,CAACC,aAAa,CAE9CC,SAAS,CAAC;AAAA,IAAAC,QAAA,GAEGJ,oBAAoB;AAAAK,OAAA,CAAAN,OAAA,GAAAK,QAAA"}
+{"version":3,"file":"FieldBoundaryContext.js","names":["_react","_interopRequireDefault","require","obj","__esModule","default","FieldBoundaryContext","React","createContext","undefined","_default","exports"],"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,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAyB,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAwCzB,MAAMG,oBAAoB,GAAGC,cAAK,CAACC,aAAa,CAE9CC,SAAS,CAAC;AAAA,IAAAC,QAAA,GAEGJ,oBAAoB;AAAAK,OAAA,CAAAN,OAAA,GAAAK,QAAA"}

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

@@ -15,11 +15,13 @@ function FieldBoundaryProvider(_ref) {
   let {
     children
   } = _ref;
+  const [, forceUpdate] = (0, _react.useReducer)(() => ({}), {});
   const {
     showAllErrors,
     hasVisibleError
   } = (0, _react.useContext)(_Context.default);
   const errorsRef = (0, _react.useRef)({});
+  const showBoundaryErrorsRef = (0, _react.useRef)(false);
   const hasError = Object.keys(errorsRef.current || {}).length > 0;
   const hasSubmitError = showAllErrors && hasError;
   const setFieldError = (0, _react.useCallback)((path, error) => {
@@ -30,11 +32,17 @@ function FieldBoundaryProvider(_ref) {
       (_errorsRef$current = errorsRef.current) === null || _errorsRef$current === void 0 ? true : delete _errorsRef$current[path];
     }
   }, []);
+  const setShowBoundaryErrors = (0, _react.useCallback)(showBoundaryErrors => {
+    showBoundaryErrorsRef.current = showBoundaryErrors;
+    forceUpdate();
+  }, []);
   const context = {
     hasError,
     hasSubmitError,
     hasVisibleError,
     errorsRef,
+    showBoundaryErrors: showBoundaryErrorsRef.current,
+    setShowBoundaryErrors,
     setFieldError
   };
   return _react.default.createElement(_FieldBoundaryContext.default.Provider, {

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

@@ -1 +1 @@
-{"version":3,"file":"FieldBoundaryProvider.js","names":["_react","_interopRequireWildcard","require","_FieldBoundaryContext","_interopRequireDefault","_Context","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","FieldBoundaryProvider","_ref","children","showAllErrors","hasVisibleError","useContext","DataContext","errorsRef","useRef","hasError","keys","current","length","hasSubmitError","setFieldError","useCallback","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,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,qBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,QAAA,GAAAD,sBAAA,CAAAF,OAAA;AAAoC,SAAAE,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAT,wBAAAK,GAAA,EAAAI,WAAA,SAAAA,WAAA,IAAAJ,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAQ,KAAA,GAAAL,wBAAA,CAAAC,WAAA,OAAAI,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAT,GAAA,YAAAQ,KAAA,CAAAE,GAAA,CAAAV,GAAA,SAAAW,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAhB,GAAA,QAAAgB,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAnB,GAAA,EAAAgB,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAf,GAAA,EAAAgB,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAhB,GAAA,CAAAgB,GAAA,SAAAL,MAAA,CAAAT,OAAA,GAAAF,GAAA,MAAAQ,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAArB,GAAA,EAAAW,MAAA,YAAAA,MAAA;AAGrB,SAASW,qBAAqBA,CAAAC,IAAA,EAAe;EAAA,IAAd;IAAEC;EAAS,CAAC,GAAAD,IAAA;EACxD,MAAM;IAAEE,aAAa;IAAEC;EAAgB,CAAC,GAAG,IAAAC,iBAAU,EAACC,gBAAW,CAAC;EAElE,MAAMC,SAAS,GAAG,IAAAC,aAAM,EAAwB,CAAC,CAAC,CAAC;EACnD,MAAMC,QAAQ,GAAGlB,MAAM,CAACmB,IAAI,CAACH,SAAS,CAACI,OAAO,IAAI,CAAC,CAAC,CAAC,CAACC,MAAM,GAAG,CAAC;EAChE,MAAMC,cAAc,GAAGV,aAAa,IAAIM,QAAQ;EAEhD,MAAMK,aAAa,GAAG,IAAAC,kBAAW,EAAC,CAACC,IAAU,EAAEC,KAAY,KAAK;IAC9D,IAAIA,KAAK,EAAE;MACTV,SAAS,CAACI,OAAO,CAACK,IAAI,CAAC,GAAG,CAAC,CAACC,KAAK;IACnC,CAAC,MAAM;MAAA,IAAAC,kBAAA;MACL,CAAAA,kBAAA,GAAOX,SAAS,CAACI,OAAO,cAAAO,kBAAA,qBAAxB,OAAOA,kBAAA,CAAoBF,IAAI,CAAC;IAClC;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,OAAkC,GAAG;IACzCV,QAAQ;IACRI,cAAc;IACdT,eAAe;IACfG,SAAS;IACTO;EACF,CAAC;EAED,OACE1C,MAAA,CAAAQ,OAAA,CAAAwC,aAAA,CAAC7C,qBAAA,CAAAK,OAAoB,CAACyC,QAAQ;IAACC,KAAK,EAAEH;EAAQ,GAC3CjB,QAC4B,CAAC;AAEpC"}
+{"version":3,"file":"FieldBoundaryProvider.js","names":["_react","_interopRequireWildcard","require","_FieldBoundaryContext","_interopRequireDefault","_Context","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","FieldBoundaryProvider","_ref","children","forceUpdate","useReducer","showAllErrors","hasVisibleError","useContext","DataContext","errorsRef","useRef","showBoundaryErrorsRef","hasError","keys","current","length","hasSubmitError","setFieldError","useCallback","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":"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"}

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

@@ -1,10 +1,11 @@
 import React from 'react';
 import { JsonObject } from 'json-pointer';
 import { Ajv } from '../../utils/ajv';
-import { CustomErrorMessagesWithPaths, AllJSONSchemaVersions, Path, OnSubmit, OnChange, EventReturnWithStateObject, OnCommit } from '../../types';
+import { CustomErrorMessagesWithPaths, AllJSONSchemaVersions, Path, OnSubmit, OnChange, EventReturnWithStateObject } from '../../types';
+import type { IsolationProviderProps } from '../../Form/Isolation/Isolation';
 import { ContextProps } from '../../../../shared/Context';
 import { FilterData, TransformData } from '../Context';
-export interface Props<Data extends JsonObject> {
+export interface Props<Data extends JsonObject> extends IsolationProviderProps<Data> {
     /**
      * Unique ID to communicate with the hook Form.useData
      */
@@ -57,7 +58,7 @@ export interface Props<Data extends JsonObject> {
     /**
      * Change handler for each value
      */
-    onPathChange?: (path: Path, value: any) => EventReturnWithStateObject | void | Promise<EventReturnWithStateObject | void>;
+    onPathChange?: (path: Path, value: unknown) => EventReturnWithStateObject | void | Promise<EventReturnWithStateObject | void>;
     /**
      * Will emit on a form submit – if validation has passed.
      * You can provide an async function to shows a submit indicator during submit. All form elements will be disabled during the submit.
@@ -75,11 +76,6 @@ export interface Props<Data extends JsonObject> {
      * The result of the onSubmit function
      */
     result: unknown) => EventReturnWithStateObject | void | Promise<EventReturnWithStateObject | void>;
-    /**
-     * Used internally by the Form.Isolation component.
-     * Will emit on a nested form context commit – if validation has passed.
-     */
-    onCommit?: OnCommit<Data>;
     /**
      * Minimum time to display the submit indicator.
      */
@@ -108,10 +104,6 @@ export interface Props<Data extends JsonObject> {
      * Make all fields required
      */
     required?: boolean;
-    /**
-     * Used internally by the Form.Isolation component
-     */
-    isolate?: boolean;
     /**
      * The children of the context provider
      */
@@ -121,4 +113,5 @@ export default function Provider<Data extends JsonObject>(props: Props<Data>): i
 type PathList = string[];
 export declare function addListPath(paths: PathList, path: Path): PathList;
 export declare function removeListPath(paths: PathList, path: Path): PathList;
+export declare const clearedData: Readonly<{}>;
 export {};