@manuscripts/article-editor 1.16.17 → 1.16.19-LEAN-3771.0

package/dist/es/components/FileManager/FileManagerDragLayer.js

@@ -0,0 +1,60 @@
+/*!
+ * The contents of this file are subject to the Common Public Attribution License Version 1.0 (the “License”); you may not use this file except in compliance with the License. You may obtain a copy of the License at https://mpapp-public.gitlab.io/manuscripts-frontend/LICENSE. The License is based on the Mozilla Public License Version 1.1 but Sections 14 and 15 have been added to cover use of software over a computer network and provide for limited attribution for the Original Developer. In addition, Exhibit A has been modified to be consistent with Exhibit B.
+ *
+ * Software distributed under the License is distributed on an “AS IS” basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the specific language governing rights and limitations under the License.
+ *
+ * The Original Code is manuscripts-frontend.
+ *
+ * The Original Developer is the Initial Developer. The Initial Developer of the Original Code is Atypon Systems LLC.
+ *
+ * All portions of the code written by Atypon Systems LLC are Copyright (c) 2024 Atypon Systems LLC. All Rights Reserved.
+ */
+import React from 'react';
+import { useDragLayer } from 'react-dnd';
+import styled from 'styled-components';
+import { FileContainer } from './FileContainer';
+import { FileCreatedDate } from './FileCreatedDate';
+import { FileName } from './FileName';
+const Container = styled.div `
+  position: fixed;
+  pointer-events: none;
+  z-index: 999;
+  left: 0;
+  top: 0;
+  max-width: 400px;
+`;
+const DraggableFileContainer = styled(FileContainer) `
+  padding: 16px 32px;
+  background: #f2fbfc;
+  border: 1px solid #bce7f6;
+  box-shadow: 0 4px 9px rgba(0, 0, 0, 0.3);
+  border-radius: 6px;
+`;
+const getItemStyles = (currentOffset) => {
+    if (!currentOffset) {
+        return {
+            display: 'none',
+        };
+    }
+    const { x, y } = currentOffset;
+    const transform = `translate(${x}px, ${y}px)`;
+    return {
+        transform,
+        WebkitTransform: transform,
+    };
+};
+export const FileManagerDragLayer = () => {
+    const { itemType, isDragging, item, currentOffset } = useDragLayer((monitor) => ({
+        item: monitor.getItem(),
+        itemType: monitor.getItemType(),
+        currentOffset: monitor.getSourceClientOffset(),
+        isDragging: monitor.isDragging(),
+    }));
+    if (!isDragging) {
+        return null;
+    }
+    return (React.createElement(Container, { style: getItemStyles(currentOffset) }, itemType === 'file' && (React.createElement(DraggableFileContainer, null,
+        React.createElement(FileName, { file: item.file }),
+        item.file.createdDate && React.createElement(FileCreatedDate, { file: item.file })))));
+};
+//# sourceMappingURL=FileManagerDragLayer.js.map

package/dist/es/components/FileManager/FileManagerDragLayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileManagerDragLayer.js","sourceRoot":"","sources":["../../../../src/components/FileManager/FileManagerDragLayer.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,YAAY,EAAW,MAAM,WAAW,CAAA;AACjD,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;CAO3B,CAAA;AAED,MAAM,sBAAsB,GAAG,MAAM,CAAC,aAAa,CAAC,CAAA;;;;;;CAMnD,CAAA;AAED,MAAM,aAAa,GAAG,CAAC,aAA6B,EAAE,EAAE;IACtD,IAAI,CAAC,aAAa,EAAE;QAClB,OAAO;YACL,OAAO,EAAE,MAAM;SAChB,CAAA;KACF;IAED,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,aAAa,CAAA;IAE9B,MAAM,SAAS,GAAG,aAAa,CAAC,OAAO,CAAC,KAAK,CAAA;IAC7C,OAAO;QACL,SAAS;QACT,eAAe,EAAE,SAAS;KAC3B,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAa,GAAG,EAAE;IACjD,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,aAAa,EAAE,GAAG,YAAY,CAChE,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;QACZ,IAAI,EAAE,OAAO,CAAC,OAAO,EAAE;QACvB,QAAQ,EAAE,OAAO,CAAC,WAAW,EAAE;QAC/B,aAAa,EAAE,OAAO,CAAC,qBAAqB,EAAE;QAC9C,UAAU,EAAE,OAAO,CAAC,UAAU,EAAE;KACjC,CAAC,CACH,CAAA;IAED,IAAI,CAAC,UAAU,EAAE;QACf,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,oBAAC,SAAS,IAAC,KAAK,EAAE,aAAa,CAAC,aAAa,CAAC,IAC3C,QAAQ,KAAK,MAAM,IAAI,CACtB,oBAAC,sBAAsB;QACrB,oBAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI;QAC5B,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,oBAAC,eAAe,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CACvC,CAC1B,CACS,CACb,CAAA;AACH,CAAC,CAAA"}

