@skbkontur/react-ui 3.9.2 → 3.10.0-fileuploader.1

package/cjs/components/FileUploader/FileUploader.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import { FileUploaderAttachedFile } from '../../internal/FileUploaderControl/fileUtils';
+import { Nullable } from '../../typings/utility-types';
+import { FileUploaderControlProviderProps } from '../../internal/FileUploaderControl/FileUploaderControlProvider';
+import { CommonProps } from '../../internal/CommonWrapper';
+interface _FileUploaderProps extends CommonProps, Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
+    /** Состояние ошибки всего контрола */
+    error?: boolean;
+    /** Состояние предупреждения всего контрола */
+    warning?: boolean;
+    /** Свойство ширины. */
+    width?: React.CSSProperties['width'];
+    /** Срабатывает при невалидном чтении файла (превращение в base64) */
+    onReadError?: (files: FileUploaderAttachedFile[]) => void;
+    /** Функция, через которую отправляем файлы. Используется для отслеживания статуса загрузки файла. */
+    request?: (file: FileUploaderAttachedFile) => Promise<void>;
+    /** Срабатывает при удачной попытке отправки через request */
+    onRequestSuccess?: (fileId: string) => void;
+    /** Срабатывает при неудачной попытке отправки через request */
+    onRequestError?: (fileId: string) => void;
+    /** Функция валидации каждого файла. Срабатывает после выбора файлов и перед попыткой отправить в request. */
+    getFileValidationText?: (file: FileUploaderAttachedFile) => Promise<Nullable<string>>;
+}
+export interface FileUploaderRef {
+    focus: () => void;
+    blur: () => void;
+}
+export interface FileUploaderProps extends _FileUploaderProps, FileUploaderControlProviderProps {
+}
+export declare const FileUploader: React.ForwardRefExoticComponent<FileUploaderProps & FileUploaderControlProviderProps & React.RefAttributes<FileUploaderRef>>;
+export {};

package/cjs/components/FileUploader/FileUploader.js

