@dnb/eufemia 10.75.4 → 10.76.0

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

@@ -5,6 +5,10 @@
 
 @import '../../../style/core/utilities.scss';
 
+:root {
+  --tooltip-z-index: 3100; // above modal
+}
+
 .dnb-tooltip {
   --tooltip-color: white;
   --tooltip-background-color: black;
@@ -12,7 +16,10 @@
   --tooltip-border-radius: 1rem;
 
   position: absolute;
-  z-index: 3100; // over modal
+  z-index: 1000;
+  .dnb-tooltip--inside-modal & {
+    z-index: var(--tooltip-z-index);
+  }
 
   display: flex;
   flex-direction: column;

package/es/components/upload/Upload.js

@@ -3,9 +3,9 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _UploadInfo, _UploadFileList;
+var _UploadInfo, _UploadFileList, _br;
 const _excluded = ["buttonTextSingular", "textSingular"],
-  _excluded2 = ["id", "skeleton", "className", "acceptedFileTypes", "filesAmountLimit", "fileMaxSize", "onChange", "onFileDelete", "onFileClick", "download", "allowDuplicates", "title", "text", "fileTypeTableCaption", "fileTypeDescription", "fileSizeDescription", "fileAmountDescription", "fileSizeContent", "buttonText", "loadingText", "errorLargeFile", "errorUnsupportedFile", "errorAmountLimit", "deleteButton", "fileListAriaLabel", "disableDragAndDrop"];
+  _excluded2 = ["id", "variant", "skeleton", "className", "acceptedFileTypes", "filesAmountLimit", "fileMaxSize", "onChange", "onFileDelete", "onFileClick", "download", "allowDuplicates", "title", "text", "fileTypeTableCaption", "fileTypeDescription", "fileSizeDescription", "fileAmountDescription", "fileSizeContent", "buttonText", "loadingText", "errorLargeFile", "errorUnsupportedFile", "errorAmountLimit", "deleteButton", "fileListAriaLabel", "disableDragAndDrop"];
 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 React, { useCallback } from 'react';
@@ -23,6 +23,7 @@ import { UploadContext, defaultProps } from './UploadContext';
 import { verifyFiles } from './UploadVerify';
 import UploadFileList from './UploadFileList';
 import UploadInfo from './UploadInfo';
+import FormLabel from '../FormLabel';
 export { defaultProps };
 const Upload = localProps => {
   const context = React.useContext(Context);
@@ -41,6 +42,7 @@ const Upload = localProps => {
   }, translations, context.Upload);
   const {
       id: idProp,
+      variant,
       skeleton,
       className,
       acceptedFileTypes,
@@ -105,7 +107,8 @@ const Upload = localProps => {
     }
     return validFiles;
   }, [acceptedFileTypes, errorLargeFile, errorUnsupportedFile, fileMaxSize, files, filesAmountLimit, getExistingFile, onChange, setFiles, setInternalFiles]);