package/dist/es/components/FileManager/FileName.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import styled from 'styled-components';
+import { FileTypeIcon } from './FileTypeIcon';
+export const FileName = ({ file }) => {
+    return (React.createElement(React.Fragment, null,
+        React.createElement(FileTypeIcon, { file: file }),
+        React.createElement(FileNameText, { "data-cy": "filename" }, file.name)));
+};
+export const FileNameText = styled.div `
+  font-family: ${(props) => props.theme.font.family.Lato};
+  font-size: ${(props) => props.theme.font.size.medium};
+  line-height: ${(props) => props.theme.font.lineHeight.large};
+  font-weight: ${(props) => props.theme.font.weight.normal};
+  color: ${(props) => props.theme.colors.text.primary};
+  margin-left: ${(props) => props.theme.grid.unit * 2}px;
+  flex-grow: 1;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+`;
+//# sourceMappingURL=FileName.js.map

package/dist/es/components/FileManager/FileName.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileName.js","sourceRoot":"","sources":["../../../../src/components/FileManager/FileName.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAE7C,MAAM,CAAC,MAAM,QAAQ,GAEhB,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IAChB,OAAO,CACL;QACE,oBAAC,YAAY,IAAC,IAAI,EAAE,IAAI,GAAI;QAC5B,oBAAC,YAAY,eAAS,UAAU,IAAE,IAAI,CAAC,IAAI,CAAgB,CAC1D,CACJ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAA;iBACrB,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI;eACzC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM;iBACrC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,KAAK;iBAC5C,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM;WAC/C,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO;iBACpC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,CAAC;;;;;CAKpD,CAAA"}

package/dist/es/components/FileManager/FileSectionAlert.js

