@dnb/eufemia/cjs/components/upload/UploadInfo.js

DNB Eufemia Design System UI Library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _push = _interopRequireDefault(require("core-js-pure/stable/instance/push.js"));
var _react = _interopRequireDefault(require("react"));
var _UploadContext = require("./UploadContext.js");
var _Lead = _interopRequireDefault(require("../../elements/Lead.js"));
var _P = _interopRequireDefault(require("../../elements/P.js"));
var _Dl = _interopRequireDefault(require("../../elements/Dl.js"));
var _Dt = _interopRequireDefault(require("../../elements/Dt.js"));
var _Dd = _interopRequireDefault(require("../../elements/Dd.js"));
var _NumberUtils = require("../number-format/NumberUtils.js");
var _UploadVerify = require("./UploadVerify.js");
var _Table = _interopRequireDefault(require("../Table.js"));
var _TableTr = _interopRequireDefault(require("../table/TableTr.js"));
var _TableTh = _interopRequireDefault(require("../table/TableTh.js"));
var _TableTd = _interopRequireDefault(require("../table/TableTd.js"));
var _Flex = _interopRequireDefault(require("../../components/Flex.js"));
var _jsxRuntime = require("react/jsx-runtime");
var _UploadInfoAcceptedFi;
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const prettifyAcceptedFileFormats = acceptedFileTypes => acceptedFileTypes.sort().join(', ').toUpperCase();
const UploadInfo = () => {
  const context = _react.default.useContext(_UploadContext.UploadContext);
  const {
    title,
    text,
    acceptedFileTypes,
    fileTypeDescription,
    fileSizeDescription,
    fileAmountDescription,
    fileSizeContent,
    filesAmountLimit,
    fileMaxSize,
    children
  } = context;
  const prettifiedAcceptedFileFormats = prettifyAcceptedFileFormats(acceptedFileTypes);
  const isAcceptedFileTypeListOfStrings = (0, _UploadVerify.isArrayOfStrings)(acceptedFileTypes);
  const displayAcceptedFileFormatsListItem = isAcceptedFileTypeListOfStrings && prettifiedAcceptedFileFormats;
  const displayFileMaxSizeItem = isAcceptedFileTypeListOfStrings && fileMaxSize;
  const displayFilesAmountLimitItem = filesAmountLimit < _UploadContext.defaultProps.filesAmountLimit;
  const displayAcceptedFileFormatsTable = !displayAcceptedFileFormatsListItem && (0, _UploadVerify.isArrayOfObjects)(acceptedFileTypes);
  const displayDl = displayAcceptedFileFormatsListItem || displayFileMaxSizeItem || displayFilesAmountLimitItem;
  return (0, _jsxRuntime.jsxs)(_Flex.default.Stack, {
    gap: "small",
    children: [(title || text) && (0, _jsxRuntime.jsxs)(_Flex.default.Stack, {
      gap: "xx-small",
      children: [title && (0, _jsxRuntime.jsx)(_Lead.default, {
        space: "0",
        children: title
      }), text && (0, _jsxRuntime.jsx)(_P.default, {
        className: "dnb-upload__text",
        children: text
      })]
    }), children, displayDl && (0, _jsxRuntime.jsxs)(_Dl.default, {
      bottom: 0,
      layout: "horizontal",
      children: [displayAcceptedFileFormatsListItem && (0, _jsxRuntime.jsxs)(_Dl.default.Item, {
        children: [(0, _jsxRuntime.jsx)(_Dt.default, {
          children: fileTypeDescription
        }), (0, _jsxRuntime.jsx)(_Dd.default, {
          children: prettifiedAcceptedFileFormats
        })]
      }), displayFileMaxSizeItem && (0, _jsxRuntime.jsxs)(_Dl.default.Item, {
        children: [(0, _jsxRuntime.jsx)(_Dt.default, {
          children: fileSizeDescription
        }), (0, _jsxRuntime.jsx)(_Dd.default, {
          children: String(fileSizeContent).replace('%size', (0, _NumberUtils.formatNumber)(fileMaxSize).toString())
        })]
      }), displayFilesAmountLimitItem && (0, _jsxRuntime.jsxs)(_Dl.default.Item, {
        children: [(0, _jsxRuntime.jsx)(_Dt.default, {
          children: fileAmountDescription
        }), (0, _jsxRuntime.jsx)(_Dd.default, {
          children: filesAmountLimit
        })]
      })]
    }), displayAcceptedFileFormatsTable && (_UploadInfoAcceptedFi || (_UploadInfoAcceptedFi = (0, _jsxRuntime.jsx)(UploadInfoAcceptedFileTypesTable, {})))]
  });
};
function UploadInfoAcceptedFileTypesTable() {
  const context = _react.default.useContext(_UploadContext.UploadContext);
  const {
    acceptedFileTypes,
    fileTypeTableCaption,
    fileTypeDescription,
    fileSizeDescription,
    fileSizeContent,
    fileMaxSize
  } = context;
  const groupByFileMaxSize = (acceptedFileTypes, fallBackFileMaxSize) => {
    const fileMaxSizeIsFalseOrZero = fileMaxSize => {
      return fileMaxSize === false || fileMaxSize === 0;
    };
    const group = {};
    acceptedFileTypes.forEach(item => {
      var _context;
      const itemFileMaxSize = item.fileMaxSize;
      const groupName = itemFileMaxSize ? itemFileMaxSize : fileMaxSizeIsFalseOrZero(itemFileMaxSize) ? 0 : fileMaxSizeIsFalseOrZero(fallBackFileMaxSize) ? 0 : fallBackFileMaxSize;
      group[groupName] = group[groupName] || [];
      (0, _push.default)(_context = group[groupName]).call(_context, item);
    });
    return group;
  };
  const acceptedFileTypesGroupedByFileMaxSize = groupByFileMaxSize(acceptedFileTypes, fileMaxSize);
  return (0, _jsxRuntime.jsxs)(_Table.default, {
    border: true,
    className: "dnb-upload__accepted-file-types-table",
    size: "small",
    children: [(0, _jsxRuntime.jsx)("caption", {
      className: "dnb-sr-only",
      children: fileTypeTableCaption
    }), (0, _jsxRuntime.jsx)("thead", {
      children: (0, _jsxRuntime.jsxs)(_TableTr.default, {
        variant: "odd",
        cellSpacing: 0,
        children: [(0, _jsxRuntime.jsx)(_TableTh.default, {
          children: fileTypeDescription
        }), (0, _jsxRuntime.jsx)(_TableTh.default, {
          children: fileSizeDescription
        })]
      })
    }), (0, _jsxRuntime.jsx)("tbody", {
      children: Object.keys(acceptedFileTypesGroupedByFileMaxSize).sort((a, b) => Number(b) - Number(a)).map(key => {
        return (0, _jsxRuntime.jsxs)(_TableTr.default, {
          variant: "odd",
          children: [(0, _jsxRuntime.jsx)(_TableTd.default, {
            children: prettifyAcceptedFileFormats(acceptedFileTypesGroupedByFileMaxSize[key].map(acceptedFileTypesObj => acceptedFileTypesObj.fileType))
          }), (0, _jsxRuntime.jsx)(_TableTd.default, {
            children: key !== '0' && String(fileSizeContent).replace('%size', (0, _NumberUtils.formatNumber)(key).toString())
          })]
        }, key);
      })
    })]
  });
}
var _default = exports.default = UploadInfo;
//# sourceMappingURL=UploadInfo.js.map