@@ -0,0 +1,270 @@
+"use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.FileUploader = void 0;var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
+
+var _fileUtils = require("../../internal/FileUploaderControl/fileUtils");
+var _Emotion = require("../../lib/theming/Emotion");
+var _useMemoObject = require("../../hooks/useMemoObject");
+var _FileUploaderControlContext = require("../../internal/FileUploaderControl/FileUploaderControlContext");
+var _FileUploaderFileValidationResult = require("../../internal/FileUploaderControl/FileUploaderFileValidationResult");
+var _useControlLocale = require("../../internal/FileUploaderControl/hooks/useControlLocale");
+var _useUpload = require("../../internal/FileUploaderControl/hooks/useUpload");
+var _useDrop3 = require("../../hooks/useDrop");
+
+var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _px = require("../../internal/icons/16px");
+
+var _withFileUploaderControlProvider = require("../../internal/FileUploaderControl/withFileUploaderControlProvider");
+var _keyListener = require("../../lib/events/keyListener");
+var _FileUploaderFile = require("../../internal/FileUploaderControl/FileUploaderFile/FileUploaderFile");
+var _FileUploaderFileList = require("../../internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList");
+var _client = require("../../lib/client");
+var _CommonWrapper = require("../../internal/CommonWrapper");
+
+var _FileUploader2 = require("./FileUploader.styles");
+
+var stopPropagation = function stopPropagation(e) {return e.stopPropagation();};
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _FileUploader = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {var _cx, _cx2, _cx3, _cx4;
+  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);var
+
+
+  disabled =
+
+
+
+
+
+
+
+
+
+
+
+
+  props.disabled,error = props.error,warning = props.warning,onBlur = props.onBlur,onFocus = props.onFocus,onReadError = props.onReadError,_props$multiple = props.multiple,multiple = _props$multiple === void 0 ? false : _props$multiple,_props$width = props.width,width = _props$width === void 0 ? theme.fileUploaderWidth : _props$width,request = props.request,getFileValidationText = props.getFileValidationText,onRequestSuccess = props.onRequestSuccess,onRequestError = props.onRequestError,inputProps = (0, _objectWithoutPropertiesLoose2.default)(props, ["disabled", "error", "warning", "onBlur", "onFocus", "onReadError", "multiple", "width", "request", "getFileValidationText", "onRequestSuccess", "onRequestError"]);var _useContext =
+
+  (0, _react.useContext)(_FileUploaderControlContext.FileUploaderControlContext),files = _useContext.files,setFiles = _useContext.setFiles,removeFile = _useContext.removeFile,setFileValidationResult = _useContext.setFileValidationResult;
+
+  var locale = (0, _useControlLocale.useControlLocale)();
+
+  var inputRef = (0, _react.useRef)(null);
+
+  var isAsync = !!request;
+  var isSingleMode = !multiple;
+
+  var upload = (0, _useUpload.useUpload)(request, onRequestSuccess, onRequestError);
+
+  var tryValidateAndUpload = (0, _react.useCallback)(
+  function (files) {
+    files.forEach( /*#__PURE__*/function () {var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(file) {var validationMessage;return _regenerator.default.wrap(function _callee$(_context) {while (1) {switch (_context.prev = _context.next) {case 0:_context.t0 =
+                getFileValidationText;if (!_context.t0) {_context.next = 5;break;}_context.next = 4;return getFileValidationText(file);case 4:_context.t0 = _context.sent;case 5:validationMessage = _context.t0;
+
+                if (!validationMessage) {
+                  isAsync && upload(file);
+                } else {
+                  setFileValidationResult(file.id, _FileUploaderFileValidationResult.FileUploaderFileValidationResult.error(validationMessage));
+                }case 7:case "end":return _context.stop();}}}, _callee);}));return function (_x) {return _ref.apply(this, arguments);};}());
+
+  },
+  [upload, error, getFileValidationText, isAsync]);
+
+
+  /** common part **/
+  var handleChange = (0, _react.useCallback)( /*#__PURE__*/function () {var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(
+    function _callee2(newFiles) {var filesArray, uploadFiles, selectedFiles, readErrorFiles;return _regenerator.default.wrap(function _callee2$(_context2) {while (1) {switch (_context2.prev = _context2.next) {case 0:if (
+              newFiles) {_context2.next = 2;break;}return _context2.abrupt("return");case 2:
+
+              filesArray = Array.from(newFiles);
+
+              if (isSingleMode) {
+                filesArray = [filesArray[0]];
+              }_context2.next = 6;return (
+
+                (0, _fileUtils.readFiles)(filesArray));case 6:uploadFiles = _context2.sent;
+
+              selectedFiles = uploadFiles.filter(function (v) {return !!v.fileInBase64;});
+              readErrorFiles = uploadFiles.filter(function (v) {return !v.fileInBase64;});
+
+              if (isSingleMode && selectedFiles.length && files.length) {
+                removeFile(files[0].id);
+              }
+
+              if (selectedFiles.length) {
+                setFiles(selectedFiles);
+                tryValidateAndUpload(selectedFiles);
+              }
+
+              readErrorFiles.length && (onReadError == null ? void 0 : onReadError(readErrorFiles));case 12:case "end":return _context2.stop();}}}, _callee2);}));return function (_x2) {return _ref2.apply(this, arguments);};}(),
+
+  [onReadError, tryValidateAndUpload, setFiles, isSingleMode, files, removeFile]);
+
+
+  var handleDrop = (0, _react.useCallback)(
+  function (event) {
+    if (disabled) {
+      return;
+    }var
+
+    dataTransfer = event.dataTransfer;var
+    files = dataTransfer.files;
+
+    if ((files == null ? void 0 : files.length) > 0) {
+      handleChange(files);
+      dataTransfer.clearData();
+    }
+  },
+  [handleChange, disabled]);var _useDrop =
+
+
+  (0, _useDrop3.useDrop)({ onDrop: handleDrop }),isDraggable = _useDrop.isDraggable,labelRef = _useDrop.ref;var _useDrop2 =
+  (0, _useDrop3.useDrop)(),isWindowDraggable = _useDrop2.isDraggable,windowRef = _useDrop2.ref;
+
+  if (_client.isBrowser) {
+    windowRef.current = window.document;
+  }
+
+  var focus = (0, _react.useCallback)(function () {var _inputRef$current;
+    _keyListener.keyListener.isTabPressed = true;
+    (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.focus();
+  }, []);
+
+  var blur = (0, _react.useCallback)(function () {var _inputRef$current2;
+    (_inputRef$current2 = inputRef.current) == null ? void 0 : _inputRef$current2.blur();
+  }, []);
+
+  (0, _react.useImperativeHandle)(ref, function () {return { focus: focus, blur: blur };}, [ref]);var _useState =
+
+  (0, _react.useState)(false),focusedByTab = _useState[0],setFocusedByTab = _useState[1];
+  var handleInputChange = (0, _react.useCallback)(
+  function (event) {
+    handleChange(event.target.files);
+  },
+  [handleChange]);
+
+
+  var handleFocus = (0, _react.useCallback)(
+  function (e) {
+    if (!disabled) {
+      // focus event fires before keyDown eventlistener
+      // so we should check tabPressed in async way
+      requestAnimationFrame(function () {
+        if (_keyListener.keyListener.isTabPressed) {
+          setFocusedByTab(true);
+        }
+      });
+      onFocus == null ? void 0 : onFocus(e);
+    }
+  },
+  [disabled, onFocus]);
+
+
+  var handleBlur = (0, _react.useCallback)(
+  function (e) {
+    setFocusedByTab(false);
+    if (!disabled) {
+      onBlur == null ? void 0 : onBlur(e);
+    }
+  },
+  [disabled, onBlur]);
+
+
+  var uploadButtonClassNames = (0, _Emotion.cx)(_FileUploader2.jsStyles.uploadButton(theme), (_cx = {}, _cx[
+  _FileUploader2.jsStyles.uploadButtonFocus(theme)] = focusedByTab, _cx[
+  _FileUploader2.jsStyles.dragOver()] = isDraggable && !disabled, _cx[
+  _FileUploader2.jsStyles.disabled(theme)] = disabled, _cx[
+  _FileUploader2.jsStyles.warning(theme)] = !!warning, _cx[
+  _FileUploader2.jsStyles.error(theme)] = !!error, _cx));
+
+
+  var uploadButtonWrapperClassNames = (0, _Emotion.cx)((_cx2 = {}, _cx2[
+  _FileUploader2.jsStyles.windowDragOver()] = isWindowDraggable && !disabled, _cx2));
+
+
+  var uploadButtonIconClassNames = (0, _Emotion.cx)(_FileUploader2.jsStyles.icon(theme), (_cx3 = {}, _cx3[
+  _FileUploader2.jsStyles.iconDisabled(theme)] = disabled, _cx3));
+
+
+  var hasOneFile = files.length === 1;
+  var hasOneFileForSingle = isSingleMode && hasOneFile;
+
+  var linkClassNames = (0, _Emotion.cx)(_FileUploader2.jsStyles.link(theme), (_cx4 = {}, _cx4[
+  _FileUploader2.jsStyles.linkDisabled(theme)] = disabled, _cx4));
+
+
+  return /*#__PURE__*/(
+    _react.default.createElement(_CommonWrapper.CommonWrapper, props, /*#__PURE__*/
+    _react.default.createElement("div", { className: _FileUploader2.jsStyles.root(theme), style: (0, _useMemoObject.useMemoObject)({ width: width }) },
+    !isSingleMode && !!files.length && /*#__PURE__*/_react.default.createElement(_FileUploaderFileList.FileUploaderFileList, null), /*#__PURE__*/
+    _react.default.createElement("div", { className: uploadButtonWrapperClassNames }, /*#__PURE__*/
+    _react.default.createElement("label", { ref: labelRef, className: uploadButtonClassNames }, /*#__PURE__*/
+    _react.default.createElement("div", { className: _FileUploader2.jsStyles.content() }, /*#__PURE__*/
+    _react.default.createElement("span", { "data-tid": 'FileUploader__link', className: linkClassNames },
+    hasOneFileForSingle ? locale.choosedFile : locale.chooseFile), "\xA0", /*#__PURE__*/
+
+
+    _react.default.createElement("div", { className: _FileUploader2.jsStyles.afterLinkText() },
+    hasOneFileForSingle ? /*#__PURE__*/
+    _react.default.createElement(_FileUploaderFile.FileUploaderFile, { file: files[0] }) : /*#__PURE__*/
+
+    _react.default.createElement(_react.default.Fragment, null,
+    locale.orDragHere, "\xA0", /*#__PURE__*/
+    _react.default.createElement("div", { className: uploadButtonIconClassNames }, /*#__PURE__*/
+    _react.default.createElement(_px.UploadIcon, null))))), /*#__PURE__*/
+
+
+
+
+
+    _react.default.createElement("input", (0, _extends2.default)({},
+    inputProps, {
+      ref: inputRef,
+      tabIndex: disabled ? -1 : 0,
+      type: "file",
+      disabled: disabled,
+      multiple: multiple,
+      className: _FileUploader2.jsStyles.fileInput(),
+      onClick: stopPropagation,
+      onChange: handleInputChange,
+      onFocus: handleFocus,
+      onBlur: handleBlur
+      // для того, чтобы срабатывало событие change при выборе одного и того же файла подряд
+      , value: '' })))))));
+
+
+
+
+
+
+});
+
+
+
+var FileUploader = (0, _withFileUploaderControlProvider.withFileUploaderControlProvider)(_FileUploader);exports.FileUploader = FileUploader;
+FileUploader.displayName = 'FileUploader';