@@ -0,0 +1,174 @@
+/*!
+ * The contents of this file are subject to the Common Public Attribution License Version 1.0 (the “License”); you may not use this file except in compliance with the License. You may obtain a copy of the License at https://mpapp-public.gitlab.io/manuscripts-frontend/LICENSE. The License is based on the Mozilla Public License Version 1.1 but Sections 14 and 15 have been added to cover use of software over a computer network and provide for limited attribution for the Original Developer. In addition, Exhibit A has been modified to be consistent with Exhibit B.
+ *
+ * Software distributed under the License is distributed on an “AS IS” basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the specific language governing rights and limitations under the License.
+ *
+ * The Original Code is manuscripts-frontend.
+ *
+ * The Original Developer is the Initial Developer. The Initial Developer of the Original Code is Atypon Systems LLC.
+ *
+ * All portions of the code written by Atypon Systems LLC are Copyright (c) 2024 Atypon Systems LLC. All Rights Reserved.
+ */
+import { AlertMessage, AlertMessageType, FileUnknownIcon, } from '@manuscripts/style-guide';
+import React from 'react';
+import styled from 'styled-components';
+import { FileContainer } from './FileContainer';
+import { FileNameText } from './FileName';
+export var FileSectionAlertType;
+(function (FileSectionAlertType) {
+    FileSectionAlertType[FileSectionAlertType["NONE"] = 0] = "NONE";
+    FileSectionAlertType[FileSectionAlertType["UPLOAD_IN_PROGRESS"] = 1] = "UPLOAD_IN_PROGRESS";
+    FileSectionAlertType[FileSectionAlertType["UPLOAD_SUCCESSFUL"] = 2] = "UPLOAD_SUCCESSFUL";
+    FileSectionAlertType[FileSectionAlertType["MOVE_SUCCESSFUL"] = 3] = "MOVE_SUCCESSFUL";
+})(FileSectionAlertType || (FileSectionAlertType = {}));
+export const FileSectionAlert = ({ alert }) => {
+    return (React.createElement(React.Fragment, null,
+        alert.type === FileSectionAlertType.UPLOAD_IN_PROGRESS && (React.createElement(FileUploadInProgressAlert, { name: alert.message })),
+        alert.type === FileSectionAlertType.UPLOAD_SUCCESSFUL && (React.createElement(FileUploadSuccessful, null)),
+        alert.type === FileSectionAlertType.MOVE_SUCCESSFUL && (React.createElement(FileMoveSuccessful, { name: alert.message }))));
+};
+const FileUploadInProgressAlert = ({ name }) => {
+    return (React.createElement(FileUploadContainer, null,
+        React.createElement(FileUnknownIcon, null),
+        React.createElement(FileUploadNameContainer, null,
+            React.createElement(UploadFileNameText, null, name),
+            React.createElement(FileUploadProgressBar, null))));
+};
+const FileUploadSuccessful = () => {
+    return (React.createElement(AlertMessageContainer, null,
+        React.createElement(AlertMessage, { type: AlertMessageType.success, hideCloseButton: true, dismissButton: {
+                text: 'OK',
+            } }, "File uploaded successfully")));
+};
+const FileMoveSuccessful = ({ name }) => {
+    return (React.createElement(AlertMessageContainer, null,
+        React.createElement(AlertMessage, { type: AlertMessageType.success, hideCloseButton: true, dismissButton: {
+                text: 'OK',
+            } },
+            "File moved to ",
+            name)));
+};
+const AlertMessageContainer = styled.div `
+  margin-left: 16px;
+  margin-right: 16px;
+`;
+const FileUploadContainer = styled(FileContainer) `
+  background: #f2fbfc;
+`;
+const FileUploadNameContainer = styled.div `
+  flex-grow: 1;
+  margin-left: 8px;
+`;
+const UploadFileNameText = styled(FileNameText) `
+  margin: 0;
+`;
+const FileUploadProgressBar = () => {
+    return (React.createElement(LinearProgress, null,
+        React.createElement(Bar, { className: "bar1" }),
+        React.createElement(Bar, { className: "bar2" })));
+};
+const LinearProgress = styled.div `
+  background: ${(props) => props.theme.colors.background.tertiary};
+  opacity: 0.7;
+  height: 4px;
+  position: relative;
+  width: 100%;
+  margin: 8px auto 0;
+  overflow: hidden;
+  border-radius: 8px;
+  animation: start 0.3s ease-in;
+`;
+const Bar = styled.div `
+  position: absolute;
+  opacity: 0.7;
+  background: #1a9bc7;
+  transition: transform 0.2s linear;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  width: 100%;
+
+  &.bar1 {
+    animation: growBar1 2.5s infinite, moveBar1 2.5s infinite;
+  }
+
+  &.bar2 {
+    animation: growBar2 2.5s infinite, moveBar2 2.5s infinite;
+  }
+
+  @keyframes growBar1 {
+    0% {
+      animation-timing-function: linear;
+      transform: scaleX(0.1);
+    }
+    35% {
+      animation-timing-function: cubic-bezier(0.3, 0.1, 0.7, 1);
+      transform: scaleX(0.1);
+    }
+    70% {
+      animation-timing-function: cubic-bezier(0.2, 0, 0.2, 1.4);
+      transform: scaleX(0.8);
+    }
+    100% {
+      transform: scaleX(0.1);
+    }
+  }
+
+  @keyframes moveBar1 {
+    0% {
+      left: -105%;
+      animation-timing-function: linear;
+    }
+    20% {
+      left: -105%;
+      animation-timing-function: cubic-bezier(0.5, 0, 0.7, 0.4);
+    }
+    60% {
+      left: 21%;
+      animation-timing-function: cubic-bezier(0.3, 0.4, 0.55, 0.9);
+    }
+    80% {
+      left: 40%;
+      animation-timing-function: cubic-bezier(0.1, 0.2, 0.3, 0.95);
+    }
+    100% {
+      left: 90%;
+    }
+  }
+
+  @keyframes growBar2 {
+    0% {
+      animation-timing-function: cubic-bezier(0.2, 0, 0.5, 0.4);
+      transform: scaleX(0.1);
+    }
+    20% {
+      animation-timing-function: cubic-bezier(0.1, 0.2, 0.6, 1);
+      transform: scaleX(0.3);
+    }
+    60% {
+      animation-timing-function: cubic-bezier(0.2, 0, 0.2, 1.4);
+      transform: scaleX(0.6);
+    }
+    100% {
+      transform: scaleX(0.1);
+    }
+  }
+  @keyframes moveBar2 {
+    0% {
+      left: -100%;
+      animation-timing-function: cubic-bezier(0.15, 0, 0.5, 0.4);
+    }
+    25% {
+      left: -50%;
+      animation-timing-function: cubic-bezier(0.3, 0.3, 0.8, 0.7);
+    }
+    50% {
+      left: 45%;
+      animation-timing-function: cubic-bezier(0.1, 0.6, 0.6, 0.9);
+    }
+    100% {
+      left: 95%;
+    }
+  }
+`;
+//# sourceMappingURL=FileSectionAlert.js.map

