@manuscripts/style-guide 0.30.27 → 0.31.2

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.
Files changed (41) hide show
  1. package/dist/cjs/components/FileManager/FileManager.js +14 -2
  2. package/dist/cjs/components/FileManager/FileSectionItem/DesignationActions.js +15 -3
  3. package/dist/cjs/components/FileManager/FileSectionItem/FileInfo.js +1 -4
  4. package/dist/cjs/components/FileManager/InlineFilesSection.js +1 -3
  5. package/dist/cjs/components/Resizer/Resizer.js +109 -0
  6. package/dist/cjs/components/Resizer/ResizerButton.js +30 -0
  7. package/dist/cjs/components/Resizer/ResizerButtonInner.js +169 -0
  8. package/dist/cjs/components/Resizer/ResizerInner.js +74 -0
  9. package/dist/cjs/components/Resizer/index.js +16 -0
  10. package/dist/cjs/components/Resizer/types.js +2 -0
  11. package/dist/cjs/components/icons/index.js +3 -1
  12. package/dist/cjs/components/icons/missing-image.js +12 -0
  13. package/dist/cjs/index.js +4 -1
  14. package/dist/cjs/lib/inlineFiles.js +65 -41
  15. package/dist/es/components/FileManager/FileManager.js +15 -3
  16. package/dist/es/components/FileManager/FileSectionItem/DesignationActions.js +15 -3
  17. package/dist/es/components/FileManager/FileSectionItem/FileInfo.js +1 -4
  18. package/dist/es/components/FileManager/InlineFilesSection.js +3 -5
  19. package/dist/es/components/Resizer/Resizer.js +102 -0
  20. package/dist/es/components/Resizer/ResizerButton.js +23 -0
  21. package/dist/es/components/Resizer/ResizerButtonInner.js +163 -0
  22. package/dist/es/components/Resizer/ResizerInner.js +68 -0
  23. package/dist/es/components/Resizer/index.js +2 -0
  24. package/dist/es/components/Resizer/types.js +1 -0
  25. package/dist/es/components/icons/index.js +1 -0
  26. package/dist/es/components/icons/missing-image.js +7 -0
  27. package/dist/es/index.js +2 -0
  28. package/dist/es/lib/inlineFiles.js +66 -42
  29. package/dist/types/components/FileManager/FileSectionItem/DesignationActions.d.ts +2 -0
  30. package/dist/types/components/FileManager/InlineFilesSection.d.ts +8 -3
  31. package/dist/types/components/Form.d.ts +1 -1
  32. package/dist/types/components/Resizer/Resizer.d.ts +36 -0
  33. package/dist/types/components/Resizer/ResizerButton.d.ts +18 -0
  34. package/dist/types/components/Resizer/ResizerButtonInner.d.ts +8 -0
  35. package/dist/types/components/Resizer/ResizerInner.d.ts +4 -0
  36. package/dist/types/components/Resizer/index.d.ts +2 -0
  37. package/dist/types/components/Resizer/types.d.ts +2 -0
  38. package/dist/types/components/icons/index.d.ts +1 -0
  39. package/dist/types/components/icons/missing-image.d.ts +3 -0
  40. package/dist/types/index.d.ts +2 -0
  41. package/package.json +2 -2
@@ -34,6 +34,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
34
34
  exports.FileManager = exports.PermissionsContext = void 0;
35
35
  const react_1 = __importStar(require("react"));
36
36
  const react_tooltip_1 = __importDefault(require("react-tooltip"));
37
+ const inlineFiles_1 = __importDefault(require("../../lib/inlineFiles"));
37
38
  const AlertMessage_1 = require("../AlertMessage");
38
39
  const Inspector_1 = require("../Inspector");
39
40
  const InspectorSection_1 = require("../InspectorSection");
