@dnb/eufemia 10.69.1 → 10.70.0

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

@@ -1 +1 @@
-{"version":3,"file":"Password.js","names":["React","useContext","useRef","useState","useCallback","classnames","SharedContext","StringField","SubmitButton","IconView","IconViewOff","IconViewMedium","IconViewOffMedium","convertSnakeCaseProps","useTranslation","Password","_ref","_innerRef$current","id","className","innerRef","value","label","disabled","size","externalProps","_objectWithoutProperties","_excluded","props","Object","freeze","hidden","setHidden","sharedContext","translations","ref","current","toggleVisibility","event","onShowPassword","onHidePassword","_objectSpread","focus","getAriaLabel","ariaLabels","showPassword","ariaLabelShow","hidePassword","ariaLabelHide","show_password","hide_password","ToggleVisibilityButton","createElement","type","variant","icon","skeleton","onClick","_extends","submitElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Password/Password.tsx"],"sourcesContent":["import React, {\n  useContext,\n  useRef,\n  useState,\n  ElementRef,\n  MutableRefObject,\n  useCallback,\n} from 'react'\nimport classnames from 'classnames'\nimport SharedContext from '../../../../shared/Context'\nimport StringField, { Props as StringFieldProps } from '../String'\n\nimport { InputProps, SubmitButton } from '../../../../components/Input'\nimport IconView from '../../../../icons/view'\nimport IconViewOff from '../../../../icons/hide'\nimport IconViewMedium from '../../../../icons/view_medium'\nimport IconViewOffMedium from '../../../../icons/hide_medium'\nimport { convertSnakeCaseProps } from '../../../../shared/helpers/withSnakeCaseProps'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type PasswordVisibilityEvent =\n  React.MouseEvent<HTMLButtonElement> & {\n    value: string\n  }\n\nexport type PasswordProps = Omit<StringFieldProps, 'innerRef'> & {\n  /**\n   * Fires when the input toggles to show the password.\n   */\n  onShowPassword?: (event: PasswordVisibilityEvent) => void\n  /**\n   * Fires when the input toggles to hide the password.\n   */\n  onHidePassword?: (event: PasswordVisibilityEvent) => void\n  /**\n   * The sizes you can choose is small (1.5rem), default (2rem), medium (2.5rem) and large (3rem) are supported component sizes. Defaults to default / null. Also, if you define a number like size=\"2\" then it will be forwarded as the input element attribute.\n   */\n  size?: InputProps['size']\n  /**\n   * ElementRef passed on to the password input element.\n   */\n  innerRef?: MutableRefObject<HTMLInputElement>\n  /**\n   * @deprecated in v11, use use `locales`prop on `Provider` and override `passwordShowLabel` instead.\n   */\n  show_password?: string\n  /**\n   * @deprecated in v11, use use `locales`prop on `Provider` and override `passwordHideLabel` instead.\n   */\n  hide_password?: string\n  /**\n   * @deprecated in v11, use `onShowPassword` instead.\n   */\n  on_show_password?: (event: PasswordVisibilityEvent) => void\n  /**\n   * @deprecated in v11, use `onHidePassword` instead.\n   */\n  on_hide_password?: (event: PasswordVisibilityEvent) => void\n}\n\nfunction Password({\n  id,\n  className,\n  innerRef,\n  value,\n  label,\n  disabled,\n  size,\n  ...externalProps\n}: PasswordProps) {\n  // Object freeze used to prevent mutation of show_password and hide_password props. Freeze and convertToSnakeCase can be removed in v11.\n  const props = convertSnakeCaseProps(Object.freeze(externalProps))\n\n  const [hidden, setHidden] = useState<boolean>(true)\n\n  const sharedContext = useContext(SharedContext)\n  const translations = useTranslation().Password\n\n  const ref = useRef<ElementRef<'input'>>(innerRef?.current ?? null)\n\n  const toggleVisibility = useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      const { onShowPassword, onHidePassword } =\n        convertSnakeCaseProps(props)\n\n      const value = ref.current.value\n\n      setHidden((hidden) => {\n        hidden\n          ? onShowPassword?.({ ...event, value })\n          : onHidePassword?.({ ...event, value })\n\n        return !hidden\n      })\n\n      if (ref.current) {\n        ref.current.focus()\n      }\n    },\n    [props]\n  )\n\n  // Can be removed with v11, just used to make sure that the old show_password and hide_password are still backward compatible.\n  const getAriaLabel = useCallback(() => {\n    const ariaLabels = {\n      showPassword: translations.ariaLabelShow,\n      hidePassword: translations.ariaLabelHide,\n    }\n\n    if (externalProps.show_password) {\n      ariaLabels['showPassword'] = externalProps.show_password\n    }\n\n    if (externalProps.hide_password) {\n      ariaLabels['hidePassword'] = externalProps.hide_password\n    }\n\n    return ariaLabels\n  }, [\n    externalProps.show_password,\n    externalProps.hide_password,\n    translations,\n  ])\n\n  const ariaLabels = getAriaLabel()\n\n  const ToggleVisibilityButton = useCallback(() => {\n    return (\n      <SubmitButton\n        id={id + '-submit-button'}\n        type=\"button\"\n        variant=\"secondary\"\n        aria-controls={id}\n        aria-label={\n          hidden ? ariaLabels.showPassword : ariaLabels.hidePassword\n        }\n        icon={\n          size === 'large'\n            ? hidden\n              ? IconViewMedium\n              : IconViewOffMedium\n            : hidden\n            ? IconView\n            : IconViewOff\n        }\n        disabled={disabled}\n        skeleton={sharedContext.skeleton}\n        onClick={toggleVisibility}\n      />\n    )\n  }, [\n    id,\n    hidden,\n    sharedContext.skeleton,\n    disabled,\n    size,\n    toggleVisibility,\n    ariaLabels,\n  ])\n\n  return (\n    <StringField\n      id={id}\n      className={classnames('dnb-forms-field-password', className)}\n      label={label ?? translations.label}\n      type={hidden ? 'password' : 'text'}\n      value={value}\n      innerRef={ref}\n      aria-describedby={id + '-submit-button'}\n      submitElement={<ToggleVisibilityButton />}\n      disabled={disabled}\n      size={size}\n      {...props}\n    />\n  )\n}\n\nexport default Password\n\nPassword._supportsSpacingProps = true\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Password.js","names":["React","useContext","useRef","useState","useCallback","classnames","SharedContext","StringField","SubmitButton","IconView","IconViewOff","IconViewMedium","IconViewOffMedium","convertSnakeCaseProps","useTranslation","Password","_ref","_innerRef$current","id","className","innerRef","value","label","disabled","size","externalProps","_objectWithoutProperties","_excluded","props","Object","freeze","hidden","setHidden","sharedContext","translations","ref","current","toggleVisibility","event","onShowPassword","onHidePassword","_objectSpread","focus","getAriaLabel","ariaLabels","showPassword","ariaLabelShow","hidePassword","ariaLabelHide","show_password","hide_password","ToggleVisibilityButton","createElement","type","variant","icon","skeleton","onClick","_extends","submitElement","autoComplete","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Password/Password.tsx"],"sourcesContent":["import React, {\n  useContext,\n  useRef,\n  useState,\n  ElementRef,\n  MutableRefObject,\n  useCallback,\n} from 'react'\nimport classnames from 'classnames'\nimport SharedContext from '../../../../shared/Context'\nimport StringField, { Props as StringFieldProps } from '../String'\n\nimport { InputProps, SubmitButton } from '../../../../components/Input'\nimport IconView from '../../../../icons/view'\nimport IconViewOff from '../../../../icons/hide'\nimport IconViewMedium from '../../../../icons/view_medium'\nimport IconViewOffMedium from '../../../../icons/hide_medium'\nimport { convertSnakeCaseProps } from '../../../../shared/helpers/withSnakeCaseProps'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type PasswordVisibilityEvent =\n  React.MouseEvent<HTMLButtonElement> & {\n    value: string\n  }\n\nexport type PasswordProps = Omit<StringFieldProps, 'innerRef'> & {\n  /**\n   * Fires when the input toggles to show the password.\n   */\n  onShowPassword?: (event: PasswordVisibilityEvent) => void\n  /**\n   * Fires when the input toggles to hide the password.\n   */\n  onHidePassword?: (event: PasswordVisibilityEvent) => void\n  /**\n   * The sizes you can choose is small (1.5rem), default (2rem), medium (2.5rem) and large (3rem) are supported component sizes. Defaults to default / null. Also, if you define a number like size=\"2\" then it will be forwarded as the input element attribute.\n   */\n  size?: InputProps['size']\n  /**\n   * ElementRef passed on to the password input element.\n   */\n  innerRef?: MutableRefObject<HTMLInputElement>\n  /**\n   * @deprecated in v11, use use `locales`prop on `Provider` and override `passwordShowLabel` instead.\n   */\n  show_password?: string\n  /**\n   * @deprecated in v11, use use `locales`prop on `Provider` and override `passwordHideLabel` instead.\n   */\n  hide_password?: string\n  /**\n   * @deprecated in v11, use `onShowPassword` instead.\n   */\n  on_show_password?: (event: PasswordVisibilityEvent) => void\n  /**\n   * @deprecated in v11, use `onHidePassword` instead.\n   */\n  on_hide_password?: (event: PasswordVisibilityEvent) => void\n}\n\nfunction Password({\n  id,\n  className,\n  innerRef,\n  value,\n  label,\n  disabled,\n  size,\n  ...externalProps\n}: PasswordProps) {\n  // Object freeze used to prevent mutation of show_password and hide_password props. Freeze and convertToSnakeCase can be removed in v11.\n  const props = convertSnakeCaseProps(Object.freeze(externalProps))\n\n  const [hidden, setHidden] = useState<boolean>(true)\n\n  const sharedContext = useContext(SharedContext)\n  const translations = useTranslation().Password\n\n  const ref = useRef<ElementRef<'input'>>(innerRef?.current ?? null)\n\n  const toggleVisibility = useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      const { onShowPassword, onHidePassword } =\n        convertSnakeCaseProps(props)\n\n      const value = ref.current.value\n\n      setHidden((hidden) => {\n        hidden\n          ? onShowPassword?.({ ...event, value })\n          : onHidePassword?.({ ...event, value })\n\n        return !hidden\n      })\n\n      if (ref.current) {\n        ref.current.focus()\n      }\n    },\n    [props]\n  )\n\n  // Can be removed with v11, just used to make sure that the old show_password and hide_password are still backward compatible.\n  const getAriaLabel = useCallback(() => {\n    const ariaLabels = {\n      showPassword: translations.ariaLabelShow,\n      hidePassword: translations.ariaLabelHide,\n    }\n\n    if (externalProps.show_password) {\n      ariaLabels['showPassword'] = externalProps.show_password\n    }\n\n    if (externalProps.hide_password) {\n      ariaLabels['hidePassword'] = externalProps.hide_password\n    }\n\n    return ariaLabels\n  }, [\n    externalProps.show_password,\n    externalProps.hide_password,\n    translations,\n  ])\n\n  const ariaLabels = getAriaLabel()\n\n  const ToggleVisibilityButton = useCallback(() => {\n    return (\n      <SubmitButton\n        id={id + '-submit-button'}\n        type=\"button\"\n        variant=\"secondary\"\n        aria-controls={id}\n        aria-label={\n          hidden ? ariaLabels.showPassword : ariaLabels.hidePassword\n        }\n        icon={\n          size === 'large'\n            ? hidden\n              ? IconViewMedium\n              : IconViewOffMedium\n            : hidden\n            ? IconView\n            : IconViewOff\n        }\n        disabled={disabled}\n        skeleton={sharedContext.skeleton}\n        onClick={toggleVisibility}\n      />\n    )\n  }, [\n    id,\n    hidden,\n    sharedContext.skeleton,\n    disabled,\n    size,\n    toggleVisibility,\n    ariaLabels,\n  ])\n\n  return (\n    <StringField\n      id={id}\n      className={classnames('dnb-forms-field-password', className)}\n      label={label ?? translations.label}\n      type={hidden ? 'password' : 'text'}\n      value={value}\n      innerRef={ref}\n      aria-describedby={id + '-submit-button'}\n      submitElement={<ToggleVisibilityButton />}\n      disabled={disabled}\n      size={size}\n      autoComplete=\"current-password\"\n      {...props}\n    />\n  )\n}\n\nexport default Password\n\nPassword._supportsSpacingProps = true\n"],"mappings":"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","ignoreList":[]}

package/extensions/forms/Field/Provider/useFieldProvider.d.ts

@@ -85,8 +85,10 @@ declare function useFieldProvider(props?: Omit<FieldProviderProps, 'children'>):
             };
             getValueByPath: import("../../hooks/useDataValue").GetValueByPath<unknown>;
             getSourceValue: import("../../hooks/useDataValue").GetValueByPath<unknown>;