package/dist/es/components/FileManager/FileSectionAlert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileSectionAlert.js","sourceRoot":"","sources":["../../../../src/components/FileManager/FileSectionAlert.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,EACL,YAAY,EACZ,gBAAgB,EAChB,eAAe,GAChB,MAAM,0BAA0B,CAAA;AACjC,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAEzC,MAAM,CAAN,IAAY,oBAKX;AALD,WAAY,oBAAoB;IAC9B,+DAAI,CAAA;IACJ,2FAAkB,CAAA;IAClB,yFAAiB,CAAA;IACjB,qFAAe,CAAA;AACjB,CAAC,EALW,oBAAoB,KAApB,oBAAoB,QAK/B;AAED,MAAM,CAAC,MAAM,gBAAgB,GAExB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACjB,OAAO,CACL;QACG,KAAK,CAAC,IAAI,KAAK,oBAAoB,CAAC,kBAAkB,IAAI,CACzD,oBAAC,yBAAyB,IAAC,IAAI,EAAE,KAAK,CAAC,OAAO,GAAI,CACnD;QACA,KAAK,CAAC,IAAI,KAAK,oBAAoB,CAAC,iBAAiB,IAAI,CACxD,oBAAC,oBAAoB,OAAG,CACzB;QACA,KAAK,CAAC,IAAI,KAAK,oBAAoB,CAAC,eAAe,IAAI,CACtD,oBAAC,kBAAkB,IAAC,IAAI,EAAE,KAAK,CAAC,OAAO,GAAI,CAC5C,CACA,CACJ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,yBAAyB,GAE1B,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IAChB,OAAO,CACL,oBAAC,mBAAmB;QAClB,oBAAC,eAAe,OAAG;QACnB,oBAAC,uBAAuB;YACtB,oBAAC,kBAAkB,QAAE,IAAI,CAAsB;YAC/C,oBAAC,qBAAqB,OAAG,CACD,CACN,CACvB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,oBAAoB,GAAa,GAAG,EAAE;IAC1C,OAAO,CACL,oBAAC,qBAAqB;QACpB,oBAAC,YAAY,IACX,IAAI,EAAE,gBAAgB,CAAC,OAAO,EAC9B,eAAe,EAAE,IAAI,EACrB,aAAa,EAAE;gBACb,IAAI,EAAE,IAAI;aACX,iCAGY,CACO,CACzB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,kBAAkB,GAEnB,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IAChB,OAAO,CACL,oBAAC,qBAAqB;QACpB,oBAAC,YAAY,IACX,IAAI,EAAE,gBAAgB,CAAC,OAAO,EAC9B,eAAe,EAAE,IAAI,EACrB,aAAa,EAAE;gBACb,IAAI,EAAE,IAAI;aACX;;YAEc,IAAI,CACN,CACO,CACzB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAGvC,CAAA;AAED,MAAM,mBAAmB,GAAG,MAAM,CAAC,aAAa,CAAC,CAAA;;CAEhD,CAAA;AAED,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAGzC,CAAA;AAED,MAAM,kBAAkB,GAAG,MAAM,CAAC,YAAY,CAAC,CAAA;;CAE9C,CAAA;AAED,MAAM,qBAAqB,GAAa,GAAG,EAAE;IAC3C,OAAO,CACL,oBAAC,cAAc;QACb,oBAAC,GAAG,IAAC,SAAS,EAAC,MAAM,GAAO;QAC5B,oBAAC,GAAG,IAAC,SAAS,EAAC,MAAM,GAAO,CACb,CAClB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA;gBACjB,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,QAAQ;;;;;;;;;CAShE,CAAA;AACD,MAAM,GAAG,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4FrB,CAAA"}

package/dist/es/components/FileManager/FileTypeIcon.js