-  const UploadWrapper = disableDragAndDrop || props.disabled ? HeightAnimation : UploadDropzone;
+  const wrapperIsHeightAnimation = disableDragAndDrop || props.disabled;
+  const UploadWrapper = wrapperIsHeightAnimation ? HeightAnimation : UploadDropzone;
   return React.createElement(UploadContext.Provider, {
     value: _objectSpread(_objectSpread({}, extendedProps), {}, {
       id,
@@ -113,12 +116,33 @@ const Upload = localProps => {
     })
   }, React.createElement(Provider, {
     skeleton: skeleton
-  }, React.createElement(UploadWrapper, {
-    className: classnames('dnb-upload', spacingClasses, className)
-  }, _UploadInfo || (_UploadInfo = React.createElement(UploadInfo, null)), React.createElement(UploadFileInput, _extends({
-    disabled: props.disabled
+  }, React.createElement(UploadWrapper, _extends({
+    className: classnames(`dnb-upload dnb-upload--${variant || 'normal'}`, spacingClasses, className)
+  }, !wrapperIsHeightAnimation ? {
+    hideOutline: variant === 'compact'
+  } : {}), variant !== 'compact' && (_UploadInfo || (_UploadInfo = React.createElement(UploadInfo, null))), variant === 'compact' && (title || text) && React.createElement(React.Fragment, null, React.createElement(CompactLabel, {
+    id: id,
+    title: title,
+    text: text
+  }), props === null || props === void 0 ? void 0 : props.children), React.createElement(UploadFileInput, _extends({
+    disabled: props.disabled,
+    files: files
   }, props)), _UploadFileList || (_UploadFileList = React.createElement(UploadFileList, null)))));
 };
+function CompactLabel(props) {
+  const {
+    id,
+    title,
+    text
+  } = props;
+  return React.createElement(FormLabel, {
+    forId: `${id}-input`,
+    vertical: true,
+    className: "dnb-upload__label"
+  }, React.createElement("span", null, title && React.createElement("span", null, title), title && text && (_br || (_br = React.createElement("br", null))), text && React.createElement("span", {
+    className: "dnb-upload__text"
+  }, text)));
+}
 Upload.useUpload = useUpload;
 Upload._formElement = true;
 Upload._supportsSpacingProps = true;

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

@@ -1 +1 @@
-{"version":3,"file":"Upload.js","names":["React","useCallback","classnames","createSpacingClasses","Provider","Context","extendPropsWithContext","makeUniqueId","useId","HeightAnimation","UploadFileInput","useUpload","UploadDropzone","UploadContext","defaultProps","verifyFiles","UploadFileList","UploadInfo","Upload","localProps","context","useContext","_context$getTranslati","getTranslation","buttonTextSingular","textSingular","translations","_objectWithoutProperties","_excluded","filesAmountLimit","buttonText","text","extendedProps","skeleton","id","idProp","className","acceptedFileTypes","fileMaxSize","onChange","onFileDelete","onFileClick","download","allowDuplicates","title","fileTypeTableCaption","fileTypeDescription","fileSizeDescription","fileAmountDescription","fileSizeContent","loadingText","errorLargeFile","errorUnsupportedFile","errorAmountLimit","deleteButton","fileListAriaLabel","disableDragAndDrop","props","_excluded2","spacingClasses","files","setFiles","setInternalFiles","getExistingFile","onInputUpload","newFiles","mergedFiles","map","fileItem","file","existingFile","exists","Boolean","filesToVerify","filter","verifiedFiles","validFiles","slice","UploadWrapper","disabled","createElement","value","_objectSpread","_UploadInfo","_extends","_UploadFileList","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/upload/Upload.tsx"],"sourcesContent":["import React, { useCallback } from 'react'\nimport classnames from 'classnames'\n\n// Shared\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport Provider from '../../shared/Provider'\nimport Context from '../../shared/Context'\nimport {\n  extendPropsWithContext,\n  makeUniqueId,\n} from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\nimport HeightAnimation from '../height-animation/HeightAnimation'\n\n// Internal\nimport UploadFileInput from './UploadFileInput'\nimport useUpload from './useUpload'\nimport UploadDropzone from './UploadDropzone'\nimport { UploadContext, defaultProps } from './UploadContext'\nimport { verifyFiles } from './UploadVerify'\n\nimport type { UploadFile, UploadAllProps } from './types'\nimport UploadFileList from './UploadFileList'\nimport UploadInfo from './UploadInfo'\n\nexport type * from './types'\nexport { defaultProps }\n\nconst Upload = (localProps: UploadAllProps) => {\n  const context = React.useContext(Context)\n\n  const { buttonTextSingular, textSingular, ...translations } =\n    context.getTranslation(localProps).Upload\n\n  if (localProps?.filesAmountLimit === 1) {\n    translations.buttonText = buttonTextSingular\n    translations.text = textSingular\n  }\n\n  const extendedProps = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    { skeleton: context?.skeleton },\n    translations,\n    context.Upload\n  )\n\n  const {\n    id: idProp,\n    skeleton,\n    className,\n    acceptedFileTypes,\n    filesAmountLimit,\n    fileMaxSize,\n    onChange,\n    onFileDelete, // eslint-disable-line\n    onFileClick, // eslint-disable-line\n    download, // eslint-disable-line\n    allowDuplicates,\n    title, // eslint-disable-line\n    text, // eslint-disable-line\n    fileTypeTableCaption, // eslint-disable-line\n    fileTypeDescription, // eslint-disable-line\n    fileSizeDescription, // eslint-disable-line\n    fileAmountDescription, // eslint-disable-line\n    fileSizeContent, // eslint-disable-line\n    buttonText, // eslint-disable-line\n    loadingText, // eslint-disable-line\n    errorLargeFile,\n    errorUnsupportedFile,\n    errorAmountLimit, // eslint-disable-line\n    deleteButton, // eslint-disable-line\n    fileListAriaLabel, // eslint-disable-line\n    disableDragAndDrop,\n    ...props\n  } = extendedProps\n\n  const spacingClasses = createSpacingClasses(props)\n\n  const id = useId(idProp)\n\n  const { files, setFiles, setInternalFiles, getExistingFile } =\n    useUpload(id)\n\n  const onInputUpload = useCallback(\n    (newFiles: Array<UploadFile>) => {\n      const mergedFiles = [\n        ...files,\n        ...newFiles.map((fileItem) => {\n          const { file } = fileItem\n\n          const existingFile = getExistingFile(file, files)\n\n          fileItem.exists = Boolean(existingFile)\n          fileItem.id =\n            fileItem.exists && !allowDuplicates\n              ? existingFile.id\n              : makeUniqueId()\n\n          return fileItem\n        }),\n      ]\n\n      const filesToVerify = allowDuplicates\n        ? mergedFiles\n        : mergedFiles.filter(({ exists }) => !exists)\n\n      const verifiedFiles = verifyFiles(filesToVerify, {\n        fileMaxSize,\n        acceptedFileTypes,\n        errorUnsupportedFile,\n        errorLargeFile,\n      })\n\n      const validFiles = [...verifiedFiles].slice(\n        0,\n        filesAmountLimit\n      ) as Array<UploadFile>\n\n      setFiles(validFiles)\n      setInternalFiles(mergedFiles)\n\n      if (typeof onChange === 'function') {\n        onChange({ files: validFiles })\n      }\n\n      return validFiles\n    },\n    [\n      acceptedFileTypes,\n      errorLargeFile,\n      errorUnsupportedFile,\n      fileMaxSize,\n      files,\n      filesAmountLimit,\n      getExistingFile,\n      onChange,\n      setFiles,\n      setInternalFiles,\n    ]\n  )\n\n  const UploadWrapper =\n    disableDragAndDrop || props.disabled ? HeightAnimation : UploadDropzone\n\n  return (\n    <UploadContext.Provider\n      value={{\n        ...extendedProps,\n        id,\n        onInputUpload,\n      }}\n    >\n      <Provider skeleton={skeleton}>\n        <UploadWrapper\n          className={classnames('dnb-upload', spacingClasses, className)}\n        >\n          <UploadInfo />\n\n          <UploadFileInput disabled={props.disabled} {...props} />\n\n          <UploadFileList />\n        </UploadWrapper>\n      </Provider>\n    </UploadContext.Provider>\n  )\n}\n\nUpload.useUpload = useUpload\n\nUpload._formElement = true\nUpload._supportsSpacingProps = true\n\nexport default Upload\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Upload.js","names":["React","useCallback","classnames","createSpacingClasses","Provider","Context","extendPropsWithContext","makeUniqueId","useId","HeightAnimation","UploadFileInput","useUpload","UploadDropzone","UploadContext","defaultProps","verifyFiles","UploadFileList","UploadInfo","FormLabel","Upload","localProps","context","useContext","_context$getTranslati","getTranslation","buttonTextSingular","textSingular","translations","_objectWithoutProperties","_excluded","filesAmountLimit","buttonText","text","extendedProps","skeleton","id","idProp","variant","className","acceptedFileTypes","fileMaxSize","onChange","onFileDelete","onFileClick","download","allowDuplicates","title","fileTypeTableCaption","fileTypeDescription","fileSizeDescription","fileAmountDescription","fileSizeContent","loadingText","errorLargeFile","errorUnsupportedFile","errorAmountLimit","deleteButton","fileListAriaLabel","disableDragAndDrop","props","_excluded2","spacingClasses","files","setFiles","setInternalFiles","getExistingFile","onInputUpload","newFiles","mergedFiles","map","fileItem","file","existingFile","exists","Boolean","filesToVerify","filter","verifiedFiles","validFiles","slice","wrapperIsHeightAnimation","disabled","UploadWrapper","createElement","value","_objectSpread","_extends","hideOutline","_UploadInfo","Fragment","CompactLabel","children","_UploadFileList","forId","vertical","_br","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/upload/Upload.tsx"],"sourcesContent":["import React, { useCallback } from 'react'\nimport classnames from 'classnames'\n\n// Shared\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport Provider from '../../shared/Provider'\nimport Context from '../../shared/Context'\nimport {\n  extendPropsWithContext,\n  makeUniqueId,\n} from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\nimport HeightAnimation from '../height-animation/HeightAnimation'\n\n// Internal\nimport UploadFileInput from './UploadFileInput'\nimport useUpload from './useUpload'\nimport UploadDropzone from './UploadDropzone'\nimport { UploadContext, defaultProps } from './UploadContext'\nimport { verifyFiles } from './UploadVerify'\n\nimport type { UploadFile, UploadAllProps } from './types'\nimport UploadFileList from './UploadFileList'\nimport UploadInfo from './UploadInfo'\nimport FormLabel from '../FormLabel'\n\nexport type * from './types'\nexport { defaultProps }\n\nconst Upload = (localProps: UploadAllProps) => {\n  const context = React.useContext(Context)\n\n  const { buttonTextSingular, textSingular, ...translations } =\n    context.getTranslation(localProps).Upload\n\n  if (localProps?.filesAmountLimit === 1) {\n    translations.buttonText = buttonTextSingular\n    translations.text = textSingular\n  }\n\n  const extendedProps = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    { skeleton: context?.skeleton },\n    translations,\n    context.Upload\n  )\n\n  const {\n    id: idProp,\n    variant,\n    skeleton,\n    className,\n    acceptedFileTypes,\n    filesAmountLimit,\n    fileMaxSize,\n    onChange,\n    onFileDelete, // eslint-disable-line\n    onFileClick, // eslint-disable-line\n    download, // eslint-disable-line\n    allowDuplicates,\n    title, // eslint-disable-line\n    text, // eslint-disable-line\n    fileTypeTableCaption, // eslint-disable-line\n    fileTypeDescription, // eslint-disable-line\n    fileSizeDescription, // eslint-disable-line\n    fileAmountDescription, // eslint-disable-line\n    fileSizeContent, // eslint-disable-line\n    buttonText, // eslint-disable-line\n    loadingText, // eslint-disable-line\n    errorLargeFile,\n    errorUnsupportedFile,\n    errorAmountLimit, // eslint-disable-line\n    deleteButton, // eslint-disable-line\n    fileListAriaLabel, // eslint-disable-line\n    disableDragAndDrop,\n    ...props\n  } = extendedProps\n\n  const spacingClasses = createSpacingClasses(props)\n\n  const id = useId(idProp)\n\n  const { files, setFiles, setInternalFiles, getExistingFile } =\n    useUpload(id)\n\n  const onInputUpload = useCallback(\n    (newFiles: Array<UploadFile>) => {\n      const mergedFiles = [\n        ...files,\n        ...newFiles.map((fileItem) => {\n          const { file } = fileItem\n\n          const existingFile = getExistingFile(file, files)\n\n          fileItem.exists = Boolean(existingFile)\n          fileItem.id =\n            fileItem.exists && !allowDuplicates\n              ? existingFile.id\n              : makeUniqueId()\n\n          return fileItem\n        }),\n      ]\n\n      const filesToVerify = allowDuplicates\n        ? mergedFiles\n        : mergedFiles.filter(({ exists }) => !exists)\n\n      const verifiedFiles = verifyFiles(filesToVerify, {\n        fileMaxSize,\n        acceptedFileTypes,\n        errorUnsupportedFile,\n        errorLargeFile,\n      })\n\n      const validFiles = [...verifiedFiles].slice(\n        0,\n        filesAmountLimit\n      ) as Array<UploadFile>\n\n      setFiles(validFiles)\n      setInternalFiles(mergedFiles)\n\n      if (typeof onChange === 'function') {\n        onChange({ files: validFiles })\n      }\n\n      return validFiles\n    },\n    [\n      acceptedFileTypes,\n      errorLargeFile,\n      errorUnsupportedFile,\n      fileMaxSize,\n      files,\n      filesAmountLimit,\n      getExistingFile,\n      onChange,\n      setFiles,\n      setInternalFiles,\n    ]\n  )\n\n  const wrapperIsHeightAnimation = disableDragAndDrop || props.disabled\n\n  const UploadWrapper = wrapperIsHeightAnimation\n    ? HeightAnimation\n    : UploadDropzone\n\n  return (\n    <UploadContext.Provider\n      value={{\n        ...extendedProps,\n        id,\n        onInputUpload,\n      }}\n    >\n      <Provider skeleton={skeleton}>\n        <UploadWrapper\n          className={classnames(\n            'dnb-upload',\n            `dnb-upload--${variant || 'normal'}`,\n            spacingClasses,\n            className\n          )}\n          {...(!wrapperIsHeightAnimation\n            ? { hideOutline: variant === 'compact' }\n            : {})}\n        >\n          {variant !== 'compact' && <UploadInfo />}\n          {variant === 'compact' && (title || text) && (\n            <>\n              <CompactLabel id={id} title={title} text={text} />\n              {props?.children}\n            </>\n          )}\n\n          <UploadFileInput\n            disabled={props.disabled}\n            files={files}\n            {...props}\n          />\n\n          <UploadFileList />\n        </UploadWrapper>\n      </Provider>\n    </UploadContext.Provider>\n  )\n}\n\nfunction CompactLabel(props: {\n  id: string\n  title?: UploadAllProps['title']\n  text?: UploadAllProps['text']\n}) {\n  const { id, title, text } = props\n  return (\n    <FormLabel\n      forId={`${id}-input`}\n      vertical\n      className=\"dnb-upload__label\"\n    >\n      <span>\n        {title && <span>{title}</span>}\n        {title && text && <br />}\n        {text && <span className=\"dnb-upload__text\">{text}</span>}\n      </span>\n    </FormLabel>\n  )\n}\n\nUpload.useUpload = useUpload\n\nUpload._formElement = true\nUpload._supportsSpacingProps = true\n\nexport default Upload\n"],"mappings":";;;;;;;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,OAAOC,UAAU,MAAM,YAAY;AAGnC,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,OAAOC,QAAQ,MAAM,uBAAuB;AAC5C,OAAOC,OAAO,MAAM,sBAAsB;AAC1C,SACEC,sBAAsB,EACtBC,YAAY,QACP,+BAA+B;AACtC,OAAOC,KAAK,MAAM,4BAA4B;AAC9C,OAAOC,eAAe,MAAM,qCAAqC;AAGjE,OAAOC,eAAe,MAAM,mBAAmB;AAC/C,OAAOC,SAAS,MAAM,aAAa;AACnC,OAAOC,cAAc,MAAM,kBAAkB;AAC7C,SAASC,aAAa,EAAEC,YAAY,QAAQ,iBAAiB;AAC7D,SAASC,WAAW,QAAQ,gBAAgB;AAG5C,OAAOC,cAAc,MAAM,kBAAkB;AAC7C,OAAOC,UAAU,MAAM,cAAc;AACrC,OAAOC,SAAS,MAAM,cAAc;AAGpC,SAASJ,YAAY;AAErB,MAAMK,MAAM,GAAIC,UAA0B,IAAK;EAC7C,MAAMC,OAAO,GAAGrB,KAAK,CAACsB,UAAU,CAACjB,OAAO,CAAC;EAEzC,MAAAkB,qBAAA,GACEF,OAAO,CAACG,cAAc,CAACJ,UAAU,CAAC,CAACD,MAAM;IADrC;MAAEM,kBAAkB;MAAEC;IAA8B,CAAC,GAAAH,qBAAA;IAAdI,YAAY,GAAAC,wBAAA,CAAAL,qBAAA,EAAAM,SAAA;EAGzD,IAAI,CAAAT,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEU,gBAAgB,MAAK,CAAC,EAAE;IACtCH,YAAY,CAACI,UAAU,GAAGN,kBAAkB;IAC5CE,YAAY,CAACK,IAAI,GAAGN,YAAY;EAClC;EAEA,MAAMO,aAAa,GAAG3B,sBAAsB,CAC1Cc,UAAU,EACVN,YAAY,EACZ;IAAEoB,QAAQ,EAAEb,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEa;EAAS,CAAC,EAC/BP,YAAY,EACZN,OAAO,CAACF,MACV,CAAC;EAED,MAAM;MACJgB,EAAE,EAAEC,MAAM;MACVC,OAAO;MACPH,QAAQ;MACRI,SAAS;MACTC,iBAAiB;MACjBT,gBAAgB;MAChBU,WAAW;MACXC,QAAQ;MACRC,YAAY;MACZC,WAAW;MACXC,QAAQ;MACRC,eAAe;MACfC,KAAK;MACLd,IAAI;MACJe,oBAAoB;MACpBC,mBAAmB;MACnBC,mBAAmB;MACnBC,qBAAqB;MACrBC,eAAe;MACfpB,UAAU;MACVqB,WAAW;MACXC,cAAc;MACdC,oBAAoB;MACpBC,gBAAgB;MAChBC,YAAY;MACZC,iBAAiB;MACjBC;IAEF,CAAC,GAAGzB,aAAa;IADZ0B,KAAK,GAAA/B,wBAAA,CACNK,aAAa,EAAA2B,UAAA;EAEjB,MAAMC,cAAc,GAAG1D,oBAAoB,CAACwD,KAAK,CAAC;EAElD,MAAMxB,EAAE,GAAG3B,KAAK,CAAC4B,MAAM,CAAC;EAExB,MAAM;IAAE0B,KAAK;IAAEC,QAAQ;IAAEC,gBAAgB;IAAEC;EAAgB,CAAC,GAC1DtD,SAAS,CAACwB,EAAE,CAAC;EAEf,MAAM+B,aAAa,GAAGjE,WAAW,CAC9BkE,QAA2B,IAAK;IAC/B,MAAMC,WAAW,GAAG,CAClB,GAAGN,KAAK,EACR,GAAGK,QAAQ,CAACE,GAAG,CAAEC,QAAQ,IAAK;MAC5B,MAAM;QAAEC;MAAK,CAAC,GAAGD,QAAQ;MAEzB,MAAME,YAAY,GAAGP,eAAe,CAACM,IAAI,EAAET,KAAK,CAAC;MAEjDQ,QAAQ,CAACG,MAAM,GAAGC,OAAO,CAACF,YAAY,CAAC;MACvCF,QAAQ,CAACnC,EAAE,GACTmC,QAAQ,CAACG,MAAM,IAAI,CAAC5B,eAAe,GAC/B2B,YAAY,CAACrC,EAAE,GACf5B,YAAY,CAAC,CAAC;MAEpB,OAAO+D,QAAQ;IACjB,CAAC,CAAC,CACH;IAED,MAAMK,aAAa,GAAG9B,eAAe,GACjCuB,WAAW,GACXA,WAAW,CAACQ,MAAM,CAAC,CAAC;MAAEH;IAAO,CAAC,KAAK,CAACA,MAAM,CAAC;IAE/C,MAAMI,aAAa,GAAG9D,WAAW,CAAC4D,aAAa,EAAE;MAC/CnC,WAAW;MACXD,iBAAiB;MACjBe,oBAAoB;MACpBD;IACF,CAAC,CAAC;IAEF,MAAMyB,UAAU,GAAG,CAAC,GAAGD,aAAa,CAAC,CAACE,KAAK,CACzC,CAAC,EACDjD,gBACF,CAAsB;IAEtBiC,QAAQ,CAACe,UAAU,CAAC;IACpBd,gBAAgB,CAACI,WAAW,CAAC;IAE7B,IAAI,OAAO3B,QAAQ,KAAK,UAAU,EAAE;MAClCA,QAAQ,CAAC;QAAEqB,KAAK,EAAEgB;MAAW,CAAC,CAAC;IACjC;IAEA,OAAOA,UAAU;EACnB,CAAC,EACD,CACEvC,iBAAiB,EACjBc,cAAc,EACdC,oBAAoB,EACpBd,WAAW,EACXsB,KAAK,EACLhC,gBAAgB,EAChBmC,eAAe,EACfxB,QAAQ,EACRsB,QAAQ,EACRC,gBAAgB,CAEpB,CAAC;EAED,MAAMgB,wBAAwB,GAAGtB,kBAAkB,IAAIC,KAAK,CAACsB,QAAQ;EAErE,MAAMC,aAAa,GAAGF,wBAAwB,GAC1CvE,eAAe,GACfG,cAAc;EAElB,OACEZ,KAAA,CAAAmF,aAAA,CAACtE,aAAa,CAACT,QAAQ;IACrBgF,KAAK,EAAAC,aAAA,CAAAA,aAAA,KACApD,aAAa;MAChBE,EAAE;MACF+B;IAAa;EACb,GAEFlE,KAAA,CAAAmF,aAAA,CAAC/E,QAAQ;IAAC8B,QAAQ,EAAEA;EAAS,GAC3BlC,KAAA,CAAAmF,aAAA,CAACD,aAAa,EAAAI,QAAA;IACZhD,SAAS,EAAEpC,UAAU,2BAEJmC,OAAO,IAAI,QAAQ,IAClCwB,cAAc,EACdvB,SACF;EAAE,GACG,CAAC0C,wBAAwB,GAC1B;IAAEO,WAAW,EAAElD,OAAO,KAAK;EAAU,CAAC,GACtC,CAAC,CAAC,GAELA,OAAO,KAAK,SAAS,KAAAmD,WAAA,KAAAA,WAAA,GAAIxF,KAAA,CAAAmF,aAAA,CAAClE,UAAU,MAAE,CAAC,IACvCoB,OAAO,KAAK,SAAS,KAAKS,KAAK,IAAId,IAAI,CAAC,IACvChC,KAAA,CAAAmF,aAAA,CAAAnF,KAAA,CAAAyF,QAAA,QACEzF,KAAA,CAAAmF,aAAA,CAACO,YAAY;IAACvD,EAAE,EAAEA,EAAG;IAACW,KAAK,EAAEA,KAAM;IAACd,IAAI,EAAEA;EAAK,CAAE,CAAC,EACjD2B,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEgC,QACR,CACH,EAED3F,KAAA,CAAAmF,aAAA,CAACzE,eAAe,EAAA4E,QAAA;IACdL,QAAQ,EAAEtB,KAAK,CAACsB,QAAS;IACzBnB,KAAK,EAAEA;EAAM,GACTH,KAAK,CACV,CAAC,EAAAiC,eAAA,KAAAA,eAAA,GAEF5F,KAAA,CAAAmF,aAAA,CAACnE,cAAc,MAAE,CAAC,CACL,CACP,CACY,CAAC;AAE7B,CAAC;AAED,SAAS0E,YAAYA,CAAC/B,KAIrB,EAAE;EACD,MAAM;IAAExB,EAAE;IAAEW,KAAK;IAAEd;EAAK,CAAC,GAAG2B,KAAK;EACjC,OACE3D,KAAA,CAAAmF,aAAA,CAACjE,SAAS;IACR2E,KAAK,EAAE,GAAG1D,EAAE,QAAS;IACrB2D,QAAQ;IACRxD,SAAS,EAAC;EAAmB,GAE7BtC,KAAA,CAAAmF,aAAA,eACGrC,KAAK,IAAI9C,KAAA,CAAAmF,aAAA,eAAOrC,KAAY,CAAC,EAC7BA,KAAK,IAAId,IAAI,KAAA+D,GAAA,KAAAA,GAAA,GAAI/F,KAAA,CAAAmF,aAAA,WAAK,CAAC,IACvBnD,IAAI,IAAIhC,KAAA,CAAAmF,aAAA;IAAM7C,SAAS,EAAC;EAAkB,GAAEN,IAAW,CACpD,CACG,CAAC;AAEhB;AAEAb,MAAM,CAACR,SAAS,GAAGA,SAAS;AAE5BQ,MAAM,CAAC6E,YAAY,GAAG,IAAI;AAC1B7E,MAAM,CAAC8E,qBAAqB,GAAG,IAAI;AAEnC,eAAe9E,MAAM","ignoreList":[]}

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

@@ -4,5 +4,6 @@ export declare const defaultProps: {
     fileMaxSize: number;
     filesAmountLimit: number;
     download: boolean;
+    variant: string;
 };
 export declare const UploadContext: import("react").Context<UploadContextProps>;

package/es/components/upload/UploadContext.js

@@ -4,7 +4,8 @@ import { createContext } from 'react';
 export const defaultProps = {
   fileMaxSize: 5,
   filesAmountLimit: 100,
-  download: false
+  download: false,
+  variant: 'normal'
 };
 export const UploadContext = createContext(null);
 //# sourceMappingURL=UploadContext.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"UploadContext.js","names":["createContext","defaultProps","fileMaxSize","filesAmountLimit","download","UploadContext"],"sources":["../../../../src/components/upload/UploadContext.tsx"],"sourcesContent":["import { createContext } from 'react'\nimport { UploadContextProps } from './types'\n\nexport const defaultProps = {\n  fileMaxSize: 5,\n  filesAmountLimit: 100,\n  download: false,\n}\n\nexport const UploadContext = createContext<UploadContextProps>(null)\n"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,OAAO;AAGrC,OAAO,MAAMC,YAAY,GAAG;EAC1BC,WAAW,EAAE,CAAC;EACdC,gBAAgB,EAAE,GAAG;EACrBC,QAAQ,EAAE;AACZ,CAAC;AAED,OAAO,MAAMC,aAAa,GAAGL,aAAa,CAAqB,IAAI,CAAC","ignoreList":[]}
+{"version":3,"file":"UploadContext.js","names":["createContext","defaultProps","fileMaxSize","filesAmountLimit","download","variant","UploadContext"],"sources":["../../../../src/components/upload/UploadContext.tsx"],"sourcesContent":["import { createContext } from 'react'\nimport { UploadContextProps } from './types'\n\nexport const defaultProps = {\n  fileMaxSize: 5,\n  filesAmountLimit: 100,\n  download: false,\n  variant: 'normal',\n}\n\nexport const UploadContext = createContext<UploadContextProps>(null)\n"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,OAAO;AAGrC,OAAO,MAAMC,YAAY,GAAG;EAC1BC,WAAW,EAAE,CAAC;EACdC,gBAAgB,EAAE,GAAG;EACrBC,QAAQ,EAAE,KAAK;EACfC,OAAO,EAAE;AACX,CAAC;AAED,OAAO,MAAMC,aAAa,GAAGN,aAAa,CAAqB,IAAI,CAAC","ignoreList":[]}

package/es/components/upload/UploadDocs.js

@@ -4,13 +4,23 @@ export const UploadProperties = {
     type: ['string', 'Function', 'Object', 'React.Context'],
     status: 'optional'
   },
+  children: {
+    doc: 'Content to display below the `title` and `text`. Can be used to add custom content.',
+    type: ['React.ReactNode'],
+    status: 'optional'
+  },
+  variant: {
+    doc: 'defines the appearance. Use one of these: `normal` or `compact`. Defaults to `normal`.',
+    type: ['normal', 'compact'],
+    status: 'optional'
+  },
   acceptedFileTypes: {
     doc: 'List of accepted file types. Either as string or [AcceptedFileType](/uilib/components/upload/properties/#acceptedfiletype). When providing a list of [AcceptedFileType](/uilib/components/upload/properties/#acceptedfiletype), the accepted file types will be presented in a table(see [example](/uilib/components/upload/demos/#upload-with-file-max-size-based-on-file-type)).',
     type: ['Array<string>', 'Array<AcceptedFileType>'],
     status: 'required'
   },
   filesAmountLimit: {
-    doc: 'Defines the amount of files the user can select and upload. Defaults to 100.',
+    doc: 'Defines the amount of files the user can select and upload. Defaults to `100`.',
     type: 'number',
     status: 'optional'
   },

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

@@ -1 +1 @@
-{"version":3,"file":"UploadDocs.js","names":["UploadProperties","id","doc","type","status","acceptedFileTypes","filesAmountLimit","fileMaxSize","title","text","download","allowDuplicates","disableDragAndDrop","skeleton","AcceptedFileTypeProperties","fileType","UploadEvents","onChange","onFileDelete","onFileClick","FileItemProperties","file","exists","isLoading","errorMessage","description","removeDeleteButton"],"sources":["../../../../src/components/upload/UploadDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const UploadProperties: PropertiesTableProps = {\n  id: {\n    doc: 'Unique id used with the useUpload hook to manage the files. Needed when wanting to connect with the useUpload hook.',\n    type: ['string', 'Function', 'Object', 'React.Context'],\n    status: 'optional',\n  },\n  acceptedFileTypes: {\n    doc: 'List of accepted file types. Either as string or [AcceptedFileType](/uilib/components/upload/properties/#acceptedfiletype). When providing a list of [AcceptedFileType](/uilib/components/upload/properties/#acceptedfiletype), the accepted file types will be presented in a table(see [example](/uilib/components/upload/demos/#upload-with-file-max-size-based-on-file-type)).',\n    type: ['Array<string>', 'Array<AcceptedFileType>'],\n    status: 'required',\n  },\n  filesAmountLimit: {\n    doc: 'Defines the amount of files the user can select and upload. Defaults to 100.',\n    type: 'number',\n    status: 'optional',\n  },\n  fileMaxSize: {\n    doc: 'Defines the max file size of each file in MB. Use either `0` or `false` to disable. Defaults to 5 MB.',\n    type: ['number', 'false'],\n    status: 'optional',\n  },\n  title: {\n    doc: 'Custom text property. Replaces the default title. Can be disabled using `false`.',\n    type: 'string',\n    status: 'optional',\n  },\n  text: {\n    doc: 'Custom text property. Replaces the default text. Can be disabled using `false`.',\n    type: 'string',\n    status: 'optional',\n  },\n  download: {\n    doc: 'Causes the browser to treat all listed files as downloadable instead of opening them in a new browser tab or window. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  allowDuplicates: {\n    doc: 'Allows uploading of duplicate files. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  disableDragAndDrop: {\n    doc: 'Disables file drag and drop, by removing the drop zone. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  skeleton: {\n    doc: 'Skeleton should be applied when loading content.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n\nexport const AcceptedFileTypeProperties: PropertiesTableProps = {\n  fileType: {\n    doc: 'The name of the accepted file type.',\n    type: 'string',\n    status: 'required',\n  },\n  fileMaxSize: {\n    doc: 'Defines the max file size of the given file type in MB. Use either `0` or `false` to disable. If not provided, it defaults to the value of [Uploads](/uilib/components/upload/properties/#properties) `fileMaxSize` which defaults to 5 MB.',\n    type: ['number', 'false'],\n    status: 'optional',\n  },\n}\n\nexport const UploadEvents: PropertiesTableProps = {\n  onChange: {\n    doc: 'Will be called on `files` changes made by the user. Access the files with `{ files }` (containing each a `fileItem`).',\n    type: 'function',\n    status: 'optional',\n  },\n  onFileDelete: {\n    doc: 'Will be called once a file gets deleted by the user. Access the deleted file with `{ fileItem }`.',\n    type: 'function',\n    status: 'optional',\n  },\n  onFileClick: {\n    doc: 'Will be called once a file gets clicked on by the user. Access the clicked file with `{ fileItem }`.',\n    type: 'function',\n    status: 'optional',\n  },\n}\n\nexport const FileItemProperties: PropertiesTableProps = {\n  file: {\n    doc: 'The file object. This is the same object as the one returned by the `File` API.',\n    type: 'File',\n    status: 'required',\n  },\n  id: {\n    doc: 'Unique ID for the file item. This ID is generated by the component and is not user-defined.',\n    type: 'string',\n    status: 'required',\n  },\n  exists: {\n    doc: 'Indicates if the file item already exists in the list of files. This is useful for distinguishing between new and existing files.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  isLoading: {\n    doc: 'Indicates if the file item is currently being loaded. This is useful for showing a loading state while the file is being processed.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  errorMessage: {\n    doc: 'Provide an error message to be displayed. This is useful for indicating issues with the file upload process.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  description: {\n    doc: 'Provide a description to be displayed. This is useful for providing additional information about the file.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  removeDeleteButton: {\n    doc: 'Set to `true` to remove the delete button from the file item. This is useful for preventing users from deleting files.',\n    type: 'boolean',\n    status: 'optional',\n  },\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"UploadDocs.js","names":["UploadProperties","id","doc","type","status","children","variant","acceptedFileTypes","filesAmountLimit","fileMaxSize","title","text","download","allowDuplicates","disableDragAndDrop","skeleton","AcceptedFileTypeProperties","fileType","UploadEvents","onChange","onFileDelete","onFileClick","FileItemProperties","file","exists","isLoading","errorMessage","description","removeDeleteButton"],"sources":["../../../../src/components/upload/UploadDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const UploadProperties: PropertiesTableProps = {\n  id: {\n    doc: 'Unique id used with the useUpload hook to manage the files. Needed when wanting to connect with the useUpload hook.',\n    type: ['string', 'Function', 'Object', 'React.Context'],\n    status: 'optional',\n  },\n  children: {\n    doc: 'Content to display below the `title` and `text`. Can be used to add custom content.',\n    type: ['React.ReactNode'],\n    status: 'optional',\n  },\n  variant: {\n    doc: 'defines the appearance. Use one of these: `normal` or `compact`. Defaults to `normal`.',\n    type: ['normal', 'compact'],\n    status: 'optional',\n  },\n  acceptedFileTypes: {\n    doc: 'List of accepted file types. Either as string or [AcceptedFileType](/uilib/components/upload/properties/#acceptedfiletype). When providing a list of [AcceptedFileType](/uilib/components/upload/properties/#acceptedfiletype), the accepted file types will be presented in a table(see [example](/uilib/components/upload/demos/#upload-with-file-max-size-based-on-file-type)).',\n    type: ['Array<string>', 'Array<AcceptedFileType>'],\n    status: 'required',\n  },\n  filesAmountLimit: {\n    doc: 'Defines the amount of files the user can select and upload. Defaults to `100`.',\n    type: 'number',\n    status: 'optional',\n  },\n  fileMaxSize: {\n    doc: 'Defines the max file size of each file in MB. Use either `0` or `false` to disable. Defaults to 5 MB.',\n    type: ['number', 'false'],\n    status: 'optional',\n  },\n  title: {\n    doc: 'Custom text property. Replaces the default title. Can be disabled using `false`.',\n    type: 'string',\n    status: 'optional',\n  },\n  text: {\n    doc: 'Custom text property. Replaces the default text. Can be disabled using `false`.',\n    type: 'string',\n    status: 'optional',\n  },\n  download: {\n    doc: 'Causes the browser to treat all listed files as downloadable instead of opening them in a new browser tab or window. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  allowDuplicates: {\n    doc: 'Allows uploading of duplicate files. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  disableDragAndDrop: {\n    doc: 'Disables file drag and drop, by removing the drop zone. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  skeleton: {\n    doc: 'Skeleton should be applied when loading content.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n\nexport const AcceptedFileTypeProperties: PropertiesTableProps = {\n  fileType: {\n    doc: 'The name of the accepted file type.',\n    type: 'string',\n    status: 'required',\n  },\n  fileMaxSize: {\n    doc: 'Defines the max file size of the given file type in MB. Use either `0` or `false` to disable. If not provided, it defaults to the value of [Uploads](/uilib/components/upload/properties/#properties) `fileMaxSize` which defaults to 5 MB.',\n    type: ['number', 'false'],\n    status: 'optional',\n  },\n}\n\nexport const UploadEvents: PropertiesTableProps = {\n  onChange: {\n    doc: 'Will be called on `files` changes made by the user. Access the files with `{ files }` (containing each a `fileItem`).',\n    type: 'function',\n    status: 'optional',\n  },\n  onFileDelete: {\n    doc: 'Will be called once a file gets deleted by the user. Access the deleted file with `{ fileItem }`.',\n    type: 'function',\n    status: 'optional',\n  },\n  onFileClick: {\n    doc: 'Will be called once a file gets clicked on by the user. Access the clicked file with `{ fileItem }`.',\n    type: 'function',\n    status: 'optional',\n  },\n}\n\nexport const FileItemProperties: PropertiesTableProps = {\n  file: {\n    doc: 'The file object. This is the same object as the one returned by the `File` API.',\n    type: 'File',\n    status: 'required',\n  },\n  id: {\n    doc: 'Unique ID for the file item. This ID is generated by the component and is not user-defined.',\n    type: 'string',\n    status: 'required',\n  },\n  exists: {\n    doc: 'Indicates if the file item already exists in the list of files. This is useful for distinguishing between new and existing files.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  isLoading: {\n    doc: 'Indicates if the file item is currently being loaded. This is useful for showing a loading state while the file is being processed.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  errorMessage: {\n    doc: 'Provide an error message to be displayed. This is useful for indicating issues with the file upload process.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  description: {\n    doc: 'Provide a description to be displayed. This is useful for providing additional information about the file.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  removeDeleteButton: {\n    doc: 'Set to `true` to remove the delete button from the file item. This is useful for preventing users from deleting files.',\n    type: 'boolean',\n    status: 'optional',\n  },\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,4 +1,6 @@
 import React from 'react';
 import type { UploadAllProps } from './types';
 export type UploadDragEvent = React.DragEvent | DragEvent;
-export default function UploadDropzone({ children, className, ...rest }: Partial<UploadAllProps>): import("react/jsx-runtime").JSX.Element;
+export default function UploadDropzone({ children, className, hideOutline, ...rest }: Partial<UploadAllProps> & {
+    hideOutline?: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/es/components/upload/UploadDropzone.js

@@ -3,7 +3,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _svg;
-const _excluded = ["children", "className"];
+const _excluded = ["children", "className", "hideOutline"];
 import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
 import classnames from 'classnames';
 import HeightAnimation from '../height-animation/HeightAnimation';
@@ -11,7 +11,8 @@ import { UploadContext } from './UploadContext';
 export default function UploadDropzone(_ref) {
   let {
       children,
-      className
+      className,
+      hideOutline = false
     } = _ref,
     rest = _objectWithoutProperties(_ref, _excluded);
   const props = rest;
@@ -85,7 +86,7 @@ export default function UploadDropzone(_ref) {
     onDrop: dropHandler,
     onDragOver: dragEnterHandler,
     onDragLeave: dragLeaveHandler
-  }, props), children, _svg || (_svg = React.createElement("svg", {
+  }, props), children, !hideOutline && (_svg || (_svg = React.createElement("svg", {
     className: "dnb-upload__outline",
     "aria-hidden": true,
     xmlns: "http://www.w3.org/2000/svg",
@@ -98,6 +99,6 @@ export default function UploadDropzone(_ref) {
     strokeWidth: "3",
     strokeDashoffset: "4",
     strokeDasharray: "8 8"
-  }))));
+  })))));
 }
 //# sourceMappingURL=UploadDropzone.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"UploadDropzone.js","names":["React","useCallback","useContext","useEffect","useRef","useState","classnames","HeightAnimation","UploadContext","UploadDropzone","_ref","children","className","rest","_objectWithoutProperties","_excluded","props","context","hover","setHover","hoverTimeout","onInputUpload","id","getFiles","event","fileData","dataTransfer","files","Array","from","forEach","file","push","clearTimers","clearTimeout","current","hoverHandler","state","stopPropagation","preventDefault","dropHandler","dragEnterHandler","dragLeaveHandler","elem","document","body","execute","hasAttribute","add","addEventListener","setAttribute","e","timeoutId","setTimeout","getAttribute","remove","removeEventListener","removeAttribute","createElement","_extends","onDrop","onDragOver","onDragLeave","_svg","xmlns","fill","width","height","rx","ry","strokeWidth","strokeDashoffset","strokeDasharray"],"sources":["../../../../src/components/upload/UploadDropzone.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react'\nimport classnames from 'classnames'\n\nimport HeightAnimation from '../height-animation/HeightAnimation'\nimport { UploadContext } from './UploadContext'\nimport type {\n  UploadAllProps,\n  UploadFileNative,\n  UploadProps,\n} from './types'\n\nexport type UploadDragEvent = React.DragEvent | DragEvent\n\nexport default function UploadDropzone({\n  children,\n  className,\n  ...rest\n}: Partial<UploadAllProps>) {\n  const props = rest as Omit<UploadProps, 'title' | 'onChange' | 'id'>\n  const context = useContext(UploadContext)\n  const [hover, setHover] = useState(false)\n  const hoverTimeout = useRef<NodeJS.Timer>()\n\n  const { onInputUpload, id } = context\n\n  const getFiles = useCallback((event: UploadDragEvent) => {\n    const fileData = event.dataTransfer\n\n    const files: Array<UploadFileNative> = []\n\n    Array.from(fileData.files).forEach((file) => {\n      files.push({ file })\n    })\n\n    return files\n  }, [])\n\n  const clearTimers = useCallback(() => {\n    clearTimeout(hoverTimeout.current)\n  }, [])\n\n  const hoverHandler = useCallback(\n    (event: UploadDragEvent, state: boolean) => {\n      event.stopPropagation()\n      event.preventDefault()\n      clearTimers()\n      setHover(state)\n    },\n    [clearTimers]\n  )\n\n  const dropHandler = useCallback(\n    (event: UploadDragEvent) => {\n      const files = getFiles(event)\n\n      onInputUpload(files)\n      hoverHandler(event, false)\n    },\n    [getFiles, onInputUpload, hoverHandler]\n  )\n\n  const dragEnterHandler = useCallback(\n    (event: UploadDragEvent) => {\n      hoverHandler(event, true)\n    },\n    [hoverHandler]\n  )\n\n  const dragLeaveHandler = useCallback(\n    (event: UploadDragEvent) => {\n      hoverHandler(event, false)\n    },\n    [hoverHandler]\n  )\n\n  useEffect(() => {\n    const elem = document.body\n    const execute = () => {\n      try {\n        if (!elem.hasAttribute('data-upload-drop-zone')) {\n          const add = elem.addEventListener\n          add('drop', dropHandler)\n          add('dragover', dragEnterHandler)\n          add('dragleave', dragLeaveHandler)\n          elem.setAttribute('data-upload-drop-zone', id)\n        }\n      } catch (e) {\n        //\n      }\n    }\n    const timeoutId = setTimeout(execute, 10) // Add the listeners delayed (ms) without prioritization, in case of re-renders\n\n    return () => {\n      clearTimers()\n      clearTimeout(timeoutId)\n      try {\n        if (elem.getAttribute('data-upload-drop-zone') === id) {\n          const remove = elem.removeEventListener\n          remove('drop', dropHandler)\n          remove('dragover', dragEnterHandler)\n          remove('dragleave', dragLeaveHandler)\n          elem.removeAttribute('data-upload-drop-zone')\n        }\n      } catch (e) {\n        //\n      }\n    }\n  }, [clearTimers, dragEnterHandler, dragLeaveHandler, dropHandler, id])\n\n  return (\n    <HeightAnimation\n      className={classnames(className, hover && 'dnb-upload--active')}\n      onDrop={dropHandler}\n      onDragOver={dragEnterHandler}\n      onDragLeave={dragLeaveHandler}\n      {...props}\n    >\n      {children}\n\n      <svg\n        className=\"dnb-upload__outline\"\n        aria-hidden\n        xmlns=\"http://www.w3.org/2000/svg\"\n        fill=\"none\"\n      >\n        <rect\n          width=\"100%\"\n          height=\"100%\"\n          rx=\"0.5rem\"\n          ry=\"0.5rem\"\n          strokeWidth=\"3\"\n          strokeDashoffset=\"4\"\n          strokeDasharray=\"8 8\"\n        />\n      </svg>\n    </HeightAnimation>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"UploadDropzone.js","names":["React","useCallback","useContext","useEffect","useRef","useState","classnames","HeightAnimation","UploadContext","UploadDropzone","_ref","children","className","hideOutline","rest","_objectWithoutProperties","_excluded","props","context","hover","setHover","hoverTimeout","onInputUpload","id","getFiles","event","fileData","dataTransfer","files","Array","from","forEach","file","push","clearTimers","clearTimeout","current","hoverHandler","state","stopPropagation","preventDefault","dropHandler","dragEnterHandler","dragLeaveHandler","elem","document","body","execute","hasAttribute","add","addEventListener","setAttribute","e","timeoutId","setTimeout","getAttribute","remove","removeEventListener","removeAttribute","createElement","_extends","onDrop","onDragOver","onDragLeave","_svg","xmlns","fill","width","height","rx","ry","strokeWidth","strokeDashoffset","strokeDasharray"],"sources":["../../../../src/components/upload/UploadDropzone.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react'\nimport classnames from 'classnames'\n\nimport HeightAnimation from '../height-animation/HeightAnimation'\nimport { UploadContext } from './UploadContext'\nimport type {\n  UploadAllProps,\n  UploadFileNative,\n  UploadProps,\n} from './types'\n\nexport type UploadDragEvent = React.DragEvent | DragEvent\n\nexport default function UploadDropzone({\n  children,\n  className,\n  hideOutline = false,\n  ...rest\n}: Partial<UploadAllProps> & { hideOutline?: boolean }) {\n  const props = rest as Omit<UploadProps, 'title' | 'onChange' | 'id'>\n  const context = useContext(UploadContext)\n  const [hover, setHover] = useState(false)\n  const hoverTimeout = useRef<NodeJS.Timer>()\n\n  const { onInputUpload, id } = context\n\n  const getFiles = useCallback((event: UploadDragEvent) => {\n    const fileData = event.dataTransfer\n\n    const files: Array<UploadFileNative> = []\n\n    Array.from(fileData.files).forEach((file) => {\n      files.push({ file })\n    })\n\n    return files\n  }, [])\n\n  const clearTimers = useCallback(() => {\n    clearTimeout(hoverTimeout.current)\n  }, [])\n\n  const hoverHandler = useCallback(\n    (event: UploadDragEvent, state: boolean) => {\n      event.stopPropagation()\n      event.preventDefault()\n      clearTimers()\n      setHover(state)\n    },\n    [clearTimers]\n  )\n\n  const dropHandler = useCallback(\n    (event: UploadDragEvent) => {\n      const files = getFiles(event)\n\n      onInputUpload(files)\n      hoverHandler(event, false)\n    },\n    [getFiles, onInputUpload, hoverHandler]\n  )\n\n  const dragEnterHandler = useCallback(\n    (event: UploadDragEvent) => {\n      hoverHandler(event, true)\n    },\n    [hoverHandler]\n  )\n\n  const dragLeaveHandler = useCallback(\n    (event: UploadDragEvent) => {\n      hoverHandler(event, false)\n    },\n    [hoverHandler]\n  )\n\n  useEffect(() => {\n    const elem = document.body\n    const execute = () => {\n      try {\n        if (!elem.hasAttribute('data-upload-drop-zone')) {\n          const add = elem.addEventListener\n          add('drop', dropHandler)\n          add('dragover', dragEnterHandler)\n          add('dragleave', dragLeaveHandler)\n          elem.setAttribute('data-upload-drop-zone', id)\n        }\n      } catch (e) {\n        //\n      }\n    }\n    const timeoutId = setTimeout(execute, 10) // Add the listeners delayed (ms) without prioritization, in case of re-renders\n\n    return () => {\n      clearTimers()\n      clearTimeout(timeoutId)\n      try {\n        if (elem.getAttribute('data-upload-drop-zone') === id) {\n          const remove = elem.removeEventListener\n          remove('drop', dropHandler)\n          remove('dragover', dragEnterHandler)\n          remove('dragleave', dragLeaveHandler)\n          elem.removeAttribute('data-upload-drop-zone')\n        }\n      } catch (e) {\n        //\n      }\n    }\n  }, [clearTimers, dragEnterHandler, dragLeaveHandler, dropHandler, id])\n\n  return (\n    <HeightAnimation\n      className={classnames(className, hover && 'dnb-upload--active')}\n      onDrop={dropHandler}\n      onDragOver={dragEnterHandler}\n      onDragLeave={dragLeaveHandler}\n      {...props}\n    >\n      {children}\n\n      {!hideOutline && (\n        <svg\n          className=\"dnb-upload__outline\"\n          aria-hidden\n          xmlns=\"http://www.w3.org/2000/svg\"\n          fill=\"none\"\n        >\n          <rect\n            width=\"100%\"\n            height=\"100%\"\n            rx=\"0.5rem\"\n            ry=\"0.5rem\"\n            strokeWidth=\"3\"\n            strokeDashoffset=\"4\"\n            strokeDasharray=\"8 8\"\n          />\n        </svg>\n      )}\n    </HeightAnimation>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,6 +1,8 @@
 import React from 'react';
-declare const UploadFileInput: ({ children, disabled, ...rest }: {
+import { UploadFile } from './types';
+declare const UploadFileInput: ({ children, disabled, files, ...rest }: {
     children?: React.ReactNode;
+    files?: UploadFile[];
     disabled?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;
 export default UploadFileInput;

package/es/components/upload/UploadFileInput.js

@@ -3,7 +3,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _UploadStatus;
-const _excluded = ["children", "disabled"];
+const _excluded = ["children", "disabled", "files"];
 import React, { useRef } from 'react';
 import Button from '../button/Button';
 import { folder as FolderIcon } from '../../icons';
@@ -14,7 +14,8 @@ import { getAcceptedFileTypes } from './UploadVerify';
 const UploadFileInput = _ref => {
   let {
       children,
-      disabled
+      disabled,
+      files
     } = _ref,
     rest = _objectWithoutProperties(_ref, _excluded);
   const fileInput = useRef(null);
@@ -24,7 +25,8 @@ const UploadFileInput = _ref => {
     acceptedFileTypes,
     buttonText,
     onInputUpload,
-    filesAmountLimit
+    filesAmountLimit,
+    variant
   } = context;
   const openFileDialog = () => {
     var _fileInput$current;
@@ -34,8 +36,8 @@ const UploadFileInput = _ref => {
   const accept = getAcceptedFileTypes(acceptedFileTypes);
   return React.createElement("div", {
     className: "dnb-upload__file-input-area"
-  }, React.createElement(Button, {
-    top: "medium",
+  }, filesAmountLimit !== (files === null || files === void 0 ? void 0 : files.length) && React.createElement(Button, {
+    top: variant === 'normal' ? 'medium' : undefined,
     id: `${sharedId}-input`,
     className: "dnb-upload__file-input-button",
     icon: FolderIcon,

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

@@ -1 +1 @@
-{"version":3,"file":"UploadFileInput.js","names":["React","useRef","Button","folder","FolderIcon","makeUniqueId","UploadContext","UploadStatus","getAcceptedFileTypes","UploadFileInput","_ref","children","disabled","rest","_objectWithoutProperties","_excluded","fileInput","context","useContext","id","acceptedFileTypes","buttonText","onInputUpload","filesAmountLimit","openFileDialog","_fileInput$current","current","click","sharedId","accept","createElement","className","top","icon","icon_position","variant","wrap","onClick","_UploadStatus","_extends","ref","type","onChange","onChangeHandler","onClickHandler","multiple","event","target","files","Array","from","map","file","value"],"sources":["../../../../src/components/upload/UploadFileInput.tsx"],"sourcesContent":["import React, { useRef } from 'react'\n\n// Components\nimport Button from '../button/Button'\n\n// Icons\nimport { folder as FolderIcon } from '../../icons'\n\n// Shared\nimport { makeUniqueId } from '../../shared/component-helper'\n\n// Internal\nimport { UploadContext } from './UploadContext'\nimport UploadStatus from './UploadStatus'\nimport { getAcceptedFileTypes } from './UploadVerify'\n\nconst UploadFileInput = ({\n  children,\n  disabled,\n  ...rest\n}: {\n  children?: React.ReactNode\n  disabled?: boolean\n}) => {\n  const fileInput = useRef<HTMLInputElement>(null)\n\n  const context = React.useContext(UploadContext)\n\n  const {\n    id,\n    acceptedFileTypes,\n    buttonText,\n    onInputUpload,\n    filesAmountLimit,\n  } = context\n\n  const openFileDialog = () => fileInput.current?.click()\n\n  const sharedId = id || makeUniqueId()\n  const accept = getAcceptedFileTypes(acceptedFileTypes)\n\n  return (\n    <div className=\"dnb-upload__file-input-area\">\n      <Button\n        top=\"medium\"\n        id={`${sharedId}-input`}\n        className=\"dnb-upload__file-input-button\"\n        icon={FolderIcon}\n        icon_position=\"left\"\n        variant=\"secondary\"\n        wrap\n        onClick={openFileDialog}\n        disabled={disabled}\n      >\n        {buttonText}\n      </Button>\n\n      <UploadStatus />\n\n      <input\n        aria-labelledby={`${sharedId}-input`}\n        ref={fileInput}\n        accept={accept}\n        className=\"dnb-upload__file-input\"\n        type=\"file\"\n        onChange={onChangeHandler}\n        onClick={onClickHandler}\n        multiple={filesAmountLimit > 1}\n        disabled={disabled}\n        {...rest}\n      />\n    </div>\n  )\n\n  function onChangeHandler(event: React.SyntheticEvent) {\n    const target = event.target as HTMLInputElement\n    const { files } = target\n\n    onInputUpload(\n      Array.from(files).map((file) => {\n        return { file }\n      })\n    )\n  }\n\n  function onClickHandler(event: React.SyntheticEvent) {\n    const target = event.target as HTMLInputElement\n\n    /**\n     * This resets the internal state.\n     * Some browsers (chromium) to check for already selected files.\n     * But we have our own logic for that.\n     * We also align the UX to be the same to all browsers,\n     * and to be same when the drag file API is used.\n     */\n    target.value = null\n  }\n}\n\nexport default UploadFileInput\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,MAAM,QAAQ,OAAO;AAGrC,OAAOC,MAAM,MAAM,kBAAkB;AAGrC,SAASC,MAAM,IAAIC,UAAU,QAAQ,aAAa;AAGlD,SAASC,YAAY,QAAQ,+BAA+B;AAG5D,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,OAAOC,YAAY,MAAM,gBAAgB;AACzC,SAASC,oBAAoB,QAAQ,gBAAgB;AAErD,MAAMC,eAAe,GAAGC,IAAA,IAOlB;EAAA,IAPmB;MACvBC,QAAQ;MACRC;IAKF,CAAC,GAAAF,IAAA;IAJIG,IAAI,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAKP,MAAMC,SAAS,GAAGf,MAAM,CAAmB,IAAI,CAAC;EAEhD,MAAMgB,OAAO,GAAGjB,KAAK,CAACkB,UAAU,CAACZ,aAAa,CAAC;EAE/C,MAAM;IACJa,EAAE;IACFC,iBAAiB;IACjBC,UAAU;IACVC,aAAa;IACbC;EACF,CAAC,GAAGN,OAAO;EAEX,MAAMO,cAAc,GAAGA,CAAA;IAAA,IAAAC,kBAAA;IAAA,QAAAA,kBAAA,GAAMT,SAAS,CAACU,OAAO,cAAAD,kBAAA,uBAAjBA,kBAAA,CAAmBE,KAAK,CAAC,CAAC;EAAA;EAEvD,MAAMC,QAAQ,GAAGT,EAAE,IAAId,YAAY,CAAC,CAAC;EACrC,MAAMwB,MAAM,GAAGrB,oBAAoB,CAACY,iBAAiB,CAAC;EAEtD,OACEpB,KAAA,CAAA8B,aAAA;IAAKC,SAAS,EAAC;EAA6B,GAC1C/B,KAAA,CAAA8B,aAAA,CAAC5B,MAAM;IACL8B,GAAG,EAAC,QAAQ;IACZb,EAAE,EAAE,GAAGS,QAAQ,QAAS;IACxBG,SAAS,EAAC,+BAA+B;IACzCE,IAAI,EAAE7B,UAAW;IACjB8B,aAAa,EAAC,MAAM;IACpBC,OAAO,EAAC,WAAW;IACnBC,IAAI;IACJC,OAAO,EAAEb,cAAe;IACxBZ,QAAQ,EAAEA;EAAS,GAElBS,UACK,CAAC,EAAAiB,aAAA,KAAAA,aAAA,GAETtC,KAAA,CAAA8B,aAAA,CAACvB,YAAY,MAAE,CAAC,GAEhBP,KAAA,CAAA8B,aAAA,UAAAS,QAAA;IACE,mBAAiB,GAAGX,QAAQ,QAAS;IACrCY,GAAG,EAAExB,SAAU;IACfa,MAAM,EAAEA,MAAO;IACfE,SAAS,EAAC,wBAAwB;IAClCU,IAAI,EAAC,MAAM;IACXC,QAAQ,EAAEC,eAAgB;IAC1BN,OAAO,EAAEO,cAAe;IACxBC,QAAQ,EAAEtB,gBAAgB,GAAG,CAAE;IAC/BX,QAAQ,EAAEA;EAAS,GACfC,IAAI,CACT,CACE,CAAC;EAGR,SAAS8B,eAAeA,CAACG,KAA2B,EAAE;IACpD,MAAMC,MAAM,GAAGD,KAAK,CAACC,MAA0B;IAC/C,MAAM;MAAEC;IAAM,CAAC,GAAGD,MAAM;IAExBzB,aAAa,CACX2B,KAAK,CAACC,IAAI,CAACF,KAAK,CAAC,CAACG,GAAG,CAAEC,IAAI,IAAK;MAC9B,OAAO;QAAEA;MAAK,CAAC;IACjB,CAAC,CACH,CAAC;EACH;EAEA,SAASR,cAAcA,CAACE,KAA2B,EAAE;IACnD,MAAMC,MAAM,GAAGD,KAAK,CAACC,MAA0B;IAS/CA,MAAM,CAACM,KAAK,GAAG,IAAI;EACrB;AACF,CAAC;AAED,eAAe5C,eAAe","ignoreList":[]}
+{"version":3,"file":"UploadFileInput.js","names":["React","useRef","Button","folder","FolderIcon","makeUniqueId","UploadContext","UploadStatus","getAcceptedFileTypes","UploadFileInput","_ref","children","disabled","files","rest","_objectWithoutProperties","_excluded","fileInput","context","useContext","id","acceptedFileTypes","buttonText","onInputUpload","filesAmountLimit","variant","openFileDialog","_fileInput$current","current","click","sharedId","accept","createElement","className","length","top","undefined","icon","icon_position","wrap","onClick","_UploadStatus","_extends","ref","type","onChange","onChangeHandler","onClickHandler","multiple","event","target","Array","from","map","file","value"],"sources":["../../../../src/components/upload/UploadFileInput.tsx"],"sourcesContent":["import React, { useRef } from 'react'\n\n// Components\nimport Button from '../button/Button'\n\n// Icons\nimport { folder as FolderIcon } from '../../icons'\n\n// Shared\nimport { makeUniqueId } from '../../shared/component-helper'\n\n// Internal\nimport { UploadContext } from './UploadContext'\nimport UploadStatus from './UploadStatus'\nimport { getAcceptedFileTypes } from './UploadVerify'\nimport { UploadFile } from './types'\n\nconst UploadFileInput = ({\n  children,\n  disabled,\n  files,\n  ...rest\n}: {\n  children?: React.ReactNode\n  files?: UploadFile[]\n  disabled?: boolean\n}) => {\n  const fileInput = useRef<HTMLInputElement>(null)\n\n  const context = React.useContext(UploadContext)\n\n  const {\n    id,\n    acceptedFileTypes,\n    buttonText,\n    onInputUpload,\n    filesAmountLimit,\n    variant,\n  } = context\n\n  const openFileDialog = () => fileInput.current?.click()\n\n  const sharedId = id || makeUniqueId()\n  const accept = getAcceptedFileTypes(acceptedFileTypes)\n\n  return (\n    <div className=\"dnb-upload__file-input-area\">\n      {filesAmountLimit !== files?.length && (\n        <Button\n          top={variant === 'normal' ? 'medium' : undefined}\n          id={`${sharedId}-input`}\n          className=\"dnb-upload__file-input-button\"\n          icon={FolderIcon}\n          icon_position=\"left\"\n          variant=\"secondary\"\n          wrap\n          onClick={openFileDialog}\n          disabled={disabled}\n        >\n          {buttonText}\n        </Button>\n      )}\n      <UploadStatus />\n\n      <input\n        aria-labelledby={`${sharedId}-input`}\n        ref={fileInput}\n        accept={accept}\n        className=\"dnb-upload__file-input\"\n        type=\"file\"\n        onChange={onChangeHandler}\n        onClick={onClickHandler}\n        multiple={filesAmountLimit > 1}\n        disabled={disabled}\n        {...rest}\n      />\n    </div>\n  )\n\n  function onChangeHandler(event: React.SyntheticEvent) {\n    const target = event.target as HTMLInputElement\n    const { files } = target\n\n    onInputUpload(\n      Array.from(files).map((file) => {\n        return { file }\n      })\n    )\n  }\n\n  function onClickHandler(event: React.SyntheticEvent) {\n    const target = event.target as HTMLInputElement\n\n    /**\n     * This resets the internal state.\n     * Some browsers (chromium) to check for already selected files.\n     * But we have our own logic for that.\n     * We also align the UX to be the same to all browsers,\n     * and to be same when the drag file API is used.\n     */\n    target.value = null\n  }\n}\n\nexport default UploadFileInput\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,MAAM,QAAQ,OAAO;AAGrC,OAAOC,MAAM,MAAM,kBAAkB;AAGrC,SAASC,MAAM,IAAIC,UAAU,QAAQ,aAAa;AAGlD,SAASC,YAAY,QAAQ,+BAA+B;AAG5D,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,OAAOC,YAAY,MAAM,gBAAgB;AACzC,SAASC,oBAAoB,QAAQ,gBAAgB;AAGrD,MAAMC,eAAe,GAAGC,IAAA,IASlB;EAAA,IATmB;MACvBC,QAAQ;MACRC,QAAQ;MACRC;IAMF,CAAC,GAAAH,IAAA;IALII,IAAI,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAMP,MAAMC,SAAS,GAAGhB,MAAM,CAAmB,IAAI,CAAC;EAEhD,MAAMiB,OAAO,GAAGlB,KAAK,CAACmB,UAAU,CAACb,aAAa,CAAC;EAE/C,MAAM;IACJc,EAAE;IACFC,iBAAiB;IACjBC,UAAU;IACVC,aAAa;IACbC,gBAAgB;IAChBC;EACF,CAAC,GAAGP,OAAO;EAEX,MAAMQ,cAAc,GAAGA,CAAA;IAAA,IAAAC,kBAAA;IAAA,QAAAA,kBAAA,GAAMV,SAAS,CAACW,OAAO,cAAAD,kBAAA,uBAAjBA,kBAAA,CAAmBE,KAAK,CAAC,CAAC;EAAA;EAEvD,MAAMC,QAAQ,GAAGV,EAAE,IAAIf,YAAY,CAAC,CAAC;EACrC,MAAM0B,MAAM,GAAGvB,oBAAoB,CAACa,iBAAiB,CAAC;EAEtD,OACErB,KAAA,CAAAgC,aAAA;IAAKC,SAAS,EAAC;EAA6B,GACzCT,gBAAgB,MAAKX,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEqB,MAAM,KACjClC,KAAA,CAAAgC,aAAA,CAAC9B,MAAM;IACLiC,GAAG,EAAEV,OAAO,KAAK,QAAQ,GAAG,QAAQ,GAAGW,SAAU;IACjDhB,EAAE,EAAE,GAAGU,QAAQ,QAAS;IACxBG,SAAS,EAAC,+BAA+B;IACzCI,IAAI,EAAEjC,UAAW;IACjBkC,aAAa,EAAC,MAAM;IACpBb,OAAO,EAAC,WAAW;IACnBc,IAAI;IACJC,OAAO,EAAEd,cAAe;IACxBd,QAAQ,EAAEA;EAAS,GAElBU,UACK,CACT,EAAAmB,aAAA,KAAAA,aAAA,GACDzC,KAAA,CAAAgC,aAAA,CAACzB,YAAY,MAAE,CAAC,GAEhBP,KAAA,CAAAgC,aAAA,UAAAU,QAAA;IACE,mBAAiB,GAAGZ,QAAQ,QAAS;IACrCa,GAAG,EAAE1B,SAAU;IACfc,MAAM,EAAEA,MAAO;IACfE,SAAS,EAAC,wBAAwB;IAClCW,IAAI,EAAC,MAAM;IACXC,QAAQ,EAAEC,eAAgB;IAC1BN,OAAO,EAAEO,cAAe;IACxBC,QAAQ,EAAExB,gBAAgB,GAAG,CAAE;IAC/BZ,QAAQ,EAAEA;EAAS,GACfE,IAAI,CACT,CACE,CAAC;EAGR,SAASgC,eAAeA,CAACG,KAA2B,EAAE;IACpD,MAAMC,MAAM,GAAGD,KAAK,CAACC,MAA0B;IAC/C,MAAM;MAAErC;IAAM,CAAC,GAAGqC,MAAM;IAExB3B,aAAa,CACX4B,KAAK,CAACC,IAAI,CAACvC,KAAK,CAAC,CAACwC,GAAG,CAAEC,IAAI,IAAK;MAC9B,OAAO;QAAEA;MAAK,CAAC;IACjB,CAAC,CACH,CAAC;EACH;EAEA,SAASP,cAAcA,CAACE,KAA2B,EAAE;IACnD,MAAMC,MAAM,GAAGD,KAAK,CAACC,MAA0B;IAS/CA,MAAM,CAACK,KAAK,GAAG,IAAI;EACrB;AACF,CAAC;AAED,eAAe9C,eAAe","ignoreList":[]}

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

@@ -137,6 +137,14 @@
 .dnb-upload__accepted-file-types-table.dnb-table tbody td:first-child {
   padding-left: 0;
 }
-.dnb-upload__subtitle.dnb-p {
-  color: var(--upload-text--secondary);
+.dnb-upload--compact {
+  padding: 0;
+  border-radius: 0;
+}
+.dnb-upload--compact .dnb-upload__text {
+  color: var(--color-black-55);
+  font-size: var(--font-size-small);
+}
+.dnb-upload--compact .dnb-help-button__content .dnb-section {
+  margin-bottom: 1rem;
 }

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

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

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

@@ -162,7 +162,17 @@
     }
   }
 
-  &__subtitle.dnb-p {
-    color: var(--upload-text--secondary);
+  &--compact {
+    padding: 0;
+    border-radius: 0;
+    .dnb-upload__text {
+      color: var(--color-black-55);
+      font-size: var(--font-size-small);
+    }
+    .dnb-help-button__content {
+      .dnb-section {
+        margin-bottom: 1rem;
+      }
+    }
   }
 }

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

@@ -13,6 +13,10 @@ export type UploadProps = {
      * unique id used with the useUpload hook to manage the files
      */
     id?: SharedStateId;
+    /**
+     * defines the appearance. Use one of these: `normal` or `compact`. Defaults to `normal`.
+     */
+    variant?: 'normal' | 'compact';
     /**
      * list of accepted file types.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/upload/types.ts"],"sourcesContent":["import React from 'react'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { LocaleProps, SpacingProps } from '../../shared/types'\nimport type { SharedStateId } from '../../shared/helpers/useSharedState'\n\nexport type UploadAcceptedFileTypes = string[]\n\nexport type UploadAcceptedFileTypesWithFileMaxSize =\n  UploadAcceptedFileTypeObject[]\n\nexport type UploadAcceptedFileTypeObject = {\n  fileType: string\n  fileMaxSize?: number | false\n}\n\nexport type UploadProps = {\n  /**\n   * unique id used with the useUpload hook to manage the files\n   */\n  id?: SharedStateId\n\n  /**\n   * list of accepted file types.\n   */\n  acceptedFileTypes:\n    | UploadAcceptedFileTypes\n    | UploadAcceptedFileTypesWithFileMaxSize\n\n  /**\n   * Skeleton should be applied when loading content\n   * Default: null\n   */\n  skeleton?: SkeletonShow\n\n  /**\n   * Defines the amount of files the user can select and upload\n   * Default: 100\n   */\n  filesAmountLimit?: number\n\n  /**\n   * Defines the max file size of each file in MB. Use either `0` or `false` to disable.\n   * Default: 5 MB\n   */\n  fileMaxSize?: number | false\n\n  /**\n   * will be called on `files` changes made by the user. Access the files with `{ files }`.\n   */\n  onChange?: ({ files }: { files: Array<UploadFile> }) => void\n\n  /**\n   * will be called once a file gets deleted by the user. Access the deleted file with `{ fileItem }`.\n   */\n  onFileDelete?: ({\n    fileItem,\n  }: {\n    fileItem: UploadFile\n  }) => void | Promise<void>\n\n  /**\n   * Will be called once a file gets clicked on by the user. Access the clicked file with `{ fileItem }`.\n   */\n  onFileClick?: ({\n    fileItem,\n  }: {\n    fileItem: UploadFile\n  }) => void | Promise<void>\n\n  /**\n   * Causes the browser to treat all listed files as downloadable instead of opening them in a new browser tab or window.\n   * Default: false\n   */\n  download?: boolean\n\n  /**\n   * Allows uploading of duplicate files.\n   * Default: false\n   */\n  allowDuplicates?: boolean\n\n  /**\n   * Disables file drag and drop, by removing the drop zone.\n   * Default: false\n   */\n  disableDragAndDrop?: boolean\n\n  /**\n   * Custom text properties\n   */\n  title?: React.ReactNode\n  text?: React.ReactNode\n  fileTypeTableCaption?: React.ReactNode\n  fileTypeDescription?: React.ReactNode\n  fileSizeDescription?: React.ReactNode\n  fileAmountDescription?: React.ReactNode\n  fileSizeContent?: React.ReactNode\n  buttonText?: React.ReactNode\n  errorLargeFile?: React.ReactNode\n  errorUnsupportedFile?: React.ReactNode\n  errorAmountLimit?: React.ReactNode\n  loadingText?: React.ReactNode\n  deleteButton?: React.ReactNode\n  fileListAriaLabel?: string\n  children?: React.ReactNode\n}\n\nexport type UploadAllProps = UploadProps &\n  SpacingProps &\n  LocaleProps &\n  Omit<React.HTMLProps<HTMLElement>, 'onChange' | 'title'>\n\nexport type UploadContextProps = {\n  id?: string\n  onInputUpload: (files: Array<UploadFileNative>) => void\n} & Partial<UploadAllProps>\n\nexport type UploadFile = {\n  file: File\n  id: string\n  exists: boolean\n  isLoading?: boolean\n  errorMessage?: React.ReactNode\n  description?: React.ReactNode\n  removeDeleteButton?: boolean\n}\n\nexport type UploadFileNative = Omit<UploadFile, 'id' | 'exists'> &\n  Partial<Pick<UploadFile, 'id' | 'exists'>>\n"],"mappings":"","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/upload/types.ts"],"sourcesContent":["import React from 'react'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { LocaleProps, SpacingProps } from '../../shared/types'\nimport type { SharedStateId } from '../../shared/helpers/useSharedState'\n\nexport type UploadAcceptedFileTypes = string[]\n\nexport type UploadAcceptedFileTypesWithFileMaxSize =\n  UploadAcceptedFileTypeObject[]\n\nexport type UploadAcceptedFileTypeObject = {\n  fileType: string\n  fileMaxSize?: number | false\n}\n\nexport type UploadProps = {\n  /**\n   * unique id used with the useUpload hook to manage the files\n   */\n  id?: SharedStateId\n\n  /**\n   * defines the appearance. Use one of these: `normal` or `compact`. Defaults to `normal`.\n   */\n  variant?: 'normal' | 'compact'\n\n  /**\n   * list of accepted file types.\n   */\n  acceptedFileTypes:\n    | UploadAcceptedFileTypes\n    | UploadAcceptedFileTypesWithFileMaxSize\n\n  /**\n   * Skeleton should be applied when loading content\n   * Default: null\n   */\n  skeleton?: SkeletonShow\n\n  /**\n   * Defines the amount of files the user can select and upload\n   * Default: 100\n   */\n  filesAmountLimit?: number\n\n  /**\n   * Defines the max file size of each file in MB. Use either `0` or `false` to disable.\n   * Default: 5 MB\n   */\n  fileMaxSize?: number | false\n\n  /**\n   * will be called on `files` changes made by the user. Access the files with `{ files }`.\n   */\n  onChange?: ({ files }: { files: Array<UploadFile> }) => void\n\n  /**\n   * will be called once a file gets deleted by the user. Access the deleted file with `{ fileItem }`.\n   */\n  onFileDelete?: ({\n    fileItem,\n  }: {\n    fileItem: UploadFile\n  }) => void | Promise<void>\n\n  /**\n   * Will be called once a file gets clicked on by the user. Access the clicked file with `{ fileItem }`.\n   */\n  onFileClick?: ({\n    fileItem,\n  }: {\n    fileItem: UploadFile\n  }) => void | Promise<void>\n\n  /**\n   * Causes the browser to treat all listed files as downloadable instead of opening them in a new browser tab or window.\n   * Default: false\n   */\n  download?: boolean\n\n  /**\n   * Allows uploading of duplicate files.\n   * Default: false\n   */\n  allowDuplicates?: boolean\n\n  /**\n   * Disables file drag and drop, by removing the drop zone.\n   * Default: false\n   */\n  disableDragAndDrop?: boolean\n\n  /**\n   * Custom text properties\n   */\n  title?: React.ReactNode\n  text?: React.ReactNode\n  fileTypeTableCaption?: React.ReactNode\n  fileTypeDescription?: React.ReactNode\n  fileSizeDescription?: React.ReactNode\n  fileAmountDescription?: React.ReactNode\n  fileSizeContent?: React.ReactNode\n  buttonText?: React.ReactNode\n  errorLargeFile?: React.ReactNode\n  errorUnsupportedFile?: React.ReactNode\n  errorAmountLimit?: React.ReactNode\n  loadingText?: React.ReactNode\n  deleteButton?: React.ReactNode\n  fileListAriaLabel?: string\n  children?: React.ReactNode\n}\n\nexport type UploadAllProps = UploadProps &\n  SpacingProps &\n  LocaleProps &\n  Omit<React.HTMLProps<HTMLElement>, 'onChange' | 'title'>\n\nexport type UploadContextProps = {\n  id?: string\n  onInputUpload: (files: Array<UploadFileNative>) => void\n} & Partial<UploadAllProps>\n\nexport type UploadFile = {\n  file: File\n  id: string\n  exists: boolean\n  isLoading?: boolean\n  errorMessage?: React.ReactNode\n  description?: React.ReactNode\n  removeDeleteButton?: boolean\n}\n\nexport type UploadFileNative = Omit<UploadFile, 'id' | 'exists'> &\n  Partial<Pick<UploadFile, 'id' | 'exists'>>\n"],"mappings":"","ignoreList":[]}

package/es/elements/lists/style/lists-mixins.scss

@@ -154,7 +154,7 @@
       // We cannot use gap: 0.5rem because of our wrapper "__item"
       display: flex;
       flex-wrap: wrap;
-      max-width: 60ch; // to enhance readability
+      max-width: var(--text-block-max-width); // to enhance readability
       width: 100%;
 
       & dt {

package/es/extensions/forms/Connectors/Bring/address.d.ts

@@ -0,0 +1,48 @@
+import { Props as SelectionProps } from '../../Field/Selection';
+import { Path, PathStrict, ReceiveAdditionalEventArgs } from '../../types';
+import { GeneralConfig, HandlerConfig, PreResponseResolver, ResponseResolver } from '../createContext';
+export declare const supportedCountryCodes: readonly ["NO"];
+export type SupportedCountries = (typeof supportedCountryCodes)[number];
+export declare const unsupportedCountryMessage = "Postal code verification is not supported for {countryCode}.";
+export type AddressResolverData = {
+    addresses: {
+        street_name: string;
+        house_number: string;
+        postal_code: string;
+        city: string;
+    }[];
+};
+export type AddressResolverPayload = Array<{
+    item: AddressResolverData['addresses'][0];
+    selected_value: string;
+    selectedKey: string;
+    content: string[];
+}>;
+type SuggestionsConnectorReturn = (event: {
+    value: string;
+    showIndicator: () => void;
+    hideIndicator: () => void;
+    updateData: (data: AddressResolverPayload) => void;
+} & ReceiveAdditionalEventArgs<string>) => Promise<void>;
+type SuggestionsHandlerConfig = HandlerConfig & {
+    countryCode?: PathStrict | SupportedCountries | Lowercase<SupportedCountries>;
+    cityPath: Path;
+    postalCodePath: Path;
+};
+export declare const preResponseResolver: PreResponseResolver;
+export declare const responseResolver: ResponseResolver<AddressResolverData, AddressResolverPayload>;
+export declare function suggestions(generalConfig: GeneralConfig, handlerConfig?: SuggestionsHandlerConfig): SuggestionsConnectorReturn;
+export declare function suggestionsElement(generalConfig: GeneralConfig, handlerConfig?: SuggestionsHandlerConfig): (props: SelectionProps) => import("react/jsx-runtime").JSX.Element;
+export declare function getMockData(countryCode?: string): {
+    addresses: {
+        address_id: string;
+        street_name: string;
+        house_number: number;
+        postal_code: string;
+        city: string;
+        county: string;
+        municipality: string;
+        type: string;
+    }[];
+};
+export {};