package/cjs/components/FileUploader/FileUploader.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FileUploader.tsx"],"names":["stopPropagation","e","_FileUploader","React","forwardRef","props","ref","theme","ThemeContext","disabled","error","warning","onBlur","onFocus","onReadError","multiple","width","fileUploaderWidth","request","getFileValidationText","onRequestSuccess","onRequestError","inputProps","FileUploaderControlContext","files","setFiles","removeFile","setFileValidationResult","locale","inputRef","isAsync","isSingleMode","upload","tryValidateAndUpload","forEach","file","validationMessage","id","FileUploaderFileValidationResult","handleChange","newFiles","filesArray","Array","from","uploadFiles","selectedFiles","filter","v","fileInBase64","readErrorFiles","length","handleDrop","event","dataTransfer","clearData","onDrop","isDraggable","labelRef","isWindowDraggable","windowRef","isBrowser","current","window","document","focus","keyListener","isTabPressed","blur","focusedByTab","setFocusedByTab","handleInputChange","target","handleFocus","requestAnimationFrame","handleBlur","uploadButtonClassNames","jsStyles","uploadButton","uploadButtonFocus","dragOver","uploadButtonWrapperClassNames","windowDragOver","uploadButtonIconClassNames","icon","iconDisabled","hasOneFile","hasOneFileForSingle","linkClassNames","link","linkDisabled","root","content","choosedFile","chooseFile","afterLinkText","orDragHere","fileInput","FileUploader","displayName"],"mappings":"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","sourcesContent":["import React, { useCallback, useContext, useImperativeHandle, useRef, useState } from 'react';\n\nimport { FileUploaderAttachedFile, readFiles } from '../../internal/FileUploaderControl/fileUtils';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useMemoObject } from '../../hooks/useMemoObject';\nimport { FileUploaderControlContext } from '../../internal/FileUploaderControl/FileUploaderControlContext';\nimport { FileUploaderFileValidationResult } from '../../internal/FileUploaderControl/FileUploaderFileValidationResult';\nimport { useControlLocale } from '../../internal/FileUploaderControl/hooks/useControlLocale';\nimport { useUpload } from '../../internal/FileUploaderControl/hooks/useUpload';\nimport { useDrop } from '../../hooks/useDrop';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { UploadIcon } from '../../internal/icons/16px';\nimport { FileUploaderControlProviderProps } from '../../internal/FileUploaderControl/FileUploaderControlProvider';\nimport { withFileUploaderControlProvider } from '../../internal/FileUploaderControl/withFileUploaderControlProvider';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { FileUploaderFile } from '../../internal/FileUploaderControl/FileUploaderFile/FileUploaderFile';\nimport { FileUploaderFileList } from '../../internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList';\nimport { isBrowser } from '../../lib/client';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { jsStyles } from './FileUploader.styles';\n\nconst stopPropagation: React.ReactEventHandler = (e) => e.stopPropagation();\n\ninterface _FileUploaderProps extends CommonProps, Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange'> {\n  /** Состояние ошибки всего контрола */\n  error?: boolean;\n  /** Состояние предупреждения всего контрола */\n  warning?: boolean;\n\n  /** Свойство ширины. */\n  width?: React.CSSProperties['width'];\n\n  /** Срабатывает при невалидном чтении файла (превращение в base64) */\n  onReadError?: (files: FileUploaderAttachedFile[]) => void;\n\n  /** Функция, через которую отправляем файлы. Используется для отслеживания статуса загрузки файла. */\n  request?: (file: FileUploaderAttachedFile) => Promise<void>;\n  /** Срабатывает при удачной попытке отправки через request */\n  onRequestSuccess?: (fileId: string) => void;\n  /** Срабатывает при неудачной попытке отправки через request */\n  onRequestError?: (fileId: string) => void;\n\n  /** Функция валидации каждого файла. Срабатывает после выбора файлов и перед попыткой отправить в request. */\n  getFileValidationText?: (file: FileUploaderAttachedFile) => Promise<Nullable<string>>;\n}\n\nexport interface FileUploaderRef {\n  focus: () => void;\n  blur: () => void;\n}\n\nconst _FileUploader = React.forwardRef<FileUploaderRef, _FileUploaderProps>((props: _FileUploaderProps, ref) => {\n  const theme = useContext(ThemeContext);\n\n  const {\n    disabled,\n    error,\n    warning,\n    onBlur,\n    onFocus,\n    onReadError,\n    multiple = false,\n    width = theme.fileUploaderWidth,\n    request,\n    getFileValidationText,\n    onRequestSuccess,\n    onRequestError,\n    ...inputProps\n  } = props;\n\n  const { files, setFiles, removeFile, setFileValidationResult } = useContext(FileUploaderControlContext);\n\n  const locale = useControlLocale();\n\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const isAsync = !!request;\n  const isSingleMode = !multiple;\n\n  const upload = useUpload(request, onRequestSuccess, onRequestError);\n\n  const tryValidateAndUpload = useCallback(\n    (files: FileUploaderAttachedFile[]) => {\n      files.forEach(async (file) => {\n        const validationMessage = getFileValidationText && (await getFileValidationText(file));\n\n        if (!validationMessage) {\n          isAsync && upload(file);\n        } else {\n          setFileValidationResult(file.id, FileUploaderFileValidationResult.error(validationMessage));\n        }\n      });\n    },\n    [upload, error, getFileValidationText, isAsync],\n  );\n\n  /** common part **/\n  const handleChange = useCallback(\n    async (newFiles: FileList | null) => {\n      if (!newFiles) return;\n\n      let filesArray = Array.from(newFiles);\n\n      if (isSingleMode) {\n        filesArray = [filesArray[0]];\n      }\n\n      const uploadFiles = await readFiles(filesArray);\n\n      const selectedFiles = uploadFiles.filter((v) => !!v.fileInBase64);\n      const readErrorFiles = uploadFiles.filter((v) => !v.fileInBase64);\n\n      if (isSingleMode && selectedFiles.length && files.length) {\n        removeFile(files[0].id);\n      }\n\n      if (selectedFiles.length) {\n        setFiles(selectedFiles);\n        tryValidateAndUpload(selectedFiles);\n      }\n\n      readErrorFiles.length && onReadError?.(readErrorFiles);\n    },\n    [onReadError, tryValidateAndUpload, setFiles, isSingleMode, files, removeFile],\n  );\n\n  const handleDrop = useCallback(\n    (event) => {\n      if (disabled) {\n        return;\n      }\n\n      const { dataTransfer } = event;\n      const { files } = dataTransfer;\n\n      if (files?.length > 0) {\n        handleChange(files);\n        dataTransfer.clearData();\n      }\n    },\n    [handleChange, disabled],\n  );\n\n  const { isDraggable, ref: labelRef } = useDrop<HTMLLabelElement>({ onDrop: handleDrop });\n  const { isDraggable: isWindowDraggable, ref: windowRef } = useDrop<Document>();\n\n  if (isBrowser) {\n    windowRef.current = window.document;\n  }\n\n  const focus = useCallback(() => {\n    keyListener.isTabPressed = true;\n    inputRef.current?.focus();\n  }, []);\n\n  const blur = useCallback(() => {\n    inputRef.current?.blur();\n  }, []);\n\n  useImperativeHandle(ref, () => ({ focus, blur }), [ref]);\n\n  const [focusedByTab, setFocusedByTab] = useState(false);\n  const handleInputChange = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      handleChange(event.target.files);\n    },\n    [handleChange],\n  );\n\n  const handleFocus = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      if (!disabled) {\n        // focus event fires before keyDown eventlistener\n        // so we should check tabPressed in async way\n        requestAnimationFrame(() => {\n          if (keyListener.isTabPressed) {\n            setFocusedByTab(true);\n          }\n        });\n        onFocus?.(e);\n      }\n    },\n    [disabled, onFocus],\n  );\n\n  const handleBlur = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      setFocusedByTab(false);\n      if (!disabled) {\n        onBlur?.(e);\n      }\n    },\n    [disabled, onBlur],\n  );\n\n  const uploadButtonClassNames = cx(jsStyles.uploadButton(theme), {\n    [jsStyles.uploadButtonFocus(theme)]: focusedByTab,\n    [jsStyles.dragOver()]: isDraggable && !disabled,\n    [jsStyles.disabled(theme)]: disabled,\n    [jsStyles.warning(theme)]: !!warning,\n    [jsStyles.error(theme)]: !!error,\n  });\n\n  const uploadButtonWrapperClassNames = cx({\n    [jsStyles.windowDragOver()]: isWindowDraggable && !disabled,\n  });\n\n  const uploadButtonIconClassNames = cx(jsStyles.icon(theme), {\n    [jsStyles.iconDisabled(theme)]: disabled,\n  });\n\n  const hasOneFile = files.length === 1;\n  const hasOneFileForSingle = isSingleMode && hasOneFile;\n\n  const linkClassNames = cx(jsStyles.link(theme), {\n    [jsStyles.linkDisabled(theme)]: disabled,\n  });\n\n  return (\n    <CommonWrapper {...props}>\n      <div className={jsStyles.root(theme)} style={useMemoObject({ width })}>\n        {!isSingleMode && !!files.length && <FileUploaderFileList />}\n        <div className={uploadButtonWrapperClassNames}>\n          <label ref={labelRef} className={uploadButtonClassNames}>\n            <div className={jsStyles.content()}>\n              <span data-tid={'FileUploader__link'} className={linkClassNames}>\n                {hasOneFileForSingle ? locale.choosedFile : locale.chooseFile}\n              </span>\n              &nbsp;\n              <div className={jsStyles.afterLinkText()}>\n                {hasOneFileForSingle ? (\n                  <FileUploaderFile file={files[0]} />\n                ) : (\n                  <>\n                    {locale.orDragHere}&nbsp;\n                    <div className={uploadButtonIconClassNames}>\n                      <UploadIcon />\n                    </div>\n                  </>\n                )}\n              </div>\n            </div>\n            <input\n              {...inputProps}\n              ref={inputRef}\n              tabIndex={disabled ? -1 : 0}\n              type=\"file\"\n              disabled={disabled}\n              multiple={multiple}\n              className={jsStyles.fileInput()}\n              onClick={stopPropagation}\n              onChange={handleInputChange}\n              onFocus={handleFocus}\n              onBlur={handleBlur}\n              // для того, чтобы срабатывало событие change при выборе одного и того же файла подряд\n              value={''}\n            />\n          </label>\n        </div>\n      </div>\n    </CommonWrapper>\n  );\n});\n\nexport interface FileUploaderProps extends _FileUploaderProps, FileUploaderControlProviderProps {}\n\nexport const FileUploader = withFileUploaderControlProvider<FileUploaderProps, FileUploaderRef>(_FileUploader);\nFileUploader.displayName = 'FileUploader';\n"]}