@@ -0,0 +1,17 @@
+import { FileCorruptedIcon, FileMainDocumentIcon, FileUnknownIcon, getFileIcon, } from '@manuscripts/style-guide';
+import React from 'react';
+/**
+ * Each file item has an icon to represent besides the file info based on the file extension,
+ * in case the file type is an image or video then the icon should be the preview image or video thumbnail.
+ */
+export const FileTypeIcon = ({ file }) => {
+    if (file.type.id === 'missing') {
+        return React.createElement(FileCorruptedIcon, { className: "file-icon" });
+    }
+    if (file.type.id === 'main-manuscript') {
+        return React.createElement(FileMainDocumentIcon, { className: "file-icon" });
+    }
+    const icon = getFileIcon(file.name);
+    return icon || React.createElement(FileUnknownIcon, { className: "file-icon" });
+};
+//# sourceMappingURL=FileTypeIcon.js.map

package/dist/es/components/FileManager/FileTypeIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileTypeIcon.js","sourceRoot":"","sources":["../../../../src/components/FileManager/FileTypeIcon.tsx"],"names":[],"mappings":"AAYA,OAAO,EACL,iBAAiB,EACjB,oBAAoB,EACpB,eAAe,EACf,WAAW,GACZ,MAAM,0BAA0B,CAAA;AACjC,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB;;;GAGG;AACH,MAAM,CAAC,MAAM,YAAY,GAEpB,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IAChB,IAAI,IAAI,CAAC,IAAI,CAAC,EAAE,KAAK,SAAS,EAAE;QAC9B,OAAO,oBAAC,iBAAiB,IAAC,SAAS,EAAC,WAAW,GAAG,CAAA;KACnD;IACD,IAAI,IAAI,CAAC,IAAI,CAAC,EAAE,KAAK,iBAAiB,EAAE;QACtC,OAAO,oBAAC,oBAAoB,IAAC,SAAS,EAAC,WAAW,GAAG,CAAA;KACtD;IAED,MAAM,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAEnC,OAAO,IAAI,IAAI,oBAAC,eAAe,IAAC,SAAS,EAAC,WAAW,GAAG,CAAA;AAC1D,CAAC,CAAA"}

package/dist/es/components/FileManager/FileUploader.js

@@ -0,0 +1,73 @@
+/*!
+ * The contents of this file are subject to the Common Public Attribution License Version 1.0 (the “License”); you may not use this file except in compliance with the License. You may obtain a copy of the License at https://mpapp-public.gitlab.io/manuscripts-frontend/LICENSE. The License is based on the Mozilla Public License Version 1.1 but Sections 14 and 15 have been added to cover use of software over a computer network and provide for limited attribution for the Original Developer. In addition, Exhibit A has been modified to be consistent with Exhibit B.
+ *
+ * Software distributed under the License is distributed on an “AS IS” basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the specific language governing rights and limitations under the License.
+ *
+ * The Original Code is manuscripts-frontend.
+ *
+ * The Original Developer is the Initial Developer. The Initial Developer of the Original Code is Atypon Systems LLC.
+ *
+ * All portions of the code written by Atypon Systems LLC are Copyright (c) 2024 Atypon Systems LLC. All Rights Reserved.
+ */
+import React, { useRef } from 'react';
+import { useDrop } from 'react-dnd';
+import { NativeTypes } from 'react-dnd-html5-backend';
+import styled, { css } from 'styled-components';
+/**
+ * This component will show the drag or upload file area
+ */
+export const FileUploader = ({ onUpload }) => {
+    const fileInputRef = useRef(null);
+    const openFileDialog = () => {
+        if (fileInputRef && fileInputRef.current) {
+            fileInputRef.current.click();
+        }
+    };
+    const handleChange = (event) => {
+        if (event && event.target && event.target.files) {
+            const file = event.target.files[0];
+            onUpload(file);
+        }
+    };
+    const [{ canDrop, isOver }, dropRef] = useDrop({
+        accept: [NativeTypes.FILE],
+        drop: (item) => {
+            const file = item.files[0];
+            onUpload(file);
+        },
+        collect: (monitor) => ({
+            isOver: monitor.isOver(),
+            canDrop: monitor.canDrop(),
+        }),
+    });
+    const isActive = canDrop && isOver;
+    return (React.createElement(Container, { ref: dropRef, "data-cy": "file-uploader", active: isActive, onClick: openFileDialog },
+        React.createElement("input", { ref: fileInputRef, type: "file", style: { display: 'none' }, onChange: handleChange, value: '' }),
+        "Drag or click to upload a new file"));
+};
+const activeBoxStyle = css `
+  background: #f2fbfc;
+  border: 1px dashed #bce7f6;
+`;
+const Container = styled.div `
+  background: ${(props) => props.theme.colors.background.secondary};
+  border: 1px dashed #e2e2e2;
+  box-sizing: border-box;
+  border-radius: 8px;
+  height: 80px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 14px;
+  line-height: 24px;
+  font-family: ${(props) => props.theme.font.family.Lato};
+  color: ${(props) => props.theme.colors.text.onLight};
+  cursor: pointer;
+  margin: 16px 16px 8px;
+  ${(props) => props.active
+    ? css `
+          ${activeBoxStyle}
+        `
+    : css ``}
+`;
+//# sourceMappingURL=FileUploader.js.map