@@ -74,13 +75,24 @@ const FileManager = ({ submissionId, attachments, modelMap, enableDragAndDrop, c
74
75
  const handleDownloadFile = (0, react_1.useCallback)((publicUrl) => {
75
76
  return handleDownload(publicUrl);
76
77
  }, [handleDownload]);
78
+ const inlineFiles = (0, react_1.useMemo)(() => (0, inlineFiles_1.default)(modelMap, attachments), [modelMap.values(), attachments]);
79
+ const inlineAttachmentsIds = (0, react_1.useMemo)(() => {
80
+ const attachmentsIDs = new Set();
81
+ inlineFiles.map(({ attachments }) => {
82
+ if (attachments) {
83
+ attachments.map((attachment) => attachmentsIDs.add(attachment.id));
84
+ }
85
+ });
86
+ return attachmentsIDs;
87
+ }, [inlineFiles]);
77
88
  const getFileSectionExternalFile = (fileSection) => {
78
89
  const isSupplementOrOtherFilesTab = fileSection === util_1.FileSectionType.Supplements ||
79
90
  fileSection === util_1.FileSectionType.OtherFile;
80
91
  const itemsData = attachments.filter((element) => {
81
92
  const designation = util_1.namesWithDesignationMap.get(element.type.label);
82
93
  return (designation !== undefined &&
83
- util_1.designationWithFileSectionsMap.get(designation) === fileSection);
94
+ util_1.designationWithFileSectionsMap.get(designation) === fileSection &&
95
+ !inlineAttachmentsIds.has(element.id));
84
96
  });
85
97
  const itemsDataWithTitle = (0, util_1.generateAttachmentsTitles)(itemsData, fileSection);
86
98
  const filesItems = itemsDataWithTitle.map((element) => {
@@ -130,7 +142,7 @@ const FileManager = ({ submissionId, attachments, modelMap, enableDragAndDrop, c
130
142
  react_1.default.createElement("div", null, "Files excluded from the final submission.")))),
131
143
  react_1.default.createElement(Inspector_1.InspectorTabPanels, { style: { overflowY: 'visible', position: 'relative' } },
132
144
  react_1.default.createElement(Inspector_1.InspectorTabPanel, null,
133
- react_1.default.createElement(InlineFilesSection_1.InlineFilesSection, { modelMap: modelMap, attachments: attachments, submissionId: submissionId, handleReplace: handleReplace, handleDownload: handleDownload, isEditor: enableDragAndDrop, dispatch: dispatch })),
145
+ react_1.default.createElement(InlineFilesSection_1.InlineFilesSection, { inlineFiles: inlineFiles, submissionId: submissionId, handleReplace: handleReplace, handleDownload: handleDownload, isEditor: enableDragAndDrop, dispatch: dispatch })),
134
146
  react_1.default.createElement(Inspector_1.InspectorTabPanel, null,
135
147
  react_1.default.createElement(FilesSection_1.FilesSection, { submissionId: submissionId, enableDragAndDrop: enableDragAndDrop, handleUpload: handleUploadFile, fileSection: util_1.FileSectionType.Supplements, filesItem: getFileSectionExternalFile(util_1.FileSectionType.Supplements), state: state, dispatch: dispatch })),
136
148
  react_1.default.createElement(Inspector_1.InspectorTabPanel, null,
@@ -24,12 +24,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
24
24
  Object.defineProperty(exports, "__esModule", { value: true });
25
25
  exports.DesignationActions = void 0;
26
26
  const react_1 = __importStar(require("react"));
27
+ const react_tooltip_1 = __importDefault(require("react-tooltip"));
27
28
  const styled_components_1 = __importDefault(require("styled-components"));
28
29
  const BottomArrowIcon_1 = __importDefault(require("../../icons/BottomArrowIcon"));
29
30
  const ConfirmationPopUp_1 = require("../ConfirmationPopUp");
31
+ const TooltipDiv_1 = require("../TooltipDiv");
30
32
  const util_1 = require("../util");
31
33
  const DesignationActionsList_1 = require("./DesignationActionsList");
32
- const DesignationActions = ({ designation, attachmentId, fileExtension, handleChangeDesignation, submissionId, fileName, dispatch, }) => {
34
+ const DesignationActions = ({ designation, attachmentId, fileExtension, handleChangeDesignation, submissionId, fileName, can, dispatch, }) => {
33
35
  const [isActionsShown, setIsActionsShown] = (0, react_1.useState)(false);
34
36
  const [confirmationPopUpData, setConfirmationPopUpData] = (0, react_1.useState)({
35
37
  isConfirmationPopUpOpen: false,
@@ -73,9 +75,12 @@ const DesignationActions = ({ designation, attachmentId, fileExtension, handleCh
73
75
  };
74
76
  return (react_1.default.createElement(react_1.default.Fragment, null,
75
77
  react_1.default.createElement(SecondaryActionsContainer, { onClick: toggleActionsList, onBlur: hideActionsList },
76
- react_1.default.createElement(SecondaryActionsText, null, util_1.designationWithReadableNamesMap.get(designation)),
78
+ !(can === null || can === void 0 ? void 0 : can.changeDesignation) && (react_1.default.createElement(TooltipContainer, null,
79
+ react_1.default.createElement(react_tooltip_1.default, { id: "file-designation", place: "bottom", offset: { bottom: -8 }, effect: "solid", className: "tooltip" },
80
+ react_1.default.createElement("div", null, "You don\u2019t have permissions to adjust this selection")))),
81
+ react_1.default.createElement(SecondaryActionsText, { "data-for": "file-designation", "data-tip": true }, util_1.designationWithReadableNamesMap.get(designation)),
77
82
  react_1.default.createElement(BottomArrowIcon_1.default, null),
78
- isActionsShown && (react_1.default.createElement(ActionsListContainer, null,
83
+ isActionsShown && (can === null || can === void 0 ? void 0 : can.changeDesignation) && (react_1.default.createElement(ActionsListContainer, null,
79
84
  react_1.default.createElement(DesignationActionsList_1.DesignationActionsList, { handleChangeDesignation: handleChangeDesignation, designationActionsList: designationActionsList, submissionId: submissionId, fileName: fileName, designation: designation, attachmentId: attachmentId, dispatch: dispatch, handleOpenConfirmationPopup: handleOpenConfirmationPopup })))),
80
85
  confirmationPopUpData.isConfirmationPopUpOpen && (react_1.default.createElement(ConfirmationPopUp_1.ConfirmationPopUp, { popupHeader: confirmationPopUpData.confirmationPopUpHeader !== undefined
81
86
  ? confirmationPopUpData.confirmationPopUpHeader
@@ -113,3 +118,10 @@ const ActionsListContainer = styled_components_1.default.div `
113
118
  top: 40px;
114
119
  z-index: 999;
115
120
  `;
121
+ const TooltipContainer = (0, styled_components_1.default)(TooltipDiv_1.TooltipDiv) `
122
+ .tooltip {
123
+ white-space: normal;
124
+ width: 144px;
125
+ height: 32px;
126
+ }
127
+ `;
@@ -31,10 +31,7 @@ const FileInfo = ({ showAttachmentName, showDesignationActions, title, submissio
31
31
  const fileName = submissionAttachmentName.substring(0, submissionAttachmentName.lastIndexOf('.'));
32
32
  const can = (0, react_1.useContext)(FileManager_1.PermissionsContext);
33
33
  return (react_1.default.createElement(exports.FileInfoContainer, null,
34
- (can === null || can === void 0 ? void 0 : can.changeDesignation) &&
35
- showDesignationActions &&
36
- designation !== undefined &&
37
- submissionId && (react_1.default.createElement(DesignationActions_1.DesignationActions, { designation: designation, attachmentId: attachmentId, fileExtension: fileExtension, handleChangeDesignation: handleChangeDesignation, submissionId: submissionId, fileName: submissionAttachmentName, dispatch: dispatch })),
34
+ showDesignationActions && designation !== undefined && submissionId && (react_1.default.createElement(DesignationActions_1.DesignationActions, { designation: designation, attachmentId: attachmentId, fileExtension: fileExtension, handleChangeDesignation: handleChangeDesignation, submissionId: submissionId, fileName: submissionAttachmentName, dispatch: dispatch, can: can })),
38
35
  react_1.default.createElement(exports.FileNameTitleContainer, null,
39
36
  react_1.default.createElement(exports.FileTitle, null,
40
37
  !showAttachmentName ? fileName : title,
@@ -26,14 +26,12 @@ exports.InlineFilesSection = void 0;
26
26
  const react_1 = __importStar(require("react"));
27
27
  const styled_components_1 = __importDefault(require("styled-components"));
28
28
  const use_dropdown_1 = require("../../hooks/use-dropdown");
29
- const inlineFiles_1 = __importDefault(require("../../lib/inlineFiles"));
30
29
  const dots_icon_1 = __importDefault(require("../icons/dots-icon"));
31
30
  const FileInfo_1 = require("./FileSectionItem/FileInfo");
32
31
  const FileSectionItem_1 = require("./FileSectionItem/FileSectionItem");
33
32
  const ItemActions_1 = require("./FileSectionItem/ItemActions");
34
33
  const util_1 = require("./util");
35
- const InlineFilesSection = ({ submissionId, handleReplace, handleDownload, modelMap, attachments, isEditor, dispatch, }) => {
36
- const inlineFiles = (0, react_1.useMemo)(() => (0, inlineFiles_1.default)(modelMap, attachments), [modelMap, attachments]);
34
+ const InlineFilesSection = ({ submissionId, handleReplace, handleDownload, inlineFiles, isEditor, dispatch, }) => {
37
35
  const onElementClick = (0, react_1.useCallback)((e) => {
38
36
  if (!isEditor) {
39
37
  return;
@@ -0,0 +1,109 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.Resizer = void 0;
7
+ const react_1 = __importDefault(require("react"));
8
+ const ResizerButton_1 = require("./ResizerButton");
9
+ const ResizerInner_1 = require("./ResizerInner");
10
+ const inners = {
11
+ column: {
12
+ end: ResizerInner_1.VerticalEndResizerInner,
13
+ start: ResizerInner_1.VerticalStartResizerInner,
14
+ },
15
+ row: {
16
+ end: ResizerInner_1.HorizontalEndResizerInner,
17
+ start: ResizerInner_1.HorizontalStartResizerInner,
18
+ },
19
+ };
20
+ class Resizer extends react_1.default.Component {
21
+ constructor() {
22
+ super(...arguments);
23
+ this.resizerRef = react_1.default.createRef();
24
+ this.state = {
25
+ isHovering: false,
26
+ isResizing: false,
27
+ startPosition: 0,
28
+ };
29
+ this.scheduleResize = (delta) => {
30
+ if (this.state.isResizing && delta) {
31
+ this.props.onResize(delta);
32
+ }
33
+ };
34
+ this.mouseDownHandler = (e) => {
35
+ e.preventDefault();
36
+ if (!this.resizerRef.current || e.target !== this.resizerRef.current) {
37
+ return;
38
+ }
39
+ if (this.state.isResizing) {
40
+ return;
41
+ }
42
+ this.setState({
43
+ isResizing: true,
44
+ startPosition: this.getPosition(e),
45
+ });
46
+ window.addEventListener('mousemove', this.mouseMoveHandler);
47
+ window.addEventListener('mouseup', this.mouseUpHandler);
48
+ window.addEventListener('mouseout', this.handleOutofBounds);
49
+ };
50
+ this.mouseUpHandler = (e, outOfBounds = false) => {
51
+ window.removeEventListener('mousemove', this.mouseMoveHandler);
52
+ window.removeEventListener('mouseup', this.mouseUpHandler);
53
+ window.removeEventListener('mouseout', this.handleOutofBounds);
54
+ this.setState({
55
+ isResizing: false,
56
+ });
57
+ const position = this.getPosition(e);
58
+ const adjustedPosition = outOfBounds ? position - 32 : position;
59
+ const delta = this.getDelta(adjustedPosition);
60
+ if (delta === 0) {
61
+ this.props.onResizeButton();
62
+ }
63
+ this.props.onResize(delta);
64
+ this.props.onResizeEnd(delta);
65
+ };
66
+ this.mouseMoveHandler = (e) => {
67
+ const position = this.getPosition(e);
68
+ const delta = this.getDelta(position);
69
+ this.scheduleResize(delta);
70
+ };
71
+ this.mouseEnterHandler = () => {
72
+ this.setState({
73
+ isHovering: true,
74
+ });
75
+ };
76
+ this.mouseLeaveHandler = () => {
77
+ this.setState({
78
+ isHovering: false,
79
+ });
80
+ };
81
+ this.handleOutofBounds = (e) => {
82
+ const disableResizeNodes = [
83
+ 'IFRAME',
84
+ 'HTML',
85
+ null,
86
+ ];
87
+ if (this.state.isResizing &&
88
+ disableResizeNodes.includes(e.relatedTarget && e.relatedTarget.nodeName)) {
89
+ this.mouseUpHandler(e, true);
90
+ }
91
+ };
92
+ this.getDelta = (delta) => {
93
+ const { startPosition } = this.state;
94
+ return this.props.side === 'end'
95
+ ? delta - startPosition
96
+ : startPosition - delta;
97
+ };
98
+ this.getPosition = (e) => {
99
+ return this.props.direction === 'row' ? e.screenX : e.screenY;
100
+ };
101
+ }
102
+ render() {
103
+ const { buttonInner, direction, side } = this.props;
104
+ const ResizerInner = inners[direction][side];
105
+ return (react_1.default.createElement(ResizerInner, { ref: this.resizerRef, onMouseDown: this.mouseDownHandler, onMouseEnter: this.mouseEnterHandler, onMouseLeave: this.mouseLeaveHandler },
106
+ react_1.default.createElement(ResizerButton_1.ResizerButton, { direction: direction, isCollapsed: this.props.collapsed, isVisible: this.state.isHovering, onClick: this.props.onResizeButton, side: side, buttonInner: buttonInner })));
107
+ }
108
+ }
109
+ exports.Resizer = Resizer;
@@ -0,0 +1,30 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.ResizerButton = void 0;
7
+ const react_1 = __importDefault(require("react"));
8
+ const ResizerButtonInner_1 = require("./ResizerButtonInner");
9
+ const inners = {
10
+ column: {
11
+ end: ResizerButtonInner_1.VerticalEndResizerButtonInner,
12
+ start: ResizerButtonInner_1.VerticalStartResizerButtonInner,
13
+ },
14
+ row: {
15
+ end: ResizerButtonInner_1.HorizontalEndResizerButtonInner,
16
+ start: ResizerButtonInner_1.HorizontalStartResizerButtonInner,
17
+ },
18
+ };
19
+ class ResizerButton extends react_1.default.PureComponent {
20
+ render() {
21
+ const { buttonInner, direction, side, isCollapsed, onClick, isVisible } = this.props;
22
+ const ResizerButtonInner = buttonInner || inners[direction][side];
23
+ return (react_1.default.createElement(ResizerButtonInner, { "aria-expanded": !isCollapsed, isCollapsed: isCollapsed, isVisible: isVisible, onClick: onClick, onMouseDown: (event) => event.preventDefault() }));
24
+ }
25
+ }
26
+ exports.ResizerButton = ResizerButton;
27
+ ResizerButton.defaultProps = {
28
+ isCollapsed: false,
29
+ isVisible: false,
30
+ };
@@ -0,0 +1,169 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VerticalStartResizerButtonInner = exports.VerticalEndResizerButtonInner = exports.HorizontalStartResizerButtonInner = exports.HorizontalEndResizerButtonInner = void 0;
7
+ const styled_components_1 = __importDefault(require("styled-components"));
8
+ const gridSize = 8;
9
+ const resizerVisibleSize = 2;
10
+ const toggleButtonDepth = gridSize * 4.5;
11
+ const toggleArrowDepth = gridSize * 2;
12
+ const toggleArrowSize = 2;
13
+ const toggleArrowStartOffset = (toggleButtonDepth - toggleArrowDepth) / 2;
14
+ const toggleArrowEndOffset = toggleArrowStartOffset - toggleArrowSize + toggleArrowDepth / 2;
15
+ const opacityTransition = `opacity 200ms ease-in-out 100ms`;
16
+ const transformTransition = `transform 100ms ease-in-out`;
17
+ const ResizerButtonInner = styled_components_1.default.button `
18
+ position: relative;
19
+ background: none;
20
+ border: none;
21
+ color: transparent;
22
+ cursor: pointer;
23
+
24
+ &:focus {
25
+ outline: 1px solid blue;
26
+ }
27
+
28
+ &::before,
29
+ &::after {
30
+ content: '';
31
+ background-color: #ddd;
32
+ border-radius: ${toggleArrowDepth}px;
33
+ position: absolute;
34
+ opacity: ${(props) => (props.isVisible ? 1 : 0.5)};
35
+ transition: ${transformTransition}, ${opacityTransition};
36
+ }
37
+
38
+ &::before {
39
+ transform-origin: ${toggleArrowSize / 2}px
40
+ ${toggleArrowDepth / 2 - toggleArrowSize / 2}px;
41
+ }
42
+
43
+ &::after {
44
+ transform-origin: ${toggleArrowSize / 2}px ${toggleArrowSize / 2}px;
45
+ }
46
+
47
+ &:hover,
48
+ &:focus {
49
+ &::before,
50
+ &::after {
51
+ background-color: #2a6f9d;
52
+ opacity: 1;
53
+ }
54
+ }
55
+ `;
56
+ const HorizontalResizerButtonInner = (0, styled_components_1.default)(ResizerButtonInner) `
57
+ top: calc(50% - ${toggleButtonDepth / 2}px);
58
+ width: ${gridSize * 3}px;
59
+ height: ${toggleButtonDepth}px;
60
+
61
+ &::before,
62
+ &::after {
63
+ width: ${toggleArrowSize}px;
64
+ height: ${toggleArrowDepth / 2}px;
65
+ transform: rotate(0deg);
66
+ }
67
+
68
+ &::before {
69
+ top: ${toggleArrowStartOffset}px;
70
+ }
71
+
72
+ &::after {
73
+ top: ${toggleArrowEndOffset}px;
74
+ }
75
+ `;
76
+ exports.HorizontalEndResizerButtonInner = (0, styled_components_1.default)(HorizontalResizerButtonInner) `
77
+ left: -${resizerVisibleSize / 2}px;
78
+
79
+ &::before,
80
+ &::after {
81
+ left: 8px;
82
+ }
83
+
84
+ &:hover,
85
+ &:focus {
86
+ &::before {
87
+ transform: rotate(${(props) => (props.isCollapsed ? '-40deg' : '40deg')});
88
+ }
89
+ &::after {
90
+ transform: rotate(${(props) => (props.isCollapsed ? '40deg' : '-40deg')});
91
+ }
92
+ }
93
+ `;
94
+ exports.HorizontalStartResizerButtonInner = (0, styled_components_1.default)(HorizontalResizerButtonInner) `
95
+ right: -${resizerVisibleSize / 2}px;
96
+
97
+ &::before,
98
+ &::after {
99
+ right: 16px;
100
+ }
101
+
102
+ &:hover,
103
+ &:focus {
104
+ &::before {
105
+ transform: rotate(${(props) => (props.isCollapsed ? '40deg' : '-40deg')});
106
+ }
107
+ &::after {
108
+ transform: rotate(${(props) => (props.isCollapsed ? '-40deg' : '40deg')});
109
+ }
110
+ }
111
+ `;
112
+ const VerticalResizerButtonInner = (0, styled_components_1.default)(ResizerButtonInner) `
113
+ left: calc(50% - ${toggleButtonDepth / 2}px);
114
+ width: ${toggleButtonDepth}px;
115
+ height: ${gridSize * 3}px;
116
+
117
+ &::before,
118
+ &::after {
119
+ width: ${toggleArrowDepth / 2}px;
120
+ height: ${toggleArrowSize}px;
121
+ }
122
+
123
+ &::before {
124
+ left: ${toggleArrowStartOffset}px;
125
+ }
126
+
127
+ &::after {
128
+ left: ${toggleArrowEndOffset}px;
129
+ }
130
+ `;
131
+ exports.VerticalEndResizerButtonInner = (0, styled_components_1.default)(VerticalResizerButtonInner) `
132
+ bottom: -${resizerVisibleSize / 2}px;
133
+
134
+ &::before,
135
+ &::after {
136
+ bottom: 8px;
137
+ transform-origin: top center;
138
+ }
139
+
140
+ &:hover,
141
+ &:focus {
142
+ &::before {
143
+ transform: rotate(${(props) => (props.isCollapsed ? '40deg' : '-40deg')});
144
+ }
145
+ &::after {
146
+ transform: rotate(${(props) => (props.isCollapsed ? '-40deg' : '40deg')});
147
+ }
148
+ }
149
+ `;
150
+ exports.VerticalStartResizerButtonInner = (0, styled_components_1.default)(VerticalResizerButtonInner) `
151
+ top: -${resizerVisibleSize / 2}px;
152
+
153
+ &::before,
154
+ &::after {
155
+ top: 8px;
156
+ transform: rotate(270deg);
157
+ transform-origin: bottom center;
158
+ }
159
+
160
+ &:hover,
161
+ &:focus {
162
+ &::before {
163
+ transform: rotate(${(props) => (props.isCollapsed ? '-40deg' : '40deg')});
164
+ }
165
+ &::after {
166
+ transform: rotate(${(props) => (props.isCollapsed ? '40deg' : '-40deg')});
167
+ }
168
+ }
169
+ `;
@@ -0,0 +1,74 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.VerticalEndResizerInner = exports.VerticalStartResizerInner = exports.HorizontalEndResizerInner = exports.HorizontalStartResizerInner = void 0;
7
+ const styled_components_1 = __importDefault(require("styled-components"));
8
+ const ResizerInner = styled_components_1.default.div `
9
+ display: block;
10
+ z-index: 2;
11
+ overflow: visible;
12
+ position: absolute;
13
+
14
+ &::before {
15
+ content: '';
16
+ position: absolute;
17
+ transition: background-color 200ms ease-in-out 100ms;
18
+ background: rgb(240, 240, 240);
19
+ }
20
+
21
+ &:hover::before {
22
+ background: #e2e2e2;
23
+ }
24
+ `;
25
+ const HorizontalResizerInner = (0, styled_components_1.default)(ResizerInner) `
26
+ cursor: ew-resize;
27
+ top: 0;
28
+ height: 100%;
29
+ width: 16px;
30
+
31
+ &::before {
32
+ height: 100%;
33
+ width: 1px;
34
+ }
35
+ `;
36
+ exports.HorizontalStartResizerInner = (0, styled_components_1.default)(HorizontalResizerInner) `
37
+ left: -16px;
38
+
39
+ &::before {
40
+ right: -1px;
41
+ }
42
+ `;
43
+ exports.HorizontalEndResizerInner = (0, styled_components_1.default)(HorizontalResizerInner) `
44
+ right: -16px;
45
+
46
+ &::before {
47
+ left: -1px;
48
+ }
49
+ `;
50
+ const VerticalResizerInner = (0, styled_components_1.default)(ResizerInner) `
51
+ cursor: ns-resize;
52
+ left: 0;
53
+ height: 16px;
54
+ width: 100%;
55
+
56
+ &::before {
57
+ width: 100%;
58
+ height: 1px;
59
+ }
60
+ `;
61
+ exports.VerticalStartResizerInner = (0, styled_components_1.default)(VerticalResizerInner) `
62
+ top: -16px;
63
+
64
+ &::before {
65
+ bottom: -1px;
66
+ }
67
+ `;
68
+ exports.VerticalEndResizerInner = (0, styled_components_1.default)(VerticalResizerInner) `
69
+ bottom: -16px;
70
+
71
+ &::before {
72
+ top: -1px;
73
+ }
74
+ `;
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
5
+ }) : (function(o, m, k, k2) {
6
+ if (k2 === undefined) k2 = k;
7
+ o[k2] = m[k];
8
+ }));
9
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
11
+ };
12
+ Object.defineProperty(exports, "__esModule", { value: true });
13
+ exports.Resizer = void 0;
14
+ var Resizer_1 = require("./Resizer");
15
+ Object.defineProperty(exports, "Resizer", { enumerable: true, get: function () { return Resizer_1.Resizer; } });
16
+ __exportStar(require("./types"), exports);
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -18,7 +18,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
18
18
  return (mod && mod.__esModule) ? mod : { "default": mod };
19
19
  };
20
20
  Object.defineProperty(exports, "__esModule", { value: true });
21
- exports.UploadIcon = exports.AttachIcon = exports.TaskStepNextIcon = exports.TaskStepDoneIcon = exports.TaskStepCurrentIcon = exports.ZoomOutIcon = exports.ZoomInIcon = exports.UserIcon = exports.TickMarkIcon = exports.SearchIcon = exports.ProjectsListIcon = exports.ProjectIcon = exports.ProjectNotificationIcon = exports.OrcidIcon = exports.GoogleIcon = exports.CloseOIcon = exports.BookmarkIcon = exports.BackArrowIcon = exports.AddIconInverted = exports.AddIconActive = exports.AddAuthor = void 0;
21
+ exports.MissingImage = exports.UploadIcon = exports.AttachIcon = exports.TaskStepNextIcon = exports.TaskStepDoneIcon = exports.TaskStepCurrentIcon = exports.ZoomOutIcon = exports.ZoomInIcon = exports.UserIcon = exports.TickMarkIcon = exports.SearchIcon = exports.ProjectsListIcon = exports.ProjectIcon = exports.ProjectNotificationIcon = exports.OrcidIcon = exports.GoogleIcon = exports.CloseOIcon = exports.BookmarkIcon = exports.BackArrowIcon = exports.AddIconInverted = exports.AddIconActive = exports.AddAuthor = void 0;
22
22
  var add_author_1 = require("./add-author");
23
23
  Object.defineProperty(exports, "AddAuthor", { enumerable: true, get: function () { return __importDefault(add_author_1).default; } });
24
24
  var add_icon_active_1 = require("./add-icon-active");
@@ -61,3 +61,5 @@ var attach_1 = require("./attach");
61
61
  Object.defineProperty(exports, "AttachIcon", { enumerable: true, get: function () { return __importDefault(attach_1).default; } });
62
62
  var upload_1 = require("./upload");
63
63
  Object.defineProperty(exports, "UploadIcon", { enumerable: true, get: function () { return __importDefault(upload_1).default; } });
64
+ var missing_image_1 = require("./missing-image");
65
+ Object.defineProperty(exports, "MissingImage", { enumerable: true, get: function () { return __importDefault(missing_image_1).default; } });
@@ -0,0 +1,12 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const react_1 = __importDefault(require("react"));
7
+ const MissingImage = () => (react_1.default.createElement("svg", { width: "28", height: "32", viewBox: "0 0 28 32", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
8
+ react_1.default.createElement("path", { d: "M2.99979 1.25C2.03237 1.25 1.25073 2.03442 1.25073 3V29C1.25073 29.9665 2.03423 30.75 3.00073 30.75H25.0007C25.9672 30.75 26.7507 29.9665 26.7507 29V11.4383C26.7507 10.9494 26.5462 10.4828 26.1868 10.1515L17.0318 1.71322C16.7092 1.41588 16.287 1.25 15.8467 1.25H15.8372H15.8275H15.8177H15.8078H15.7978H15.7877H15.7775H15.7671H15.7567H15.7462H15.7355H15.7248H15.7139H15.703H15.6919H15.6807H15.6694H15.6581H15.6466H15.635H15.6233H15.6115H15.5996H15.5876H15.5755H15.5633H15.551H15.5386H15.5261H15.5135H15.5008H15.488H15.4751H15.4621H15.449H15.4358H15.4225H15.4091H15.3956H15.382H15.3683H15.3545H15.3406H15.3266H15.3126H15.2984H15.2841H15.2697H15.2553H15.2407H15.2261H15.2113H15.1965H15.1815H15.1665H15.1514H15.1362H15.1209H15.1055H15.09H15.0744H15.0587H15.043H15.0271H15.0111H14.9951H14.979H14.9628H14.9464H14.93H14.9136H14.897H14.8803H14.8636H14.8467H14.8298H14.8128H14.7957H14.7785H14.7612H14.7438H14.7264H14.7089H14.6912H14.6735H14.6557H14.6379H14.6199H14.6019H14.5837H14.5655H14.5472H14.5289H14.5104H14.4919H14.4732H14.4545H14.4357H14.4169H14.3979H14.3789H14.3598H14.3406H14.3213H14.302H14.2825H14.263H14.2435H14.2238H14.204H14.1842H14.1643H14.1443H14.1243H14.1042H14.084H14.0637H14.0433H14.0229H14.0024H13.9818H13.9611H13.9404H13.9196H13.8987H13.8778H13.8567H13.8356H13.8144H13.7932H13.7719H13.7505H13.729H13.7075H13.6859H13.6642H13.6425H13.6206H13.5988H13.5768H13.5548H13.5327H13.5105H13.4883H13.466H13.4436H13.4212H13.3987H13.3761H13.3535H13.3308H13.308H13.2851H13.2622H13.2393H13.2162H13.1931H13.17H13.1467H13.1235H13.1001H13.0767H13.0532H13.0296H13.006H12.9824H12.9586H12.9348H12.911H12.8871H12.8631H12.839H12.8149H12.7908H12.7666H12.7423H12.7179H12.6935H12.6691H12.6446H12.62H12.5954H12.5707H12.5459H12.5211H12.4963H12.4713H12.4464H12.4213H12.3963H12.3711H12.3459H12.3207H12.2954H12.27H12.2446H12.2191H12.1936H12.168H12.1424H12.1167H12.091H12.0652H12.0394H12.0135H11.9876H11.9616H11.9355H11.9094H11.8833H11.8571H11.8309H11.8046H11.7782H11.7519H11.7254H11.6989H11.6724H11.6458H11.6192H11.5925H11.5658H11.539H11.5122H11.4854H11.4585H11.4315H11.4045H11.3775H11.3504H11.3233H11.2961H11.2689H11.2416H11.2143H11.187H11.1596H11.1322H11.1047H11.0772H11.0497H11.0221H10.9944H10.9668H10.939H10.9113H10.8835H10.8556H10.8278H10.7999H10.7719H10.7439H10.7159H10.6878H10.6597H10.6316H10.6034H10.5752H10.5469H10.5187H10.4903H10.462H10.4336H10.4052H10.3767H10.3482H10.3197H10.2911H10.2625H10.2339H10.2052H10.1765H10.1478H10.119H10.0902H10.0614H10.0326H10.0037H9.97477H9.94582H9.91684H9.88784H9.8588H9.82973H9.80064H9.77151H9.74236H9.71318H9.68397H9.65474H9.62547H9.59618H9.56687H9.53752H9.50815H9.47876H9.44934H9.41989H9.39042H9.36092H9.3314H9.30186H9.27229H9.24269H9.21308H9.18344H9.15378H9.12409H9.09438H9.06465H9.0349H9.00513H8.97534H8.94552H8.91569H8.88583H8.85596H8.82606H8.79615H8.76621H8.73626H8.70629H8.6763H8.64629H8.61627H8.58623H8.55617H8.52609H8.49599H8.46588H8.43576H8.40562H8.37546H8.34529H8.3151H8.2849H8.25468H8.22445H8.1942H8.16394H8.13367H8.10339H8.07309H8.04278H8.01246H7.98212H7.95178H7.92142H7.89105H7.86067H7.83029H7.79989H7.76948H7.73906H7.70863H7.67819H7.64775H7.61729H7.58683H7.55636H7.52588H7.49539H7.4649H7.4344H7.40389H7.37338H7.34286H7.31234H7.28181H7.25127H7.22073H7.19019H7.15964H7.12908H7.09853H7.06797H7.0374H7.00684H6.97627H6.9457H6.91512H6.88455H6.85397H6.82339H6.79282H6.76224H6.73166H6.70108H6.6705H6.63992H6.60934H6.57876H6.54819H6.51761H6.48704H6.45647H6.4259H6.39533H6.36477H6.33421H6.30366H6.27311H6.24256H6.21201H6.18148H6.15094H6.12041H6.08989H6.05937H6.02886H5.99836H5.96786H5.93737H5.90689H5.87641H5.84594H5.81548H5.78503H5.75458H5.72415H5.69372H5.66331H5.6329H5.6025H5.57212H5.54174H5.51138H5.48102H5.45068H5.42035H5.39003H5.35973H5.32943H5.29915H5.26888H5.23863H5.20839H5.17816H5.14795H5.11775H5.08757H5.0574H5.02725H4.99711H4.96699H4.93688H4.90679H4.87672H4.84667H4.81663H4.78661H4.75661H4.72662H4.69666H4.66671H4.63678H4.60687H4.57698H4.54712H4.51727H4.48744H4.45763H4.42784H4.39808H4.36833H4.33861H4.30891H4.27923H4.24958H4.21994H4.19033H4.16075H4.13119H4.10165H4.07213H4.04264H4.01318H3.98374H3.95433H3.92494H3.89558H3.86624H3.83693H3.80765H3.7784H3.74917H3.71997H3.6908H3.66165H3.63254H3.60345H3.57439H3.54537H3.51637H3.4874H3.45846H3.42955H3.40068H3.37183H3.34302H3.31423H3.28548H3.25676H3.22808H3.19942H3.1708H3.14222H3.11366H3.08514H3.05666H3.02821H2.99979Z", stroke: "#6E6E6E", strokeWidth: "1.5" }),
9
+ react_1.default.createElement("path", { d: "M8.00073 24C10.1219 20.9815 15.8916 16.7556 22.0007 24", stroke: "#6E6E6E", strokeWidth: "1.5", strokeLinecap: "round" }),
10
+ react_1.default.createElement("path", { d: "M8.00073 8C8.00073 8 8.00073 9.04738 8.00073 11", stroke: "#6E6E6E", strokeWidth: "1.5", strokeLinecap: "round" }),
11
+ react_1.default.createElement("path", { d: "M16.0007 2V12H26.0007", stroke: "#6E6E6E", strokeWidth: "1.5" })));
12
+ exports.default = MissingImage;
package/dist/cjs/index.js CHANGED
@@ -28,7 +28,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  return (mod && mod.__esModule) ? mod : { "default": mod };
29
29
  };
30
30
  Object.defineProperty(exports, "__esModule", { value: true });
31
- exports.SelectDialogDesignation = exports.errorsDecoder = exports.PdfPreview = void 0;
31
+ exports.SelectDialogDesignation = exports.errorsDecoder = exports.PdfPreview = exports.inlineFiles = void 0;
32
32
  __exportStar(require("./components/AffiliationsEditor"), exports);
33
33
  __exportStar(require("./components/AffiliationsList"), exports);
34
34
  __exportStar(require("./components/AuthorForm"), exports);
@@ -48,6 +48,7 @@ __exportStar(require("./components/Form"), exports);
48
48
  __exportStar(require("./components/FileManager"), exports);
49
49
  __exportStar(require("./components/FileManager/util"), exports);
50
50
  __exportStar(require("./components/FileManager/FileSectionItem/FileSectionItem"), exports);
51
+ __exportStar(require("./components/Resizer"), exports);
51
52
  __exportStar(require("./components/SaveStatus"), exports);
52
53
  __exportStar(require("./components/SimpleModal"), exports);
53
54
  __exportStar(require("./components/StyledModal"), exports);
@@ -59,6 +60,8 @@ __exportStar(require("./components/Tip"), exports);
59
60
  __exportStar(require("./components/icons"), exports);
60
61
  __exportStar(require("./components/Inspector"), exports);
61
62
  __exportStar(require("./components/InspectorSection"), exports);
63
+ var inlineFiles_1 = require("./lib/inlineFiles");
64
+ Object.defineProperty(exports, "inlineFiles", { enumerable: true, get: function () { return __importDefault(inlineFiles_1).default; } });
62
65
  var PdfPreview_1 = require("./components/PdfPreview");
63
66
  Object.defineProperty(exports, "PdfPreview", { enumerable: true, get: function () { return __importDefault(PdfPreview_1).default; } });
64
67
  __exportStar(require("./components/SubmissionInspector"), exports);