@dnb/eufemia 10.61.0 → 10.62.1

package/extensions/forms/Field/Upload/Upload.d.ts

@@ -14,3 +14,4 @@ declare namespace UploadComponent {
     var _supportsSpacingProps: boolean;
 }
 export default UploadComponent;
+export declare function transformFiles(value: UploadValue): UploadValue;

package/extensions/forms/Field/Upload/Upload.js

@@ -48,9 +48,19 @@ function UploadComponent(props) {
   const errorMessages = useMemo(() => ({
     'Field.errorRequired': formsTr.errorRequired
   }), [formsTr.errorRequired]);
+  const fromInput = useCallback(value => {
+    value.forEach((item, index) => {
+      var _item$file;
+      value[index] = item;
+      value[index]['name'] = item['name'] || ((_item$file = item.file) === null || _item$file === void 0 ? void 0 : _item$file.name);
+    });
+    return value;
+  }, []);
   const preparedProps = _objectSpread({
     errorMessages,
-    validateRequired
+    validateRequired,
+    fromInput,
+    toInput: transformFiles
   }, props);
   const _useFieldProps = useFieldProps(preparedProps, {
       executeOnChangeRegardlessOfError: true
@@ -89,15 +99,7 @@ function UploadComponent(props) {
     filesRef.current = files;
   }, [files]);
   useEffect(() => {
-    const hasInvalidFiles = value === null || value === void 0 ? void 0 : value.some(_ref2 => {
-      let {
-        file
-      } = _ref2;
-      return !(file !== null && file !== void 0 && file.name);
-    });
-    if (!hasInvalidFiles) {
-      setFiles(value);
-    }
+    setFiles(value);
   }, [setFiles, value]);
   const handleChangeAsync = useCallback(async existingFiles => {
     var _filesRef$current;
@@ -111,10 +113,10 @@ function UploadComponent(props) {
       const uploadedFiles = updateFileLoadingState(incomingFiles, {
         isLoading: false
       });
-      const indexOfFirstNewFile = filesRef.current.findIndex(_ref3 => {
+      const indexOfFirstNewFile = filesRef.current.findIndex(_ref2 => {
         let {
           id
-        } = _ref3;
+        } = _ref2;
         return id === newFiles[0].id;
       });
       const updatedFiles = [...filesRef.current.slice(0, indexOfFirstNewFile), ...uploadedFiles, ...filesRef.current.slice(indexOfFirstNewFile + newFiles.length)];
@@ -122,11 +124,11 @@ function UploadComponent(props) {
     } else {
       handleChange(existingFiles);
     }
-  }, [files, setFiles, fileHandler, handleChange]);
-  const changeHandler = useCallback(_ref4 => {
+  }, [setFiles, fileHandler, handleChange]);
+  const changeHandler = useCallback(_ref3 => {
     let {
       files
-    } = _ref4;
+    } = _ref3;
     handleBlur();
     handleFocus();
     if (fileHandler) {
@@ -166,4 +168,18 @@ function UploadComponent(props) {
 }
 export default UploadComponent;
 UploadComponent._supportsSpacingProps = true;
+export function transformFiles(value) {
+  if (Array.isArray(value)) {
+    if (value.length === 0) {
+      return undefined;
+    }
+    value.map(item => {
+      if (item !== null && item !== void 0 && item.file && !(item.file instanceof File)) {
+        item['file'] = new File([], item['name']);
+      }
+      return item;
+    });
+  }
+  return value;
+}
 //# sourceMappingURL=Upload.js.map

package/extensions/forms/Field/Upload/Upload.js.map

@@ -1 +1 @@
-{"version":3,"file":"Upload.js","names":["React","useCallback","useEffect","useMemo","useRef","classnames","FieldBlock","useFieldProps","useTranslation","useFormsTranslation","Upload","useUpload","pickSpacingProps","HelpButtonInline","HelpButtonInlineContent","useSharedTranslation","FormError","validateRequired","value","_ref","required","isChanged","error","hasError","some","file","errorMessage","hasFiles","length","undefined","updateFileLoadingState","files","isLoading","arguments","map","_objectSpread","UploadComponent","props","sharedTr","formsTr","errorMessages","errorRequired","preparedProps","_useFieldProps","executeOnChangeRegardlessOfError","id","className","width","widthProp","label","labelDescription","help","htmlAttributes","handleChange","handleFocus","handleBlur","fileHandler","rest","_objectWithoutProperties","_excluded","title","text","acceptedFileTypes","filesAmountLimit","fileMaxSize","skeleton","onFileDelete","onFileClick","setFiles","filesRef","current","hasInvalidFiles","_ref2","name","handleChangeAsync","existingFiles","_filesRef$current","existingFileIds","newFiles","filter","includes","incomingFiles","uploadedFiles","indexOfFirstNewFile","findIndex","_ref3","updatedFiles","slice","changeHandler","_ref4","fieldBlockProps","forId","labelSrOnly","createElement","_extends","onChange","Fragment","contentId","left","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Upload/Upload.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef } from 'react'\nimport classnames from 'classnames'\nimport FieldBlock, {\n  Props as FieldBlockProps,\n  FieldBlockWidth,\n} from '../../FieldBlock'\nimport {\n  useFieldProps,\n  useTranslation as useFormsTranslation,\n} from '../../hooks'\nimport { FieldProps } from '../../types'\nimport Upload, {\n  UploadFile,\n  UploadFileNative,\n  UploadProps,\n} from '../../../../components/Upload'\nimport useUpload from '../../../../components/upload/useUpload'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport HelpButtonInline, {\n  HelpButtonInlineContent,\n} from '../../../../components/help-button/HelpButtonInline'\nimport { useTranslation as useSharedTranslation } from '../../../../shared'\nimport { SpacingProps } from '../../../../shared/types'\nimport { FormError } from '../../utils'\n\nexport type { UploadFile, UploadFileNative }\nexport type UploadValue = Array<UploadFile | UploadFileNative>\nexport type Props = Omit<\n  FieldProps<UploadValue, UploadValue | undefined>,\n  'name'\n> &\n  SpacingProps & {\n    width?: Omit<FieldBlockWidth, 'medium' | 'small'>\n  } & Pick<\n    Partial<UploadProps>,\n    | 'title'\n    | 'text'\n    | 'acceptedFileTypes'\n    | 'filesAmountLimit'\n    | 'fileMaxSize'\n    | 'onFileDelete'\n    | 'onFileClick'\n    | 'skeleton'\n    | 'download'\n  > & {\n    fileHandler?: (\n      newFiles: UploadValue\n    ) => UploadValue | Promise<UploadValue>\n  }\n\nconst validateRequired = (\n  value: UploadValue,\n  { required, isChanged, error }\n) => {\n  const hasError = value?.some((file) => file.errorMessage)\n  if (hasError) {\n    return new FormError('Upload.errorInvalidFiles')\n  }\n\n  const hasFiles = value?.length > 0\n  if (required && ((!isChanged && !hasFiles) || !hasFiles)) {\n    return error\n  }\n\n  return undefined\n}\n\nconst updateFileLoadingState = (\n  files: UploadValue,\n  { isLoading } = { isLoading: false }\n) => {\n  return files.map((file) => ({ ...file, isLoading }))\n}\n\nfunction UploadComponent(props: Props) {\n  const sharedTr = useSharedTranslation().Upload\n  const formsTr = useFormsTranslation().Upload\n\n  const errorMessages = useMemo(\n    () => ({\n      'Field.errorRequired': formsTr.errorRequired,\n    }),\n    [formsTr.errorRequired]\n  )\n\n  const preparedProps = {\n    errorMessages,\n    validateRequired,\n    ...props,\n  }\n\n  const {\n    id,\n    className,\n    width: widthProp = 'stretch',\n    value,\n    label,\n    labelDescription,\n    help,\n    htmlAttributes,\n    handleChange,\n    handleFocus,\n    handleBlur,\n    fileHandler,\n    ...rest\n  } = useFieldProps(preparedProps, {\n    executeOnChangeRegardlessOfError: true,\n  })\n\n  // Upload props\n  const {\n    title = sharedTr.title,\n    text = sharedTr.text,\n    acceptedFileTypes = ['pdf', 'png', 'jpg', 'jpeg'],\n    filesAmountLimit = 100,\n    fileMaxSize = 5,\n    skeleton,\n    onFileDelete,\n    onFileClick,\n  } = rest\n\n  const { files, setFiles } = useUpload(id)\n\n  const filesRef = useRef<Array<UploadFile>>()\n\n  useEffect(() => {\n    filesRef.current = files\n  }, [files])\n\n  useEffect(() => {\n    // Files stored in session storage will not have a property (due to serialization).\n    const hasInvalidFiles = value?.some(({ file }) => !file?.name)\n    if (!hasInvalidFiles) {\n      setFiles(value)\n    }\n  }, [setFiles, value])\n\n  const handleChangeAsync = useCallback(\n    async (existingFiles: UploadValue) => {\n      // Filter out existing files\n      const existingFileIds =\n        filesRef.current?.map((file) => file.id) || []\n      const newFiles = existingFiles.filter(\n        (file) => !existingFileIds.includes(file.id)\n      )\n\n      if (newFiles.length > 0) {\n        // Set loading\n        setFiles([\n          ...filesRef.current,\n          ...updateFileLoadingState(newFiles, { isLoading: true }),\n        ])\n\n        const incomingFiles = await fileHandler(newFiles)\n\n        const uploadedFiles = updateFileLoadingState(incomingFiles, {\n          isLoading: false,\n        })\n\n        const indexOfFirstNewFile = filesRef.current.findIndex(\n          ({ id }) => id === newFiles[0].id\n        )\n\n        const updatedFiles = [\n          ...filesRef.current.slice(0, indexOfFirstNewFile),\n          ...uploadedFiles,\n          ...filesRef.current.slice(indexOfFirstNewFile + newFiles.length),\n        ]\n\n        // Set error, if any\n        handleChange(updatedFiles)\n      } else {\n        handleChange(existingFiles)\n      }\n    },\n    [files, setFiles, fileHandler, handleChange]\n  )\n\n  const changeHandler = useCallback(\n    ({ files }: { files: UploadValue }) => {\n      // Prevents the form-status from showing up\n      handleBlur()\n      handleFocus()\n\n      if (fileHandler) {\n        handleChangeAsync(files)\n      } else {\n        handleChange(files)\n      }\n    },\n    [handleBlur, handleFocus, fileHandler, handleChangeAsync, handleChange]\n  )\n\n  const width = widthProp as FieldBlockWidth\n  const fieldBlockProps: FieldBlockProps = {\n    id,\n    forId: `${id}-input`,\n    labelSrOnly: true,\n    className: classnames('dnb-forms-field-upload', className),\n    width,\n    help: undefined,\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps}>\n      <Upload\n        id={id}\n        acceptedFileTypes={acceptedFileTypes}\n        filesAmountLimit={filesAmountLimit}\n        fileMaxSize={fileMaxSize}\n        skeleton={skeleton}\n        onChange={changeHandler}\n        onFileDelete={onFileDelete}\n        onFileClick={onFileClick}\n        title={label ?? title}\n        text={\n          help ? (\n            <>\n              {labelDescription ?? text}\n              <HelpButtonInline\n                contentId={`${id}-help`}\n                left={text ? 'x-small' : false}\n                help={help}\n              />\n            </>\n          ) : (\n            labelDescription ?? text\n          )\n        }\n        {...htmlAttributes}\n      >\n        {help && (\n          <HelpButtonInlineContent contentId={`${id}-help`} help={help} />\n        )}\n      </Upload>\n    </FieldBlock>\n  )\n}\n\nexport default UploadComponent\n\nUploadComponent._supportsSpacingProps = true\n"],"mappings":"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"}
+{"version":3,"file":"Upload.js","names":["React","useCallback","useEffect","useMemo","useRef","classnames","FieldBlock","useFieldProps","useTranslation","useFormsTranslation","Upload","useUpload","pickSpacingProps","HelpButtonInline","HelpButtonInlineContent","useSharedTranslation","FormError","validateRequired","value","_ref","required","isChanged","error","hasError","some","file","errorMessage","hasFiles","length","undefined","updateFileLoadingState","files","isLoading","arguments","map","_objectSpread","UploadComponent","props","sharedTr","formsTr","errorMessages","errorRequired","fromInput","forEach","item","index","_item$file","name","preparedProps","toInput","transformFiles","_useFieldProps","executeOnChangeRegardlessOfError","id","className","width","widthProp","label","labelDescription","help","htmlAttributes","handleChange","handleFocus","handleBlur","fileHandler","rest","_objectWithoutProperties","_excluded","title","text","acceptedFileTypes","filesAmountLimit","fileMaxSize","skeleton","onFileDelete","onFileClick","setFiles","filesRef","current","handleChangeAsync","existingFiles","_filesRef$current","existingFileIds","newFiles","filter","includes","incomingFiles","uploadedFiles","indexOfFirstNewFile","findIndex","_ref2","updatedFiles","slice","changeHandler","_ref3","fieldBlockProps","forId","labelSrOnly","createElement","_extends","onChange","Fragment","contentId","left","_supportsSpacingProps","Array","isArray","File"],"sources":["../../../../../../src/extensions/forms/Field/Upload/Upload.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef } from 'react'\nimport classnames from 'classnames'\nimport FieldBlock, {\n  Props as FieldBlockProps,\n  FieldBlockWidth,\n} from '../../FieldBlock'\nimport {\n  useFieldProps,\n  useTranslation as useFormsTranslation,\n} from '../../hooks'\nimport { FieldProps } from '../../types'\nimport Upload, {\n  UploadFile,\n  UploadFileNative,\n  UploadProps,\n} from '../../../../components/Upload'\nimport useUpload from '../../../../components/upload/useUpload'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport HelpButtonInline, {\n  HelpButtonInlineContent,\n} from '../../../../components/help-button/HelpButtonInline'\nimport { useTranslation as useSharedTranslation } from '../../../../shared'\nimport { SpacingProps } from '../../../../shared/types'\nimport { FormError } from '../../utils'\n\nexport type { UploadFile, UploadFileNative }\nexport type UploadValue = Array<UploadFile | UploadFileNative>\nexport type Props = Omit<\n  FieldProps<UploadValue, UploadValue | undefined>,\n  'name'\n> &\n  SpacingProps & {\n    width?: Omit<FieldBlockWidth, 'medium' | 'small'>\n  } & Pick<\n    Partial<UploadProps>,\n    | 'title'\n    | 'text'\n    | 'acceptedFileTypes'\n    | 'filesAmountLimit'\n    | 'fileMaxSize'\n    | 'onFileDelete'\n    | 'onFileClick'\n    | 'skeleton'\n    | 'download'\n  > & {\n    fileHandler?: (\n      newFiles: UploadValue\n    ) => UploadValue | Promise<UploadValue>\n  }\n\nconst validateRequired = (\n  value: UploadValue,\n  { required, isChanged, error }\n) => {\n  const hasError = value?.some((file) => file.errorMessage)\n  if (hasError) {\n    return new FormError('Upload.errorInvalidFiles')\n  }\n\n  const hasFiles = value?.length > 0\n  if (required && ((!isChanged && !hasFiles) || !hasFiles)) {\n    return error\n  }\n\n  return undefined\n}\n\nconst updateFileLoadingState = (\n  files: UploadValue,\n  { isLoading } = { isLoading: false }\n) => {\n  return files.map((file) => ({ ...file, isLoading }))\n}\n\nfunction UploadComponent(props: Props) {\n  const sharedTr = useSharedTranslation().Upload\n  const formsTr = useFormsTranslation().Upload\n\n  const errorMessages = useMemo(\n    () => ({\n      'Field.errorRequired': formsTr.errorRequired,\n    }),\n    [formsTr.errorRequired]\n  )\n\n  const fromInput = useCallback((value: UploadValue) => {\n    value.forEach((item, index) => {\n      value[index] = item\n\n      // Store the name in the value, to support session storage (serialization)\n      value[index]['name'] = item['name'] || item.file?.name\n    })\n\n    return value\n  }, [])\n\n  const preparedProps = {\n    errorMessages,\n    validateRequired,\n    fromInput,\n    toInput: transformFiles,\n    ...props,\n  }\n\n  const {\n    id,\n    className,\n    width: widthProp = 'stretch',\n    value,\n    label,\n    labelDescription,\n    help,\n    htmlAttributes,\n    handleChange,\n    handleFocus,\n    handleBlur,\n    fileHandler,\n    ...rest\n  } = useFieldProps(preparedProps, {\n    executeOnChangeRegardlessOfError: true,\n  })\n\n  // Upload props\n  const {\n    title = sharedTr.title,\n    text = sharedTr.text,\n    acceptedFileTypes = ['pdf', 'png', 'jpg', 'jpeg'],\n    filesAmountLimit = 100,\n    fileMaxSize = 5,\n    skeleton,\n    onFileDelete,\n    onFileClick,\n  } = rest\n\n  const { files, setFiles } = useUpload(id)\n\n  const filesRef = useRef<Array<UploadFile>>()\n\n  useEffect(() => {\n    filesRef.current = files\n  }, [files])\n\n  useEffect(() => {\n    setFiles(value)\n  }, [setFiles, value])\n\n  const handleChangeAsync = useCallback(\n    async (existingFiles: UploadValue) => {\n      // Filter out existing files\n      const existingFileIds =\n        filesRef.current?.map((file) => file.id) || []\n      const newFiles = existingFiles.filter(\n        (file) => !existingFileIds.includes(file.id)\n      )\n\n      if (newFiles.length > 0) {\n        // Set loading\n        setFiles([\n          ...filesRef.current,\n          ...updateFileLoadingState(newFiles, { isLoading: true }),\n        ])\n\n        const incomingFiles = await fileHandler(newFiles)\n\n        const uploadedFiles = updateFileLoadingState(incomingFiles, {\n          isLoading: false,\n        })\n\n        const indexOfFirstNewFile = filesRef.current.findIndex(\n          ({ id }) => id === newFiles[0].id\n        )\n\n        const updatedFiles = [\n          ...filesRef.current.slice(0, indexOfFirstNewFile),\n          ...uploadedFiles,\n          ...filesRef.current.slice(indexOfFirstNewFile + newFiles.length),\n        ]\n\n        // Set error, if any\n        handleChange(updatedFiles)\n      } else {\n        handleChange(existingFiles)\n      }\n    },\n    [setFiles, fileHandler, handleChange]\n  )\n\n  const changeHandler = useCallback(\n    ({ files }: { files: UploadValue }) => {\n      // Prevents the form-status from showing up\n      handleBlur()\n      handleFocus()\n\n      if (fileHandler) {\n        handleChangeAsync(files)\n      } else {\n        handleChange(files)\n      }\n    },\n    [handleBlur, handleFocus, fileHandler, handleChangeAsync, handleChange]\n  )\n\n  const width = widthProp as FieldBlockWidth\n  const fieldBlockProps: FieldBlockProps = {\n    id,\n    forId: `${id}-input`,\n    labelSrOnly: true,\n    className: classnames('dnb-forms-field-upload', className),\n    width,\n    help: undefined,\n    ...pickSpacingProps(props),\n  }\n\n  return (\n    <FieldBlock {...fieldBlockProps}>\n      <Upload\n        id={id}\n        acceptedFileTypes={acceptedFileTypes}\n        filesAmountLimit={filesAmountLimit}\n        fileMaxSize={fileMaxSize}\n        skeleton={skeleton}\n        onChange={changeHandler}\n        onFileDelete={onFileDelete}\n        onFileClick={onFileClick}\n        title={label ?? title}\n        text={\n          help ? (\n            <>\n              {labelDescription ?? text}\n              <HelpButtonInline\n                contentId={`${id}-help`}\n                left={text ? 'x-small' : false}\n                help={help}\n              />\n            </>\n          ) : (\n            labelDescription ?? text\n          )\n        }\n        {...htmlAttributes}\n      >\n        {help && (\n          <HelpButtonInlineContent contentId={`${id}-help`} help={help} />\n        )}\n      </Upload>\n    </FieldBlock>\n  )\n}\n\nexport default UploadComponent\n\nUploadComponent._supportsSpacingProps = true\n\nexport function transformFiles(value: UploadValue) {\n  if (Array.isArray(value)) {\n    if (value.length === 0) {\n      return undefined\n    }\n\n    value.map((item) => {\n      if (item?.file && !(item.file instanceof File)) {\n        // To support session storage, we recreated the file blob.\n        item['file'] = new File([], item['name'])\n      }\n      return item\n    })\n  }\n\n  return value\n}\n"],"mappings":"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"}

package/extensions/forms/FieldBlock/FieldBlock.js

@@ -342,6 +342,7 @@ function FieldBlock(props) {
     ref: contentsRef
   }, children), React.createElement(SubmitIndicator, {
     state: fieldState !== null && fieldState !== void 0 ? fieldState : fieldStateRef.current,
+    showLabel: true,
     className: "dnb-forms-field-block__indicator dnb-forms-submit-indicator--inline-wrap"
   }))));
 }

package/extensions/forms/FieldBlock/FieldBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldBlock.js","names":["React","useMemo","useContext","useCallback","useRef","useReducer","useEffect","classnames","FieldBlockContext","DataContext","IterateElementContext","Space","FormLabel","FormStatus","Ul","Li","convertJsxToString","findElementInChildren","useId","HelpButtonInline","HelpButtonInlineContent","SubmitIndicator","createSharedState","useTranslation","FormError","states","FieldBlock","props","_props$id","dataContext","fieldBlockContext","nestedFieldBlockContext","disableStatusSummary","id","forId","sharedData","_Object$assign","Object","assign","data","className","layout","layoutOptions","composition","label","labelProp","labelDescription","labelSuffix","labelSrOnly","help","asFieldset","required","info","warning","error","errorProp","fieldState","disabled","width","contentWidth","labelHeight","align","labelSize","contentClassName","children","rest","_objectWithoutProperties","_excluded","hasCustomWidth","test","String","hasCustomContentWidth","iterateItemContext","index","iterateIndex","blockId","wasUpdated","forceUpdate","mountedFieldsRef","fieldStateRef","stateRecordRef","fieldStateIdsRef","contentsRef","hasInitiallyErrorProp","Boolean","optionalLabelSuffix","Field","labelSuffixText","content","undefined","replace","includes","isValidElement","createElement","Fragment","setInternalRecord","stateId","identifier","type","current","existingIndex","findIndex","item","_objectSpread","push","setBlockRecord","setFieldState","showFieldError","show","map","showInitially","statusContent","statesWithMessages","entries","flatMap","_ref","reduce","acc","cur","existing","find","messages","getMessagesFromError","message","state","width_element","no_animation","process","env","NODE_ENV","globalThis","IS_TEST","found","msg","filter","_ref2","i","arr","length","CombineMessages","mainClasses","gridClasses","enableFieldset","useEnableFieldset","labelProps","element","srOnly","space","size","mainStyle","_lO$minWidth","_lO$maxWidth","style","lO","min","getFieldWidth","minWidth","max","maxWidth","prerenderFieldProps","hasLabelDescription","isFragment","fragmentHasChildren","fragmentHasOnlyUndefinedChildren","hasHelp","title","Provider","value","hasErrorProp","_extends","contentId","breakout","outset","parseFloat","ref","_ref3","result","count","child","_child$props","_child$type","_ref4","translations","errorSummary","stateSummary","_ref5","key","Array","isArray","errors","Error","toString","fragment","Children","isUndefined","toArray","every","_supportsSpacingProps"],"sources":["../../../../../src/extensions/forms/FieldBlock/FieldBlock.tsx"],"sourcesContent":["import React, {\n  useMemo,\n  useContext,\n  useCallback,\n  useRef,\n  useReducer,\n  useEffect,\n} from 'react'\nimport classnames from 'classnames'\nimport FieldBlockContext, {\n  StateWithMessage,\n  StatesWithMessages,\n  FieldErrorIdsRef,\n  MountedFieldsRef,\n  StateRecord,\n  StateMessage,\n  StateTypes,\n  StatusContent,\n  FieldBlockContextProps,\n  StateBasis,\n} from './FieldBlockContext'\nimport DataContext from '../DataContext/Context'\nimport IterateElementContext from '../Iterate/IterateItemContext'\nimport { Space, FormLabel, FormStatus } from '../../../components'\nimport { Ul, Li } from '../../../elements'\nimport {\n  convertJsxToString,\n  findElementInChildren,\n} from '../../../shared/component-helper'\nimport useId from '../../../shared/helpers/useId'\nimport {\n  ComponentProps,\n  FieldProps,\n  SubmitState,\n  Identifier,\n} from '../types'\nimport type { FormLabelAllProps } from '../../../components/FormLabel'\nimport HelpButtonInline, {\n  HelpButtonInlineContent,\n  HelpProps,\n} from '../../../components/help-button/HelpButtonInline'\nimport SubmitIndicator from '../Form/SubmitIndicator/SubmitIndicator'\nimport { createSharedState } from '../../../shared/helpers/useSharedState'\nimport useTranslation from '../hooks/useTranslation'\nimport { FormError } from '../utils'\n\nexport const states: Array<StateTypes> = ['error', 'info', 'warning']\n\n/**\n * The width of a field block\n */\nexport type CustomWidth = `${number}rem`\nexport type FieldBlockWidth =\n  | false\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'stretch'\n  | CustomWidth\nexport type FieldBlockHorizontalLabelWidth =\n  | 'small'\n  | 'medium'\n  | 'large'\n  | CustomWidth\nexport type FieldBlockHorizontalLabelHeight =\n  | 'default'\n  | 'small'\n  | 'medium'\n  | 'large'\n\nexport type SharedFieldBlockProps = {\n  /**\n   * The layout of the field block\n   */\n  layout?: 'vertical' | 'horizontal'\n  /** Use this to set additional options for the layout */\n  layoutOptions?: {\n    width?: FieldBlockHorizontalLabelWidth\n    minWidth?: FieldBlockHorizontalLabelWidth\n    maxWidth?: FieldBlockHorizontalLabelWidth\n  }\n  /**\n   * Main label text for the field\n   */\n  label?: React.ReactNode\n  /**\n   * Will append an additional text to the label, like \"(optional)\" or \"(recommended)\"\n   */\n  labelSuffix?: React.ReactNode\n  /**\n   * A more discreet text displayed beside the label\n   */\n  labelDescription?: React.ReactNode\n  /**\n   * Width of outer block element\n   */\n  width?: FieldBlockWidth\n  /**\n   * Width of contents block, while label etc can be wider if space is available\n   */\n  contentWidth?: FieldBlockWidth\n  /**\n   * Provide help content for the field.\n   */\n  help?: HelpProps\n}\n\nexport type Props = SharedFieldBlockProps &\n  Pick<\n    FieldProps,\n    keyof ComponentProps | 'info' | 'warning' | 'error' | 'disabled'\n  > & {\n    /** The id to link a element with */\n    forId?: string\n    /** Use true if you have more than one form element */\n    asFieldset?: boolean\n    /** use `true` to make the label only readable by screen readers. */\n    labelSrOnly?: boolean\n    /** Defines the layout of nested fields */\n    composition?: FieldBlockContextProps['composition']\n    /** For composition only: Align the contents vertically */\n    align?: 'center' | 'bottom'\n    /** Class name for the contents block */\n    contentClassName?: string\n    /** To show the SubmitIndicator during async validation */\n    fieldState?: SubmitState\n    /** Typography size */\n    labelSize?: 'medium' | 'large'\n    /** Defines the height of an component (size prop), so the label can be aligned correctly */\n    labelHeight?: FieldBlockHorizontalLabelHeight\n    /** Disable the error summary for this field block */\n    disableStatusSummary?: boolean\n    /** For internal use only */\n    required?: boolean\n    children?: React.ReactNode\n  } & React.HTMLAttributes<HTMLDivElement>\n\nfunction FieldBlock(props: Props) {\n  const dataContext = useContext(DataContext)\n  const fieldBlockContext = useContext(FieldBlockContext)\n  const nestedFieldBlockContext = !fieldBlockContext?.disableStatusSummary\n    ? fieldBlockContext\n    : null\n\n  const id = useId(props.id ?? props.forId)\n  const sharedData = createSharedState<Props>('field-block-props-' + id)\n  const {\n    className,\n    forId,\n    layout = 'vertical',\n    layoutOptions,\n    composition,\n    label: labelProp,\n    labelDescription,\n    labelSuffix,\n    labelSrOnly,\n    help,\n    asFieldset,\n    required,\n    info,\n    warning,\n    error: errorProp,\n    disableStatusSummary,\n    fieldState,\n    disabled,\n    width,\n    contentWidth,\n    labelHeight,\n    align,\n    labelSize,\n    contentClassName,\n    children,\n    ...rest\n  } = Object.assign({}, sharedData.data, props)\n  const hasCustomWidth = /\\d(rem)$/.test(String(width))\n  const hasCustomContentWidth = /\\d(rem)$/.test(String(contentWidth))\n\n  const iterateItemContext = useContext(IterateElementContext)\n  const { index: iterateIndex } = iterateItemContext ?? {}\n\n  const blockId = useId(props.id)\n  const [wasUpdated, forceUpdate] = useReducer(() => ({}), {})\n  const mountedFieldsRef = useRef<MountedFieldsRef>({})\n  const fieldStateRef = useRef<SubmitState>(null)\n  const stateRecordRef = useRef<StateRecord>({})\n  const fieldStateIdsRef = useRef<FieldErrorIdsRef>(null)\n  const contentsRef = useRef<HTMLDivElement>(null)\n  const hasInitiallyErrorProp = useMemo(() => {\n    return Boolean(errorProp)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  const { optionalLabelSuffix } = useTranslation().Field\n  const labelSuffixText = useMemo(() => {\n    if (required === false || typeof labelSuffix !== 'undefined') {\n      return labelSuffix ?? optionalLabelSuffix\n    }\n    return ''\n  }, [required, labelSuffix, optionalLabelSuffix])\n\n  const label = useMemo(() => {\n    let content = labelProp\n\n    if (iterateIndex !== undefined) {\n      content = convertJsxToString(labelProp).replace(\n        '{itemNo}',\n        String(iterateIndex + 1)\n      )\n    }\n\n    if (labelSuffixText) {\n      if (convertJsxToString(content).includes(optionalLabelSuffix)) {\n        return content\n      }\n\n      if (typeof content === 'string') {\n        return content + ' ' + labelSuffixText\n      }\n\n      if (React.isValidElement(content)) {\n        return (\n          <>\n            {content}\n            {' '}\n            {labelSuffixText}\n          </>\n        )\n      }\n    }\n\n    return content\n  }, [iterateIndex, labelProp, labelSuffixText, optionalLabelSuffix])\n\n  const setInternalRecord = useCallback((props: StateBasis) => {\n    const { stateId, identifier, type } = props\n\n    if (!stateRecordRef.current[identifier]) {\n      stateRecordRef.current[identifier] = []\n    }\n\n    fieldStateIdsRef.current = { error: null, warning: null, info: null }\n\n    const existingIndex = stateRecordRef.current[identifier].findIndex(\n      (item) => {\n        return item.stateId === stateId && item.type === type\n      }\n    )\n\n    if (existingIndex > -1) {\n      stateRecordRef.current[identifier][existingIndex] = {\n        ...stateRecordRef.current[identifier][existingIndex],\n        ...props,\n      }\n    } else {\n      stateRecordRef.current[identifier].push(props)\n    }\n  }, [])\n\n  const setBlockRecord = useCallback(\n    (props: StateBasis) => {\n      if (nestedFieldBlockContext) {\n        // If this FieldBlock is inside another one, forward the call to the outer one\n        nestedFieldBlockContext.setBlockRecord(props)\n        return\n      }\n\n      setInternalRecord(props)\n\n      forceUpdate()\n    },\n    [nestedFieldBlockContext, setInternalRecord]\n  )\n\n  const setFieldState = useCallback(\n    (identifier: Identifier, fieldState: SubmitState) => {\n      if (fieldState !== fieldStateRef.current) {\n        fieldStateRef.current = fieldState\n\n        forceUpdate()\n      }\n    },\n    []\n  )\n\n  const showFieldError = useCallback(\n    (identifier: Identifier, show: boolean) => {\n      if (nestedFieldBlockContext) {\n        // If this FieldBlock is inside another one, forward the call to the outer one\n        nestedFieldBlockContext.showFieldError(identifier, show)\n        return\n      }\n\n      if (stateRecordRef.current[identifier]) {\n        stateRecordRef.current[identifier] = stateRecordRef.current[\n          identifier\n        ].map((item) => {\n          if (item.showInitially) {\n            return item\n          }\n\n          return {\n            ...item,\n            show,\n          }\n        })\n\n        forceUpdate()\n      }\n    },\n    [nestedFieldBlockContext]\n  )\n\n  const statusContent = useMemo(() => {\n    if (typeof errorProp !== 'undefined') {\n      setInternalRecord({\n        identifier: blockId,\n        showInitially: hasInitiallyErrorProp,\n        type: 'error',\n        content: errorProp,\n      })\n    }\n\n    if (typeof warning !== 'undefined') {\n      setInternalRecord({\n        identifier: blockId,\n        showInitially: true,\n        type: 'warning',\n        content: warning,\n      })\n    }\n\n    if (typeof info !== 'undefined') {\n      setInternalRecord({\n        identifier: blockId,\n        showInitially: true,\n        type: 'info',\n        content: info,\n      })\n    }\n\n    const statesWithMessages: Array<StatesWithMessages> =\n      // 1. Prepare the states for later use\n      Object.entries(stateRecordRef.current)\n        .flatMap(([identifier, states]) =>\n          states.map((props) => {\n            return {\n              identifier,\n              ...props,\n            }\n          })\n        )\n\n        // 2. Take states and group the same type together\n        .reduce((acc, cur) => {\n          const existing = acc.find((item) => {\n            return item.type === cur.type\n          })\n\n          const messages = getMessagesFromError(cur).map((message) => {\n            return {\n              ...cur,\n              message,\n            }\n          })\n\n          if (existing) {\n            existing.messages.push(...messages)\n          } else {\n            acc.push({\n              ...cur,\n              content: undefined,\n              messages,\n            })\n          }\n\n          return acc\n        }, [] as Array<StatesWithMessages>)\n\n    // 3. Return the grouped states/messages\n    return states.reduce((acc, type) => {\n      const id = `${props.id || forId || blockId}-form-status--${type}`\n      acc[type] = {\n        id,\n        label,\n        state: type === 'warning' ? 'warn' : type,\n        width_element: contentsRef,\n\n        // Enable animation only in the browser and not in tests\n        no_animation:\n          process.env.NODE_ENV === 'test'\n            ? true\n            : typeof globalThis !== 'undefined'\n            ? globalThis.IS_TEST === true\n            : false,\n      }\n\n      const found = statesWithMessages.find((item) => {\n        return item.type === type\n      })\n\n      if (found?.messages) {\n        // Hide/remove messages that should be hidden and are not marked as to be shown initially\n        const messages = found.messages\n          .map((msg) => {\n            if (msg.type === 'error') {\n              if (!msg.showInitially && !msg.show) {\n                msg.message = null\n              }\n            }\n\n            return msg\n          })\n          .filter(({ message }) => message)\n          .reduce((acc, msg, i, arr) => {\n            const existingIndex = arr.findIndex((item) => {\n              return (\n                convertJsxToString(item.message) ===\n                convertJsxToString(msg.message)\n              )\n            })\n\n            // Remove duplicates, use the first found message\n            if (existingIndex === i) {\n              acc.push(msg)\n            }\n\n            return acc\n          }, [])\n\n        // Combine the messages and put them in an ul/li list\n        if (messages.length > 0) {\n          acc[type] = {\n            ...acc[type],\n            children: <CombineMessages type={type} messages={messages} />,\n          }\n\n          fieldStateIdsRef.current[type] = id\n        } else {\n          fieldStateIdsRef.current[type] = undefined\n        }\n      }\n\n      return acc\n    }, {}) as StatusContent\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    info,\n    warning,\n    errorProp,\n    nestedFieldBlockContext,\n    setInternalRecord,\n    blockId,\n    wasUpdated, // wasUpdated is needed to get the current errors\n  ])\n\n  // Handle the error prop from outside\n  useEffect(() => {\n    if (!nestedFieldBlockContext) {\n      showFieldError(blockId, Boolean(errorProp))\n    }\n  }, [errorProp, blockId, showFieldError, nestedFieldBlockContext])\n\n  useEffect(\n    () => () => {\n      mountedFieldsRef.current = {}\n      stateRecordRef.current = {}\n    },\n    []\n  )\n\n  const mainClasses = classnames(\n    'dnb-forms-field-block',\n    width &&\n      `dnb-forms-field-block--width-${hasCustomWidth ? 'custom' : width}`,\n    contentWidth &&\n      `dnb-forms-field-block--content-width-${\n        hasCustomContentWidth ? 'custom' : contentWidth\n      }`,\n    labelHeight && `dnb-forms-field-block--label-height-${labelHeight}`,\n    composition && 'dnb-forms-field-block__composition',\n    composition &&\n      `dnb-forms-field-block__composition--${\n        composition === true ? 'horizontal' : composition\n      }`,\n    className\n  )\n  const gridClasses = classnames(\n    'dnb-forms-field-block__grid',\n    `dnb-forms-field-block--layout-${layout}`\n  )\n\n  // A child component with a label was found, use fieldset/legend instead of div/label\n  const enableFieldset = useEnableFieldset({\n    label,\n    asFieldset,\n    children,\n    nestedFieldBlockContext,\n  })\n\n  const labelProps: FormLabelAllProps = {\n    className: 'dnb-forms-field-block__label',\n    element: enableFieldset ? 'legend' : 'label',\n    forId: enableFieldset ? undefined : forId,\n    srOnly: labelSrOnly,\n    space: 0, // Use CSS for spacing, but we need to reset space for doing so\n    size: labelSize,\n    disabled,\n  }\n\n  const mainStyle = useMemo(() => {\n    const style: React.CSSProperties = {}\n\n    if (hasCustomWidth) {\n      style['--dnb-forms-field-block-width'] = width\n    }\n\n    if (hasCustomContentWidth) {\n      style['--dnb-forms-field-block-content-width'] = contentWidth\n    }\n\n    const lO = layoutOptions || {}\n    const min = getFieldWidth(lO.minWidth ?? lO.width)\n    const max = getFieldWidth(lO.maxWidth ?? lO.width)\n\n    if (typeof min === 'string') {\n      style['--dnb-forms-field-block-layout-width-min'] = min\n    }\n    if (typeof max === 'string') {\n      style['--dnb-forms-field-block-layout-width-max'] = max\n    }\n\n    return style\n  }, [\n    contentWidth,\n    hasCustomContentWidth,\n    hasCustomWidth,\n    layoutOptions,\n    width,\n  ])\n\n  if (dataContext?.prerenderFieldProps) {\n    return null\n  }\n\n  const hasLabelDescription = isFragment(labelDescription)\n    ? fragmentHasChildren(labelDescription) &&\n      !fragmentHasOnlyUndefinedChildren(labelDescription)\n    : labelDescription\n  const hasHelp = help?.title || help?.content\n\n  return (\n    <FieldBlockContext.Provider\n      value={{\n        setBlockRecord,\n        setFieldState,\n        showFieldError,\n        hasErrorProp: Boolean(errorProp),\n        fieldStateIdsRef,\n        mountedFieldsRef,\n        composition,\n        disableStatusSummary,\n      }}\n    >\n      <Space\n        element={enableFieldset ? 'fieldset' : 'div'} // use fieldset and legend to enhance a11y\n        style={mainStyle}\n        className={mainClasses}\n        {...rest}\n      >\n        <div className={gridClasses}>\n          {(label || labelDescription || hasHelp) && (\n            <FormLabel {...labelProps}>\n              <span>\n                {label && (\n                  <span className=\"dnb-forms-field-block__label__content\">\n                    {label}\n                  </span>\n                )}\n\n                {hasLabelDescription && (\n                  <span className=\"dnb-forms-field-block__label__description\">\n                    {labelDescription}\n                  </span>\n                )}\n\n                {hasHelp && (\n                  <HelpButtonInline contentId={`${id}-help`} help={help} />\n                )}\n              </span>\n            </FormLabel>\n          )}\n\n          {hasHelp && (\n            <HelpButtonInlineContent\n              contentId={`${id}-help`}\n              className=\"dnb-forms-field-block__help\"\n              help={help}\n              breakout={\n                layout === 'vertical' &&\n                !nestedFieldBlockContext?.composition\n              }\n              outset={layout !== 'horizontal'}\n            />\n          )}\n\n          <div\n            className={classnames(\n              'dnb-forms-field-block__status',\n\n              // Handle the width of the status messages\n              contentWidth &&\n                contentWidth !== 'small' &&\n                contentWidth !== 'medium' &&\n                !(parseFloat(contentWidth) <= 11) &&\n                `dnb-forms-field-block__contents--width-${\n                  hasCustomContentWidth ? 'custom' : contentWidth\n                }`\n            )}\n          >\n            <FormStatus {...statusContent?.error} />\n            <FormStatus {...statusContent?.warning} />\n            <FormStatus {...statusContent?.info} />\n          </div>\n\n          <div\n            className={classnames(\n              'dnb-forms-field-block__contents',\n              contentWidth &&\n                `dnb-forms-field-block__contents--width-${\n                  hasCustomContentWidth ? 'custom' : contentWidth\n                }`,\n              align && `dnb-forms-field-block__contents--align-${align}`,\n              contentClassName\n            )}\n            ref={contentsRef}\n          >\n            {children}\n          </div>\n\n          <SubmitIndicator\n            state={fieldState ?? fieldStateRef.current}\n            className=\"dnb-forms-field-block__indicator dnb-forms-submit-indicator--inline-wrap\"\n          />\n        </div>\n      </Space>\n    </FieldBlockContext.Provider>\n  )\n}\n\nfunction useEnableFieldset({\n  label,\n  asFieldset,\n  children,\n  nestedFieldBlockContext,\n}) {\n  return useMemo(() => {\n    if (asFieldset === false) {\n      return false\n    }\n\n    let result = asFieldset\n\n    if (label && !result && !nestedFieldBlockContext) {\n      let count = 0\n\n      findElementInChildren(children, (child: React.ReactElement) => {\n        if (\n          child?.props?.label ||\n          child?.type?.['_formElement'] === true\n        ) {\n          count++\n        }\n        if (count > 1) {\n          return (result = true)\n        }\n      })\n    }\n\n    return Boolean(result)\n  }, [asFieldset, children, label, nestedFieldBlockContext])\n}\n\nfunction CombineMessages({\n  type,\n  messages,\n}: {\n  type: StateTypes\n  messages: Array<StateWithMessage>\n}) {\n  const translations = useTranslation().Field\n\n  if (messages.length === 1) {\n    return <>{messages[0].message}</>\n  }\n\n  return (\n    <>\n      {type === 'error'\n        ? translations.errorSummary\n        : translations.stateSummary}\n      <Ul>\n        {messages.map(({ message }, i) => {\n          return <Li key={i}>{message}</Li>\n        })}\n      </Ul>\n    </>\n  )\n}\n\nexport function getMessagesFromError(\n  item: Partial<StateWithMessage>\n): Array<StateMessage> {\n  const { content } = item\n\n  if (content instanceof FormError && Array.isArray(content.errors)) {\n    return content.errors.map((error) => {\n      return error.message\n    })\n  }\n\n  if (Array.isArray(content)) {\n    return content.map((content) => {\n      return content instanceof FormError || content instanceof Error\n        ? content.message\n        : content\n    })\n  }\n\n  if (content instanceof FormError || content instanceof Error) {\n    return [content.message as StateMessage]\n  }\n\n  return [\n    ((React.isValidElement(content) ? content : content?.toString()) ||\n      content) as StateMessage,\n  ]\n}\n\nfunction isFragment(fragment: React.ReactNode) {\n  return React.isValidElement(fragment) && fragment.type === React.Fragment\n}\n\nfunction fragmentHasChildren(fragment: React.ReactNode) {\n  return (\n    React.isValidElement(fragment) &&\n    React.Children.count(fragment.props.children) > 0\n  )\n}\n\nfunction fragmentHasOnlyUndefinedChildren(fragment: React.ReactNode) {\n  const isUndefined = (child) => child === undefined\n\n  return (\n    React.isValidElement(fragment) &&\n    React.Children.toArray(fragment.props.children).every(isUndefined)\n  )\n}\n\nFieldBlock._supportsSpacingProps = true\n\nexport default FieldBlock\n\nfunction getFieldWidth(width: FieldBlockHorizontalLabelWidth) {\n  switch (width) {\n    case 'small':\n      return 'var(--forms-field-width--small)'\n    case 'medium':\n      return 'var(--forms-field-width--medium)'\n    case 'large':\n      return 'var(--forms-field-width--large)'\n  }\n\n  return width\n}\n"],"mappings":"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"}
+{"version":3,"file":"FieldBlock.js","names":["React","useMemo","useContext","useCallback","useRef","useReducer","useEffect","classnames","FieldBlockContext","DataContext","IterateElementContext","Space","FormLabel","FormStatus","Ul","Li","convertJsxToString","findElementInChildren","useId","HelpButtonInline","HelpButtonInlineContent","SubmitIndicator","createSharedState","useTranslation","FormError","states","FieldBlock","props","_props$id","dataContext","fieldBlockContext","nestedFieldBlockContext","disableStatusSummary","id","forId","sharedData","_Object$assign","Object","assign","data","className","layout","layoutOptions","composition","label","labelProp","labelDescription","labelSuffix","labelSrOnly","help","asFieldset","required","info","warning","error","errorProp","fieldState","disabled","width","contentWidth","labelHeight","align","labelSize","contentClassName","children","rest","_objectWithoutProperties","_excluded","hasCustomWidth","test","String","hasCustomContentWidth","iterateItemContext","index","iterateIndex","blockId","wasUpdated","forceUpdate","mountedFieldsRef","fieldStateRef","stateRecordRef","fieldStateIdsRef","contentsRef","hasInitiallyErrorProp","Boolean","optionalLabelSuffix","Field","labelSuffixText","content","undefined","replace","includes","isValidElement","createElement","Fragment","setInternalRecord","stateId","identifier","type","current","existingIndex","findIndex","item","_objectSpread","push","setBlockRecord","setFieldState","showFieldError","show","map","showInitially","statusContent","statesWithMessages","entries","flatMap","_ref","reduce","acc","cur","existing","find","messages","getMessagesFromError","message","state","width_element","no_animation","process","env","NODE_ENV","globalThis","IS_TEST","found","msg","filter","_ref2","i","arr","length","CombineMessages","mainClasses","gridClasses","enableFieldset","useEnableFieldset","labelProps","element","srOnly","space","size","mainStyle","_lO$minWidth","_lO$maxWidth","style","lO","min","getFieldWidth","minWidth","max","maxWidth","prerenderFieldProps","hasLabelDescription","isFragment","fragmentHasChildren","fragmentHasOnlyUndefinedChildren","hasHelp","title","Provider","value","hasErrorProp","_extends","contentId","breakout","outset","parseFloat","ref","showLabel","_ref3","result","count","child","_child$props","_child$type","_ref4","translations","errorSummary","stateSummary","_ref5","key","Array","isArray","errors","Error","toString","fragment","Children","isUndefined","toArray","every","_supportsSpacingProps"],"sources":["../../../../../src/extensions/forms/FieldBlock/FieldBlock.tsx"],"sourcesContent":["import React, {\n  useMemo,\n  useContext,\n  useCallback,\n  useRef,\n  useReducer,\n  useEffect,\n} from 'react'\nimport classnames from 'classnames'\nimport FieldBlockContext, {\n  StateWithMessage,\n  StatesWithMessages,\n  FieldErrorIdsRef,\n  MountedFieldsRef,\n  StateRecord,\n  StateMessage,\n  StateTypes,\n  StatusContent,\n  FieldBlockContextProps,\n  StateBasis,\n} from './FieldBlockContext'\nimport DataContext from '../DataContext/Context'\nimport IterateElementContext from '../Iterate/IterateItemContext'\nimport { Space, FormLabel, FormStatus } from '../../../components'\nimport { Ul, Li } from '../../../elements'\nimport {\n  convertJsxToString,\n  findElementInChildren,\n} from '../../../shared/component-helper'\nimport useId from '../../../shared/helpers/useId'\nimport {\n  ComponentProps,\n  FieldProps,\n  SubmitState,\n  Identifier,\n} from '../types'\nimport type { FormLabelAllProps } from '../../../components/FormLabel'\nimport HelpButtonInline, {\n  HelpButtonInlineContent,\n  HelpProps,\n} from '../../../components/help-button/HelpButtonInline'\nimport SubmitIndicator from '../Form/SubmitIndicator/SubmitIndicator'\nimport { createSharedState } from '../../../shared/helpers/useSharedState'\nimport useTranslation from '../hooks/useTranslation'\nimport { FormError } from '../utils'\n\nexport const states: Array<StateTypes> = ['error', 'info', 'warning']\n\n/**\n * The width of a field block\n */\nexport type CustomWidth = `${number}rem`\nexport type FieldBlockWidth =\n  | false\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'stretch'\n  | CustomWidth\nexport type FieldBlockHorizontalLabelWidth =\n  | 'small'\n  | 'medium'\n  | 'large'\n  | CustomWidth\nexport type FieldBlockHorizontalLabelHeight =\n  | 'default'\n  | 'small'\n  | 'medium'\n  | 'large'\n\nexport type SharedFieldBlockProps = {\n  /**\n   * The layout of the field block\n   */\n  layout?: 'vertical' | 'horizontal'\n  /** Use this to set additional options for the layout */\n  layoutOptions?: {\n    width?: FieldBlockHorizontalLabelWidth\n    minWidth?: FieldBlockHorizontalLabelWidth\n    maxWidth?: FieldBlockHorizontalLabelWidth\n  }\n  /**\n   * Main label text for the field\n   */\n  label?: React.ReactNode\n  /**\n   * Will append an additional text to the label, like \"(optional)\" or \"(recommended)\"\n   */\n  labelSuffix?: React.ReactNode\n  /**\n   * A more discreet text displayed beside the label\n   */\n  labelDescription?: React.ReactNode\n  /**\n   * Width of outer block element\n   */\n  width?: FieldBlockWidth\n  /**\n   * Width of contents block, while label etc can be wider if space is available\n   */\n  contentWidth?: FieldBlockWidth\n  /**\n   * Provide help content for the field.\n   */\n  help?: HelpProps\n}\n\nexport type Props = SharedFieldBlockProps &\n  Pick<\n    FieldProps,\n    keyof ComponentProps | 'info' | 'warning' | 'error' | 'disabled'\n  > & {\n    /** The id to link a element with */\n    forId?: string\n    /** Use true if you have more than one form element */\n    asFieldset?: boolean\n    /** use `true` to make the label only readable by screen readers. */\n    labelSrOnly?: boolean\n    /** Defines the layout of nested fields */\n    composition?: FieldBlockContextProps['composition']\n    /** For composition only: Align the contents vertically */\n    align?: 'center' | 'bottom'\n    /** Class name for the contents block */\n    contentClassName?: string\n    /** To show the SubmitIndicator during async validation */\n    fieldState?: SubmitState\n    /** Typography size */\n    labelSize?: 'medium' | 'large'\n    /** Defines the height of an component (size prop), so the label can be aligned correctly */\n    labelHeight?: FieldBlockHorizontalLabelHeight\n    /** Disable the error summary for this field block */\n    disableStatusSummary?: boolean\n    /** For internal use only */\n    required?: boolean\n    children?: React.ReactNode\n  } & React.HTMLAttributes<HTMLDivElement>\n\nfunction FieldBlock(props: Props) {\n  const dataContext = useContext(DataContext)\n  const fieldBlockContext = useContext(FieldBlockContext)\n  const nestedFieldBlockContext = !fieldBlockContext?.disableStatusSummary\n    ? fieldBlockContext\n    : null\n\n  const id = useId(props.id ?? props.forId)\n  const sharedData = createSharedState<Props>('field-block-props-' + id)\n  const {\n    className,\n    forId,\n    layout = 'vertical',\n    layoutOptions,\n    composition,\n    label: labelProp,\n    labelDescription,\n    labelSuffix,\n    labelSrOnly,\n    help,\n    asFieldset,\n    required,\n    info,\n    warning,\n    error: errorProp,\n    disableStatusSummary,\n    fieldState,\n    disabled,\n    width,\n    contentWidth,\n    labelHeight,\n    align,\n    labelSize,\n    contentClassName,\n    children,\n    ...rest\n  } = Object.assign({}, sharedData.data, props)\n  const hasCustomWidth = /\\d(rem)$/.test(String(width))\n  const hasCustomContentWidth = /\\d(rem)$/.test(String(contentWidth))\n\n  const iterateItemContext = useContext(IterateElementContext)\n  const { index: iterateIndex } = iterateItemContext ?? {}\n\n  const blockId = useId(props.id)\n  const [wasUpdated, forceUpdate] = useReducer(() => ({}), {})\n  const mountedFieldsRef = useRef<MountedFieldsRef>({})\n  const fieldStateRef = useRef<SubmitState>(null)\n  const stateRecordRef = useRef<StateRecord>({})\n  const fieldStateIdsRef = useRef<FieldErrorIdsRef>(null)\n  const contentsRef = useRef<HTMLDivElement>(null)\n  const hasInitiallyErrorProp = useMemo(() => {\n    return Boolean(errorProp)\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  const { optionalLabelSuffix } = useTranslation().Field\n  const labelSuffixText = useMemo(() => {\n    if (required === false || typeof labelSuffix !== 'undefined') {\n      return labelSuffix ?? optionalLabelSuffix\n    }\n    return ''\n  }, [required, labelSuffix, optionalLabelSuffix])\n\n  const label = useMemo(() => {\n    let content = labelProp\n\n    if (iterateIndex !== undefined) {\n      content = convertJsxToString(labelProp).replace(\n        '{itemNo}',\n        String(iterateIndex + 1)\n      )\n    }\n\n    if (labelSuffixText) {\n      if (convertJsxToString(content).includes(optionalLabelSuffix)) {\n        return content\n      }\n\n      if (typeof content === 'string') {\n        return content + ' ' + labelSuffixText\n      }\n\n      if (React.isValidElement(content)) {\n        return (\n          <>\n            {content}\n            {' '}\n            {labelSuffixText}\n          </>\n        )\n      }\n    }\n\n    return content\n  }, [iterateIndex, labelProp, labelSuffixText, optionalLabelSuffix])\n\n  const setInternalRecord = useCallback((props: StateBasis) => {\n    const { stateId, identifier, type } = props\n\n    if (!stateRecordRef.current[identifier]) {\n      stateRecordRef.current[identifier] = []\n    }\n\n    fieldStateIdsRef.current = { error: null, warning: null, info: null }\n\n    const existingIndex = stateRecordRef.current[identifier].findIndex(\n      (item) => {\n        return item.stateId === stateId && item.type === type\n      }\n    )\n\n    if (existingIndex > -1) {\n      stateRecordRef.current[identifier][existingIndex] = {\n        ...stateRecordRef.current[identifier][existingIndex],\n        ...props,\n      }\n    } else {\n      stateRecordRef.current[identifier].push(props)\n    }\n  }, [])\n\n  const setBlockRecord = useCallback(\n    (props: StateBasis) => {\n      if (nestedFieldBlockContext) {\n        // If this FieldBlock is inside another one, forward the call to the outer one\n        nestedFieldBlockContext.setBlockRecord(props)\n        return\n      }\n\n      setInternalRecord(props)\n\n      forceUpdate()\n    },\n    [nestedFieldBlockContext, setInternalRecord]\n  )\n\n  const setFieldState = useCallback(\n    (identifier: Identifier, fieldState: SubmitState) => {\n      if (fieldState !== fieldStateRef.current) {\n        fieldStateRef.current = fieldState\n\n        forceUpdate()\n      }\n    },\n    []\n  )\n\n  const showFieldError = useCallback(\n    (identifier: Identifier, show: boolean) => {\n      if (nestedFieldBlockContext) {\n        // If this FieldBlock is inside another one, forward the call to the outer one\n        nestedFieldBlockContext.showFieldError(identifier, show)\n        return\n      }\n\n      if (stateRecordRef.current[identifier]) {\n        stateRecordRef.current[identifier] = stateRecordRef.current[\n          identifier\n        ].map((item) => {\n          if (item.showInitially) {\n            return item\n          }\n\n          return {\n            ...item,\n            show,\n          }\n        })\n\n        forceUpdate()\n      }\n    },\n    [nestedFieldBlockContext]\n  )\n\n  const statusContent = useMemo(() => {\n    if (typeof errorProp !== 'undefined') {\n      setInternalRecord({\n        identifier: blockId,\n        showInitially: hasInitiallyErrorProp,\n        type: 'error',\n        content: errorProp,\n      })\n    }\n\n    if (typeof warning !== 'undefined') {\n      setInternalRecord({\n        identifier: blockId,\n        showInitially: true,\n        type: 'warning',\n        content: warning,\n      })\n    }\n\n    if (typeof info !== 'undefined') {\n      setInternalRecord({\n        identifier: blockId,\n        showInitially: true,\n        type: 'info',\n        content: info,\n      })\n    }\n\n    const statesWithMessages: Array<StatesWithMessages> =\n      // 1. Prepare the states for later use\n      Object.entries(stateRecordRef.current)\n        .flatMap(([identifier, states]) =>\n          states.map((props) => {\n            return {\n              identifier,\n              ...props,\n            }\n          })\n        )\n\n        // 2. Take states and group the same type together\n        .reduce((acc, cur) => {\n          const existing = acc.find((item) => {\n            return item.type === cur.type\n          })\n\n          const messages = getMessagesFromError(cur).map((message) => {\n            return {\n              ...cur,\n              message,\n            }\n          })\n\n          if (existing) {\n            existing.messages.push(...messages)\n          } else {\n            acc.push({\n              ...cur,\n              content: undefined,\n              messages,\n            })\n          }\n\n          return acc\n        }, [] as Array<StatesWithMessages>)\n\n    // 3. Return the grouped states/messages\n    return states.reduce((acc, type) => {\n      const id = `${props.id || forId || blockId}-form-status--${type}`\n      acc[type] = {\n        id,\n        label,\n        state: type === 'warning' ? 'warn' : type,\n        width_element: contentsRef,\n\n        // Enable animation only in the browser and not in tests\n        no_animation:\n          process.env.NODE_ENV === 'test'\n            ? true\n            : typeof globalThis !== 'undefined'\n            ? globalThis.IS_TEST === true\n            : false,\n      }\n\n      const found = statesWithMessages.find((item) => {\n        return item.type === type\n      })\n\n      if (found?.messages) {\n        // Hide/remove messages that should be hidden and are not marked as to be shown initially\n        const messages = found.messages\n          .map((msg) => {\n            if (msg.type === 'error') {\n              if (!msg.showInitially && !msg.show) {\n                msg.message = null\n              }\n            }\n\n            return msg\n          })\n          .filter(({ message }) => message)\n          .reduce((acc, msg, i, arr) => {\n            const existingIndex = arr.findIndex((item) => {\n              return (\n                convertJsxToString(item.message) ===\n                convertJsxToString(msg.message)\n              )\n            })\n\n            // Remove duplicates, use the first found message\n            if (existingIndex === i) {\n              acc.push(msg)\n            }\n\n            return acc\n          }, [])\n\n        // Combine the messages and put them in an ul/li list\n        if (messages.length > 0) {\n          acc[type] = {\n            ...acc[type],\n            children: <CombineMessages type={type} messages={messages} />,\n          }\n\n          fieldStateIdsRef.current[type] = id\n        } else {\n          fieldStateIdsRef.current[type] = undefined\n        }\n      }\n\n      return acc\n    }, {}) as StatusContent\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    info,\n    warning,\n    errorProp,\n    nestedFieldBlockContext,\n    setInternalRecord,\n    blockId,\n    wasUpdated, // wasUpdated is needed to get the current errors\n  ])\n\n  // Handle the error prop from outside\n  useEffect(() => {\n    if (!nestedFieldBlockContext) {\n      showFieldError(blockId, Boolean(errorProp))\n    }\n  }, [errorProp, blockId, showFieldError, nestedFieldBlockContext])\n\n  useEffect(\n    () => () => {\n      mountedFieldsRef.current = {}\n      stateRecordRef.current = {}\n    },\n    []\n  )\n\n  const mainClasses = classnames(\n    'dnb-forms-field-block',\n    width &&\n      `dnb-forms-field-block--width-${hasCustomWidth ? 'custom' : width}`,\n    contentWidth &&\n      `dnb-forms-field-block--content-width-${\n        hasCustomContentWidth ? 'custom' : contentWidth\n      }`,\n    labelHeight && `dnb-forms-field-block--label-height-${labelHeight}`,\n    composition && 'dnb-forms-field-block__composition',\n    composition &&\n      `dnb-forms-field-block__composition--${\n        composition === true ? 'horizontal' : composition\n      }`,\n    className\n  )\n  const gridClasses = classnames(\n    'dnb-forms-field-block__grid',\n    `dnb-forms-field-block--layout-${layout}`\n  )\n\n  // A child component with a label was found, use fieldset/legend instead of div/label\n  const enableFieldset = useEnableFieldset({\n    label,\n    asFieldset,\n    children,\n    nestedFieldBlockContext,\n  })\n\n  const labelProps: FormLabelAllProps = {\n    className: 'dnb-forms-field-block__label',\n    element: enableFieldset ? 'legend' : 'label',\n    forId: enableFieldset ? undefined : forId,\n    srOnly: labelSrOnly,\n    space: 0, // Use CSS for spacing, but we need to reset space for doing so\n    size: labelSize,\n    disabled,\n  }\n\n  const mainStyle = useMemo(() => {\n    const style: React.CSSProperties = {}\n\n    if (hasCustomWidth) {\n      style['--dnb-forms-field-block-width'] = width\n    }\n\n    if (hasCustomContentWidth) {\n      style['--dnb-forms-field-block-content-width'] = contentWidth\n    }\n\n    const lO = layoutOptions || {}\n    const min = getFieldWidth(lO.minWidth ?? lO.width)\n    const max = getFieldWidth(lO.maxWidth ?? lO.width)\n\n    if (typeof min === 'string') {\n      style['--dnb-forms-field-block-layout-width-min'] = min\n    }\n    if (typeof max === 'string') {\n      style['--dnb-forms-field-block-layout-width-max'] = max\n    }\n\n    return style\n  }, [\n    contentWidth,\n    hasCustomContentWidth,\n    hasCustomWidth,\n    layoutOptions,\n    width,\n  ])\n\n  if (dataContext?.prerenderFieldProps) {\n    return null\n  }\n\n  const hasLabelDescription = isFragment(labelDescription)\n    ? fragmentHasChildren(labelDescription) &&\n      !fragmentHasOnlyUndefinedChildren(labelDescription)\n    : labelDescription\n  const hasHelp = help?.title || help?.content\n\n  return (\n    <FieldBlockContext.Provider\n      value={{\n        setBlockRecord,\n        setFieldState,\n        showFieldError,\n        hasErrorProp: Boolean(errorProp),\n        fieldStateIdsRef,\n        mountedFieldsRef,\n        composition,\n        disableStatusSummary,\n      }}\n    >\n      <Space\n        element={enableFieldset ? 'fieldset' : 'div'} // use fieldset and legend to enhance a11y\n        style={mainStyle}\n        className={mainClasses}\n        {...rest}\n      >\n        <div className={gridClasses}>\n          {(label || labelDescription || hasHelp) && (\n            <FormLabel {...labelProps}>\n              <span>\n                {label && (\n                  <span className=\"dnb-forms-field-block__label__content\">\n                    {label}\n                  </span>\n                )}\n\n                {hasLabelDescription && (\n                  <span className=\"dnb-forms-field-block__label__description\">\n                    {labelDescription}\n                  </span>\n                )}\n\n                {hasHelp && (\n                  <HelpButtonInline contentId={`${id}-help`} help={help} />\n                )}\n              </span>\n            </FormLabel>\n          )}\n\n          {hasHelp && (\n            <HelpButtonInlineContent\n              contentId={`${id}-help`}\n              className=\"dnb-forms-field-block__help\"\n              help={help}\n              breakout={\n                layout === 'vertical' &&\n                !nestedFieldBlockContext?.composition\n              }\n              outset={layout !== 'horizontal'}\n            />\n          )}\n\n          <div\n            className={classnames(\n              'dnb-forms-field-block__status',\n\n              // Handle the width of the status messages\n              contentWidth &&\n                contentWidth !== 'small' &&\n                contentWidth !== 'medium' &&\n                !(parseFloat(contentWidth) <= 11) &&\n                `dnb-forms-field-block__contents--width-${\n                  hasCustomContentWidth ? 'custom' : contentWidth\n                }`\n            )}\n          >\n            <FormStatus {...statusContent?.error} />\n            <FormStatus {...statusContent?.warning} />\n            <FormStatus {...statusContent?.info} />\n          </div>\n\n          <div\n            className={classnames(\n              'dnb-forms-field-block__contents',\n              contentWidth &&\n                `dnb-forms-field-block__contents--width-${\n                  hasCustomContentWidth ? 'custom' : contentWidth\n                }`,\n              align && `dnb-forms-field-block__contents--align-${align}`,\n              contentClassName\n            )}\n            ref={contentsRef}\n          >\n            {children}\n          </div>\n\n          <SubmitIndicator\n            state={fieldState ?? fieldStateRef.current}\n            showLabel\n            className=\"dnb-forms-field-block__indicator dnb-forms-submit-indicator--inline-wrap\"\n          />\n        </div>\n      </Space>\n    </FieldBlockContext.Provider>\n  )\n}\n\nfunction useEnableFieldset({\n  label,\n  asFieldset,\n  children,\n  nestedFieldBlockContext,\n}) {\n  return useMemo(() => {\n    if (asFieldset === false) {\n      return false\n    }\n\n    let result = asFieldset\n\n    if (label && !result && !nestedFieldBlockContext) {\n      let count = 0\n\n      findElementInChildren(children, (child: React.ReactElement) => {\n        if (\n          child?.props?.label ||\n          child?.type?.['_formElement'] === true\n        ) {\n          count++\n        }\n        if (count > 1) {\n          return (result = true)\n        }\n      })\n    }\n\n    return Boolean(result)\n  }, [asFieldset, children, label, nestedFieldBlockContext])\n}\n\nfunction CombineMessages({\n  type,\n  messages,\n}: {\n  type: StateTypes\n  messages: Array<StateWithMessage>\n}) {\n  const translations = useTranslation().Field\n\n  if (messages.length === 1) {\n    return <>{messages[0].message}</>\n  }\n\n  return (\n    <>\n      {type === 'error'\n        ? translations.errorSummary\n        : translations.stateSummary}\n      <Ul>\n        {messages.map(({ message }, i) => {\n          return <Li key={i}>{message}</Li>\n        })}\n      </Ul>\n    </>\n  )\n}\n\nexport function getMessagesFromError(\n  item: Partial<StateWithMessage>\n): Array<StateMessage> {\n  const { content } = item\n\n  if (content instanceof FormError && Array.isArray(content.errors)) {\n    return content.errors.map((error) => {\n      return error.message\n    })\n  }\n\n  if (Array.isArray(content)) {\n    return content.map((content) => {\n      return content instanceof FormError || content instanceof Error\n        ? content.message\n        : content\n    })\n  }\n\n  if (content instanceof FormError || content instanceof Error) {\n    return [content.message as StateMessage]\n  }\n\n  return [\n    ((React.isValidElement(content) ? content : content?.toString()) ||\n      content) as StateMessage,\n  ]\n}\n\nfunction isFragment(fragment: React.ReactNode) {\n  return React.isValidElement(fragment) && fragment.type === React.Fragment\n}\n\nfunction fragmentHasChildren(fragment: React.ReactNode) {\n  return (\n    React.isValidElement(fragment) &&\n    React.Children.count(fragment.props.children) > 0\n  )\n}\n\nfunction fragmentHasOnlyUndefinedChildren(fragment: React.ReactNode) {\n  const isUndefined = (child) => child === undefined\n\n  return (\n    React.isValidElement(fragment) &&\n    React.Children.toArray(fragment.props.children).every(isUndefined)\n  )\n}\n\nFieldBlock._supportsSpacingProps = true\n\nexport default FieldBlock\n\nfunction getFieldWidth(width: FieldBlockHorizontalLabelWidth) {\n  switch (width) {\n    case 'small':\n      return 'var(--forms-field-width--small)'\n    case 'medium':\n      return 'var(--forms-field-width--medium)'\n    case 'large':\n      return 'var(--forms-field-width--large)'\n  }\n\n  return width\n}\n"],"mappings":"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"}

package/extensions/forms/Form/SubmitIndicator/SubmitIndicator.d.ts

@@ -3,8 +3,9 @@ import type { SpaceProps } from '../../../../components/Space';
 import type { SubmitState } from '../../types';
 export type Props = {
     state: SubmitState;
+    label?: React.ReactNode;
+    showLabel?: boolean;
     className?: string;
-    successLabel?: string;
     children?: React.ReactNode;
 } & SpaceProps;
 declare function SubmitIndicator(props: Props): import("react/jsx-runtime").JSX.Element;

package/extensions/forms/Form/SubmitIndicator/SubmitIndicator.js

@@ -3,27 +3,27 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _b, _span;
-const _excluded = ["className", "children", "state", "successLabel"];
+var _b;
+const _excluded = ["className", "children", "state", "showLabel", "label"];
 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, { useCallback, useMemo, useRef, useState } from 'react';
 import classnames from 'classnames';
-import { Icon, Space, Tooltip } from '../../../../components';
-import { check } from '../../../../icons';
+import { Space } from '../../../../components';
 import { omitSpacingProps, pickSpacingProps } from '../../../../components/flex/utils';
-import { useTranslation } from '../../../../shared';
+import useTranslation from '../../hooks/useTranslation';
 import { convertJsxToString } from '../../../../shared/component-helper';
 const useLayoutEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;
 function SubmitIndicator(props) {
+  const translation = useTranslation();
   const {
       className,
       children,
       state,
-      successLabel = 'Saved'
+      showLabel,
+      label = translation.SubmitIndicator.label
     } = props,
     rest = _objectWithoutProperties(props, _excluded);
-  const translation = useTranslation();
   const childrenRef = useRef(null);
   const [willWrap, setWillWrap] = useState(false);
   const key = useMemo(() => convertJsxToString(children), [children]);
@@ -45,18 +45,16 @@ function SubmitIndicator(props) {
   const ariaAttributes = state === 'pending' ? {
     role: 'status',
     'aria-busy': true,
-    'aria-label': translation.ProgressIndicator.indicator_label
+    'aria-label': convertJsxToString(label)
   } : {
     'aria-hidden': true
   };
   const dot = _b || (_b = React.createElement("b", null, "."));
   const indicator = React.createElement("span", _extends({
     className: "dnb-forms-submit-indicator__content"
-  }, ariaAttributes, omitSpacingProps(rest)), state === 'success' && React.createElement(Tooltip, {
-    targetElement: _span || (_span = React.createElement("span", null, React.createElement(Icon, {
-      icon: check
-    })))
-  }, successLabel), state && state !== 'success' && state !== 'abort' && React.createElement(React.Fragment, null, dot, dot, dot));
+  }, ariaAttributes, omitSpacingProps(rest)), showLabel && React.createElement("span", {
+    className: "dnb-forms-submit-indicator__label"
+  }, label), state && state !== 'success' && state !== 'abort' && React.createElement(React.Fragment, null, dot, dot, dot));
   return React.createElement(Space, _extends({}, params, {
     element: "span"
   }), children && React.createElement("span", {

package/extensions/forms/Form/SubmitIndicator/SubmitIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubmitIndicator.js","names":["React","useCallback","useMemo","useRef","useState","classnames","Icon","Space","Tooltip","check","omitSpacingProps","pickSpacingProps","useTranslation","convertJsxToString","useLayoutEffect","window","useEffect","SubmitIndicator","props","className","children","state","successLabel","rest","_objectWithoutProperties","_excluded","translation","childrenRef","willWrap","setWillWrap","key","recalculate","willWordWrap","current","addEventListener","removeEventListener","params","_objectSpread","ariaAttributes","role","ProgressIndicator","indicator_label","dot","_b","createElement","indicator","_extends","targetElement","_span","icon","Fragment","element","ref","word","_element$parentElemen","offsetHeight","innerHTML","clone","cloneNode","parentElement","insertBefore","height","remove","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/SubmitIndicator/SubmitIndicator.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from 'react'\nimport classnames from 'classnames'\nimport { Icon, Space, Tooltip } from '../../../../components'\nimport type { SpaceProps } from '../../../../components/Space'\nimport { check } from '../../../../icons'\nimport type { SubmitState } from '../../types'\nimport {\n  omitSpacingProps,\n  pickSpacingProps,\n} from '../../../../components/flex/utils'\nimport { useTranslation } from '../../../../shared'\nimport { convertJsxToString } from '../../../../shared/component-helper'\n\n// SSR warning fix: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\nconst useLayoutEffect =\n  typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect\n\nexport type Props = {\n  state: SubmitState\n  className?: string\n  successLabel?: string\n  children?: React.ReactNode\n} & SpaceProps\n\nfunction SubmitIndicator(props: Props) {\n  const {\n    className,\n    children,\n    state,\n    successLabel = 'Saved',\n    ...rest\n  } = props\n  const translation = useTranslation()\n  const childrenRef = useRef<HTMLSpanElement>(null)\n  const [willWrap, setWillWrap] = useState(false)\n  const key = useMemo(() => convertJsxToString(children), [children])\n\n  const recalculate = useCallback(() => {\n    setWillWrap(willWordWrap(childrenRef.current, '. . . '))\n  }, [childrenRef])\n\n  useLayoutEffect(() => {\n    if (key) {\n      recalculate()\n\n      window.addEventListener('resize', recalculate)\n      return () => {\n        window.removeEventListener('resize', recalculate)\n      }\n    }\n  }, [key, recalculate])\n\n  const params = {\n    className: classnames(\n      'dnb-forms-submit-indicator',\n      state && `dnb-forms-submit-indicator--state-${state}`,\n      willWrap && 'dnb-forms-submit-indicator--inline-wrap',\n      className\n    ),\n    ...pickSpacingProps(rest),\n  } as SpaceProps\n\n  const ariaAttributes =\n    state === 'pending'\n      ? {\n          role: 'status',\n          'aria-busy': true,\n          'aria-label': translation.ProgressIndicator.indicator_label,\n        }\n      : {\n          'aria-hidden': true,\n        }\n\n  const dot = <b>.</b>\n  const indicator = (\n    <span\n      className=\"dnb-forms-submit-indicator__content\"\n      {...ariaAttributes}\n      {...omitSpacingProps(rest)}\n    >\n      {state === 'success' && (\n        <Tooltip\n          targetElement={\n            <span>\n              <Icon icon={check} />\n            </span>\n          }\n        >\n          {successLabel}\n        </Tooltip>\n      )}\n      {state && state !== 'success' && state !== 'abort' && (\n        <>\n          {dot}\n          {dot}\n          {dot}\n        </>\n      )}\n    </span>\n  )\n\n  return (\n    <Space {...params} element=\"span\">\n      {children && (\n        <span ref={childrenRef} key={key}>\n          {children}\n        </span>\n      )}\n      {indicator}\n    </Space>\n  )\n}\n\nfunction willWordWrap(element: HTMLElement, word: string) {\n  if (!element) {\n    return\n  }\n\n  const { offsetHeight, innerHTML } = element\n\n  const clone = element.cloneNode(true) as HTMLElement\n  element.parentElement?.insertBefore(clone, element)\n\n  clone.innerHTML += word\n  const height = clone.offsetHeight\n  clone.innerHTML = innerHTML\n\n  clone.remove()\n\n  return height > offsetHeight\n}\n\nSubmitIndicator._supportsSpacingProps = true\nexport default SubmitIndicator\n"],"mappings":"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"}
+{"version":3,"file":"SubmitIndicator.js","names":["React","useCallback","useMemo","useRef","useState","classnames","Space","omitSpacingProps","pickSpacingProps","useTranslation","convertJsxToString","useLayoutEffect","window","useEffect","SubmitIndicator","props","translation","className","children","state","showLabel","label","rest","_objectWithoutProperties","_excluded","childrenRef","willWrap","setWillWrap","key","recalculate","willWordWrap","current","addEventListener","removeEventListener","params","_objectSpread","ariaAttributes","role","dot","_b","createElement","indicator","_extends","Fragment","element","ref","word","_element$parentElemen","offsetHeight","innerHTML","clone","cloneNode","parentElement","insertBefore","height","remove","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/SubmitIndicator/SubmitIndicator.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from 'react'\nimport classnames from 'classnames'\nimport { Space } from '../../../../components'\nimport type { SpaceProps } from '../../../../components/Space'\nimport type { SubmitState } from '../../types'\nimport {\n  omitSpacingProps,\n  pickSpacingProps,\n} from '../../../../components/flex/utils'\nimport useTranslation from '../../hooks/useTranslation'\nimport { convertJsxToString } from '../../../../shared/component-helper'\n\n// SSR warning fix: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\nconst useLayoutEffect =\n  typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect\n\nexport type Props = {\n  state: SubmitState\n  label?: React.ReactNode\n  showLabel?: boolean\n  className?: string\n  children?: React.ReactNode\n} & SpaceProps\n\nfunction SubmitIndicator(props: Props) {\n  const translation = useTranslation()\n\n  const {\n    className,\n    children,\n    state,\n    showLabel,\n    label = translation.SubmitIndicator.label,\n    ...rest\n  } = props\n  const childrenRef = useRef<HTMLSpanElement>(null)\n  const [willWrap, setWillWrap] = useState(false)\n  const key = useMemo(() => convertJsxToString(children), [children])\n\n  const recalculate = useCallback(() => {\n    setWillWrap(willWordWrap(childrenRef.current, '. . . '))\n  }, [childrenRef])\n\n  useLayoutEffect(() => {\n    if (key) {\n      recalculate()\n\n      window.addEventListener('resize', recalculate)\n      return () => {\n        window.removeEventListener('resize', recalculate)\n      }\n    }\n  }, [key, recalculate])\n\n  const params = {\n    className: classnames(\n      'dnb-forms-submit-indicator',\n      state && `dnb-forms-submit-indicator--state-${state}`,\n      willWrap && 'dnb-forms-submit-indicator--inline-wrap',\n      className\n    ),\n    ...pickSpacingProps(rest),\n  } as SpaceProps\n\n  const ariaAttributes =\n    state === 'pending'\n      ? {\n          role: 'status',\n          'aria-busy': true,\n          'aria-label': convertJsxToString(label),\n        }\n      : {\n          'aria-hidden': true,\n        }\n\n  const dot = <b>.</b>\n  const indicator = (\n    <span\n      className=\"dnb-forms-submit-indicator__content\"\n      {...ariaAttributes}\n      {...omitSpacingProps(rest)}\n    >\n      {showLabel && (\n        <span className=\"dnb-forms-submit-indicator__label\">{label}</span>\n      )}\n      {state && state !== 'success' && state !== 'abort' && (\n        <>\n          {dot}\n          {dot}\n          {dot}\n        </>\n      )}\n    </span>\n  )\n\n  return (\n    <Space {...params} element=\"span\">\n      {children && (\n        <span ref={childrenRef} key={key}>\n          {children}\n        </span>\n      )}\n      {indicator}\n    </Space>\n  )\n}\n\nfunction willWordWrap(element: HTMLElement, word: string) {\n  if (!element) {\n    return\n  }\n\n  const { offsetHeight, innerHTML } = element\n\n  const clone = element.cloneNode(true) as HTMLElement\n  element.parentElement?.insertBefore(clone, element)\n\n  clone.innerHTML += word\n  const height = clone.offsetHeight\n  clone.innerHTML = innerHTML\n\n  clone.remove()\n\n  return height > offsetHeight\n}\n\nSubmitIndicator._supportsSpacingProps = true\nexport default SubmitIndicator\n"],"mappings":"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"}

package/extensions/forms/Form/SubmitIndicator/SubmitIndicatorDocs.js

@@ -4,6 +4,16 @@ export const SubmitIndicatorProperties = {
     type: 'string',
     status: 'required'
   },
+  showLabel: {
+    doc: 'If `true`, the label will be shown. Defaults to `false`.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  label: {
+    doc: 'Provide a label that will be shown next to the indicator.',
+    type: 'string',
+    status: 'optional'
+  },
   children: {
     doc: 'If content is provided, the component will try to find out if the indicator needs to be put on a new row or not. This way it will animate the height nicely.',
     type: 'React.Node',

package/extensions/forms/Form/SubmitIndicator/SubmitIndicatorDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubmitIndicatorDocs.js","names":["SubmitIndicatorProperties","state","doc","type","status","children"],"sources":["../../../../../../src/extensions/forms/Form/SubmitIndicator/SubmitIndicatorDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const SubmitIndicatorProperties: PropertiesTableProps = {\n  state: {\n    doc: 'Provide `pending` to make the dots visible and `success` to show the checkmark icon.',\n    type: 'string',\n    status: 'required',\n  },\n  children: {\n    doc: 'If content is provided, the component will try to find out if the indicator needs to be put on a new row or not. This way it will animate the height nicely.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,yBAA+C,GAAG;EAC7DC,KAAK,EAAE;IACLC,GAAG,EAAE,sFAAsF;IAC3FC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,QAAQ,EAAE;IACRH,GAAG,EAAE,8JAA8J;IACnKC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC"}
+{"version":3,"file":"SubmitIndicatorDocs.js","names":["SubmitIndicatorProperties","state","doc","type","status","showLabel","label","children"],"sources":["../../../../../../src/extensions/forms/Form/SubmitIndicator/SubmitIndicatorDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const SubmitIndicatorProperties: PropertiesTableProps = {\n  state: {\n    doc: 'Provide `pending` to make the dots visible and `success` to show the checkmark icon.',\n    type: 'string',\n    status: 'required',\n  },\n  showLabel: {\n    doc: 'If `true`, the label will be shown. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  label: {\n    doc: 'Provide a label that will be shown next to the indicator.',\n    type: 'string',\n    status: 'optional',\n  },\n  children: {\n    doc: 'If content is provided, the component will try to find out if the indicator needs to be put on a new row or not. This way it will animate the height nicely.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,yBAA+C,GAAG;EAC7DC,KAAK,EAAE;IACLC,GAAG,EAAE,sFAAsF;IAC3FC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,SAAS,EAAE;IACTH,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDE,KAAK,EAAE;IACLJ,GAAG,EAAE,2DAA2D;IAChEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,QAAQ,EAAE;IACRL,GAAG,EAAE,8JAA8J;IACnKC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC"}

package/extensions/forms/Form/SubmitIndicator/style/dnb-form-submit-indicator.css

@@ -2,14 +2,28 @@
  * Utilities
  */
 .dnb-forms-submit-indicator {
-  display: inline;
   --padding-left: 0.5em;
+  --font-animation: font-size var(--font-animation-duration, 400ms)
+    var(--easing-default);
+  --opacity-animation: opacity var(--opacity-animation-duration, 0ms)
+    var(--easing-default) var(--opacity-animation-delay, 0ms);
+  display: inline;
+}
+.dnb-forms-submit-indicator:has(.dnb-forms-submit-indicator__label) {
+  --font-animation-duration: 400ms;
+  --opacity-animation-duration: 400ms;
+  --opacity-animation-delay: 250ms;
+}
+.dnb-forms-submit-indicator__label {
+  padding: 0.5em 0;
 }
 .dnb-forms-submit-indicator__content {
+  align-items: center;
   font-size: 0;
+  opacity: 0;
   line-height: 1em;
-  will-change: font-size;
-  transition: font-size 800ms var(--easing-default);
+  will-change: font-size opacity;
+  transition: var(--font-animation), var(--opacity-animation);
 }
 .dnb-forms-submit-indicator__content b {
   padding-left: 0.125em;
@@ -19,6 +33,7 @@
   animation-iteration-count: infinite;
   animation-duration: 1.3s;
   animation-delay: 200ms;
+  font-weight: var(--font-weight-bold);
 }
 .dnb-forms-submit-indicator__content b:nth-of-type(1) {
   padding-left: var(--padding-left);
@@ -35,21 +50,7 @@ html[data-visual-test] .dnb-forms-submit-indicator__content b {
 }
 .dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content {
   font-size: 1em;
-  font-weight: var(--font-weight-bold);
-}
-.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content {
-  font-size: 1em;
-}
-.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon {
-  padding-left: var(--padding-left);
-  color: var(--color-success-green);
-}
-.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon--default {
-  font-size: 1em;
-}
-.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content__label {
-  font-size: var(--font-size-small);
-  padding-left: calc(var(--padding-left) * 2);
+  opacity: 1;
 }
 .dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content {
   display: flex;

package/extensions/forms/Form/SubmitIndicator/style/dnb-form-submit-indicator.min.css

@@ -1 +1 @@
-.dnb-forms-submit-indicator{--padding-left:0.5em;display:inline}.dnb-forms-submit-indicator__content{font-size:0;line-height:1em;transition:font-size .8s var(--easing-default);will-change:font-size}.dnb-forms-submit-indicator__content b{animation-delay:.2s;animation-duration:1.3s;animation-iteration-count:infinite;animation-name:submit-indicator-dot;color:var(--dots-color,currentColor);opacity:.2;padding-left:.125em}.dnb-forms-submit-indicator__content b:first-of-type{animation-delay:50ms;padding-left:var(--padding-left)}.dnb-forms-submit-indicator__content b:nth-of-type(2){animation-delay:.2s}.dnb-forms-submit-indicator__content b:nth-of-type(3){animation-delay:.4s}html[data-visual-test] .dnb-forms-submit-indicator__content b{animation:none}.dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content{font-size:1em;font-weight:var(--font-weight-bold)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon{color:var(--color-success-green);padding-left:var(--padding-left)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon--default{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content__label{font-size:var(--font-size-small);padding-left:calc(var(--padding-left)*2)}.dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content{--padding-left:0.25em;display:flex}@keyframes submit-indicator-dot{0%{opacity:.2}15%{opacity:1}50%{opacity:1}60%{opacity:.3}to{opacity:.2}}@keyframes submit-indicator-success{0%{font-size:1em;opacity:.2}20%{font-size:1em;opacity:1}80%{opacity:1}85%{font-size:1em;opacity:.3}90%{opacity:0}to{font-size:0;opacity:0}}
+.dnb-forms-submit-indicator{--padding-left:0.5em;--font-animation:font-size var(--font-animation-duration,400ms) var(--easing-default);--opacity-animation:opacity var(--opacity-animation-duration,0ms) var(--easing-default) var(--opacity-animation-delay,0ms);display:inline}.dnb-forms-submit-indicator:has(.dnb-forms-submit-indicator__label){--font-animation-duration:400ms;--opacity-animation-duration:400ms;--opacity-animation-delay:250ms}.dnb-forms-submit-indicator__label{padding:.5em 0}.dnb-forms-submit-indicator__content{align-items:center;font-size:0;line-height:1em;opacity:0;transition:var(--font-animation),var(--opacity-animation);will-change:font-size opacity}.dnb-forms-submit-indicator__content b{animation-delay:.2s;animation-duration:1.3s;animation-iteration-count:infinite;animation-name:submit-indicator-dot;color:var(--dots-color,currentColor);font-weight:var(--font-weight-bold);opacity:.2;padding-left:.125em}.dnb-forms-submit-indicator__content b:first-of-type{animation-delay:50ms;padding-left:var(--padding-left)}.dnb-forms-submit-indicator__content b:nth-of-type(2){animation-delay:.2s}.dnb-forms-submit-indicator__content b:nth-of-type(3){animation-delay:.4s}html[data-visual-test] .dnb-forms-submit-indicator__content b{animation:none}.dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content{font-size:1em;opacity:1}.dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content{--padding-left:0.25em;display:flex}@keyframes submit-indicator-dot{0%{opacity:.2}15%{opacity:1}50%{opacity:1}60%{opacity:.3}to{opacity:.2}}@keyframes submit-indicator-success{0%{font-size:1em;opacity:.2}20%{font-size:1em;opacity:1}80%{opacity:1}85%{font-size:1em;opacity:.3}90%{opacity:0}to{font-size:0;opacity:0}}