package/dist/es/components/FileManager/FileUploader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileUploader.js","sourceRoot":"","sources":["../../../../src/components/FileManager/FileUploader.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,KAAK,EAAE,EAAe,MAAM,EAAE,MAAM,OAAO,CAAA;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AACrD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAU/C;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACxE,MAAM,YAAY,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAA;IAEnD,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,IAAI,YAAY,IAAI,YAAY,CAAC,OAAO,EAAE;YACxC,YAAY,CAAC,OAAO,CAAC,KAAK,EAAE,CAAA;SAC7B;IACH,CAAC,CAAA;IACD,MAAM,YAAY,GAAG,CAAC,KAAoC,EAAE,EAAE;QAC5D,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE;YAC/C,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;YAClC,QAAQ,CAAC,IAAI,CAAC,CAAA;SACf;IACH,CAAC,CAAA;IAED,MAAM,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,OAAO,CAAC,GAAG,OAAO,CAAC;QAC7C,MAAM,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC;QAC1B,IAAI,EAAE,CAAC,IAAW,EAAE,EAAE;YACpB,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;YAC1B,QAAQ,CAAC,IAAI,CAAC,CAAA;QAChB,CAAC;QACD,OAAO,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;YACrB,MAAM,EAAE,OAAO,CAAC,MAAM,EAAE;YACxB,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE;SAC3B,CAAC;KACH,CAAC,CAAA;IAEF,MAAM,QAAQ,GAAG,OAAO,IAAI,MAAM,CAAA;IAElC,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,OAAO,aACJ,eAAe,EACvB,MAAM,EAAE,QAAQ,EAChB,OAAO,EAAE,cAAc;QAEvB,+BACE,GAAG,EAAE,YAAY,EACjB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAC1B,QAAQ,EAAE,YAAY,EACtB,KAAK,EAAE,EAAE,GACT;6CAEQ,CACb,CAAA;AACH,CAAC,CAAA;AAED,MAAM,cAAc,GAAG,GAAG,CAAA;;;CAGzB,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAqB;gBACjC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,SAAS;;;;;;;;;;iBAUjD,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI;WAC7C,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO;;;IAGjD,CAAC,KAAK,EAAE,EAAE,CACV,KAAK,CAAC,MAAM;IACV,CAAC,CAAC,GAAG,CAAA;YACC,cAAc;SACjB;IACH,CAAC,CAAC,GAAG,CAAA,EAAE;CACZ,CAAA"}

package/dist/es/components/FileManager/InlineFilesSection.js

