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

package/components/FileUploader/FileUploader/FileUploader.js

@@ -0,0 +1,277 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useCallback, useContext, useImperativeHandle, useRef, useState } from 'react';
+import { readFiles } from "../../../internal/FileUploaderControl/fileUtils";
+import { cx } from "../../../lib/theming/Emotion";
+import { useMemoObject } from "../../../hooks/useMemoObject";
+import { FileUploaderControlContext } from "../../../internal/FileUploaderControl/FileUploaderControlContext";
+import { FileUploaderFileValidationResult } from "../../../internal/FileUploaderControl/FileUploaderFileValidationResult";
+import { useControlLocale } from "../../../internal/FileUploaderControl/hooks/useControlLocale";
+import { useUpload } from "../../../internal/FileUploaderControl/hooks/useUpload";
+import { useDrop } from "../../../hooks/useDrop";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { UploadIcon } from "../../../internal/icons/16px";
+import { withFileUploaderControlProvider } from "../../../internal/FileUploaderControl/withFileUploaderControlProvider";
+import { keyListener } from "../../../lib/events/keyListener";
+import { FileUploaderFile } from "../../../internal/FileUploaderControl/FileUploaderFile/FileUploaderFile";
+import { FileUploaderFileList } from "../../../internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList";
+import { isBrowser } from "../../../lib/client";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { jsStyles } from "../FileUploader.styles";
+
+var stopPropagation = function stopPropagation(e) {
+  return e.stopPropagation();
+};
+
+var _FileUploader = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var _cx, _cx2, _cx3, _cx4;
+
+  var theme = useContext(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 = _objectWithoutPropertiesLoose(props, ["disabled", "error", "warning", "onBlur", "onFocus", "onReadError", "multiple", "width", "request", "getFileValidationText", "onRequestSuccess", "onRequestError"]);
+
+  var _useContext = useContext(FileUploaderControlContext),
+      files = _useContext.files,
+      setFiles = _useContext.setFiles,
+      removeFile = _useContext.removeFile,
+      setFileValidationResult = _useContext.setFileValidationResult;
+
+  var locale = useControlLocale();
+  var inputRef = useRef(null);
+  var isAsync = !!request;
+  var isSingleMode = !multiple;
+  var upload = useUpload(request, onRequestSuccess, onRequestError);
+  var tryValidateAndUpload = useCallback(function (files) {
+    files.forEach( /*#__PURE__*/function () {
+      var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(file) {
+        var validationMessage;
+        return _regeneratorRuntime.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.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 = useCallback( /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(newFiles) {
+      var filesArray, uploadFiles, selectedFiles, readErrorFiles;
+      return _regeneratorRuntime.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 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 = 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 = useDrop({
+    onDrop: handleDrop
+  }),
+      isDraggable = _useDrop.isDraggable,
+      labelRef = _useDrop.ref;
+
+  var _useDrop2 = useDrop(),
+      isWindowDraggable = _useDrop2.isDraggable,
+      windowRef = _useDrop2.ref;
+
+  if (isBrowser) {
+    windowRef.current = window.document;
+  }
+
+  var focus = useCallback(function () {
+    var _inputRef$current;
+
+    keyListener.isTabPressed = true;
+    (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.focus();
+  }, []);
+  var blur = useCallback(function () {
+    var _inputRef$current2;
+
+    (_inputRef$current2 = inputRef.current) == null ? void 0 : _inputRef$current2.blur();
+  }, []);
+  useImperativeHandle(ref, function () {
+    return {
+      focus: focus,
+      blur: blur
+    };
+  }, [ref]);
+
+  var _useState = useState(false),
+      focusedByTab = _useState[0],
+      setFocusedByTab = _useState[1];
+
+  var handleInputChange = useCallback(function (event) {
+    handleChange(event.target.files);
+  }, [handleChange]);
+  var handleFocus = useCallback(function (e) {
+    if (!disabled) {
+      // focus event fires before keyDown eventlistener
+      // so we should check tabPressed in async way
+      requestAnimationFrame(function () {
+        if (keyListener.isTabPressed) {
+          setFocusedByTab(true);
+        }
+      });
+      onFocus == null ? void 0 : onFocus(e);
+    }
+  }, [disabled, onFocus]);
+  var handleBlur = useCallback(function (e) {
+    setFocusedByTab(false);
+
+    if (!disabled) {
+      onBlur == null ? void 0 : onBlur(e);
+    }
+  }, [disabled, onBlur]);
+  var uploadButtonClassNames = cx(jsStyles.uploadButton(theme), (_cx = {}, _cx[jsStyles.uploadButtonFocus(theme)] = focusedByTab, _cx[jsStyles.dragOver()] = isDraggable && !disabled, _cx[jsStyles.disabled(theme)] = disabled, _cx[jsStyles.warning(theme)] = !!warning, _cx[jsStyles.error(theme)] = !!error, _cx));
+  var uploadButtonWrapperClassNames = cx((_cx2 = {}, _cx2[jsStyles.windowDragOver()] = isWindowDraggable && !disabled, _cx2));
+  var uploadButtonIconClassNames = cx(jsStyles.icon(theme), (_cx3 = {}, _cx3[jsStyles.iconDisabled(theme)] = disabled, _cx3));
+  var hasOneFile = files.length === 1;
+  var hasOneFileForSingle = isSingleMode && hasOneFile;
+  var linkClassNames = cx(jsStyles.link(theme), (_cx4 = {}, _cx4[jsStyles.linkDisabled(theme)] = disabled, _cx4));
+  return /*#__PURE__*/React.createElement(CommonWrapper, props, /*#__PURE__*/React.createElement("div", {
+    className: jsStyles.root(theme),
+    style: useMemoObject({
+      width: width
+    })
+  }, !isSingleMode && !!files.length && /*#__PURE__*/React.createElement(FileUploaderFileList, null), /*#__PURE__*/React.createElement("div", {
+    className: uploadButtonWrapperClassNames
+  }, /*#__PURE__*/React.createElement("label", {
+    ref: labelRef,
+    className: uploadButtonClassNames
+  }, /*#__PURE__*/React.createElement("div", {
+    className: jsStyles.content()
+  }, /*#__PURE__*/React.createElement("span", {
+    "data-tid": 'FileUploader__link',
+    className: linkClassNames
+  }, hasOneFileForSingle ? locale.choosedFile : locale.chooseFile), "\xA0", /*#__PURE__*/React.createElement("div", {
+    className: jsStyles.afterLinkText()
+  }, hasOneFileForSingle ? /*#__PURE__*/React.createElement(FileUploaderFile, {
+    file: files[0]
+  }) : /*#__PURE__*/React.createElement(React.Fragment, null, locale.orDragHere, "\xA0", /*#__PURE__*/React.createElement("div", {
+    className: uploadButtonIconClassNames
+  }, /*#__PURE__*/React.createElement(UploadIcon, null))))), /*#__PURE__*/React.createElement("input", _extends({}, inputProps, {
+    ref: inputRef,
+    tabIndex: disabled ? -1 : 0,
+    type: "file",
+    disabled: disabled,
+    multiple: multiple,
+    className: jsStyles.fileInput(),
+    onClick: stopPropagation,
+    onChange: handleInputChange,
+    onFocus: handleFocus,
+    onBlur: handleBlur // для того, чтобы срабатывало событие change при выборе одного и того же файла подряд
+    ,
+    value: ''
+  }))))));
+});
+
+export var FileUploader = withFileUploaderControlProvider(_FileUploader);
+FileUploader.displayName = 'FileUploader';

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

@@ -0,0 +1 @@
+{"version":3,"sources":["FileUploader.tsx"],"names":["React","useCallback","useContext","useImperativeHandle","useRef","useState","readFiles","cx","useMemoObject","FileUploaderControlContext","FileUploaderFileValidationResult","useControlLocale","useUpload","useDrop","ThemeContext","UploadIcon","withFileUploaderControlProvider","keyListener","FileUploaderFile","FileUploaderFileList","isBrowser","CommonWrapper","jsStyles","stopPropagation","e","_FileUploader","forwardRef","props","ref","theme","disabled","error","warning","onBlur","onFocus","onReadError","multiple","width","fileUploaderWidth","request","getFileValidationText","onRequestSuccess","onRequestError","inputProps","files","setFiles","removeFile","setFileValidationResult","locale","inputRef","isAsync","isSingleMode","upload","tryValidateAndUpload","forEach","file","validationMessage","id","handleChange","newFiles","filesArray","Array","from","uploadFiles","selectedFiles","filter","v","fileInBase64","readErrorFiles","length","handleDrop","event","dataTransfer","clearData","onDrop","isDraggable","labelRef","isWindowDraggable","windowRef","current","window","document","focus","isTabPressed","blur","focusedByTab","setFocusedByTab","handleInputChange","target","handleFocus","requestAnimationFrame","handleBlur","uploadButtonClassNames","uploadButton","uploadButtonFocus","dragOver","uploadButtonWrapperClassNames","windowDragOver","uploadButtonIconClassNames","icon","iconDisabled","hasOneFile","hasOneFileForSingle","linkClassNames","link","linkDisabled","root","content","choosedFile","chooseFile","afterLinkText","orDragHere","fileInput","FileUploader","displayName"],"mappings":"uSAAA,OAAOA,KAAP,IAAgBC,WAAhB,EAA6BC,UAA7B,EAAyCC,mBAAzC,EAA8DC,MAA9D,EAAsEC,QAAtE,QAAsF,OAAtF;;AAEA,SAAmCC,SAAnC,QAAoD,8CAApD;AACA,SAASC,EAAT,QAAmB,2BAAnB;AACA,SAASC,aAAT,QAA8B,2BAA9B;AACA,SAASC,0BAAT,QAA2C,+DAA3C;AACA,SAASC,gCAAT,QAAiD,qEAAjD;AACA,SAASC,gBAAT,QAAiC,2DAAjC;AACA,SAASC,SAAT,QAA0B,oDAA1B;AACA,SAASC,OAAT,QAAwB,qBAAxB;;AAEA,SAASC,YAAT,QAA6B,gCAA7B;AACA,SAASC,UAAT,QAA2B,2BAA3B;;AAEA,SAASC,+BAAT,QAAgD,oEAAhD;AACA,SAASC,WAAT,QAA4B,8BAA5B;AACA,SAASC,gBAAT,QAAiC,sEAAjC;AACA,SAASC,oBAAT,QAAqC,8EAArC;AACA,SAASC,SAAT,QAA0B,kBAA1B;AACA,SAAsBC,aAAtB,QAA2C,8BAA3C;;AAEA,SAASC,QAAT,QAAyB,uBAAzB;;AAEA,IAAMC,eAAwC,GAAG,SAA3CA,eAA2C,CAACC,CAAD,UAAOA,CAAC,CAACD,eAAF,EAAP,EAAjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,IAAME,aAAa,gBAAGzB,KAAK,CAAC0B,UAAN,CAAsD,UAACC,KAAD,EAA4BC,GAA5B,EAAoC;AAC9G,MAAMC,KAAK,GAAG3B,UAAU,CAACY,YAAD,CAAxB,CAD8G;;;AAI5GgB,EAAAA,QAJ4G;;;;;;;;;;;;;AAiB1GH,EAAAA,KAjB0G,CAI5GG,QAJ4G,CAK5GC,KAL4G,GAiB1GJ,KAjB0G,CAK5GI,KAL4G,CAM5GC,OAN4G,GAiB1GL,KAjB0G,CAM5GK,OAN4G,CAO5GC,MAP4G,GAiB1GN,KAjB0G,CAO5GM,MAP4G,CAQ5GC,OAR4G,GAiB1GP,KAjB0G,CAQ5GO,OAR4G,CAS5GC,WAT4G,GAiB1GR,KAjB0G,CAS5GQ,WAT4G,mBAiB1GR,KAjB0G,CAU5GS,QAV4G,CAU5GA,QAV4G,gCAUjG,KAViG,kCAiB1GT,KAjB0G,CAW5GU,KAX4G,CAW5GA,KAX4G,6BAWpGR,KAAK,CAACS,iBAX8F,gBAY5GC,OAZ4G,GAiB1GZ,KAjB0G,CAY5GY,OAZ4G,CAa5GC,qBAb4G,GAiB1Gb,KAjB0G,CAa5Ga,qBAb4G,CAc5GC,gBAd4G,GAiB1Gd,KAjB0G,CAc5Gc,gBAd4G,CAe5GC,cAf4G,GAiB1Gf,KAjB0G,CAe5Ge,cAf4G,CAgBzGC,UAhByG,iCAiB1GhB,KAjB0G;;AAmB7CzB,EAAAA,UAAU,CAACO,0BAAD,CAnBmC,CAmBtGmC,KAnBsG,eAmBtGA,KAnBsG,CAmB/FC,QAnB+F,eAmB/FA,QAnB+F,CAmBrFC,UAnBqF,eAmBrFA,UAnBqF,CAmBzEC,uBAnByE,eAmBzEA,uBAnByE;;AAqB9G,MAAMC,MAAM,GAAGrC,gBAAgB,EAA/B;;AAEA,MAAMsC,QAAQ,GAAG7C,MAAM,CAAmB,IAAnB,CAAvB;;AAEA,MAAM8C,OAAO,GAAG,CAAC,CAACX,OAAlB;AACA,MAAMY,YAAY,GAAG,CAACf,QAAtB;;AAEA,MAAMgB,MAAM,GAAGxC,SAAS,CAAC2B,OAAD,EAAUE,gBAAV,EAA4BC,cAA5B,CAAxB;;AAEA,MAAMW,oBAAoB,GAAGpD,WAAW;AACtC,YAAC2C,KAAD,EAAuC;AACrCA,IAAAA,KAAK,CAACU,OAAN,gGAAc,iBAAOC,IAAP;AACcf,gBAAAA,qBADd,sEAC8CA,qBAAqB,CAACe,IAAD,CADnE,2CACNC,iBADM;;AAGZ,oBAAI,CAACA,iBAAL,EAAwB;AACtBN,kBAAAA,OAAO,IAAIE,MAAM,CAACG,IAAD,CAAjB;AACD,iBAFD,MAEO;AACLR,kBAAAA,uBAAuB,CAACQ,IAAI,CAACE,EAAN,EAAU/C,gCAAgC,CAACqB,KAAjC,CAAuCyB,iBAAvC,CAAV,CAAvB;AACD,iBAPW,wDAAd;;AASD,GAXqC;AAYtC,GAACJ,MAAD,EAASrB,KAAT,EAAgBS,qBAAhB,EAAuCU,OAAvC,CAZsC,CAAxC;;;AAeA;AACA,MAAMQ,YAAY,GAAGzD,WAAW;AAC9B,sBAAO0D,QAAP;AACOA,cAAAA,QADP;;AAGMC,cAAAA,UAHN,GAGmBC,KAAK,CAACC,IAAN,CAAWH,QAAX,CAHnB;;AAKE,kBAAIR,YAAJ,EAAkB;AAChBS,gBAAAA,UAAU,GAAG,CAACA,UAAU,CAAC,CAAD,CAAX,CAAb;AACD,eAPH;;AAS4BtD,gBAAAA,SAAS,CAACsD,UAAD,CATrC,SASQG,WATR;;AAWQC,cAAAA,aAXR,GAWwBD,WAAW,CAACE,MAAZ,CAAmB,UAACC,CAAD,UAAO,CAAC,CAACA,CAAC,CAACC,YAAX,EAAnB,CAXxB;AAYQC,cAAAA,cAZR,GAYyBL,WAAW,CAACE,MAAZ,CAAmB,UAACC,CAAD,UAAO,CAACA,CAAC,CAACC,YAAV,EAAnB,CAZzB;;AAcE,kBAAIhB,YAAY,IAAIa,aAAa,CAACK,MAA9B,IAAwCzB,KAAK,CAACyB,MAAlD,EAA0D;AACxDvB,gBAAAA,UAAU,CAACF,KAAK,CAAC,CAAD,CAAL,CAASa,EAAV,CAAV;AACD;;AAED,kBAAIO,aAAa,CAACK,MAAlB,EAA0B;AACxBxB,gBAAAA,QAAQ,CAACmB,aAAD,CAAR;AACAX,gBAAAA,oBAAoB,CAACW,aAAD,CAApB;AACD;;AAEDI,cAAAA,cAAc,CAACC,MAAf,KAAyBlC,WAAzB,oBAAyBA,WAAW,CAAGiC,cAAH,CAApC,EAvBF,2DAD8B;;AA0B9B,GAACjC,WAAD,EAAckB,oBAAd,EAAoCR,QAApC,EAA8CM,YAA9C,EAA4DP,KAA5D,EAAmEE,UAAnE,CA1B8B,CAAhC;;;AA6BA,MAAMwB,UAAU,GAAGrE,WAAW;AAC5B,YAACsE,KAAD,EAAW;AACT,QAAIzC,QAAJ,EAAc;AACZ;AACD,KAHQ;;AAKD0C,IAAAA,YALC,GAKgBD,KALhB,CAKDC,YALC;AAMD5B,IAAAA,KANC,GAMS4B,YANT,CAMD5B,KANC;;AAQT,QAAI,CAAAA,KAAK,QAAL,YAAAA,KAAK,CAAEyB,MAAP,IAAgB,CAApB,EAAuB;AACrBX,MAAAA,YAAY,CAACd,KAAD,CAAZ;AACA4B,MAAAA,YAAY,CAACC,SAAb;AACD;AACF,GAb2B;AAc5B,GAACf,YAAD,EAAe5B,QAAf,CAd4B,CAA9B,CA3E8G;;;AA4FvEjB,EAAAA,OAAO,CAAmB,EAAE6D,MAAM,EAAEJ,UAAV,EAAnB,CA5FgE,CA4FtGK,WA5FsG,YA4FtGA,WA5FsG,CA4FpFC,QA5FoF,YA4FzFhD,GA5FyF;AA6FnDf,EAAAA,OAAO,EA7F4C,CA6FzFgE,iBA7FyF,aA6FtGF,WA7FsG,CA6FjEG,SA7FiE,aA6FtElD,GA7FsE;;AA+F9G,MAAIR,SAAJ,EAAe;AACb0D,IAAAA,SAAS,CAACC,OAAV,GAAoBC,MAAM,CAACC,QAA3B;AACD;;AAED,MAAMC,KAAK,GAAGjF,WAAW,CAAC,YAAM;AAC9BgB,IAAAA,WAAW,CAACkE,YAAZ,GAA2B,IAA3B;AACA,yBAAAlC,QAAQ,CAAC8B,OAAT,uCAAkBG,KAAlB;AACD,GAHwB,EAGtB,EAHsB,CAAzB;;AAKA,MAAME,IAAI,GAAGnF,WAAW,CAAC,YAAM;AAC7B,0BAAAgD,QAAQ,CAAC8B,OAAT,wCAAkBK,IAAlB;AACD,GAFuB,EAErB,EAFqB,CAAxB;;AAIAjF,EAAAA,mBAAmB,CAACyB,GAAD,EAAM,oBAAO,EAAEsD,KAAK,EAALA,KAAF,EAASE,IAAI,EAAJA,IAAT,EAAP,EAAN,EAA+B,CAACxD,GAAD,CAA/B,CAAnB,CA5G8G;;AA8GtEvB,EAAAA,QAAQ,CAAC,KAAD,CA9G8D,CA8GvGgF,YA9GuG,gBA8GzFC,eA9GyF;AA+G9G,MAAMC,iBAAiB,GAAGtF,WAAW;AACnC,YAACsE,KAAD,EAAgD;AAC9Cb,IAAAA,YAAY,CAACa,KAAK,CAACiB,MAAN,CAAa5C,KAAd,CAAZ;AACD,GAHkC;AAInC,GAACc,YAAD,CAJmC,CAArC;;;AAOA,MAAM+B,WAAW,GAAGxF,WAAW;AAC7B,YAACuB,CAAD,EAA2C;AACzC,QAAI,CAACM,QAAL,EAAe;AACb;AACA;AACA4D,MAAAA,qBAAqB,CAAC,YAAM;AAC1B,YAAIzE,WAAW,CAACkE,YAAhB,EAA8B;AAC5BG,UAAAA,eAAe,CAAC,IAAD,CAAf;AACD;AACF,OAJoB,CAArB;AAKApD,MAAAA,OAAO,QAAP,YAAAA,OAAO,CAAGV,CAAH,CAAP;AACD;AACF,GAZ4B;AAa7B,GAACM,QAAD,EAAWI,OAAX,CAb6B,CAA/B;;;AAgBA,MAAMyD,UAAU,GAAG1F,WAAW;AAC5B,YAACuB,CAAD,EAA2C;AACzC8D,IAAAA,eAAe,CAAC,KAAD,CAAf;AACA,QAAI,CAACxD,QAAL,EAAe;AACbG,MAAAA,MAAM,QAAN,YAAAA,MAAM,CAAGT,CAAH,CAAN;AACD;AACF,GAN2B;AAO5B,GAACM,QAAD,EAAWG,MAAX,CAP4B,CAA9B;;;AAUA,MAAM2D,sBAAsB,GAAGrF,EAAE,CAACe,QAAQ,CAACuE,YAAT,CAAsBhE,KAAtB,CAAD;AAC9BP,EAAAA,QAAQ,CAACwE,iBAAT,CAA2BjE,KAA3B,CAD8B,IACMwD,YADN;AAE9B/D,EAAAA,QAAQ,CAACyE,QAAT,EAF8B,IAERpB,WAAW,IAAI,CAAC7C,QAFR;AAG9BR,EAAAA,QAAQ,CAACQ,QAAT,CAAkBD,KAAlB,CAH8B,IAGHC,QAHG;AAI9BR,EAAAA,QAAQ,CAACU,OAAT,CAAiBH,KAAjB,CAJ8B,IAIJ,CAAC,CAACG,OAJE;AAK9BV,EAAAA,QAAQ,CAACS,KAAT,CAAeF,KAAf,CAL8B,IAKN,CAAC,CAACE,KALI,OAAjC;;;AAQA,MAAMiE,6BAA6B,GAAGzF,EAAE;AACrCe,EAAAA,QAAQ,CAAC2E,cAAT,EADqC,IACTpB,iBAAiB,IAAI,CAAC/C,QADb,QAAxC;;;AAIA,MAAMoE,0BAA0B,GAAG3F,EAAE,CAACe,QAAQ,CAAC6E,IAAT,CAActE,KAAd,CAAD;AAClCP,EAAAA,QAAQ,CAAC8E,YAAT,CAAsBvE,KAAtB,CADkC,IACHC,QADG,QAArC;;;AAIA,MAAMuE,UAAU,GAAGzD,KAAK,CAACyB,MAAN,KAAiB,CAApC;AACA,MAAMiC,mBAAmB,GAAGnD,YAAY,IAAIkD,UAA5C;;AAEA,MAAME,cAAc,GAAGhG,EAAE,CAACe,QAAQ,CAACkF,IAAT,CAAc3E,KAAd,CAAD;AACtBP,EAAAA,QAAQ,CAACmF,YAAT,CAAsB5E,KAAtB,CADsB,IACSC,QADT,QAAzB;;;AAIA;AACE,wBAAC,aAAD,EAAmBH,KAAnB;AACE,iCAAK,SAAS,EAAEL,QAAQ,CAACoF,IAAT,CAAc7E,KAAd,CAAhB,EAAsC,KAAK,EAAErB,aAAa,CAAC,EAAE6B,KAAK,EAALA,KAAF,EAAD,CAA1D;AACG,KAACc,YAAD,IAAiB,CAAC,CAACP,KAAK,CAACyB,MAAzB,iBAAmC,oBAAC,oBAAD,OADtC;AAEE,iCAAK,SAAS,EAAE2B,6BAAhB;AACE,mCAAO,GAAG,EAAEpB,QAAZ,EAAsB,SAAS,EAAEgB,sBAAjC;AACE,iCAAK,SAAS,EAAEtE,QAAQ,CAACqF,OAAT,EAAhB;AACE,kCAAM,YAAU,oBAAhB,EAAsC,SAAS,EAAEJ,cAAjD;AACGD,IAAAA,mBAAmB,GAAGtD,MAAM,CAAC4D,WAAV,GAAwB5D,MAAM,CAAC6D,UADrD,CADF;;;AAKE,iCAAK,SAAS,EAAEvF,QAAQ,CAACwF,aAAT,EAAhB;AACGR,IAAAA,mBAAmB;AAClB,wBAAC,gBAAD,IAAkB,IAAI,EAAE1D,KAAK,CAAC,CAAD,CAA7B,GADkB;;AAGlB;AACGI,IAAAA,MAAM,CAAC+D,UADV;AAEE,iCAAK,SAAS,EAAEb,0BAAhB;AACE,wBAAC,UAAD,OADF,CAFF,CAJJ,CALF,CADF;;;;;;AAmBE;AACMvD,IAAAA,UADN;AAEE,MAAA,GAAG,EAAEM,QAFP;AAGE,MAAA,QAAQ,EAAEnB,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAH5B;AAIE,MAAA,IAAI,EAAC,MAJP;AAKE,MAAA,QAAQ,EAAEA,QALZ;AAME,MAAA,QAAQ,EAAEM,QANZ;AAOE,MAAA,SAAS,EAAEd,QAAQ,CAAC0F,SAAT,EAPb;AAQE,MAAA,OAAO,EAAEzF,eARX;AASE,MAAA,QAAQ,EAAEgE,iBATZ;AAUE,MAAA,OAAO,EAAEE,WAVX;AAWE,MAAA,MAAM,EAAEE;AACR;AAZF,QAaE,KAAK,EAAE,EAbT,IAnBF,CADF,CAFF,CADF,CADF;;;;;;;AA4CD,CAnNqB,CAAtB;;;;AAuNA,OAAO,IAAMsB,YAAY,GAAGjG,+BAA+B,CAAqCS,aAArC,CAApD;AACPwF,YAAY,CAACC,WAAb,GAA2B,cAA3B","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/components/FileUploader/FileUploader/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/FileUploader/FileUploader.js",
+  "module": "FileUploader",
+  "types": "../FileUploader.d.ts",
+  "sideEffects": false
+}

package/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/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/components/FileUploader/FileUploader.styles/FileUploader.styles.js

@@ -0,0 +1,56 @@
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
+
+import { css, keyframes, memoizeStyle } from "../../../lib/theming/Emotion";
+var styles = {
+  pulse: function pulse() {
+    return keyframes(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\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 css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\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 css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\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 css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      border: ", " solid ", ";\n      box-shadow: 0px 0px 0px 1px ", ";\n    "])), t.fileUploaderBorderWidth, t.fileUploaderBorderColorFocus, t.fileUploaderBorderColorFocus);
+  },
+  dragOver: function dragOver() {
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\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 css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      border-radius: 2px;\n      animation: ", " 1.5s infinite;\n    "])), styles.pulse());
+  },
+  content: function content() {
+    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      display: flex;\n      width: 100%;\n      align-items: center;\n      height: 100%;\n    "])));
+  },
+  fileInput: function fileInput() {
+    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      width: 0;\n      height: 0;\n    "])));
+  },
+  afterLinkText: function afterLinkText() {
+    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      display: flex;\n      justify-content: space-between;\n      flex: 1 1 auto;\n    "])));
+  },
+  warning: function warning(t) {
+    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      border: ", " solid ", ";\n      box-shadow: 0px 0px 0px 1px ", ";\n    "])), t.fileUploaderBorderWidth, t.fileUploaderBorderColorWarning, t.fileUploaderBorderColorWarning);
+  },
+  error: function error(t) {
+    return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      border: ", " solid ", ";\n      box-shadow: 0px 0px 0px 1px ", ";\n    "])), t.fileUploaderBorderWidth, t.fileUploaderBorderColorError, t.fileUploaderBorderColorError);
+  },
+  disabled: function disabled(t) {
+    return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\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 css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      font-size: ", ";\n      color: ", ";\n    "])), t.fileUploaderIconSize, t.fileUploaderIconColor);
+  },
+  iconDisabled: function iconDisabled(t) {
+    return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.fileUploaderDisabledIconColor);
+  },
+  link: function link(t) {
+    return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\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 css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n      &:hover {\n        text-decoration: none;\n      }\n    "])), t.fileUploaderDisabledLinkColor);
+  }
+};
+export var jsStyles = memoizeStyle(styles);

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

@@ -0,0 +1 @@
+{"version":3,"sources":["FileUploader.styles.ts"],"names":["css","keyframes","memoizeStyle","styles","pulse","root","t","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/components/FileUploader/FileUploader.styles/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/FileUploader/FileUploader.styles.js",
+  "module": "FileUploader.styles",
+  "types": "../FileUploader.styles.d.ts",
+  "sideEffects": false
+}

package/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/components/FileUploader/index/index.js

@@ -0,0 +1,3 @@
+export { FileUploaderFileStatus } from "../../../internal/FileUploaderControl/fileUtils";
+export { FileUploaderFileValidationResult } from "../../../internal/FileUploaderControl/FileUploaderFileValidationResult";
+export * from "../FileUploader";

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":["FileUploaderFileStatus","FileUploaderFileValidationResult"],"mappings":"AAAA,SAASA,sBAAT,QAAuC,8CAAvC;;AAEA,SAASC,gCAAT,QAAiD,qEAAjD;AACA,cAAc,gBAAd","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/components/FileUploader/index/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/FileUploader/index.js",
+  "module": "index",
+  "types": "../index.d.ts",
+  "sideEffects": false
+}

package/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/components/FileUploader/locale/index/index.js

@@ -0,0 +1,8 @@
+import { LocaleHelper } from "../../../../lib/locale/LocaleHelper";
+import { componentsLocales as en_GB } from "../locales/en";
+import { componentsLocales as ru_RU } from "../locales/ru";
+export * from "../types";
+export var FileUploaderLocaleHelper = new LocaleHelper({
+  ru_RU: ru_RU,
+  en_GB: en_GB
+});

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":["LocaleHelper","componentsLocales","en_GB","ru_RU","FileUploaderLocaleHelper"],"mappings":"AAAA,SAASA,YAAT,QAA6B,kCAA7B;;AAEA,SAASC,iBAAiB,IAAIC,KAA9B,QAA2C,cAA3C;AACA,SAASD,iBAAiB,IAAIE,KAA9B,QAA2C,cAA3C;;;AAGA,cAAc,SAAd;;AAEA,OAAO,IAAMC,wBAAwB,GAAG,IAAIJ,YAAJ,CAAqC;AAC3EG,EAAAA,KAAK,EAALA,KAD2E;AAE3ED,EAAAA,KAAK,EAALA,KAF2E,EAArC,CAAjC","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/components/FileUploader/locale/index/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../cjs/components/FileUploader/locale/index.js",
+  "module": "index",
+  "types": "../index.d.ts",
+  "sideEffects": false
+}

package/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/components/FileUploader/locale/locales/en/en.js

@@ -0,0 +1,6 @@
+export var componentsLocales = {
+  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/components/FileUploader/locale/locales/en/en.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["en.ts"],"names":["componentsLocales","chooseFile","choosedFile","orDragHere","requestErrorText"],"mappings":";;AAEA,OAAO,IAAMA,iBAAqC,GAAG;AACnDC,EAAAA,UAAU,EAAE,eADuC;AAEnDC,EAAAA,WAAW,EAAE,eAFsC;AAGnDC,EAAAA,UAAU,EAAE,cAHuC;AAInDC,EAAAA,gBAAgB,EAAE,sEAJiC,EAA9C","sourcesContent":["import { FileUploaderLocale } from '../types';\n\nexport const componentsLocales: FileUploaderLocale = {\n  chooseFile: 'Select a file',\n  choosedFile: 'File selected',\n  orDragHere: 'or drag here',\n  requestErrorText: 'The file could not be uploaded to the server, please try again later',\n};\n"]}

package/components/FileUploader/locale/locales/en/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../../cjs/components/FileUploader/locale/locales/en.js",
+  "module": "en",
+  "types": "../en.d.ts",
+  "sideEffects": false
+}

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

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

package/components/FileUploader/locale/locales/ru/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../../cjs/components/FileUploader/locale/locales/ru.js",
+  "module": "ru",
+  "types": "../ru.d.ts",
+  "sideEffects": false
+}

package/components/FileUploader/locale/locales/ru/ru.js

@@ -0,0 +1,6 @@
+export var componentsLocales = {
+  chooseFile: 'Выберите файл',
+  choosedFile: 'Выбран файл',
+  orDragHere: 'или перетащите сюда',
+  requestErrorText: 'Файл не удалось загрузить на сервер, повторите попытку позже'
+};

package/components/FileUploader/locale/locales/ru/ru.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ru.ts"],"names":["componentsLocales","chooseFile","choosedFile","orDragHere","requestErrorText"],"mappings":";;AAEA,OAAO,IAAMA,iBAAqC,GAAG;AACnDC,EAAAA,UAAU,EAAE,eADuC;AAEnDC,EAAAA,WAAW,EAAE,aAFsC;AAGnDC,EAAAA,UAAU,EAAE,qBAHuC;AAInDC,EAAAA,gBAAgB,EAAE,8DAJiC,EAA9C","sourcesContent":["import { FileUploaderLocale } from '../types';\n\nexport const componentsLocales: FileUploaderLocale = {\n  chooseFile: 'Выберите файл',\n  choosedFile: 'Выбран файл',\n  orDragHere: 'или перетащите сюда',\n  requestErrorText: 'Файл не удалось загрузить на сервер, повторите попытку позже',\n};\n"]}

package/components/FileUploader/locale/locales/ru.d.ts

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