-            setFieldEventListener: (path: string, type: "onSubmit" | "onSubmitRequest" | "onPathChange" | "onMount", callback: (params?: {
+            setFieldEventListener: (path: string, type: "onSubmit" | "onSubmitCall" | "onSubmitRequest" | "onPathChange" | "onMount", callback: (params?: {
                 value: unknown;
+            } | {
+                preventSubmit: () => void;
             }) => void | Promise<void | Error>) => void;
             validators: Record<string, import("../../types").Validator<unknown, import("../../types").DefaultErrorMessages>>;
             props: import("../../types").UseFieldProps<unknown, unknown, import("../../types").DefaultErrorMessages>;
@@ -105,8 +107,10 @@ declare function useFieldProvider(props?: Omit<FieldProviderProps, 'children'>):
             };
             getValueByPath: import("../../hooks/useDataValue").GetValueByPath<unknown>;
             getSourceValue: import("../../hooks/useDataValue").GetValueByPath<unknown>;
-            setFieldEventListener: (path: string, type: "onSubmit" | "onSubmitRequest" | "onPathChange" | "onMount", callback: (params?: {
+            setFieldEventListener: (path: string, type: "onSubmit" | "onSubmitCall" | "onSubmitRequest" | "onPathChange" | "onMount", callback: (params?: {
                 value: unknown;
+            } | {
+                preventSubmit: () => void;
             }) => void | Promise<void | Error>) => void;
             validators: Record<string, import("../../types").Validator<unknown, import("../../types").DefaultErrorMessages>>;
             props: import("../../types").UseFieldProps<unknown, unknown, import("../../types").DefaultErrorMessages>;
@@ -125,8 +129,10 @@ declare function useFieldProvider(props?: Omit<FieldProviderProps, 'children'>):
             };
             getValueByPath: import("../../hooks/useDataValue").GetValueByPath<unknown>;
             getSourceValue: import("../../hooks/useDataValue").GetValueByPath<unknown>;
-            setFieldEventListener: (path: string, type: "onSubmit" | "onSubmitRequest" | "onPathChange" | "onMount", callback: (params?: {
+            setFieldEventListener: (path: string, type: "onSubmit" | "onSubmitCall" | "onSubmitRequest" | "onPathChange" | "onMount", callback: (params?: {
                 value: unknown;
+            } | {
+                preventSubmit: () => void;
             }) => void | Promise<void | Error>) => void;
             validators: Record<string, import("../../types").Validator<unknown, import("../../types").DefaultErrorMessages>>;
             props: import("../../types").UseFieldProps<unknown, unknown, import("../../types").DefaultErrorMessages>;

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

@@ -6,7 +6,7 @@ export type { UploadFile, UploadFileNative };
 export type UploadValue = Array<UploadFile | UploadFileNative>;
 export type Props = Omit<FieldProps<UploadValue, UploadValue | undefined>, 'name'> & SpacingProps & {
     width?: Omit<FieldBlockWidth, 'medium' | 'small'>;
-} & Pick<Partial<UploadProps>, 'title' | 'text' | 'acceptedFileTypes' | 'filesAmountLimit' | 'fileMaxSize' | 'onFileDelete' | 'onFileClick' | 'skeleton' | 'download'> & {
+} & Pick<Partial<UploadProps>, 'title' | 'text' | 'acceptedFileTypes' | 'filesAmountLimit' | 'fileMaxSize' | 'onFileDelete' | 'onFileClick' | 'skeleton' | 'download' | 'allowDuplicates'> & {
     fileHandler?: (newFiles: UploadValue) => UploadValue | Promise<UploadValue>;
 };
 declare function UploadComponent(props: Props): import("react/jsx-runtime").JSX.Element;

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

@@ -79,7 +79,9 @@ function UploadComponent(props) {
     fileMaxSize = 5,
     skeleton,
     onFileDelete,
-    onFileClick
+    onFileClick,
+    download,
+    allowDuplicates
   } = rest;
   const {
     files,
@@ -151,6 +153,8 @@ function UploadComponent(props) {
     id: id,
     acceptedFileTypes: acceptedFileTypes,
     filesAmountLimit: filesAmountLimit,
+    download: download,
+    allowDuplicates: allowDuplicates,
     fileMaxSize: fileMaxSize,
     skeleton: skeleton,
     onChange: changeHandler,
@@ -177,7 +181,11 @@ export function transformFiles(value) {
     }
     value.map(item => {
       if (item !== null && item !== void 0 && item.file && !(item.file instanceof File)) {
-        item['file'] = new File([], item['name']);
+        var _lastModified, _item$file2, _type, _item$file3;
+        item['file'] = new File([], item['name'] || (item === null || item === void 0 ? void 0 : item.file['name']), {
+          lastModified: (_lastModified = (_item$file2 = item.file) === null || _item$file2 === void 0 ? void 0 : _item$file2.lastModified) !== null && _lastModified !== void 0 ? _lastModified : 0,
+          type: (_type = (_item$file3 = item.file) === null || _item$file3 === void 0 ? void 0 : _item$file3.type) !== null && _type !== void 0 ? _type : ''
+        });
       }
       return item;
     });

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","UploadComponent","props","sharedTr","formsTr","errorMessages","errorRequired","fromInput","forEach","item","index","_item$file","name","preparedProps","_objectSpread","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","files","setFiles","filesRef","current","handleChangeAsync","_filesRef$current","existingFileIds","map","newFiles","filter","includes","newValidFiles","newFilesLoading","isLoading","incomingFiles","incomingFileObj","foundIndex","findIndex","newFile","push","indexOfFirstNewFile","_ref2","updatedFiles","slice","changeHandler","_ref3","fieldBlockProps","forId","labelSrOnly","createElement","_extends","onChange","Fragment","contentId","left","roundedCorner","_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\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 (files: UploadValue) => {\n      // Filter out existing files\n      const existingFileIds =\n        filesRef.current?.map((file) => file.id) || []\n      const newFiles = files.filter(\n        (file) => !existingFileIds.includes(file.id)\n      )\n      const newValidFiles = newFiles.filter((file) => !file.errorMessage)\n\n      if (newValidFiles.length > 0) {\n        // Set loading\n        const newFilesLoading = newFiles.map((file) => ({\n          ...file,\n          isLoading: !file.errorMessage,\n        }))\n        setFiles([...filesRef.current, ...newFilesLoading])\n\n        const incomingFiles = await fileHandler(newValidFiles)\n        // merge incoming files into existing order of newFiles.\n        incomingFiles.forEach((file) => {\n          const incomingFileObj = {\n            ...file,\n            isLoading: false,\n          }\n          const foundIndex = newFilesLoading.findIndex(\n            (newFile) => newFile.isLoading\n          )\n          if (foundIndex >= 0) {\n            newFilesLoading[foundIndex] = incomingFileObj\n          } else {\n            // if there's more files incoming than there's files loading (edge case), add them to end of array.\n            newFilesLoading.push(incomingFileObj)\n          }\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          ...newFilesLoading,\n          ...filesRef.current.slice(\n            indexOfFirstNewFile + newFilesLoading.length\n          ),\n        ]\n\n        // Set error, if any\n        handleChange(updatedFiles)\n      } else {\n        handleChange(files)\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\n            contentId={`${id}-help`}\n            help={help}\n            roundedCorner={false}\n          />\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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","ignoreList":[]}
+{"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","UploadComponent","props","sharedTr","formsTr","errorMessages","errorRequired","fromInput","forEach","item","index","_item$file","name","preparedProps","_objectSpread","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","download","allowDuplicates","files","setFiles","filesRef","current","handleChangeAsync","_filesRef$current","existingFileIds","map","newFiles","filter","includes","newValidFiles","newFilesLoading","isLoading","incomingFiles","incomingFileObj","foundIndex","findIndex","newFile","push","indexOfFirstNewFile","_ref2","updatedFiles","slice","changeHandler","_ref3","fieldBlockProps","forId","labelSrOnly","createElement","_extends","onChange","Fragment","contentId","left","roundedCorner","_supportsSpacingProps","Array","isArray","File","_lastModified","_item$file2","_type","_item$file3","lastModified","type"],"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    | 'allowDuplicates'\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\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    download,\n    allowDuplicates,\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 (files: UploadValue) => {\n      // Filter out existing files\n      const existingFileIds =\n        filesRef.current?.map((file) => file.id) || []\n      const newFiles = files.filter(\n        (file) => !existingFileIds.includes(file.id)\n      )\n      const newValidFiles = newFiles.filter((file) => !file.errorMessage)\n\n      if (newValidFiles.length > 0) {\n        // Set loading\n        const newFilesLoading = newFiles.map((file) => ({\n          ...file,\n          isLoading: !file.errorMessage,\n        }))\n        setFiles([...filesRef.current, ...newFilesLoading])\n\n        const incomingFiles = await fileHandler(newValidFiles)\n        // merge incoming files into existing order of newFiles.\n        incomingFiles.forEach((file) => {\n          const incomingFileObj = {\n            ...file,\n            isLoading: false,\n          }\n          const foundIndex = newFilesLoading.findIndex(\n            (newFile) => newFile.isLoading\n          )\n          if (foundIndex >= 0) {\n            newFilesLoading[foundIndex] = incomingFileObj\n          } else {\n            // if there's more files incoming than there's files loading (edge case), add them to end of array.\n            newFilesLoading.push(incomingFileObj)\n          }\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          ...newFilesLoading,\n          ...filesRef.current.slice(\n            indexOfFirstNewFile + newFilesLoading.length\n          ),\n        ]\n\n        // Set error, if any\n        handleChange(updatedFiles)\n      } else {\n        handleChange(files)\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        download={download}\n        allowDuplicates={allowDuplicates}\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\n            contentId={`${id}-help`}\n            help={help}\n            roundedCorner={false}\n          />\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'] || item?.file['name'], {\n          lastModified: (item.file as File)?.lastModified ?? 0,\n          type: (item.file as File)?.type ?? '',\n        })\n      }\n      return item\n    })\n  }\n\n  return value\n}\n"],"mappings":"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","ignoreList":[]}

package/extensions/forms/Form/SubmitConfirmation/SubmitConfirmation.js

@@ -20,7 +20,7 @@ function SubmitConfirmation(props) {
   } = props;
   const {
     setFormState,
-    setHandleSubmit,
+    setFieldEventListener,
     handleSubmit: handleFinalSubmit,
     submitState,
     formElementRef,
@@ -121,16 +121,16 @@ function SubmitConfirmation(props) {
     preventSubmit();
     await setConfirmationState('readyToBeSubmitted');
   }, [setConfirmationState, validatePreventSubmit]);
-  setHandleSubmit === null || setHandleSubmit === void 0 ? void 0 : setHandleSubmit(handleSubmit);
+  setFieldEventListener === null || setFieldEventListener === void 0 ? void 0 : setFieldEventListener(undefined, 'onSubmit', handleSubmit);
   const submitHandler = useCallback(async () => {
-    setHandleSubmit === null || setHandleSubmit === void 0 ? void 0 : setHandleSubmit(handleSubmit, {
+    setFieldEventListener === null || setFieldEventListener === void 0 ? void 0 : setFieldEventListener(undefined, 'onSubmit', handleSubmit, {
       remove: true
     });
     await setConfirmationState('submitInProgress');
     await handleFinalSubmit();
     await setConfirmationState('submissionComplete');
     setFocusOnButton();
-  }, [handleFinalSubmit, handleSubmit, setFocusOnButton, setHandleSubmit, setConfirmationState]);
+  }, [handleFinalSubmit, handleSubmit, setFocusOnButton, setFieldEventListener, setConfirmationState]);
   const sharedProviderParams = {
     formElement: {
       disabled: false

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

@@ -1 +1 @@
-{"version":3,"file":"SubmitConfirmation.js","names":["React","useCallback","useContext","useMemo","useReducer","useRef","DataContext","SharedProvider","HeightAnimation","removeUndefinedProps","SubmitConfirmation","props","forceUpdate","preventSubmitWhen","onStateChange","onSubmitResult","renderWithState","children","setFormState","setHandleSubmit","handleSubmit","handleFinalSubmit","submitState","formElementRef","internalDataRef","confirmationStateRef","submitStateRef","preventSubmitRef","undefined","validatePreventSubmit","current","getParamsRef","setConfirmationState","state","window","requestAnimationFrame","keepPending","confirmationState","connectWithDialog","openState","onConfirm","submitHandler","onDecline","cancelHandler","onClose","_ref","triggeredBy","data","Object","keys","length","_objectSpread","setFocusOnButton","form","element","querySelector","focus","e","_ref2","preventSubmit","remove","sharedProviderParams","formElement","disabled","createElement","Fragment","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/SubmitConfirmation/SubmitConfirmation.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport DataContext from '../../DataContext/Context'\nimport SharedProvider from '../../../../shared/Provider'\nimport { ContextProps } from '../../../../shared/Context'\nimport { HeightAnimation } from '../../../../components'\nimport {\n  DialogContentProps,\n  DialogProps,\n} from '../../../../components/dialog/types'\nimport { EventStateObject } from '../../types'\nimport { removeUndefinedProps } from '../../../../shared/component-helper'\n\nexport type ConfirmationState =\n  | 'idle'\n  | 'readyToBeSubmitted'\n  | 'submitInProgress'\n  | 'submissionComplete'\n\nexport type ConfirmParams = {\n  data: unknown\n  confirmationState: ConfirmationState\n  submitState: EventStateObject | undefined\n  connectWithDialog: Pick<\n    DialogProps & DialogContentProps,\n    'openState' | 'onConfirm' | 'onDecline' | 'onClose'\n  >\n  setConfirmationState: (state: ConfirmationState) => void\n  submitHandler: () => void | Promise<void>\n  cancelHandler: () => void | Promise<void>\n}\n\nexport type ConfirmProps = {\n  preventSubmitWhen?: (params: ConfirmParams) => boolean\n  onStateChange?: (params: ConfirmParams) => void | Promise<void>\n  onSubmitResult?: (params: ConfirmParams) => void\n  renderWithState?: (params: ConfirmParams) => React.ReactNode\n  children?: React.ReactNode\n}\n\nfunction SubmitConfirmation(props: ConfirmProps) {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const {\n    preventSubmitWhen,\n    onStateChange,\n    onSubmitResult,\n    renderWithState,\n    children,\n  } = props\n\n  const {\n    setFormState,\n    setHandleSubmit,\n    handleSubmit: handleFinalSubmit,\n    submitState,\n    formElementRef,\n    internalDataRef,\n  } = useContext(DataContext)\n\n  const confirmationStateRef = useRef<ConfirmationState>('idle')\n  const submitStateRef = useRef<EventStateObject>()\n  const preventSubmitRef = useRef<boolean>(undefined)\n\n  const validatePreventSubmit = useCallback(() => {\n    return (preventSubmitRef.current = preventSubmitWhen?.(\n      getParamsRef.current()\n    ))\n  }, [preventSubmitWhen])\n\n  const setConfirmationState = useCallback(\n    async (state: ConfirmationState) => {\n      confirmationStateRef.current = state\n      await onStateChange?.(getParamsRef.current())\n      if (typeof window !== 'undefined') {\n        window.requestAnimationFrame(() => {\n          switch (state) {\n            case 'idle':\n              setFormState('complete', { keepPending: false })\n              break\n            case 'readyToBeSubmitted':\n              setFormState('pending', { keepPending: true })\n              break\n            case 'submitInProgress':\n              setFormState('pending', { keepPending: true })\n              break\n            case 'submissionComplete':\n              setFormState('complete', { keepPending: false })\n              break\n            default:\n              forceUpdate()\n          }\n        })\n      }\n    },\n    [onStateChange, setFormState]\n  )\n\n  const getParamsRef = useRef(() => {\n    const confirmationState = confirmationStateRef.current\n\n    const connectWithDialog = {\n      openState: confirmationState === 'readyToBeSubmitted',\n      onConfirm: submitHandler,\n      onDecline: cancelHandler,\n      onClose: ({ triggeredBy }) => {\n        if (triggeredBy === 'keyboard') {\n          cancelHandler()\n        }\n      },\n    }\n\n    return {\n      data: internalDataRef?.current,\n      confirmationState,\n      setConfirmationState,\n      submitHandler,\n      cancelHandler,\n      connectWithDialog,\n      submitState: submitStateRef.current,\n    } satisfies ConfirmParams\n  })\n\n  useMemo(() => {\n    if (Object.keys(removeUndefinedProps(submitState) || {}).length > 0) {\n      submitStateRef.current = {\n        ...submitState,\n      } as EventStateObject\n      onSubmitResult?.(getParamsRef.current())\n    }\n  }, [submitState, onSubmitResult])\n\n  const setFocusOnButton = useCallback(() => {\n    try {\n      const form = formElementRef.current\n      const element = (form.querySelector('.dnb-forms-submit-button') ||\n        form) as HTMLElement\n      element.focus()\n    } catch (e) {\n      //\n    }\n  }, [formElementRef])\n\n  const cancelHandler = useCallback(async () => {\n    await setConfirmationState('idle')\n    setFocusOnButton()\n  }, [setFocusOnButton, setConfirmationState])\n\n  const handleSubmit = useCallback(\n    async ({ preventSubmit }) => {\n      if (confirmationStateRef.current === 'submitInProgress') {\n        return // stop here\n      }\n\n      if (validatePreventSubmit() !== true) {\n        await setConfirmationState('submitInProgress')\n        return // stop here\n      }\n\n      submitStateRef.current = undefined\n\n      // Prevent the form form from being submitted\n      preventSubmit()\n\n      await setConfirmationState('readyToBeSubmitted')\n    },\n    [setConfirmationState, validatePreventSubmit]\n  )\n  setHandleSubmit?.(handleSubmit)\n\n  const submitHandler = useCallback(async () => {\n    setHandleSubmit?.(handleSubmit, { remove: true })\n\n    await setConfirmationState('submitInProgress')\n    await handleFinalSubmit()\n    await setConfirmationState('submissionComplete')\n\n    setFocusOnButton()\n  }, [\n    handleFinalSubmit,\n    handleSubmit,\n    setFocusOnButton,\n    setHandleSubmit,\n    setConfirmationState,\n  ])\n\n  const sharedProviderParams: ContextProps = {\n    formElement: {\n      disabled: false,\n    },\n  }\n\n  return (\n    <>\n      {children}\n\n      <SharedProvider {...sharedProviderParams}>\n        <HeightAnimation>\n          {renderWithState?.(getParamsRef.current())}\n        </HeightAnimation>\n      </SharedProvider>\n    </>\n  )\n}\n\nSubmitConfirmation._supportsSpacingProps = 'children'\nexport default SubmitConfirmation\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SubmitConfirmation.js","names":["React","useCallback","useContext","useMemo","useReducer","useRef","DataContext","SharedProvider","HeightAnimation","removeUndefinedProps","SubmitConfirmation","props","forceUpdate","preventSubmitWhen","onStateChange","onSubmitResult","renderWithState","children","setFormState","setFieldEventListener","handleSubmit","handleFinalSubmit","submitState","formElementRef","internalDataRef","confirmationStateRef","submitStateRef","preventSubmitRef","undefined","validatePreventSubmit","current","getParamsRef","setConfirmationState","state","window","requestAnimationFrame","keepPending","confirmationState","connectWithDialog","openState","onConfirm","submitHandler","onDecline","cancelHandler","onClose","_ref","triggeredBy","data","Object","keys","length","_objectSpread","setFocusOnButton","form","element","querySelector","focus","e","_ref2","preventSubmit","remove","sharedProviderParams","formElement","disabled","createElement","Fragment","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/SubmitConfirmation/SubmitConfirmation.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport DataContext from '../../DataContext/Context'\nimport SharedProvider from '../../../../shared/Provider'\nimport { ContextProps } from '../../../../shared/Context'\nimport { HeightAnimation } from '../../../../components'\nimport {\n  DialogContentProps,\n  DialogProps,\n} from '../../../../components/dialog/types'\nimport { EventStateObject } from '../../types'\nimport { removeUndefinedProps } from '../../../../shared/component-helper'\n\nexport type ConfirmationState =\n  | 'idle'\n  | 'readyToBeSubmitted'\n  | 'submitInProgress'\n  | 'submissionComplete'\n\nexport type ConfirmParams = {\n  data: unknown\n  confirmationState: ConfirmationState\n  submitState: EventStateObject | undefined\n  connectWithDialog: Pick<\n    DialogProps & DialogContentProps,\n    'openState' | 'onConfirm' | 'onDecline' | 'onClose'\n  >\n  setConfirmationState: (state: ConfirmationState) => void\n  submitHandler: () => void | Promise<void>\n  cancelHandler: () => void | Promise<void>\n}\n\nexport type ConfirmProps = {\n  preventSubmitWhen?: (params: ConfirmParams) => boolean\n  onStateChange?: (params: ConfirmParams) => void | Promise<void>\n  onSubmitResult?: (params: ConfirmParams) => void\n  renderWithState?: (params: ConfirmParams) => React.ReactNode\n  children?: React.ReactNode\n}\n\nfunction SubmitConfirmation(props: ConfirmProps) {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const {\n    preventSubmitWhen,\n    onStateChange,\n    onSubmitResult,\n    renderWithState,\n    children,\n  } = props\n\n  const {\n    setFormState,\n    setFieldEventListener,\n    handleSubmit: handleFinalSubmit,\n    submitState,\n    formElementRef,\n    internalDataRef,\n  } = useContext(DataContext)\n\n  const confirmationStateRef = useRef<ConfirmationState>('idle')\n  const submitStateRef = useRef<EventStateObject>()\n  const preventSubmitRef = useRef<boolean>(undefined)\n\n  const validatePreventSubmit = useCallback(() => {\n    return (preventSubmitRef.current = preventSubmitWhen?.(\n      getParamsRef.current()\n    ))\n  }, [preventSubmitWhen])\n\n  const setConfirmationState = useCallback(\n    async (state: ConfirmationState) => {\n      confirmationStateRef.current = state\n      await onStateChange?.(getParamsRef.current())\n      if (typeof window !== 'undefined') {\n        window.requestAnimationFrame(() => {\n          switch (state) {\n            case 'idle':\n              setFormState('complete', { keepPending: false })\n              break\n            case 'readyToBeSubmitted':\n              setFormState('pending', { keepPending: true })\n              break\n            case 'submitInProgress':\n              setFormState('pending', { keepPending: true })\n              break\n            case 'submissionComplete':\n              setFormState('complete', { keepPending: false })\n              break\n            default:\n              forceUpdate()\n          }\n        })\n      }\n    },\n    [onStateChange, setFormState]\n  )\n\n  const getParamsRef = useRef(() => {\n    const confirmationState = confirmationStateRef.current\n\n    const connectWithDialog = {\n      openState: confirmationState === 'readyToBeSubmitted',\n      onConfirm: submitHandler,\n      onDecline: cancelHandler,\n      onClose: ({ triggeredBy }) => {\n        if (triggeredBy === 'keyboard') {\n          cancelHandler()\n        }\n      },\n    }\n\n    return {\n      data: internalDataRef?.current,\n      confirmationState,\n      setConfirmationState,\n      submitHandler,\n      cancelHandler,\n      connectWithDialog,\n      submitState: submitStateRef.current,\n    } satisfies ConfirmParams\n  })\n\n  useMemo(() => {\n    if (Object.keys(removeUndefinedProps(submitState) || {}).length > 0) {\n      submitStateRef.current = {\n        ...submitState,\n      } as EventStateObject\n      onSubmitResult?.(getParamsRef.current())\n    }\n  }, [submitState, onSubmitResult])\n\n  const setFocusOnButton = useCallback(() => {\n    try {\n      const form = formElementRef.current\n      const element = (form.querySelector('.dnb-forms-submit-button') ||\n        form) as HTMLElement\n      element.focus()\n    } catch (e) {\n      //\n    }\n  }, [formElementRef])\n\n  const cancelHandler = useCallback(async () => {\n    await setConfirmationState('idle')\n    setFocusOnButton()\n  }, [setFocusOnButton, setConfirmationState])\n\n  const handleSubmit = useCallback(\n    async ({ preventSubmit }) => {\n      if (confirmationStateRef.current === 'submitInProgress') {\n        return // stop here\n      }\n\n      if (validatePreventSubmit() !== true) {\n        await setConfirmationState('submitInProgress')\n        return // stop here\n      }\n\n      submitStateRef.current = undefined\n\n      // Prevent the form form from being submitted\n      preventSubmit()\n\n      await setConfirmationState('readyToBeSubmitted')\n    },\n    [setConfirmationState, validatePreventSubmit]\n  )\n  setFieldEventListener?.(undefined, 'onSubmit', handleSubmit)\n\n  const submitHandler = useCallback(async () => {\n    setFieldEventListener?.(undefined, 'onSubmit', handleSubmit, {\n      remove: true,\n    })\n\n    await setConfirmationState('submitInProgress')\n    await handleFinalSubmit()\n    await setConfirmationState('submissionComplete')\n\n    setFocusOnButton()\n  }, [\n    handleFinalSubmit,\n    handleSubmit,\n    setFocusOnButton,\n    setFieldEventListener,\n    setConfirmationState,\n  ])\n\n  const sharedProviderParams: ContextProps = {\n    formElement: {\n      disabled: false,\n    },\n  }\n\n  return (\n    <>\n      {children}\n\n      <SharedProvider {...sharedProviderParams}>\n        <HeightAnimation>\n          {renderWithState?.(getParamsRef.current())}\n        </HeightAnimation>\n      </SharedProvider>\n    </>\n  )\n}\n\nSubmitConfirmation._supportsSpacingProps = 'children'\nexport default SubmitConfirmation\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IACVC,WAAW,EACXC,UAAU,EACVC,OAAO,EACPC,UAAU,EACVC,MAAM,QACD,OAAO;AACd,OAAOC,WAAW,MAAM,2BAA2B;AACnD,OAAOC,cAAc,MAAM,6BAA6B;AAExD,SAASC,eAAe,QAAQ,wBAAwB;AAMxD,SAASC,oBAAoB,QAAQ,qCAAqC;AA6B1E,SAASC,kBAAkBA,CAACC,KAAmB,EAAE;EAC/C,MAAM,GAAGC,WAAW,CAAC,GAAGR,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;EAElD,MAAM;IACJS,iBAAiB;IACjBC,aAAa;IACbC,cAAc;IACdC,eAAe;IACfC;EACF,CAAC,GAAGN,KAAK;EAET,MAAM;IACJO,YAAY;IACZC,qBAAqB;IACrBC,YAAY,EAAEC,iBAAiB;IAC/BC,WAAW;IACXC,cAAc;IACdC;EACF,CAAC,GAAGtB,UAAU,CAACI,WAAW,CAAC;EAE3B,MAAMmB,oBAAoB,GAAGpB,MAAM,CAAoB,MAAM,CAAC;EAC9D,MAAMqB,cAAc,GAAGrB,MAAM,CAAmB,CAAC;EACjD,MAAMsB,gBAAgB,GAAGtB,MAAM,CAAUuB,SAAS,CAAC;EAEnD,MAAMC,qBAAqB,GAAG5B,WAAW,CAAC,MAAM;IAC9C,OAAQ0B,gBAAgB,CAACG,OAAO,GAAGjB,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAClDkB,YAAY,CAACD,OAAO,CAAC,CACvB,CAAC;EACH,CAAC,EAAE,CAACjB,iBAAiB,CAAC,CAAC;EAEvB,MAAMmB,oBAAoB,GAAG/B,WAAW,CACtC,MAAOgC,KAAwB,IAAK;IAClCR,oBAAoB,CAACK,OAAO,GAAGG,KAAK;IACpC,OAAMnB,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAGiB,YAAY,CAACD,OAAO,CAAC,CAAC,CAAC;IAC7C,IAAI,OAAOI,MAAM,KAAK,WAAW,EAAE;MACjCA,MAAM,CAACC,qBAAqB,CAAC,MAAM;QACjC,QAAQF,KAAK;UACX,KAAK,MAAM;YACTf,YAAY,CAAC,UAAU,EAAE;cAAEkB,WAAW,EAAE;YAAM,CAAC,CAAC;YAChD;UACF,KAAK,oBAAoB;YACvBlB,YAAY,CAAC,SAAS,EAAE;cAAEkB,WAAW,EAAE;YAAK,CAAC,CAAC;YAC9C;UACF,KAAK,kBAAkB;YACrBlB,YAAY,CAAC,SAAS,EAAE;cAAEkB,WAAW,EAAE;YAAK,CAAC,CAAC;YAC9C;UACF,KAAK,oBAAoB;YACvBlB,YAAY,CAAC,UAAU,EAAE;cAAEkB,WAAW,EAAE;YAAM,CAAC,CAAC;YAChD;UACF;YACExB,WAAW,CAAC,CAAC;QACjB;MACF,CAAC,CAAC;IACJ;EACF,CAAC,EACD,CAACE,aAAa,EAAEI,YAAY,CAC9B,CAAC;EAED,MAAMa,YAAY,GAAG1B,MAAM,CAAC,MAAM;IAChC,MAAMgC,iBAAiB,GAAGZ,oBAAoB,CAACK,OAAO;IAEtD,MAAMQ,iBAAiB,GAAG;MACxBC,SAAS,EAAEF,iBAAiB,KAAK,oBAAoB;MACrDG,SAAS,EAAEC,aAAa;MACxBC,SAAS,EAAEC,aAAa;MACxBC,OAAO,EAAEC,IAAA,IAAqB;QAAA,IAApB;UAAEC;QAAY,CAAC,GAAAD,IAAA;QACvB,IAAIC,WAAW,KAAK,UAAU,EAAE;UAC9BH,aAAa,CAAC,CAAC;QACjB;MACF;IACF,CAAC;IAED,OAAO;MACLI,IAAI,EAAEvB,eAAe,aAAfA,eAAe,uBAAfA,eAAe,CAAEM,OAAO;MAC9BO,iBAAiB;MACjBL,oBAAoB;MACpBS,aAAa;MACbE,aAAa;MACbL,iBAAiB;MACjBhB,WAAW,EAAEI,cAAc,CAACI;IAC9B,CAAC;EACH,CAAC,CAAC;EAEF3B,OAAO,CAAC,MAAM;IACZ,IAAI6C,MAAM,CAACC,IAAI,CAACxC,oBAAoB,CAACa,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC4B,MAAM,GAAG,CAAC,EAAE;MACnExB,cAAc,CAACI,OAAO,GAAAqB,aAAA,KACjB7B,WAAW,CACK;MACrBP,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAGgB,YAAY,CAACD,OAAO,CAAC,CAAC,CAAC;IAC1C;EACF,CAAC,EAAE,CAACR,WAAW,EAAEP,cAAc,CAAC,CAAC;EAEjC,MAAMqC,gBAAgB,GAAGnD,WAAW,CAAC,MAAM;IACzC,IAAI;MACF,MAAMoD,IAAI,GAAG9B,cAAc,CAACO,OAAO;MACnC,MAAMwB,OAAO,GAAID,IAAI,CAACE,aAAa,CAAC,0BAA0B,CAAC,IAC7DF,IAAoB;MACtBC,OAAO,CAACE,KAAK,CAAC,CAAC;IACjB,CAAC,CAAC,OAAOC,CAAC,EAAE,CAEZ;EACF,CAAC,EAAE,CAAClC,cAAc,CAAC,CAAC;EAEpB,MAAMoB,aAAa,GAAG1C,WAAW,CAAC,YAAY;IAC5C,MAAM+B,oBAAoB,CAAC,MAAM,CAAC;IAClCoB,gBAAgB,CAAC,CAAC;EACpB,CAAC,EAAE,CAACA,gBAAgB,EAAEpB,oBAAoB,CAAC,CAAC;EAE5C,MAAMZ,YAAY,GAAGnB,WAAW,CAC9B,MAAAyD,KAAA,IAA6B;IAAA,IAAtB;MAAEC;IAAc,CAAC,GAAAD,KAAA;IACtB,IAAIjC,oBAAoB,CAACK,OAAO,KAAK,kBAAkB,EAAE;MACvD;IACF;IAEA,IAAID,qBAAqB,CAAC,CAAC,KAAK,IAAI,EAAE;MACpC,MAAMG,oBAAoB,CAAC,kBAAkB,CAAC;MAC9C;IACF;IAEAN,cAAc,CAACI,OAAO,GAAGF,SAAS;IAGlC+B,aAAa,CAAC,CAAC;IAEf,MAAM3B,oBAAoB,CAAC,oBAAoB,CAAC;EAClD,CAAC,EACD,CAACA,oBAAoB,EAAEH,qBAAqB,CAC9C,CAAC;EACDV,qBAAqB,aAArBA,qBAAqB,uBAArBA,qBAAqB,CAAGS,SAAS,EAAE,UAAU,EAAER,YAAY,CAAC;EAE5D,MAAMqB,aAAa,GAAGxC,WAAW,CAAC,YAAY;IAC5CkB,qBAAqB,aAArBA,qBAAqB,uBAArBA,qBAAqB,CAAGS,SAAS,EAAE,UAAU,EAAER,YAAY,EAAE;MAC3DwC,MAAM,EAAE;IACV,CAAC,CAAC;IAEF,MAAM5B,oBAAoB,CAAC,kBAAkB,CAAC;IAC9C,MAAMX,iBAAiB,CAAC,CAAC;IACzB,MAAMW,oBAAoB,CAAC,oBAAoB,CAAC;IAEhDoB,gBAAgB,CAAC,CAAC;EACpB,CAAC,EAAE,CACD/B,iBAAiB,EACjBD,YAAY,EACZgC,gBAAgB,EAChBjC,qBAAqB,EACrBa,oBAAoB,CACrB,CAAC;EAEF,MAAM6B,oBAAkC,GAAG;IACzCC,WAAW,EAAE;MACXC,QAAQ,EAAE;IACZ;EACF,CAAC;EAED,OACE/D,KAAA,CAAAgE,aAAA,CAAAhE,KAAA,CAAAiE,QAAA,QACGhD,QAAQ,EAETjB,KAAA,CAAAgE,aAAA,CAACzD,cAAc,EAAKsD,oBAAoB,EACtC7D,KAAA,CAAAgE,aAAA,CAACxD,eAAe,QACbQ,eAAe,aAAfA,eAAe,uBAAfA,eAAe,CAAGe,YAAY,CAACD,OAAO,CAAC,CAAC,CAC1B,CACH,CAChB,CAAC;AAEP;AAEApB,kBAAkB,CAACwD,qBAAqB,GAAG,UAAU;AACrD,eAAexD,kBAAkB","ignoreList":[]}

package/extensions/forms/Form/Visibility/VisibilityDocs.js

@@ -1,7 +1,7 @@
 import { HeightAnimationEvents } from '../../../../components/height-animation/HeightAnimationDocs';
 export const VisibilityProperties = {
   visibleWhen: {
-    doc: 'Provide a `path` or `itemPath` and a `hasValue` method that returns a boolean or the expected value in order to show children. The first parameter is the value of the path. You can also use `isValid` instead of `hasValue` to only show the children when the field has no errors and has lost focus (blurred). You can change that behavior by using the `validateContinuously` property.',
+    doc: 'Provide a `path` or `itemPath`, and a `hasValue` function that returns either a boolean or the expected value to determine whether the children should be shown. The first parameter passed to `hasValue` is the value at the given `path`. If the `path` does not exist, the value will be `undefined`. \nAlternatively, you can use `isValid` instead of `hasValue` to show the children only when the field has no validation errors and has been blurred (lost focus). You can change this behavior by setting the `validateContinuously` property.',
     type: 'object',
     status: 'optional'
   },

package/extensions/forms/Form/Visibility/VisibilityDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"VisibilityDocs.js","names":["HeightAnimationEvents","VisibilityProperties","visibleWhen","doc","type","status","visibleWhenNot","pathDefined","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","inferData","visible","animate","keepInDOM","compensateForGap","filterData","fieldPropsWhenHidden","element","children","VisibilityEvents","onVisible","onOpen","onAnimationEnd"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/VisibilityDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { HeightAnimationEvents } from '../../../../components/height-animation/HeightAnimationDocs'\n\nexport const VisibilityProperties: PropertiesTableProps = {\n  visibleWhen: {\n    doc: 'Provide a `path` or `itemPath` and a `hasValue` method that returns a boolean or the expected value in order to show children. The first parameter is the value of the path. You can also use `isValid` instead of `hasValue` to only show the children when the field has no errors and has lost focus (blurred). You can change that behavior by using the `validateContinuously` property.',\n    type: 'object',\n    status: 'optional',\n  },\n  visibleWhenNot: {\n    doc: 'Same as `visibleWhen`, but with inverted logic.',\n    type: 'object',\n    status: 'optional',\n  },\n  pathDefined: {\n    doc: 'Given data context path must be defined to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathUndefined: {\n    doc: 'Given data context path must be undefined to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathTruthy: {\n    doc: 'Given data context path must be truthy to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathFalsy: {\n    doc: 'Given data context path must be falsy to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathTrue: {\n    doc: 'Given data context path must be true to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathFalse: {\n    doc: 'Given data context path must be false to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  inferData: {\n    doc: 'Will be called to decide by external logic, and show/hide contents based on the return value.',\n    type: 'function',\n    status: 'optional',\n  },\n  visible: {\n    doc: 'Control visibility directly using the `visible` prop. When used alongside other conditions, the `visible` prop takes precedence.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  animate: {\n    doc: 'Define if the content should animate during show/hide.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  keepInDOM: {\n    doc: \"Keep the content in the DOM, even if it's not visible. Can be used to let fields run validation.\",\n    type: 'boolean',\n    status: 'optional',\n  },\n  compensateForGap: {\n    doc: 'To compensate for CSS gap between the rows, so animation does not jump during the animation. Provide a CSS unit or `auto`. Defaults to `null`.',\n    type: 'string',\n    status: 'optional',\n  },\n  filterData: {\n    doc: 'Filter data based on provided criteria. More info about `filterData` can be found in the [Getting Started](/uilib/extensions/forms/getting-started/#filter-data) documentation.',\n    type: ['object', 'function'],\n    status: 'optional',\n  },\n  fieldPropsWhenHidden: {\n    doc: 'When visibility is hidden, and `keepInDOM` is true, pass these props to the children.',\n    type: 'various',\n    status: 'optional',\n  },\n  element: {\n    doc: 'Define the type of element. Defaults to `div`. Only for when `animate` is true.',\n    type: 'string or React.Element',\n    status: 'optional',\n  },\n  children: {\n    doc: 'Contents.',\n    type: 'React.Node',\n    status: 'required',\n  },\n}\n\nexport const VisibilityEvents: PropertiesTableProps = {\n  onVisible: {\n    doc: 'Callback for when the content gets visible. Returns a boolean as the first parameter.',\n    type: HeightAnimationEvents.onOpen.type,\n    status: 'optional',\n  },\n  onAnimationEnd: HeightAnimationEvents.onAnimationEnd,\n}\n"],"mappings":"AACA,SAASA,qBAAqB,QAAQ,6DAA6D;AAEnG,OAAO,MAAMC,oBAA0C,GAAG;EACxDC,WAAW,EAAE;IACXC,GAAG,EAAE,+XAA+X;IACpYC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,cAAc,EAAE;IACdH,GAAG,EAAE,iDAAiD;IACtDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,WAAW,EAAE;IACXJ,GAAG,EAAE,2DAA2D;IAChEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,aAAa,EAAE;IACbL,GAAG,EAAE,6DAA6D;IAClEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,UAAU,EAAE;IACVN,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDK,SAAS,EAAE;IACTP,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,QAAQ,EAAE;IACRR,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,SAAS,EAAE;IACTT,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,SAAS,EAAE;IACTV,GAAG,EAAE,+FAA+F;IACpGC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDS,OAAO,EAAE;IACPX,GAAG,EAAE,kIAAkI;IACvIC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDU,OAAO,EAAE;IACPZ,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDW,SAAS,EAAE;IACTb,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDY,gBAAgB,EAAE;IAChBd,GAAG,EAAE,gJAAgJ;IACrJC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDa,UAAU,EAAE;IACVf,GAAG,EAAE,iLAAiL;IACtLC,IAAI,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC;IAC5BC,MAAM,EAAE;EACV,CAAC;EACDc,oBAAoB,EAAE;IACpBhB,GAAG,EAAE,uFAAuF;IAC5FC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDe,OAAO,EAAE;IACPjB,GAAG,EAAE,iFAAiF;IACtFC,IAAI,EAAE,yBAAyB;IAC/BC,MAAM,EAAE;EACV,CAAC;EACDgB,QAAQ,EAAE;IACRlB,GAAG,EAAE,WAAW;IAChBC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMiB,gBAAsC,GAAG;EACpDC,SAAS,EAAE;IACTpB,GAAG,EAAE,uFAAuF;IAC5FC,IAAI,EAAEJ,qBAAqB,CAACwB,MAAM,CAACpB,IAAI;IACvCC,MAAM,EAAE;EACV,CAAC;EACDoB,cAAc,EAAEzB,qBAAqB,CAACyB;AACxC,CAAC","ignoreList":[]}
+{"version":3,"file":"VisibilityDocs.js","names":["HeightAnimationEvents","VisibilityProperties","visibleWhen","doc","type","status","visibleWhenNot","pathDefined","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","inferData","visible","animate","keepInDOM","compensateForGap","filterData","fieldPropsWhenHidden","element","children","VisibilityEvents","onVisible","onOpen","onAnimationEnd"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/VisibilityDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\nimport { HeightAnimationEvents } from '../../../../components/height-animation/HeightAnimationDocs'\n\nexport const VisibilityProperties: PropertiesTableProps = {\n  visibleWhen: {\n    doc: 'Provide a `path` or `itemPath`, and a `hasValue` function that returns either a boolean or the expected value to determine whether the children should be shown. The first parameter passed to `hasValue` is the value at the given `path`. If the `path` does not exist, the value will be `undefined`. \\nAlternatively, you can use `isValid` instead of `hasValue` to show the children only when the field has no validation errors and has been blurred (lost focus). You can change this behavior by setting the `validateContinuously` property.',\n    type: 'object',\n    status: 'optional',\n  },\n  visibleWhenNot: {\n    doc: 'Same as `visibleWhen`, but with inverted logic.',\n    type: 'object',\n    status: 'optional',\n  },\n  pathDefined: {\n    doc: 'Given data context path must be defined to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathUndefined: {\n    doc: 'Given data context path must be undefined to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathTruthy: {\n    doc: 'Given data context path must be truthy to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathFalsy: {\n    doc: 'Given data context path must be falsy to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathTrue: {\n    doc: 'Given data context path must be true to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathFalse: {\n    doc: 'Given data context path must be false to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  inferData: {\n    doc: 'Will be called to decide by external logic, and show/hide contents based on the return value.',\n    type: 'function',\n    status: 'optional',\n  },\n  visible: {\n    doc: 'Control visibility directly using the `visible` prop. When used alongside other conditions, the `visible` prop takes precedence.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  animate: {\n    doc: 'Define if the content should animate during show/hide.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  keepInDOM: {\n    doc: \"Keep the content in the DOM, even if it's not visible. Can be used to let fields run validation.\",\n    type: 'boolean',\n    status: 'optional',\n  },\n  compensateForGap: {\n    doc: 'To compensate for CSS gap between the rows, so animation does not jump during the animation. Provide a CSS unit or `auto`. Defaults to `null`.',\n    type: 'string',\n    status: 'optional',\n  },\n  filterData: {\n    doc: 'Filter data based on provided criteria. More info about `filterData` can be found in the [Getting Started](/uilib/extensions/forms/getting-started/#filter-data) documentation.',\n    type: ['object', 'function'],\n    status: 'optional',\n  },\n  fieldPropsWhenHidden: {\n    doc: 'When visibility is hidden, and `keepInDOM` is true, pass these props to the children.',\n    type: 'various',\n    status: 'optional',\n  },\n  element: {\n    doc: 'Define the type of element. Defaults to `div`. Only for when `animate` is true.',\n    type: 'string or React.Element',\n    status: 'optional',\n  },\n  children: {\n    doc: 'Contents.',\n    type: 'React.Node',\n    status: 'required',\n  },\n}\n\nexport const VisibilityEvents: PropertiesTableProps = {\n  onVisible: {\n    doc: 'Callback for when the content gets visible. Returns a boolean as the first parameter.',\n    type: HeightAnimationEvents.onOpen.type,\n    status: 'optional',\n  },\n  onAnimationEnd: HeightAnimationEvents.onAnimationEnd,\n}\n"],"mappings":"AACA,SAASA,qBAAqB,QAAQ,6DAA6D;AAEnG,OAAO,MAAMC,oBAA0C,GAAG;EACxDC,WAAW,EAAE;IACXC,GAAG,EAAE,yhBAAyhB;IAC9hBC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,cAAc,EAAE;IACdH,GAAG,EAAE,iDAAiD;IACtDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,WAAW,EAAE;IACXJ,GAAG,EAAE,2DAA2D;IAChEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,aAAa,EAAE;IACbL,GAAG,EAAE,6DAA6D;IAClEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,UAAU,EAAE;IACVN,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDK,SAAS,EAAE;IACTP,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,QAAQ,EAAE;IACRR,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,SAAS,EAAE;IACTT,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,SAAS,EAAE;IACTV,GAAG,EAAE,+FAA+F;IACpGC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDS,OAAO,EAAE;IACPX,GAAG,EAAE,kIAAkI;IACvIC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDU,OAAO,EAAE;IACPZ,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDW,SAAS,EAAE;IACTb,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDY,gBAAgB,EAAE;IAChBd,GAAG,EAAE,gJAAgJ;IACrJC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDa,UAAU,EAAE;IACVf,GAAG,EAAE,iLAAiL;IACtLC,IAAI,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC;IAC5BC,MAAM,EAAE;EACV,CAAC;EACDc,oBAAoB,EAAE;IACpBhB,GAAG,EAAE,uFAAuF;IAC5FC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDe,OAAO,EAAE;IACPjB,GAAG,EAAE,iFAAiF;IACtFC,IAAI,EAAE,yBAAyB;IAC/BC,MAAM,EAAE;EACV,CAAC;EACDgB,QAAQ,EAAE;IACRlB,GAAG,EAAE,WAAW;IAChBC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMiB,gBAAsC,GAAG;EACpDC,SAAS,EAAE;IACTpB,GAAG,EAAE,uFAAuF;IAC5FC,IAAI,EAAEJ,qBAAqB,CAACwB,MAAM,CAACpB,IAAI;IACvCC,MAAM,EAAE;EACV,CAAC;EACDoB,cAAc,EAAEzB,qBAAqB,CAACyB;AACxC,CAAC","ignoreList":[]}

package/extensions/forms/Form/Visibility/useVisibility.js

@@ -60,23 +60,19 @@ export default function useVisibility(props) {
         return visibleWhenNot ? !result : result;
       }
       if ('hasValue' in visibleWhen || 'withValue' in visibleWhen) {
+        var _visibleWhen, _visibleWhen$hasValue, _visibleWhen2, _visibleWhen3;
         const hasPath = pointer.has(data, path);
-        if (hasPath) {
-          var _visibleWhen, _visibleWhen$hasValue, _visibleWhen2, _visibleWhen3;
-          const value = pointer.get(data, path);
-          if ((_visibleWhen = visibleWhen) !== null && _visibleWhen !== void 0 && _visibleWhen['withValue']) {
-            console.warn('VisibleWhen: "withValue" is deprecated, use "hasValue" instead');
-          }
-          const hasValue = (_visibleWhen$hasValue = (_visibleWhen2 = visibleWhen) === null || _visibleWhen2 === void 0 ? void 0 : _visibleWhen2['hasValue']) !== null && _visibleWhen$hasValue !== void 0 ? _visibleWhen$hasValue : (_visibleWhen3 = visibleWhen) === null || _visibleWhen3 === void 0 ? void 0 : _visibleWhen3['withValue'];
-          const result = typeof hasValue === 'function' ? hasValue(value) === false : hasValue !== value;
-          if (visibleWhenNot) {
-            if (!result) {
-              return false;
-            }
-          } else if (result) {
+        const value = hasPath ? pointer.get(data, path) : undefined;
+        if ((_visibleWhen = visibleWhen) !== null && _visibleWhen !== void 0 && _visibleWhen['withValue']) {
+          console.warn('VisibleWhen: "withValue" is deprecated, use "hasValue" instead');
+        }
+        const hasValue = (_visibleWhen$hasValue = (_visibleWhen2 = visibleWhen) === null || _visibleWhen2 === void 0 ? void 0 : _visibleWhen2['hasValue']) !== null && _visibleWhen$hasValue !== void 0 ? _visibleWhen$hasValue : (_visibleWhen3 = visibleWhen) === null || _visibleWhen3 === void 0 ? void 0 : _visibleWhen3['withValue'];
+        const result = typeof hasValue === 'function' ? hasValue(value) === false : hasValue !== value;
+        if (visibleWhenNot) {
+          if (!result) {
             return false;
           }
-        } else {
+        } else if (result) {
           return false;
         }
       }

package/extensions/forms/Form/Visibility/useVisibility.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVisibility.js","names":["useCallback","useContext","useRef","pointer","DataContext","usePath","useVisibility","props","hasFieldError","filterDataHandler","mountedFieldsRef","data","originalData","makePath","makeIteratePath","propsRef","current","withinIterate","makeLocalPath","path","check","visible","visibleWhen","visibleWhenNot","pathDefined","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","pathValue","whenValue","inferData","filterData","arguments","length","undefined","itemPath","item","get","isMounted","result","continuousValidation","validateContinuously","isFocused","hasPath","has","_visibleWhen","_visibleWhen$hasValue","_visibleWhen2","_visibleWhen3","value","console","warn","hasValue","getValue","Boolean"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/useVisibility.tsx"],"sourcesContent":["import { useCallback, useContext, useRef } from 'react'\nimport pointer from '../../utils/json-pointer'\nimport DataContext from '../../DataContext/Context'\nimport usePath from '../../hooks/usePath'\nimport { Path } from '../../types'\nimport { Props } from './Visibility'\n\nexport type { Props }\n\nexport default function useVisibility(props?: Partial<Props>) {\n  const {\n    hasFieldError,\n    filterDataHandler,\n    mountedFieldsRef,\n    data: originalData,\n  } = useContext(DataContext)\n\n  const { makePath, makeIteratePath } = usePath()\n\n  // Forward props to the \"check\" method with ref to avoid infinite loop\n  const propsRef = useRef(props)\n  propsRef.current = props\n\n  const { withinIterate } = props || {}\n  const makeLocalPath = useCallback(\n    (path: Path) => {\n      if (withinIterate) {\n        return makeIteratePath(path)\n      }\n\n      return makePath(path)\n    },\n    [makeIteratePath, makePath, withinIterate]\n  )\n\n  const check = useCallback(\n    (\n      {\n        visible,\n        visibleWhen,\n        visibleWhenNot,\n        pathDefined,\n        pathUndefined,\n        pathTruthy,\n        pathFalsy,\n        pathTrue,\n        pathFalse,\n        pathValue,\n        whenValue,\n        inferData,\n        filterData,\n      }: Partial<Props> = propsRef.current\n    ) => {\n      if (typeof visible === 'boolean') {\n        return visible\n      }\n\n      const data =\n        (filterData && filterDataHandler?.(originalData, filterData)) ||\n        originalData\n\n      if (visibleWhen || visibleWhenNot) {\n        if (visibleWhenNot) {\n          visibleWhen = visibleWhenNot\n        }\n\n        const path =\n          'itemPath' in visibleWhen\n            ? makeIteratePath(visibleWhen.itemPath)\n            : makePath(visibleWhen.path)\n\n        if ('isValid' in visibleWhen) {\n          const item = mountedFieldsRef.current.get(path)\n          if (!item || item.isMounted !== true) {\n            return visibleWhenNot ? true : false\n          }\n          const result =\n            (visibleWhen.continuousValidation ||\n            visibleWhen.validateContinuously\n              ? true\n              : item.isFocused !== true) && hasFieldError(path) === false\n          return visibleWhenNot ? !result : result\n        }\n\n        if ('hasValue' in visibleWhen || 'withValue' in visibleWhen) {\n          const hasPath = pointer.has(data, path)\n\n          if (hasPath) {\n            const value = pointer.get(data, path)\n\n            if (visibleWhen?.['withValue']) {\n              console.warn(\n                'VisibleWhen: \"withValue\" is deprecated, use \"hasValue\" instead'\n              )\n            }\n\n            const hasValue =\n              visibleWhen?.['hasValue'] ?? visibleWhen?.['withValue']\n            const result =\n              typeof hasValue === 'function'\n                ? hasValue(value) === false\n                : hasValue !== value\n\n            if (visibleWhenNot) {\n              if (!result) {\n                return false\n              }\n            } else if (result) {\n              return false\n            }\n          } else {\n            return false\n          }\n        }\n      }\n\n      const getValue = (path: Path) => {\n        if (pointer.has(data, path)) {\n          return pointer.get(data, path)\n        }\n      }\n\n      if (pathDefined) {\n        return getValue(makeLocalPath(pathDefined)) !== undefined\n      }\n      if (pathUndefined) {\n        return getValue(makeLocalPath(pathUndefined)) === undefined\n      }\n\n      if (pathTrue && getValue(makeLocalPath(pathTrue)) !== true) {\n        return false\n      }\n      if (pathFalse && getValue(makeLocalPath(pathFalse)) !== false) {\n        return false\n      }\n\n      if (\n        pathTruthy &&\n        Boolean(getValue(makeLocalPath(pathTruthy))) === false\n      ) {\n        return false\n      }\n      if (\n        pathFalsy &&\n        Boolean(getValue(makeLocalPath(pathFalsy))) === true\n      ) {\n        return false\n      }\n\n      if (inferData && !inferData(data)) {\n        return false\n      }\n\n      // Deprecated can be removed in v11\n      if (pathValue && getValue(makeLocalPath(pathValue)) !== whenValue) {\n        return false\n      }\n\n      return true\n    },\n    [\n      filterDataHandler,\n      originalData,\n      makeLocalPath,\n      makeIteratePath,\n      makePath,\n      mountedFieldsRef,\n      hasFieldError,\n    ]\n  )\n\n  return { check }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"useVisibility.js","names":["useCallback","useContext","useRef","pointer","DataContext","usePath","useVisibility","props","hasFieldError","filterDataHandler","mountedFieldsRef","data","originalData","makePath","makeIteratePath","propsRef","current","withinIterate","makeLocalPath","path","check","visible","visibleWhen","visibleWhenNot","pathDefined","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","pathValue","whenValue","inferData","filterData","arguments","length","undefined","itemPath","item","get","isMounted","result","continuousValidation","validateContinuously","isFocused","_visibleWhen","_visibleWhen$hasValue","_visibleWhen2","_visibleWhen3","hasPath","has","value","console","warn","hasValue","getValue","Boolean"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/useVisibility.tsx"],"sourcesContent":["import { useCallback, useContext, useRef } from 'react'\nimport pointer from '../../utils/json-pointer'\nimport DataContext from '../../DataContext/Context'\nimport usePath from '../../hooks/usePath'\nimport { Path } from '../../types'\nimport { Props } from './Visibility'\n\nexport type { Props }\n\nexport default function useVisibility(props?: Partial<Props>) {\n  const {\n    hasFieldError,\n    filterDataHandler,\n    mountedFieldsRef,\n    data: originalData,\n  } = useContext(DataContext)\n\n  const { makePath, makeIteratePath } = usePath()\n\n  // Forward props to the \"check\" method with ref to avoid infinite loop\n  const propsRef = useRef(props)\n  propsRef.current = props\n\n  const { withinIterate } = props || {}\n  const makeLocalPath = useCallback(\n    (path: Path) => {\n      if (withinIterate) {\n        return makeIteratePath(path)\n      }\n\n      return makePath(path)\n    },\n    [makeIteratePath, makePath, withinIterate]\n  )\n\n  const check = useCallback(\n    (\n      {\n        visible,\n        visibleWhen,\n        visibleWhenNot,\n        pathDefined,\n        pathUndefined,\n        pathTruthy,\n        pathFalsy,\n        pathTrue,\n        pathFalse,\n        pathValue,\n        whenValue,\n        inferData,\n        filterData,\n      }: Partial<Props> = propsRef.current\n    ) => {\n      if (typeof visible === 'boolean') {\n        return visible\n      }\n\n      const data =\n        (filterData && filterDataHandler?.(originalData, filterData)) ||\n        originalData\n\n      if (visibleWhen || visibleWhenNot) {\n        if (visibleWhenNot) {\n          visibleWhen = visibleWhenNot\n        }\n\n        const path =\n          'itemPath' in visibleWhen\n            ? makeIteratePath(visibleWhen.itemPath)\n            : makePath(visibleWhen.path)\n\n        if ('isValid' in visibleWhen) {\n          const item = mountedFieldsRef.current.get(path)\n          if (!item || item.isMounted !== true) {\n            return visibleWhenNot ? true : false\n          }\n          const result =\n            (visibleWhen.continuousValidation ||\n            visibleWhen.validateContinuously\n              ? true\n              : item.isFocused !== true) && hasFieldError(path) === false\n          return visibleWhenNot ? !result : result\n        }\n\n        if ('hasValue' in visibleWhen || 'withValue' in visibleWhen) {\n          const hasPath = pointer.has(data, path)\n          const value = hasPath ? pointer.get(data, path) : undefined\n\n          if (visibleWhen?.['withValue']) {\n            console.warn(\n              'VisibleWhen: \"withValue\" is deprecated, use \"hasValue\" instead'\n            )\n          }\n\n          const hasValue =\n            visibleWhen?.['hasValue'] ?? visibleWhen?.['withValue']\n          const result =\n            typeof hasValue === 'function'\n              ? hasValue(value) === false\n              : hasValue !== value\n\n          if (visibleWhenNot) {\n            if (!result) {\n              return false\n            }\n          } else if (result) {\n            return false\n          }\n        }\n      }\n\n      const getValue = (path: Path) => {\n        if (pointer.has(data, path)) {\n          return pointer.get(data, path)\n        }\n      }\n\n      if (pathDefined) {\n        return getValue(makeLocalPath(pathDefined)) !== undefined\n      }\n      if (pathUndefined) {\n        return getValue(makeLocalPath(pathUndefined)) === undefined\n      }\n\n      if (pathTrue && getValue(makeLocalPath(pathTrue)) !== true) {\n        return false\n      }\n      if (pathFalse && getValue(makeLocalPath(pathFalse)) !== false) {\n        return false\n      }\n\n      if (\n        pathTruthy &&\n        Boolean(getValue(makeLocalPath(pathTruthy))) === false\n      ) {\n        return false\n      }\n      if (\n        pathFalsy &&\n        Boolean(getValue(makeLocalPath(pathFalsy))) === true\n      ) {\n        return false\n      }\n\n      if (inferData && !inferData(data)) {\n        return false\n      }\n\n      // Deprecated can be removed in v11\n      if (pathValue && getValue(makeLocalPath(pathValue)) !== whenValue) {\n        return false\n      }\n\n      return true\n    },\n    [\n      filterDataHandler,\n      originalData,\n      makeLocalPath,\n      makeIteratePath,\n      makePath,\n      mountedFieldsRef,\n      hasFieldError,\n    ]\n  )\n\n  return { check }\n}\n"],"mappings":"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","ignoreList":[]}

package/extensions/forms/Value/Date/Date.d.ts

@@ -8,10 +8,4 @@ declare function DateComponent(props: Props): import("react/jsx-runtime").JSX.El
 declare namespace DateComponent {
     var _supportsSpacingProps: boolean;
 }
-export type FormatDateOptions = {
-    locale?: string;
-    variant?: Props['variant'];
-};
-export declare function formatDate(value: string, { locale, variant }?: FormatDateOptions): string;
-export declare function getOptions(variant: Props['variant']): Intl.DateTimeFormatOptions;
 export default DateComponent;

package/extensions/forms/Value/Date/Date.js

@@ -1,15 +1,15 @@
 "use client";
 
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import "core-js/modules/web.dom-collections.iterator.js";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import "core-js/modules/web.dom-collections.iterator.js";
 import React, { useCallback, useContext } from 'react';
-import { parseISO } from 'date-fns';
-import { LOCALE } from '../../../../shared/defaults';
 import StringValue from '../String';
 import useTranslation from '../../hooks/useTranslation';
 import SharedContext from '../../../../shared/Context';
+import { formatDate, formatDateRange } from '../../../../components/date-picker/DatePickerCalc';
+import { parseRangeValue } from '../../Field/Date';
 function DateComponent(props) {
   var _props$locale, _props$variant, _props$label;
   const translations = useTranslation().Date;
@@ -22,6 +22,17 @@ function DateComponent(props) {
     if (!value) {
       return undefined;
     }
+    const isRange = /\|/.test(value);
+    if (isRange) {
+      const [startDate, endDate] = parseRangeValue(value);
+      return formatDateRange({
+        startDate,
+        endDate
+      }, {
+        locale,
+        variant
+      });
+    }
     return formatDate(value, {
       locale,
       variant
@@ -33,39 +44,6 @@ function DateComponent(props) {
   });
   return React.createElement(StringValue, stringProps);
 }
-export function formatDate(value) {
-  let {
-    locale = LOCALE,
-    variant = 'numeric'
-  } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  const isRange = /^(\d{4}-\d{2}-\d{2}|null|undefined)\|(\d{4}-\d{2}-\d{2}|null|undefined)$/.test(value);
-  const options = getOptions(variant);
-  if (isRange) {
-    const [startValue, endValue] = value.split('|');
-    const startDate = parseISO(startValue);
-    const endDate = parseISO(endValue);
-    if (isNaN(startDate.valueOf()) || isNaN(endDate.valueOf())) {
-      return undefined;
-    }
-    return typeof Intl !== 'undefined' ? new Intl.DateTimeFormat(locale, options).formatRange(startDate, endDate) : `${startDate.toLocaleString(locale, options)}|${endDate.toLocaleString(locale, options)}`;
-  }
-  const date = parseISO(value);
-  return typeof Intl !== 'undefined' ? new Intl.DateTimeFormat(locale, options).format(date) : date.toLocaleString(locale, options);
-}
-export function getOptions(variant) {
-  if (variant === 'numeric') {
-    return {
-      day: '2-digit',
-      month: '2-digit',
-      year: 'numeric'
-    };
-  }
-  return {
-    day: 'numeric',
-    month: variant,
-    year: 'numeric'
-  };
-}
 DateComponent._supportsSpacingProps = true;
 export default DateComponent;
 //# sourceMappingURL=Date.js.map

package/extensions/forms/Value/Date/Date.js.map

@@ -1 +1 @@
-{"version":3,"file":"Date.js","names":["React","useCallback","useContext","parseISO","LOCALE","StringValue","useTranslation","SharedContext","DateComponent","props","_props$locale","_props$variant","_props$label","translations","Date","locale","contextLocale","variant","toInput","value","undefined","formatDate","stringProps","_objectSpread","label","createElement","arguments","length","isRange","test","options","getOptions","startValue","endValue","split","startDate","endDate","isNaN","valueOf","Intl","DateTimeFormat","formatRange","toLocaleString","date","format","day","month","year","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Value/Date/Date.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport { parseISO } from 'date-fns'\nimport { LOCALE } from '../../../../shared/defaults'\nimport StringValue, { Props as StringValueProps } from '../String'\nimport useTranslation from '../../hooks/useTranslation'\nimport SharedContext, { AnyLocale } from '../../../../shared/Context'\n\nexport type Props = StringValueProps & {\n  variant?: 'long' | 'short' | 'numeric'\n  locale?: AnyLocale\n}\n\nfunction DateComponent(props: Props) {\n  const translations = useTranslation().Date\n  const { locale: contextLocale } = useContext(SharedContext)\n  const locale = props.locale ?? contextLocale\n  const variant = props.variant ?? 'long'\n\n  const toInput = useCallback(\n    (value: string) => {\n      if (!value) {\n        return undefined\n      }\n\n      return formatDate(value, { locale, variant })\n    },\n    [locale, variant]\n  )\n\n  const stringProps: Props = {\n    ...props,\n    label: props.label ?? translations.label,\n    toInput,\n  }\n  return <StringValue {...stringProps} />\n}\n\nexport type FormatDateOptions = {\n  locale?: string\n  variant?: Props['variant']\n}\n\nexport function formatDate(\n  value: string,\n  { locale = LOCALE, variant = 'numeric' }: FormatDateOptions = {}\n) {\n  // Either of the range dates can be null\n  const isRange =\n    /^(\\d{4}-\\d{2}-\\d{2}|null|undefined)\\|(\\d{4}-\\d{2}-\\d{2}|null|undefined)$/.test(\n      value\n    )\n  const options = getOptions(variant)\n\n  if (isRange) {\n    const [startValue, endValue] = value.split('|')\n\n    const startDate = parseISO(startValue)\n    const endDate = parseISO(endValue)\n\n    // Stop if either date is invalid\n    if (isNaN(startDate.valueOf()) || isNaN(endDate.valueOf())) {\n      return undefined\n    }\n\n    return typeof Intl !== 'undefined'\n      ? new Intl.DateTimeFormat(locale, options).formatRange(\n          startDate,\n          endDate\n        )\n      : `${startDate.toLocaleString(\n          locale,\n          options\n        )}|${endDate.toLocaleString(locale, options)}`\n  }\n\n  const date = parseISO(value)\n\n  return typeof Intl !== 'undefined'\n    ? new Intl.DateTimeFormat(locale, options).format(date)\n    : date.toLocaleString(locale, options)\n}\n\nexport function getOptions(\n  variant: Props['variant']\n): Intl.DateTimeFormatOptions {\n  if (variant === 'numeric') {\n    return {\n      day: '2-digit',\n      month: '2-digit',\n      year: 'numeric',\n    } as const\n  }\n\n  return {\n    day: 'numeric',\n    month: variant,\n    year: 'numeric',\n  } as const\n}\n\nDateComponent._supportsSpacingProps = true\nexport default DateComponent\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Date.js","names":["React","useCallback","useContext","StringValue","useTranslation","SharedContext","formatDate","formatDateRange","parseRangeValue","DateComponent","props","_props$locale","_props$variant","_props$label","translations","Date","locale","contextLocale","variant","toInput","value","undefined","isRange","test","startDate","endDate","stringProps","_objectSpread","label","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Value/Date/Date.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport StringValue, { Props as StringValueProps } from '../String'\nimport useTranslation from '../../hooks/useTranslation'\nimport SharedContext, { AnyLocale } from '../../../../shared/Context'\nimport {\n  formatDate,\n  formatDateRange,\n} from '../../../../components/date-picker/DatePickerCalc'\nimport { parseRangeValue } from '../../Field/Date'\n\nexport type Props = StringValueProps & {\n  variant?: 'long' | 'short' | 'numeric'\n  locale?: AnyLocale\n}\n\nfunction DateComponent(props: Props) {\n  const translations = useTranslation().Date\n  const { locale: contextLocale } = useContext(SharedContext)\n  const locale = props.locale ?? contextLocale\n  const variant = props.variant ?? 'long'\n\n  const toInput = useCallback(\n    (value: string) => {\n      if (!value) {\n        return undefined\n      }\n\n      // Range values contains the pipe separator in the middle\n      const isRange = /\\|/.test(value)\n\n      if (isRange) {\n        const [startDate, endDate] = parseRangeValue(value)\n\n        return formatDateRange({ startDate, endDate }, { locale, variant })\n      }\n\n      return formatDate(value, { locale, variant })\n    },\n    [locale, variant]\n  )\n\n  const stringProps: Props = {\n    ...props,\n    label: props.label ?? translations.label,\n    toInput,\n  }\n  return <StringValue {...stringProps} />\n}\n\nDateComponent._supportsSpacingProps = true\nexport default DateComponent\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,WAAW,MAAqC,WAAW;AAClE,OAAOC,cAAc,MAAM,4BAA4B;AACvD,OAAOC,aAAa,MAAqB,4BAA4B;AACrE,SACEC,UAAU,EACVC,eAAe,QACV,mDAAmD;AAC1D,SAASC,eAAe,QAAQ,kBAAkB;AAOlD,SAASC,aAAaA,CAACC,KAAY,EAAE;EAAA,IAAAC,aAAA,EAAAC,cAAA,EAAAC,YAAA;EACnC,MAAMC,YAAY,GAAGV,cAAc,CAAC,CAAC,CAACW,IAAI;EAC1C,MAAM;IAAEC,MAAM,EAAEC;EAAc,CAAC,GAAGf,UAAU,CAACG,aAAa,CAAC;EAC3D,MAAMW,MAAM,IAAAL,aAAA,GAAGD,KAAK,CAACM,MAAM,cAAAL,aAAA,cAAAA,aAAA,GAAIM,aAAa;EAC5C,MAAMC,OAAO,IAAAN,cAAA,GAAGF,KAAK,CAACQ,OAAO,cAAAN,cAAA,cAAAA,cAAA,GAAI,MAAM;EAEvC,MAAMO,OAAO,GAAGlB,WAAW,CACxBmB,KAAa,IAAK;IACjB,IAAI,CAACA,KAAK,EAAE;MACV,OAAOC,SAAS;IAClB;IAGA,MAAMC,OAAO,GAAG,IAAI,CAACC,IAAI,CAACH,KAAK,CAAC;IAEhC,IAAIE,OAAO,EAAE;MACX,MAAM,CAACE,SAAS,EAAEC,OAAO,CAAC,GAAGjB,eAAe,CAACY,KAAK,CAAC;MAEnD,OAAOb,eAAe,CAAC;QAAEiB,SAAS;QAAEC;MAAQ,CAAC,EAAE;QAAET,MAAM;QAAEE;MAAQ,CAAC,CAAC;IACrE;IAEA,OAAOZ,UAAU,CAACc,KAAK,EAAE;MAAEJ,MAAM;MAAEE;IAAQ,CAAC,CAAC;EAC/C,CAAC,EACD,CAACF,MAAM,EAAEE,OAAO,CAClB,CAAC;EAED,MAAMQ,WAAkB,GAAAC,aAAA,CAAAA,aAAA,KACnBjB,KAAK;IACRkB,KAAK,GAAAf,YAAA,GAAEH,KAAK,CAACkB,KAAK,cAAAf,YAAA,cAAAA,YAAA,GAAIC,YAAY,CAACc,KAAK;IACxCT;EAAO,EACR;EACD,OAAOnB,KAAA,CAAA6B,aAAA,CAAC1B,WAAW,EAAKuB,WAAc,CAAC;AACzC;AAEAjB,aAAa,CAACqB,qBAAqB,GAAG,IAAI;AAC1C,eAAerB,aAAa","ignoreList":[]}

package/extensions/forms/Wizard/Container/WizardContainer.js

@@ -25,7 +25,7 @@ import { IterateOverSteps } from './IterateOverSteps';
 import { PrerenderFieldPropsOfOtherSteps } from './PrerenderFieldPropsOfOtherSteps';
 const useLayoutEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;
 function WizardContainer(props) {
-  var _dataContext$setHandl;
+  var _dataContext$setField;
   const {
       className,
       id: idProp,
@@ -292,7 +292,7 @@ function WizardContainer(props) {
       preventSubmit();
     }
   }, [hasInvalidStepsState, handleNext]);
-  (_dataContext$setHandl = dataContext.setHandleSubmit) === null || _dataContext$setHandl === void 0 ? void 0 : _dataContext$setHandl.call(dataContext, handleSubmit);
+  (_dataContext$setField = dataContext.setFieldEventListener) === null || _dataContext$setField === void 0 ? void 0 : _dataContext$setField.call(dataContext, undefined, 'onSubmit', handleSubmit);
   const {
     check
   } = useVisibility();