@@ -0,0 +1,128 @@
+/*!
+ * The contents of this file are subject to the Common Public Attribution License Version 1.0 (the “License”); you may not use this file except in compliance with the License. You may obtain a copy of the License at https://mpapp-public.gitlab.io/manuscripts-frontend/LICENSE. The License is based on the Mozilla Public License Version 1.1 but Sections 14 and 15 have been added to cover use of software over a computer network and provide for limited attribution for the Original Developer. In addition, Exhibit A has been modified to be consistent with Exhibit B.
+ *
+ * Software distributed under the License is distributed on an “AS IS” basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the specific language governing rights and limitations under the License.
+ *
+ * The Original Code is manuscripts-frontend.
+ *
+ * The Original Developer is the Initial Developer. The Initial Developer of the Original Code is Atypon Systems LLC.
+ *
+ * All portions of the code written by Atypon Systems LLC are Copyright (c) 2024 Atypon Systems LLC. All Rights Reserved.
+ */
+import { findAbstractsNode, } from '@manuscripts/body-editor';
+import { FileType, getFileTypeIcon } from '@manuscripts/style-guide';
+import { schema } from '@manuscripts/transform';
+import { NodeSelection } from 'prosemirror-state';
+import { findChildrenByType } from 'prosemirror-utils';
+import React, { useMemo } from 'react';
+import styled from 'styled-components';
+import { useStore } from '../../store';
+import { FileActions } from './FileActions';
+import { FileContainer } from './FileContainer';
+import { FileCreatedDate } from './FileCreatedDate';
+import { FileSectionType } from './FileManager';
+import { FileName } from './FileName';
+const findGraphicalAbstractFigureElement = (doc) => {
+    const abstracts = findAbstractsNode(doc);
+    return findChildrenByType(abstracts.node, schema.nodes.figure_element)[0];
+};
+export const InlineFilesSection = ({ elements, }) => {
+    const [{ view, fileManagement }] = useStore((s) => ({
+        view: s.view,
+        fileManagement: s.fileManagement,
+    }));
+    const ga = useMemo(() => findGraphicalAbstractFigureElement(view.state.doc), [view.state.doc]);
+    const handleClick = (element) => {
+        const tr = view.state.tr;
+        tr.setSelection(NodeSelection.create(view.state.doc, element.pos));
+        tr.scrollIntoView();
+        view.focus();
+        view.dispatch(tr);
+    };
+    const handleDetach = async (figure) => {
+        const tr = view.state.tr;
+        tr.setNodeAttribute(figure.pos, 'src', '');
+        tr.setSelection(NodeSelection.create(view.state.doc, figure.pos));
+        tr.scrollIntoView();
+        view.focus();
+        view.dispatch(tr);
+    };
+    const handleReplace = async (figure, file) => {
+        const uploaded = await fileManagement.upload(file);
+        const tr = view.state.tr;
+        tr.setNodeAttribute(figure.pos, 'src', uploaded.id);
+        tr.setSelection(NodeSelection.create(view.state.doc, figure.pos));
+        tr.scrollIntoView();
+        view.focus();
+        view.dispatch(tr);
+    };
+    const getElementFileType = (element) => {
+        if (element.node.attrs.id === ga?.node.attrs.id) {
+            return FileType.GraphicalAbstract;
+        }
+        return FileType.Figure;
+    };
+    const getElementFileLabel = (index) => {
+        if (index === 0 && ga) {
+            return 'Graphical Abstract';
+        }
+        if (!ga) {
+            index++;
+        }
+        return `Figure ${index}`;
+    };
+    return (React.createElement(React.Fragment, null, elements.map((element, index) => (React.createElement(Element, { key: index, onClick: () => handleClick(element) },
+        React.createElement(ElementLabelContainer, null,
+            getFileTypeIcon(getElementFileType(element)),
+            React.createElement(ElementLabel, null, getElementFileLabel(index))),
+        React.createElement(ElementFilesContainer, { "data-cy": "file-elements-container" }, element.files?.map((figure) => (React.createElement(ElementFile, { key: figure.file.id, figure: figure, onReplace: async (f) => await handleReplace(figure, f), onDetach: async () => await handleDetach(figure), onDownload: () => fileManagement.download(figure.file) })))))))));
+};
+const ElementFile = ({ figure, onDownload, onReplace, onDetach }) => {
+    return (React.createElement(ModelFileContainer, { "data-cy": "file-container" },
+        React.createElement(FileName, { file: figure.file }),
+        React.createElement(FileCreatedDate, { file: figure.file, className: "show-on-hover" }),
+        React.createElement(FileActions, { "data-cy": "file-actions", sectionType: FileSectionType.Inline, onDownload: figure.file ? onDownload : undefined, onDetach: figure.file ? onDetach : undefined, onReplace: onReplace })));
+};
+const Element = styled.div `
+  display: flex;
+  flex-direction: column;
+  padding: 0;
+
+  border-bottom: 1px dashed #f0f0f0;
+
+  svg {
+    width: 24px;
+  }
+
+  :last-child {
+    border-bottom: 0;
+  }
+`;
+const ElementLabelContainer = styled.div `
+  display: flex;
+  padding: 20px 16px;
+  cursor: pointer;
+`;
+const ElementLabel = styled.div `
+  color: ${(props) => props.theme.colors.text.primary};
+  font-weight: bold;
+  font-size: 16px;
+  line-height: 20px;
+  white-space: nowrap;
+  margin-left: ${(props) => props.theme.grid.unit * 2}px;
+`;
+const ElementFilesContainer = styled.div `
+  width: 100%;
+  > :last-child {
+    margin-bottom: 25px;
+  }
+`;
+const ModelFileContainer = styled(FileContainer) `
+  padding: 8px 16px;
+  height: 40px;
+
+  path {
+    fill: #6e6e6e;
+  }
+`;
+//# sourceMappingURL=InlineFilesSection.js.map