package/cjs/components/FileUploader/FileUploader.md

@@ -0,0 +1,67 @@
+Контрол загрузки файлов.
+Можно использовать для синхронной отправки данных, например, в форме.
+Или же можно использовать в асинхронном режиме.
+
+Синхронный контрол
+```jsx harmony
+import { FileUploader } from '@skbkontur/react-ui';
+
+<FileUploader  />
+```
+
+Асинхронный контрол
+```jsx harmony
+import { FileUploader } from '@skbkontur/react-ui';
+
+const request = () => Promise.resolve();
+
+<FileUploader request={request} />
+```
+
+Multiple контрол
+```jsx harmony
+import { FileUploader } from '@skbkontur/react-ui';
+
+const request = () => Promise.reject();
+
+<FileUploader request={request} multiple />
+```
+
+Валидация файла в списке
+```jsx harmony
+import { FileUploader } from '@skbkontur/react-ui';
+
+<FileUploader multiple getFileValidationText={({originalFile}) => `У файла ${originalFile.name} неверный формат`} />
+```
+
+Валидация контрола
+```jsx harmony
+import { FileUploader } from '@skbkontur/react-ui';
+
+<FileUploader multiple error />
+```
+
+#### Локали по умолчанию
+
+```typescript static
+interface FileUploaderLocale {
+  chooseFile: string;
+  choosedFile: string;
+  orDragHere: string;
+  requestErrorText: string;
+}
+
+const ru_RU = {
+  chooseFile: 'Выберите файл',
+  choosedFile: 'Выбран файл',
+  orDragHere: 'или перетащите сюда',
+  requestErrorText: 'Файл не удалось загрузить на сервер, повторите попытку позже',
+};
+
+const en_GB = {
+  chooseFile: 'Select a file',
+  choosedFile: 'File selected',
+  orDragHere: 'or drag here',
+  requestErrorText: 'The file could not be uploaded to the server, please try again later',
+};
+```

