@braineet/ui
Version:
Braineet design system
122 lines (121 loc) • 6.24 kB
JavaScript
;
exports.__esModule = true;
exports.DefaultUploadItem = void 0;
var _react = _interopRequireWildcard(require("react"));
var _reactSpring = require("react-spring");
var _button = _interopRequireDefault(require("../../button"));
var _file = require("../../file");
var _icon = _interopRequireDefault(require("../../icon"));
var _pane = _interopRequireDefault(require("../../pane"));
var _useUploadState = require("../useUploadState");
var _styles = require("./styles");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var DefaultUploadItem = /*#__PURE__*/(0, _react.memo)(function (_ref) {
var item = _ref.item,
children = _ref.children,
disabled = _ref.disabled,
readonly = _ref.readonly,
listType = _ref.listType,
animationStatus = _ref.animationStatus,
uploadItems = _ref.uploadItems,
onPreview = _ref.onPreview,
cancelUpload = _ref.cancelUpload,
removeItem = _ref.removeItem;
var canPreview = _react.default.useMemo(function () {
return (0, _useUploadState.canPreviewFile)(item);
}, [item == null ? void 0 : item.type, item == null ? void 0 : item.status]);
var handleReupload = function handleReupload(e) {
e.preventDefault();
e.stopPropagation();
uploadItems([item]);
};
var handlePreview = function handlePreview(e) {
if (e.defaultPrevented) return;
e.preventDefault();
onPreview(_extends({}, item, {
fileName: item == null ? void 0 : item.name
}));
};
var handleCancel = function handleCancel(e) {
e.stopPropagation();
e.preventDefault();
if ((item == null ? void 0 : item.status) === _useUploadState.UPLOAD_ITEM_STATUS.UPLOADING && cancelUpload) {
cancelUpload();
}
removeItem(item.uid);
};
var transitions = (0, _reactSpring.useTransition)((item == null ? void 0 : item.status) === _useUploadState.UPLOAD_ITEM_STATUS.SUCCESS, null, {
from: {
opacity: 0,
transform: 'translate3d(0, -5px, 0)'
},
enter: {
opacity: 1,
transform: 'translate3d(0, 0, 0)'
},
leave: {
opacity: 0,
transform: 'translate3d(0, -5px, 0)'
},
delay: 300
});
var itemIcon = _react.default.useMemo(function () {
if (listType === _useUploadState.LIST_TYPE.TEXT) return null;
return (0, _useUploadState.getFileIcon)(item);
}, [item, listType]);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_file.File, {
id: "" + ((item == null ? void 0 : item.uid) || (item == null ? void 0 : item.name)),
file: _extends({}, item, {
icon: itemIcon
}),
status: item == null ? void 0 : item.status,
onClick: canPreview ? handlePreview : null,
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_pane.default, {
display: "flex",
children: [transitions.map(function (_ref2) {
var tItem = _ref2.item,
key = _ref2.key,
styles = _extends({}, (_objectDestructuringEmpty(_ref2.props), _ref2.props));
return tItem && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.FeedbackIconWrapper, {
style: styles,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.default, {
name: "add_validated",
color: "success"
})
}, key);
}), (item == null ? void 0 : item.type) === 'link' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.default, {
disabled: disabled,
styleType: "ghost",
color: "black",
icon: "share",
as: "a",
target: "_blank",
href: item == null ? void 0 : item.url
}), children, !disabled && !readonly && (item == null ? void 0 : item.status) === _useUploadState.UPLOAD_ITEM_STATUS.ERROR && /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.default, {
icon: "reset",
styleType: "ghost",
color: "error",
onClick: handleReupload,
disabled: animationStatus === 'leave'
}), !disabled && !readonly && /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.default, {
icon: "clear",
styleType: "ghost",
color: (item == null ? void 0 : item.status) === _useUploadState.UPLOAD_ITEM_STATUS.ERROR ? 'error' : 'black',
onClick: handleCancel,
disabled: animationStatus === 'leave'
}), (item == null ? void 0 : item.progress) > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.UploadItemProgressBar, {
progress: item == null ? void 0 : item.progress
}) : null]
})
});
});
exports.DefaultUploadItem = DefaultUploadItem;
DefaultUploadItem.displayName = 'DefaultUploadItem';
DefaultUploadItem.defaultProps = {
animationStatus: null
};