@ozen-ui/kit
Version:
React component library
166 lines (165 loc) • 7.54 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.FileUploaderProvider = void 0;
var tslib_1 = require("tslib");
require("../components/FileUploaderHint/FileUploaderHint.css");
require("../modules/FileUploaderInput/FileUploaderInput.css");
require("../modules/FileUploaderDrop/FileUploaderDrop.css");
require("../modules/FileUploaderLoader/FileUploaderLoader.css");
require("../modules/FileUploaderList/FileUploaderList.css");
require("../FileUploader.css");
var react_1 = tslib_1.__importStar(require("react"));
var useControlled_1 = require("../../../hooks/useControlled");
var array_1 = require("../../../utils/array");
var constants_1 = require("../constants");
var utils_1 = require("../utils");
var FileUploaderContext_1 = require("./FileUploaderContext");
var FileUploaderProvider = function (_a) {
var filesProp = _a.files, defaultFiles = _a.defaultFiles, prepareFiles = _a.prepareFiles, children = _a.children, _b = _a.size, size = _b === void 0 ? constants_1.FILE_UPLOADER_DEFAULT_SIZE : _b, _c = _a.multiple, multiple = _c === void 0 ? constants_1.FILE_UPLOADER_DEFAULT_MULTIPLE : _c, onChange = _a.onChange, onDelete = _a.onDelete, onDraggingStart = _a.onDraggingStart, onDraggingEnd = _a.onDraggingEnd, _d = _a.status, status = _d === void 0 ? constants_1.FILE_UPLOADER_DEFAULT_STATUS : _d, _e = _a.variant, variant = _e === void 0 ? constants_1.FILE_UPLOADER_DEFAULT_VARIANT : _e, accept = _a.accept, _f = _a.validate, validateProp = _f === void 0 ? constants_1.FILE_UPLOADER_DEFAULT_VALIDATE : _f, _g = _a.allow, allowProp = _g === void 0 ? constants_1.FILE_UPLOADER_DEFAULT_ALLOW_DROP : _g, _h = _a.onAllowDropChange, onAllowDropChange = _h === void 0 ? constants_1.FILE_UPLOADER_DEFAULT_ON_ALLOW_DROP_CHANGE : _h, _j = _a.onAllowUploadChange, onAllowUploadChange = _j === void 0 ? constants_1.FILE_UPLOADER_DEFAULT_ON_ALLOW_UPLOAD_CHANGE : _j, _k = _a.onDrop, onDrop = _k === void 0 ? constants_1.FILE_UPLOADER_DEFAULT_ON_DROP : _k;
var _l = tslib_1.__read((0, useControlled_1.useControlled)({
value: filesProp,
defaultValue: defaultFiles,
name: 'FileUploaderProvider',
state: 'files',
}), 2), filesState = _l[0], setFilesState = _l[1];
var files = filesState !== null && filesState !== void 0 ? filesState : [];
var filesInfos = prepareFiles(files);
var _m = tslib_1.__read((0, react_1.useState)(false), 2), dragging = _m[0], setDraggingState = _m[1];
var inputRef = (0, react_1.useRef)(null);
var calculateValidate = function (file, files) {
var validateArray = (0, array_1.isArray)(validateProp) ? validateProp : [validateProp];
var failedValidate = [];
validateArray.forEach(function (validate) {
var returnValue = validate(file, files);
if ((0, utils_1.isObjectValidateInfo)(returnValue)) {
if (!returnValue.isValid) {
failedValidate.push({
validate: validate,
info: returnValue,
});
}
return;
}
if (!returnValue) {
failedValidate.push({
validate: validate,
info: false,
});
}
});
return {
isValid: failedValidate.length === 0,
failed: failedValidate,
};
};
var validate = function (file, files) {
return calculateValidate(file, files).isValid;
};
var setFiles = function (newFiles) {
var changesFiles = (0, utils_1.getNewFiles)(files, newFiles);
var acceptedFiles = [];
var rejectedFiles = [];
changesFiles.forEach(function (file) {
var validationResult = calculateValidate(file, files);
if (validationResult.isValid) {
acceptedFiles.push(file);
}
else {
rejectedFiles.push({
file: file,
validation: validationResult.failed,
});
}
});
if (acceptedFiles.length === 0 &&
rejectedFiles.length === 0 &&
files.length === newFiles.length) {
return;
}
var newStateFiles = tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read(files), false), tslib_1.__read(acceptedFiles), false);
setFilesState(newStateFiles);
onChange === null || onChange === void 0 ? void 0 : onChange({
files: newStateFiles,
acceptedFiles: acceptedFiles,
rejectedFiles: rejectedFiles,
});
};
var openUploader = function () {
var _a;
(_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.click();
};
var deleteFile = function (fileInfo) {
onDelete === null || onDelete === void 0 ? void 0 : onDelete(fileInfo);
};
var setDragging = function (event, isDragging) {
if (isDragging === dragging) {
return;
}
setDraggingState(isDragging);
var draggingItems = (function () {
var _a;
var rawItems = (_a = event === null || event === void 0 ? void 0 : event.dataTransfer) === null || _a === void 0 ? void 0 : _a.items;
var items = rawItems ? Array.from(rawItems) : [];
return items.filter(function (item) { return item.kind === 'file'; });
})();
var info = {
files: draggingItems,
count: draggingItems.length,
};
if (isDragging) {
onDraggingStart === null || onDraggingStart === void 0 ? void 0 : onDraggingStart(event, info);
}
else {
onDraggingEnd === null || onDraggingEnd === void 0 ? void 0 : onDraggingEnd(event, info);
}
};
var calculateAllow = function (files) {
var allowArray = (0, array_1.isArray)(allowProp) ? allowProp : [allowProp];
var failedAllow = [];
allowArray.forEach(function (allow) {
// eslint-disable-next-line no-use-before-define
var returnValue = allow(files, contextValue);
if ((0, utils_1.isObjectAllowInfo)(returnValue)) {
if (!returnValue.isAllow) {
failedAllow.push({
allow: allow,
info: returnValue,
});
}
return;
}
if (!returnValue) {
failedAllow.push({
allow: allow,
info: false,
});
}
});
return {
isAllow: failedAllow.length === 0,
failed: failedAllow,
};
};
var contextValue = {
accept: accept,
files: files,
filesInfos: filesInfos,
size: size,
setFiles: setFiles,
dragging: dragging,
setDragging: setDragging,
inputRef: inputRef,
openUploader: openUploader,
multiple: multiple,
deleteFile: deleteFile,
status: status,
variant: variant,
validate: validate,
calculateAllow: calculateAllow,
onAllowDropChange: onAllowDropChange,
onAllowUploadChange: onAllowUploadChange,
onDrop: onDrop,
};
return (react_1.default.createElement(FileUploaderContext_1.FileUploaderContext.Provider, { value: contextValue }, children));
};
exports.FileUploaderProvider = FileUploaderProvider;