package/cjs/components/FileUploader/FileUploader.styles.d.ts

@@ -0,0 +1,19 @@
+import { Theme } from '../../lib/theming/Theme';
+export declare const jsStyles: {
+    pulse(): string;
+    root(t: Theme): string;
+    uploadButton(t: Theme): string;
+    uploadButtonFocus(t: Theme): string;
+    dragOver(): string;
+    windowDragOver(): string;
+    content(): string;
+    fileInput(): string;
+    afterLinkText(): string;
+    warning(t: Theme): string;
+    error(t: Theme): string;
+    disabled(t: Theme): string;
+    icon(t: Theme): string;
+    iconDisabled(t: Theme): string;
+    link(t: Theme): string;
+    linkDisabled(t: Theme): string;
+};

package/cjs/components/FileUploader/FileUploader.styles.js

@@ -0,0 +1,159 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.jsStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
+
+
+var styles = {
+  pulse: function pulse() {
+    return (0, _Emotion.keyframes)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n        0% {\n          box-shadow:\n            0px 0px 0px 0px #2DA4F9,\n            0px 0px 0px 1px rgba(45,164,249,0.7);\n        }\n        95% {\n          box-shadow:\n            0px 0px 0px 0px #2DA4F9,\n            0px 0px 0px 10px rgba(45,164,249,0);\n        }\n        100% {\n          box-shadow:\n            0px 0px 0px 0px #2DA4F9,\n            0px 0px 0px 1px rgba(45,164,249,0);\n        }\n      "])));
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  },
+
+  root: function root(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      min-width: 285px;\n      position: relative;\n      background-color: ", ";\n      line-height: ", ";\n      font-size: ", ";\n      color: ", ";\n    "])),
+
+
+
+    t.fileUploaderBg,
+    t.fileUploaderLineHeight,
+    t.fileUploaderFontSize,
+    t.fileUploaderTextColorDefault);
+
+  },
+
+  uploadButton: function uploadButton(t) {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: 100%;\n      display: inline-flex;\n      align-items: center;\n      justify-content: space-between;\n      border: ", " ", " ", ";\n      box-sizing: border-box;\n      border-radius: ", ";\n      outline: none;\n      cursor: pointer;\n      padding: ", " ", ";\n      transition: box-shadow 0.3s ease;\n    "])),
+
+
+
+
+    t.fileUploaderBorderWidth, t.fileUploaderBorderStyle, t.fileUploaderBorderColor,
+
+    t.fileUploaderBorderRadius,
+
+
+    t.fileUploaderPaddingY, t.fileUploaderPaddingX);
+
+
+  },
+
+  uploadButtonFocus: function uploadButtonFocus(t) {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0px 0px 0px 1px ", ";\n    "])),
+    t.fileUploaderBorderWidth, t.fileUploaderBorderColorFocus,
+    t.fileUploaderBorderColorFocus);
+
+  },
+
+  dragOver: function dragOver() {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: 1px solid #2da4f9;\n      border-radius: 2px;\n      box-shadow: 0px 0px 0px 3px #2da4f9, 0px 0px 0px 8px rgba(45, 164, 249, 0.35);\n    "])));
+
+
+
+
+  },
+
+  windowDragOver: function windowDragOver() {
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border-radius: 2px;\n      animation: ", " 1.5s infinite;\n    "])),
+
+    styles.pulse());
+
+  },
+
+  content: function content() {
+    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: flex;\n      width: 100%;\n      align-items: center;\n      height: 100%;\n    "])));
+
+
+
+
+
+  },
+
+  fileInput: function fileInput() {
+    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: 0;\n      height: 0;\n    "])));
+
+
+
+  },
+
+  afterLinkText: function afterLinkText() {
+    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: flex;\n      justify-content: space-between;\n      flex: 1 1 auto;\n    "])));
+
+
+
+
+  },
+
+  warning: function warning(t) {
+    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0px 0px 0px 1px ", ";\n    "])),
+    t.fileUploaderBorderWidth, t.fileUploaderBorderColorWarning,
+    t.fileUploaderBorderColorWarning);
+
+  },
+
+  error: function error(t) {
+    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0px 0px 0px 1px ", ";\n    "])),
+    t.fileUploaderBorderWidth, t.fileUploaderBorderColorError,
+    t.fileUploaderBorderColorError);
+
+  },
+
+  disabled: function disabled(t) {
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      cursor: default;\n      background: ", ";\n      border: ", " solid ", ";\n      color: ", ";\n      box-shadow: none;\n    "])),
+
+    t.fileUploaderDisabledBg,
+    t.fileUploaderBorderWidth, t.fileUploaderDisabledBorderColor,
+    t.fileUploaderDisabledTextColor);
+
+
+  },
+
+  icon: function icon(t) {
+    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      font-size: ", ";\n      color: ", ";\n    "])),
+
+    t.fileUploaderIconSize,
+    t.fileUploaderIconColor);
+
+  },
+
+  iconDisabled: function iconDisabled(t) {
+    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n    "])),
+    t.fileUploaderDisabledIconColor);
+
+  },
+
+  link: function link(t) {
+    return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      outline: none;\n      text-decoration: none;\n\n      &:hover {\n        text-decoration: ", ";\n      }\n      color: ", ";\n    "])),
+
+
+
+
+    t.linkHoverTextDecoration,
+
+    t.fileUploaderLinkColor);
+
+  },
+
+  linkDisabled: function linkDisabled(t) {
+    return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      &:hover {\n        text-decoration: none;\n      }\n    "])),
+    t.fileUploaderDisabledLinkColor);
+
+
+
+
+  } };
+
+
+var jsStyles = (0, _Emotion.memoizeStyle)(styles);exports.jsStyles = jsStyles;

