@topconsultnpm/sdkui-react-beta 6.14.128 → 6.14.130
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -10,7 +10,7 @@ import { DeviceType } from '../../base/TMDeviceProvider';
|
|
|
10
10
|
import TMTooltip from '../../base/TMTooltip';
|
|
11
11
|
import { TMFileViewer, StyledHeaderIcon } from './TMDcmtPreview';
|
|
12
12
|
import TMPanel from '../../base/TMPanel';
|
|
13
|
-
const TMFileUploader = ({ deviceType = DeviceType.DESKTOP, onClose, onFileUpload, isRequired = false, defaultBlob = null, isResizingActive }) => {
|
|
13
|
+
const TMFileUploader = ({ deviceType = DeviceType.DESKTOP, onClose, onFileUpload, isRequired = false, defaultBlob = null, isResizingActive, showTMPanel = true }) => {
|
|
14
14
|
const [dragOver, setDragOver] = useState(false);
|
|
15
15
|
const [uploadedFile, setUploadedFile] = useState(defaultBlob);
|
|
16
16
|
const [fileName, setFileName] = useState('');
|
|
@@ -85,7 +85,8 @@ const TMFileUploader = ({ deviceType = DeviceType.DESKTOP, onClose, onFileUpload
|
|
|
85
85
|
_jsx("div", { style: { display: 'flex', gap: 10, width: '100%', height: '100%' }, children: _jsxs(UploadContainer, { ref: uploaderRef, tabIndex: 0, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, style: { backgroundColor: dragOver ? '#76b1e6' : 'white' }, onDoubleClick: browseHandler, "$isRequired": isRequired, children: [_jsx("div", { style: { display: 'flex', gap: '10px', flexDirection: 'column', position: 'absolute', right: 5, top: 5 }, children: _jsx(TMButton, { btnStyle: 'icon', caption: 'Sfoglia', color: isRequired && !uploadedFile ? 'error' : 'primary', onClick: browseHandler, icon: _jsx(IconFolderOpen, { fontSize: 22 }) }) }), _jsx("p", { style: { fontSize: '1.2rem', fontWeight: 'bold' }, children: deviceType === DeviceType.MOBILE ? 'Clicca per sfogliare il tuo file' : 'Trascina il tuo file qui o fai doppio click per sfogliarlo' }), isRequired && _jsxs("p", { style: { fontWeight: 'bold' }, children: [" ", SDKUI_Localizator.RequiredField, " "] })] }) }) :
|
|
86
86
|
_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 10, width: '100%', height: '100%' }, children: [_jsxs("div", { style: { backgroundColor: 'white', padding: '5px 10px', borderRadius: 8, display: 'flex', alignItems: 'center', justifyContent: 'space-between', color: TMColors.primaryColor }, children: [_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 5 }, children: [_jsx("p", { children: "File name:" }), _jsxs("div", { style: { fontWeight: 'bold' }, children: [fileName, " ", _jsxs("span", { children: [" ", ` (${formatBytes(fileSize)})`, " "] })] })] }), uploadedFile && _jsx(TMButton, { btnStyle: 'icon', color: 'error', caption: 'Pulisci', onClick: () => clearFile(true), icon: _jsx(IconClear, { fontSize: 22 }) })] }), extensionHandler(fileExt) === FileExtensionHandler.READY_TO_SHOW ? _jsx(TMFileViewer, { fileBlob: uploadedFile, isResizingActive: isResizingActive }) :
|
|
87
87
|
_jsx("div", { style: { backgroundColor: '#f6dbdb', padding: '5px 10px', borderRadius: 8, display: 'flex', alignItems: 'center', justifyContent: 'space-between', color: TMColors.error }, children: _jsxs("div", { children: [" ", 'Anteprima non disponibile.', fileExt && _jsx("b", { children: ` (*.${fileExt})` })] }) })] });
|
|
88
|
-
|
|
88
|
+
const innerContent = (_jsxs("div", { style: { width: '100%', height: '100%', padding: '2px', display: 'flex', flexDirection: 'column', gap: 10 }, children: [_jsx(HiddenInput, { id: "fileInput", type: "file", onChange: handleInputChange }), content] }));
|
|
89
|
+
return showTMPanel ? (_jsx(TMPanel, { ref: fileUploaderPanelRef, panelID: 'file-uploader-panel', title: SDKUI_Localizator.FileUpload, onBack: deviceType === DeviceType.MOBILE ? () => onClose?.() : undefined, toolbar: deviceType !== DeviceType.MOBILE ? (_jsx(StyledHeaderIcon, { onClick: onClose, "$color": 'white', children: _jsx(TMTooltip, { content: SDKUI_Localizator.Close, children: _jsx(IconCloseOutline, {}) }) })) : undefined, children: innerContent })) : (innerContent);
|
|
89
90
|
};
|
|
90
91
|
const UploadContainer = styled.div `
|
|
91
92
|
position: relative;
|
|
@@ -407,7 +407,7 @@ const TMBlogs = (props) => {
|
|
|
407
407
|
// Scroll the focused blog post into view
|
|
408
408
|
useEffect(() => {
|
|
409
409
|
if (focusedBlog && focusedBlog.id && containerRef.current) {
|
|
410
|
-
const focusedElement = document.getElementById(id + "-" + uiId + focusedBlog.id.toString());
|
|
410
|
+
const focusedElement = document.getElementById(id + "-" + uiId + "-" + focusedBlog.id.toString());
|
|
411
411
|
if (focusedElement) {
|
|
412
412
|
focusedElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
|
413
413
|
}
|
|
@@ -417,7 +417,7 @@ const TMBlogs = (props) => {
|
|
|
417
417
|
const scrollRef = useRef(null);
|
|
418
418
|
useEffect(() => {
|
|
419
419
|
if (focusedBlog && focusedBlog.id) { // containerRef.current
|
|
420
|
-
const focusedElement = document.getElementById(id + "-" + uiId + focusedBlog.id.toString());
|
|
420
|
+
const focusedElement = document.getElementById(id + "-" + uiId + "-" + focusedBlog.id.toString());
|
|
421
421
|
if (focusedElement) {
|
|
422
422
|
focusedElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
|
423
423
|
}
|
|
@@ -548,7 +548,7 @@ const TMBlogs = (props) => {
|
|
|
548
548
|
maxWidth: "65px",
|
|
549
549
|
overflow: 'hidden',
|
|
550
550
|
textOverflow: 'ellipsis',
|
|
551
|
-
transform: layoutMode === 'chat' ? 'translate(
|
|
551
|
+
transform: layoutMode === 'chat' ? 'translate(45px, 0px)' : undefined
|
|
552
552
|
}, children: SDKUI_Localizator.New }))] }), _jsxs("div", { style: {
|
|
553
553
|
fontSize: 'calc(1rem - 1px)',
|
|
554
554
|
color: isSelected ? "#fff" : !blogPost.isSys ? TMColors.primary : colors.RED
|