package/dist/es/components/FileManager/InlineFilesSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineFilesSection.js","sourceRoot":"","sources":["../../../../src/components/FileManager/InlineFilesSection.tsx"],"names":[],"mappings":"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"}

package/dist/es/components/FileManager/OtherFilesSection.js

@@ -0,0 +1,82 @@
+/*!
+ * The contents of this file are subject to the Common Public Attribution License Version 1.0 (the “License”); you may not use this file except in compliance with the License. You may obtain a copy of the License at https://mpapp-public.gitlab.io/manuscripts-frontend/LICENSE. The License is based on the Mozilla Public License Version 1.1 but Sections 14 and 15 have been added to cover use of software over a computer network and provide for limited attribution for the Original Developer. In addition, Exhibit A has been modified to be consistent with Exhibit B.
+ *
+ * Software distributed under the License is distributed on an “AS IS” basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the specific language governing rights and limitations under the License.
+ *
+ * The Original Code is manuscripts-frontend.
+ *
+ * The Original Developer is the Initial Developer. The Initial Developer of the Original Code is Atypon Systems LLC.
+ *
+ * All portions of the code written by Atypon Systems LLC are Copyright (c) 2024 Atypon Systems LLC. All Rights Reserved.
+ */
+import { insertSupplement } from '@manuscripts/body-editor';
+import { usePermissions } from '@manuscripts/style-guide';
+import React, { useEffect, useState } from 'react';
+import { useDrag } from 'react-dnd';
+import { getEmptyImage } from 'react-dnd-html5-backend';
+import { useStore } from '../../store';
+import { FileActions } from './FileActions';
+import { FileContainer } from './FileContainer';
+import { FileCreatedDate } from './FileCreatedDate';
+import { FileSectionType } from './FileManager';
+import { FileName } from './FileName';
+import { FileSectionAlert, FileSectionAlertType } from './FileSectionAlert';
+import { FileUploader } from './FileUploader';
+/**
+ *  This component represents the other files in the file section.
+ */
+export const OtherFilesSection = ({ files }) => {
+    const [{ view, fileManagement }] = useStore((s) => ({
+        view: s.view,
+        fileManagement: s.fileManagement,
+    }));
+    const can = usePermissions();
+    const [alert, setAlert] = useState({
+        type: FileSectionAlertType.NONE,
+        message: '',
+    });
+    const handleUpload = async (file) => {
+        setAlert({
+            type: FileSectionAlertType.UPLOAD_IN_PROGRESS,
+            message: file.name,
+        });
+        await fileManagement.upload(file);
+        setAlert({
+            type: FileSectionAlertType.UPLOAD_SUCCESSFUL,
+            message: '',
+        });
+    };
+    const moveToSupplements = async (file) => {
+        insertSupplement(file, view.state, view.dispatch);
+        setAlert({
+            type: FileSectionAlertType.MOVE_SUCCESSFUL,
+            message: FileSectionType.Supplements,
+        });
+    };
+    return (React.createElement("div", null,
+        can?.uploadFile && React.createElement(FileUploader, { onUpload: handleUpload }),
+        React.createElement(FileSectionAlert, { alert: alert }),
+        files.map((file) => (React.createElement(OtherFile, { key: file.id, file: file, onDownload: () => fileManagement.download(file), onMoveToSupplements: async () => await moveToSupplements(file) })))));
+};
+const OtherFile = ({ file, onDownload, onMoveToSupplements }) => {
+    const [{ isDragging }, dragRef, preview] = useDrag({
+        type: 'file',
+        item: {
+            file,
+        },
+        collect: (monitor) => ({
+            isDragging: monitor.isDragging(),
+        }),
+    });
+    useEffect(() => {
+        preview(getEmptyImage());
+    }, [preview]);
+    return (React.createElement(FileContainer, { key: file.id, "data-cy": "file-container", ref: dragRef, className: isDragging ? 'dragging' : '' },
+        React.createElement(FileName, { file: file }),
+        React.createElement(FileCreatedDate, { file: file, className: "show-on-hover" }),
+        React.createElement(FileActions, { sectionType: FileSectionType.OtherFile, onDownload: onDownload, move: {
+                sectionType: FileSectionType.Supplements,
+                handler: onMoveToSupplements,
+            } })));
+};
+//# sourceMappingURL=OtherFilesSection.js.map

package/dist/es/components/FileManager/OtherFilesSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OtherFilesSection.js","sourceRoot":"","sources":["../../../../src/components/FileManager/OtherFilesSection.tsx"],"names":[],"mappings":"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"}