package/cjs/components/FileUploader/FileUploader.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FileUploader.styles.ts"],"names":["styles","pulse","keyframes","root","t","css","fileUploaderBg","fileUploaderLineHeight","fileUploaderFontSize","fileUploaderTextColorDefault","uploadButton","fileUploaderBorderWidth","fileUploaderBorderStyle","fileUploaderBorderColor","fileUploaderBorderRadius","fileUploaderPaddingY","fileUploaderPaddingX","uploadButtonFocus","fileUploaderBorderColorFocus","dragOver","windowDragOver","content","fileInput","afterLinkText","warning","fileUploaderBorderColorWarning","error","fileUploaderBorderColorError","disabled","fileUploaderDisabledBg","fileUploaderDisabledBorderColor","fileUploaderDisabledTextColor","icon","fileUploaderIconSize","fileUploaderIconColor","iconDisabled","fileUploaderDisabledIconColor","link","linkHoverTextDecoration","fileUploaderLinkColor","linkDisabled","fileUploaderDisabledLinkColor","jsStyles"],"mappings":"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","sourcesContent":["import { css, keyframes, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nconst styles = {\n  pulse() {\n    return keyframes`\n        0% {\n          box-shadow:\n            0px 0px 0px 0px #2DA4F9,\n            0px 0px 0px 1px rgba(45,164,249,0.7);\n        }\n        95% {\n          box-shadow:\n            0px 0px 0px 0px #2DA4F9,\n            0px 0px 0px 10px rgba(45,164,249,0);\n        }\n        100% {\n          box-shadow:\n            0px 0px 0px 0px #2DA4F9,\n            0px 0px 0px 1px rgba(45,164,249,0);\n        }\n      `;\n  },\n\n  root(t: Theme) {\n    return css`\n      display: inline-block;\n      min-width: 285px;\n      position: relative;\n      background-color: ${t.fileUploaderBg};\n      line-height: ${t.fileUploaderLineHeight};\n      font-size: ${t.fileUploaderFontSize};\n      color: ${t.fileUploaderTextColorDefault};\n    `;\n  },\n\n  uploadButton(t: Theme) {\n    return css`\n      width: 100%;\n      display: inline-flex;\n      align-items: center;\n      justify-content: space-between;\n      border: ${t.fileUploaderBorderWidth} ${t.fileUploaderBorderStyle} ${t.fileUploaderBorderColor};\n      box-sizing: border-box;\n      border-radius: ${t.fileUploaderBorderRadius};\n      outline: none;\n      cursor: pointer;\n      padding: ${t.fileUploaderPaddingY} ${t.fileUploaderPaddingX};\n      transition: box-shadow 0.3s ease;\n    `;\n  },\n\n  uploadButtonFocus(t: Theme) {\n    return css`\n      border: ${t.fileUploaderBorderWidth} solid ${t.fileUploaderBorderColorFocus};\n      box-shadow: 0px 0px 0px 1px ${t.fileUploaderBorderColorFocus};\n    `;\n  },\n\n  dragOver() {\n    return css`\n      border: 1px solid #2da4f9;\n      border-radius: 2px;\n      box-shadow: 0px 0px 0px 3px #2da4f9, 0px 0px 0px 8px rgba(45, 164, 249, 0.35);\n    `;\n  },\n\n  windowDragOver() {\n    return css`\n      border-radius: 2px;\n      animation: ${styles.pulse()} 1.5s infinite;\n    `;\n  },\n\n  content() {\n    return css`\n      display: flex;\n      width: 100%;\n      align-items: center;\n      height: 100%;\n    `;\n  },\n\n  fileInput() {\n    return css`\n      width: 0;\n      height: 0;\n    `;\n  },\n\n  afterLinkText() {\n    return css`\n      display: flex;\n      justify-content: space-between;\n      flex: 1 1 auto;\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      border: ${t.fileUploaderBorderWidth} solid ${t.fileUploaderBorderColorWarning};\n      box-shadow: 0px 0px 0px 1px ${t.fileUploaderBorderColorWarning};\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      border: ${t.fileUploaderBorderWidth} solid ${t.fileUploaderBorderColorError};\n      box-shadow: 0px 0px 0px 1px ${t.fileUploaderBorderColorError};\n    `;\n  },\n\n  disabled(t: Theme) {\n    return css`\n      cursor: default;\n      background: ${t.fileUploaderDisabledBg};\n      border: ${t.fileUploaderBorderWidth} solid ${t.fileUploaderDisabledBorderColor};\n      color: ${t.fileUploaderDisabledTextColor};\n      box-shadow: none;\n    `;\n  },\n\n  icon(t: Theme) {\n    return css`\n      display: inline-block;\n      font-size: ${t.fileUploaderIconSize};\n      color: ${t.fileUploaderIconColor};\n    `;\n  },\n\n  iconDisabled(t: Theme) {\n    return css`\n      color: ${t.fileUploaderDisabledIconColor};\n    `;\n  },\n\n  link(t: Theme) {\n    return css`\n      outline: none;\n      text-decoration: none;\n\n      &:hover {\n        text-decoration: ${t.linkHoverTextDecoration};\n      }\n      color: ${t.fileUploaderLinkColor};\n    `;\n  },\n\n  linkDisabled(t: Theme) {\n    return css`\n      color: ${t.fileUploaderDisabledLinkColor};\n      &:hover {\n        text-decoration: none;\n      }\n    `;\n  },\n};\n\nexport const jsStyles = memoizeStyle(styles);\n"]}

package/cjs/components/FileUploader/index.d.ts

@@ -0,0 +1,4 @@
+export { FileUploaderFileStatus } from '../../internal/FileUploaderControl/fileUtils';
+export type { FileUploaderAttachedFile, FileUploaderFileInBase64 } from '../../internal/FileUploaderControl/fileUtils';
+export { FileUploaderFileValidationResult } from '../../internal/FileUploaderControl/FileUploaderFileValidationResult';
+export * from './FileUploader';

package/cjs/components/FileUploader/index.js

@@ -0,0 +1,4 @@
+"use strict";exports.__esModule = true;var _exportNames = { FileUploaderFileStatus: true, FileUploaderFileValidationResult: true };exports.FileUploaderFileValidationResult = exports.FileUploaderFileStatus = void 0;var _fileUtils = require("../../internal/FileUploaderControl/fileUtils");exports.FileUploaderFileStatus = _fileUtils.FileUploaderFileStatus;
+
+var _FileUploaderFileValidationResult = require("../../internal/FileUploaderControl/FileUploaderFileValidationResult");exports.FileUploaderFileValidationResult = _FileUploaderFileValidationResult.FileUploaderFileValidationResult;
+var _FileUploader = require("./FileUploader");Object.keys(_FileUploader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _FileUploader[key]) return;exports[key] = _FileUploader[key];});

package/cjs/components/FileUploader/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":[],"mappings":"sNAAA,yE;;AAEA,uH;AACA","sourcesContent":["export { FileUploaderFileStatus } from '../../internal/FileUploaderControl/fileUtils';\nexport type { FileUploaderAttachedFile, FileUploaderFileInBase64 } from '../../internal/FileUploaderControl/fileUtils';\nexport { FileUploaderFileValidationResult } from '../../internal/FileUploaderControl/FileUploaderFileValidationResult';\nexport * from './FileUploader';\n"]}

package/cjs/components/FileUploader/locale/index.d.ts

@@ -0,0 +1,4 @@
+import { LocaleHelper } from '../../../lib/locale/LocaleHelper';
+import { FileUploaderLocale } from './types';
+export * from './types';
+export declare const FileUploaderLocaleHelper: LocaleHelper<FileUploaderLocale>;

package/cjs/components/FileUploader/locale/index.js

@@ -0,0 +1,11 @@
+"use strict";exports.__esModule = true;var _exportNames = { FileUploaderLocaleHelper: true };exports.FileUploaderLocaleHelper = void 0;var _LocaleHelper = require("../../../lib/locale/LocaleHelper");
+
+var _en = require("./locales/en");
+var _ru = require("./locales/ru");
+
+
+var _types = require("./types");Object.keys(_types).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _types[key]) return;exports[key] = _types[key];});
+
+var FileUploaderLocaleHelper = new _LocaleHelper.LocaleHelper({
+  ru_RU: _ru.componentsLocales,
+  en_GB: _en.componentsLocales });exports.FileUploaderLocaleHelper = FileUploaderLocaleHelper;

package/cjs/components/FileUploader/locale/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":["FileUploaderLocaleHelper","LocaleHelper","ru_RU","en_GB"],"mappings":"uIAAA;;AAEA;AACA;;;AAGA;;AAEO,IAAMA,wBAAwB,GAAG,IAAIC,0BAAJ,CAAqC;AAC3EC,EAAAA,KAAK,EAALA,qBAD2E;AAE3EC,EAAAA,KAAK,EAALA,qBAF2E,EAArC,CAAjC,C","sourcesContent":["import { LocaleHelper } from '../../../lib/locale/LocaleHelper';\n\nimport { componentsLocales as en_GB } from './locales/en';\nimport { componentsLocales as ru_RU } from './locales/ru';\nimport { FileUploaderLocale } from './types';\n\nexport * from './types';\n\nexport const FileUploaderLocaleHelper = new LocaleHelper<FileUploaderLocale>({\n  ru_RU,\n  en_GB,\n});\n"]}

package/cjs/components/FileUploader/locale/locales/en.d.ts

@@ -0,0 +1,2 @@
+import { FileUploaderLocale } from '../types';
+export declare const componentsLocales: FileUploaderLocale;