@manuscripts/style-guide 1.13.9 → 1.13.11-LEAN-3771.0

package/dist/cjs/components/FileManager/SupplementsSection.js

@@ -1,118 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SupplementsSection = void 0;
-const json_schema_1 = require("@manuscripts/json-schema");
-const react_1 = __importStar(require("react"));
-const react_dnd_1 = require("react-dnd");
-const react_dnd_html5_backend_1 = require("react-dnd-html5-backend");
-const FileActions_1 = require("./FileActions");
-const FileContainer_1 = require("./FileContainer");
-const FileCreatedDate_1 = require("./FileCreatedDate");
-const FileManager_1 = require("./FileManager");
-const FileManagerProvider_1 = require("./FileManagerProvider");
-const FileName_1 = require("./FileName");
-const FileSectionAlert_1 = require("./FileSectionAlert");
-const FileUploader_1 = require("./FileUploader");
-const util_1 = require("./util");
-const SupplementsSection = ({ supplements }) => {
-    const { modelMap, saveModel, deleteModel, fileManagement } = (0, react_1.useContext)(FileManagerProvider_1.FileManagerContext);
-    const can = (0, react_1.useContext)(FileManager_1.PermissionsContext);
-    const [alert, setAlert] = (0, react_1.useState)({
-        type: FileSectionAlert_1.FileSectionAlertType.NONE,
-        message: '',
-    });
-    const upload = (file) => __awaiter(void 0, void 0, void 0, function* () {
-        setAlert({
-            type: FileSectionAlert_1.FileSectionAlertType.UPLOAD_IN_PROGRESS,
-            message: file.name,
-        });
-        const uploaded = yield fileManagement.upload(file);
-        setAlert({
-            type: FileSectionAlert_1.FileSectionAlertType.UPLOAD_SUCCESSFUL,
-            message: '',
-        });
-        return uploaded;
-    });
-    const handleUpload = (file) => __awaiter(void 0, void 0, void 0, function* () {
-        const uploaded = yield upload(file);
-        const supplement = (0, json_schema_1.buildSupplement)('', uploaded.id);
-        yield saveModel(Object.assign(Object.assign({}, supplement), { MIME: file.type }));
-    });
-    const handleReplace = (modelId, file) => __awaiter(void 0, void 0, void 0, function* () {
-        const uploaded = yield upload(file);
-        const supplement = (0, json_schema_1.buildSupplement)('', uploaded.id);
-        yield deleteModel(modelId);
-        yield saveModel(Object.assign(Object.assign({}, supplement), { MIME: file.type }));
-    });
-    const handleMoveToOtherFiles = (modelId) => __awaiter(void 0, void 0, void 0, function* () {
-        yield deleteModel(modelId);
-        setAlert({
-            type: FileSectionAlert_1.FileSectionAlertType.MOVE_SUCCESSFUL,
-            message: util_1.FileSectionType.OtherFile,
-        });
-    });
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        (can === null || can === void 0 ? void 0 : can.uploadFile) && react_1.default.createElement(FileUploader_1.FileUploader, { onUpload: handleUpload }),
-        react_1.default.createElement(FileSectionAlert_1.FileSectionAlert, { alert: alert }),
-        supplements.map((supplement) => (react_1.default.createElement(SupplementFile, { key: supplement.modelId, file: supplement, handleDownload: () => fileManagement.download(supplement), handleReplace: (f) => __awaiter(void 0, void 0, void 0, function* () { return yield handleReplace(supplement.modelId, f); }), handleDetach: () => __awaiter(void 0, void 0, void 0, function* () { return yield handleMoveToOtherFiles(supplement.modelId); }) })))));
-};
-exports.SupplementsSection = SupplementsSection;
-const SupplementFile = ({ file, handleDownload, handleReplace, handleDetach }) => {
-    const [{ isDragging }, dragRef, preview] = (0, react_dnd_1.useDrag)({
-        type: 'file',
-        item: {
-            file,
-            model: {
-                _id: file.modelId,
-                objectType: json_schema_1.ObjectTypes.Supplement,
-            },
-        },
-        collect: (monitor) => ({
-            isDragging: monitor.isDragging(),
-        }),
-    });
-    (0, react_1.useEffect)(() => {
-        preview((0, react_dnd_html5_backend_1.getEmptyImage)());
-    }, [preview]);
-    return (react_1.default.createElement(FileContainer_1.FileContainer, { "data-cy": "file-container", key: file.id, ref: dragRef, className: isDragging ? 'dragging' : '' },
-        react_1.default.createElement(FileName_1.FileName, { file: file }),
-        react_1.default.createElement(FileCreatedDate_1.FileCreatedDate, { file: file, className: "show-on-hover" }),
-        react_1.default.createElement(FileActions_1.FileActions, { "data-cy": "file-actions", sectionType: util_1.FileSectionType.Supplements, handleDownload: file.id ? handleDownload : undefined, handleReplace: handleReplace, move: file.id
-                ? {
-                    sectionType: util_1.FileSectionType.OtherFile,
-                    handler: handleDetach,
-                }
-                : undefined })));
-};

package/dist/cjs/components/FileManager/index.js

@@ -1,32 +0,0 @@
-"use strict";
-/*!
- * © 2020 Atypon Systems LLC
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./FileManager"), exports);

package/dist/cjs/components/FileManager/util.js

@@ -1,138 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isImageFile = exports.getFileTypeIcon = exports.getFileIcon = exports.getFileType = exports.FileType = exports.FileSectionType = void 0;
-const react_1 = __importDefault(require("react"));
-const icons_1 = require("../icons");
-var FileSectionType;
-(function (FileSectionType) {
-    FileSectionType["Inline"] = "Inline files";
-    FileSectionType["Supplements"] = "Supplements";
-    FileSectionType["OtherFile"] = "Other files";
-})(FileSectionType = exports.FileSectionType || (exports.FileSectionType = {}));
-var FileType;
-(function (FileType) {
-    FileType[FileType["Image"] = 0] = "Image";
-    FileType[FileType["Audio"] = 1] = "Audio";
-    FileType[FileType["Video"] = 2] = "Video";
-    FileType[FileType["PlainDocument"] = 3] = "PlainDocument";
-    FileType[FileType["SheetsWorkbooks"] = 4] = "SheetsWorkbooks";
-    FileType[FileType["Latex"] = 5] = "Latex";
-    FileType[FileType["CodeFile"] = 6] = "CodeFile";
-    FileType[FileType["PdfFile"] = 7] = "PdfFile";
-    FileType[FileType["CompressedFile"] = 8] = "CompressedFile";
-    FileType[FileType["PlainText"] = 9] = "PlainText";
-    FileType[FileType["Figure"] = 10] = "Figure";
-    FileType[FileType["GraphicalAbstract"] = 11] = "GraphicalAbstract";
-})(FileType = exports.FileType || (exports.FileType = {}));
-const extension2type = new Map([
-    ['png', FileType.Image],
-    ['jpg', FileType.Image],
-    ['jpeg', FileType.Image],
-    ['jfif', FileType.Image],
-    ['gif', FileType.Image],
-    ['svg', FileType.Image],
-    ['tif', FileType.Image],
-    ['tiff', FileType.Image],
-    ['mp3', FileType.Audio],
-    ['wav', FileType.Audio],
-    ['wma', FileType.Audio],
-    ['flac', FileType.Audio],
-    ['avi', FileType.Video],
-    ['mp4', FileType.Video],
-    ['mov', FileType.Video],
-    ['wmv', FileType.Video],
-    ['doc', FileType.PlainDocument],
-    ['docx', FileType.PlainDocument],
-    ['rtf', FileType.PlainDocument],
-    ['xls', FileType.SheetsWorkbooks],
-    ['xlsx', FileType.SheetsWorkbooks],
-    ['xml', FileType.SheetsWorkbooks],
-    ['tex', FileType.Latex],
-    ['js', FileType.CodeFile],
-    ['py', FileType.CodeFile],
-    ['tsx', FileType.CodeFile],
-    ['html', FileType.CodeFile],
-    ['pdf', FileType.PdfFile],
-    ['zip', FileType.CompressedFile],
-    ['rar', FileType.CompressedFile],
-    ['arj', FileType.CompressedFile],
-    ['tar.gz', FileType.CompressedFile],
-    ['tgz', FileType.CompressedFile],
-    ['txt', FileType.PlainText],
-]);
-const type2icon = new Map([
-    [
-        FileType.Audio,
-        react_1.default.createElement(icons_1.FileAudioIcon, { key: FileType.Audio, className: "file-icon" }),
-    ],
-    [
-        FileType.Video,
-        react_1.default.createElement(icons_1.FileVideoIcon, { key: FileType.Video, className: "file-icon" }),
-    ],
-    [
-        FileType.PlainDocument,
-        react_1.default.createElement(icons_1.FileDocumentIcon, { key: FileType.PlainDocument, color: "#1A9BC7", className: "file-icon" }),
-    ],
-    [
-        FileType.SheetsWorkbooks,
-        react_1.default.createElement(icons_1.FileTableIcon, { key: FileType.SheetsWorkbooks, className: "file-icon" }),
-    ],
-    [
-        FileType.Latex,
-        react_1.default.createElement(icons_1.FileLatexIcon, { key: FileType.Latex, color: "#1A9BC7", className: "file-icon" }),
-    ],
-    [
-        FileType.CodeFile,
-        react_1.default.createElement(icons_1.FileCodeIcon, { key: FileType.CodeFile, className: "file-icon" }),
-    ],
-    [
-        FileType.PdfFile,
-        react_1.default.createElement(icons_1.FilePdfIcon, { key: FileType.PdfFile, className: "file-icon" }),
-    ],
-    [
-        FileType.CompressedFile,
-        react_1.default.createElement(icons_1.FileCompressedIcon, { key: FileType.CompressedFile, className: "file-icon" }),
-    ],
-    [
-        FileType.PlainText,
-        react_1.default.createElement(icons_1.FileDocumentIcon, { key: FileType.PlainText, color: "#FFBD26", className: "file-icon" }),
-    ],
-    [
-        FileType.Image,
-        react_1.default.createElement(icons_1.FileImageIcon, { key: FileType.Image, className: "file-icon" }),
-    ],
-    [
-        FileType.Figure,
-        react_1.default.createElement(icons_1.FileFigureIcon, { key: FileType.Figure, className: "file-icon" }),
-    ],
-    [
-        FileType.GraphicalAbstract,
-        react_1.default.createElement(icons_1.FileGraphicalAbstractIcon, { key: FileType.GraphicalAbstract, className: "file-icon" }),
-    ],
-    [undefined, react_1.default.createElement(icons_1.FileUnknownIcon, { key: undefined, className: "file-icon" })],
-]);
-const getFileType = (file) => {
-    const extension = getExtension(file.name);
-    return extension2type.get(extension.toLowerCase());
-};
-exports.getFileType = getFileType;
-const getFileIcon = (file) => {
-    const type = (0, exports.getFileType)(file);
-    return type2icon.get(type);
-};
-exports.getFileIcon = getFileIcon;
-const getFileTypeIcon = (type) => {
-    return type2icon.get(type);
-};
-exports.getFileTypeIcon = getFileTypeIcon;
-const isImageFile = (file) => {
-    return (0, exports.getFileType)(file) === FileType.Image;
-};
-exports.isImageFile = isImageFile;
-const getExtension = (name) => {
-    const index = name.indexOf('.');
-    return index ? name.substring(index + 1) : '';
-};

package/dist/cjs/hooks/use-files.js

@@ -1,39 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFiles = void 0;
-const json_schema_1 = require("@manuscripts/json-schema");
-const files_1 = require("../lib/files");
-const use_deep_compare_1 = require("./use-deep-compare");
-const types = [
-    json_schema_1.ObjectTypes.Section,
-    json_schema_1.ObjectTypes.FigureElement,
-    json_schema_1.ObjectTypes.Figure,
-    json_schema_1.ObjectTypes.Supplement,
-    json_schema_1.ObjectTypes.ElementsOrder,
-];
-const getOtherFiles = (inlineFiles, supplements, files) => {
-    const excluded = new Set();
-    inlineFiles.flatMap((f) => f.files).forEach((f) => excluded.add(f.id));
-    supplements.forEach((s) => excluded.add(s.id));
-    return files.filter((f) => !excluded.has(f.id));
-};
-const useFiles = (modelMap, files) => {
-    const models = [];
-    for (const [_, model] of modelMap.entries()) {
-        if (types.includes(model.objectType)) {
-            models.push(model);
-        }
-    }
-    return (0, use_deep_compare_1.useDeepCompareMemo)(() => {
-        const inlineFiles = (0, files_1.getInlineFiles)(modelMap, files);
-        const supplements = (0, files_1.getSupplements)(modelMap, files);
-        const otherFiles = getOtherFiles(inlineFiles, supplements, files);
-        return {
-            inlineFiles,
-            supplements,
-            otherFiles,
-        };
-    }, [models, files]);
-};
-exports.useFiles = useFiles;
-exports.default = exports.useFiles;

package/dist/es/components/EditorHeader/EditorHeader.js

@@ -1,180 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import React, { useCallback, useState } from 'react';
-import styled from 'styled-components';
-import { ArrowLeftIcon, DropdownContainer, DropdownList, EditIcon, NavDropdownContainer, NavDropdownToggle, PrimaryButton, RoleAnnotatingIcon, RoleReadingIcon, SaveStatus, SecondaryButton, TextArea, useDropdown, } from '../..';
-import { ProceedView } from './ProceedView';
-export var DialogState;
-(function (DialogState) {
-    DialogState[DialogState["INIT"] = 0] = "INIT";
-    DialogState[DialogState["LOADING"] = 1] = "LOADING";
-    DialogState[DialogState["ERROR"] = 2] = "ERROR";
-    DialogState[DialogState["SUCCESS"] = 3] = "SUCCESS";
-    DialogState[DialogState["CLOSED"] = 4] = "CLOSED";
-})(DialogState || (DialogState = {}));
-const Editing = { label: 'Editing', icon: EditIcon };
-const MapUserRole = {
-    Editor: Editing,
-    Owner: Editing,
-    Writer: Editing,
-    Annotator: { label: 'Suggesting', icon: RoleAnnotatingIcon },
-    Viewer: { label: 'Reading', icon: RoleReadingIcon },
-    Proofer: { label: 'Proofing', icon: RoleAnnotatingIcon },
-};
-export const EditorHeader = ({ handleSnapshot, submission, hasPendingSuggestions, userRole, canCompleteTask, submitProceed, goBack, status, isAnnotator, isProofer, message, exceptionDialog: ExceptionDialog, disabelProceedNote, }) => {
-    var _a, _b, _c, _d, _e;
-    const [noteValue, setNoteValue] = useState('');
-    const [selectedTransitionIndex, setSelectedTransitionIndex] = useState();
-    const { dialogData, submit } = submitProceed;
-    const { updateState, clearError } = dialogData;
-    const continueDialogAction = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
-        if (submission && selectedTransitionIndex && handleSnapshot) {
-            const { status } = submission.currentStep.type.transitions[selectedTransitionIndex];
-            updateState(DialogState.LOADING);
-            yield handleSnapshot();
-            yield submit(status.id, noteValue);
-        }
-    }), [
-        submission,
-        selectedTransitionIndex,
-        handleSnapshot,
-        updateState,
-        submit,
-        noteValue,
-    ]);
-    const onTransitionClick = useCallback((event) => {
-        updateState(DialogState.INIT);
-        setSelectedTransitionIndex(event.target.value || event.target.parentNode.value);
-    }, [setSelectedTransitionIndex, updateState]);
-    const onCancelClick = useCallback(() => {
-        setSelectedTransitionIndex(undefined);
-        clearError();
-        updateState(DialogState.CLOSED);
-    }, [setSelectedTransitionIndex, clearError, updateState]);
-    const onNoteChange = useCallback((event) => setNoteValue(event.target.value), [setNoteValue]);
-    const currentStepTransition = submission === null || submission === void 0 ? void 0 : submission.currentStep.type.transitions;
-    const disable = !currentStepTransition || !canCompleteTask;
-    const errorCode = (_d = (_c = (_b = (_a = dialogData.mutationError) === null || _a === void 0 ? void 0 : _a.graphQLErrors) === null || _b === void 0 ? void 0 : _b.find((error) => { var _a; return (_a = error === null || error === void 0 ? void 0 : error.extensions) === null || _a === void 0 ? void 0 : _a.code; })) === null || _c === void 0 ? void 0 : _c.extensions) === null || _d === void 0 ? void 0 : _d.code.name;
-    return (React.createElement(Wrapper, null,
-        goBack && (React.createElement(SecondaryButtonSmall, { onClick: goBack, type: "button" },
-            React.createElement(ArrowLeftIcon, null),
-            React.createElement("span", null, "Dashboard"))),
-        handleSnapshot &&
-            typeof hasPendingSuggestions == 'boolean' &&
-            submission.nextStep && (React.createElement(ProceedView, { isAnnotator: isAnnotator, isProofer: isProofer, disable: disable, onTransitionClick: onTransitionClick, hasPendingSuggestions: hasPendingSuggestions, dialogData: dialogData, noteValue: noteValue, currentStepTransition: currentStepTransition, currentStepType: submission.currentStep.type, previousStepType: (_e = submission.previousStep) === null || _e === void 0 ? void 0 : _e.type, nextStepType: submission.nextStep.type, onNoteChange: disabelProceedNote ? undefined : onNoteChange, continueDialogAction: continueDialogAction, onCancelClick: onCancelClick, message: message })),
-        status && (React.createElement(ChildWrapper, null,
-            React.createElement(SaveStatus, { status: status }))),
-        React.createElement(Spacer, null),
-        React.createElement(CurrentStepLabel, null, submission.currentStep.type.label),
-        React.createElement(CurrentActionLablel, null,
-            userRole &&
-                MapUserRole[userRole] &&
-                React.createElement(MapUserRole[userRole].icon),
-            React.createElement("span", null, userRole && MapUserRole[userRole].label)),
-        React.createElement(HelpDropdown, null),
-        errorCode && React.createElement(ExceptionDialog, { errorCode: errorCode })));
-};
-const HelpDropdown = () => {
-    const { isOpen, toggleOpen, wrapperRef } = useDropdown();
-    return (React.createElement(HelpDropdownContainer, { ref: wrapperRef },
-        React.createElement(HelpDropdownButton, { onClick: toggleOpen },
-            React.createElement("span", null, "Help"),
-            React.createElement(NavDropdownToggle, { className: isOpen ? 'open' : '' })),
-        isOpen && (React.createElement(DropdownList, { top: 12, direction: "right" },
-            React.createElement(DropdownItem, null, "Documentation")))));
-};
-const SecondaryButtonSmall = styled(SecondaryButton) `
-  font-size: inherit;
-  margin-right: ${(props) => props.theme.grid.unit * 2}px;
-  padding-top: ${(props) => props.theme.grid.unit * 0.75}px;
-  padding-bottom: ${(props) => props.theme.grid.unit * 0.75}px;
-`;
-const HelpDropdownButton = styled.button `
-  background: transparent;
-  border: none;
-  cursor: pointer;
-`;
-const HelpDropdownContainer = styled(DropdownContainer) `
-  border-left: 1px solid #f2f2f2;
-  margin: -${(props) => props.theme.grid.unit * 3}px ${(props) => props.theme.grid.unit * 2}px -${(props) => props.theme.grid.unit * 3}px
-    ${(props) => props.theme.grid.unit * 6}px;
-  padding: ${(props) => props.theme.grid.unit * 4.75}px 0
-    ${(props) => props.theme.grid.unit * 5}px
-    ${(props) => props.theme.grid.unit * 4}px;
-`;
-const DropdownItem = styled.a `
-  color: inherit;
-  display: block;
-  cursor: pointer;
-  text-decoration: none;
-  padding: ${(props) => props.theme.grid.unit * 5}px;
-`;
-export const PrimaryButtonSmall = styled(PrimaryButton) `
-  padding-top: ${(props) => props.theme.grid.unit * 0.75}px;
-  padding-bottom: ${(props) => props.theme.grid.unit * 0.75}px;
-  font-size: inherit;
-`;
-const Wrapper = styled.div `
-  display: flex;
-  z-index: 6;
-  padding: ${(props) => props.theme.grid.unit * 3}px
-    ${(props) => props.theme.grid.unit * 8}px;
-  width: 100%;
-  box-sizing: border-box;
-  align-items: center;
-  border-bottom: 1px solid #f2f2f2;
-  font-size: 14px;
-  background: white;
-
-  ${NavDropdownContainer} + ${NavDropdownContainer} {
-    margin-left: ${(props) => props.theme.grid.unit * 2}px;
-  }
-  ${PrimaryButtonSmall} + ${NavDropdownContainer} {
-    margin-left: ${(props) => props.theme.grid.unit * 2}px;
-  }
-`;
-const CurrentStepLabel = styled.span `
-  background: #f2f2f2;
-  border-radius: ${(props) => props.theme.grid.unit * 1.5}px;
-  padding: ${(props) => props.theme.grid.unit}px;
-`;
-const CurrentActionLablel = styled.span `
-  display: flex;
-  padding: 0 ${(props) => props.theme.grid.unit * 6}px;
-  svg {
-    margin-right: ${(props) => props.theme.grid.unit * 2.5}px;
-  }
-`;
-const ChildWrapper = styled.div `
-  display: inline-flex;
-  margin: 0 2em;
-  flex-direction: row;
-  align-items: center;
-`;
-const Grid = styled.div `
-  display: grid;
-  grid-template-columns: max-content auto;
-  gap: 0 ${(props) => props.theme.grid.unit * 2}px;
-  margin-top: ${(props) => props.theme.grid.unit * 4}px;
-  background: ${(props) => props.theme.colors.background.secondary};
-  padding: ${(props) => props.theme.grid.unit * 6}px;
-`;
-const Line = styled.hr `
-  margin: 5px 0 0 0;
-  flex: 1;
-  border: 1px dashed #c9c9c9;
-`;
-const Spacer = styled.div `
-  flex: auto;
-`;
-export const MediumTextArea = styled(TextArea) `
-  padding: 8px;
-  font-size: 1em;
-`;

package/dist/es/components/EditorHeader/ProceedView.js

@@ -1,165 +0,0 @@
-import React, { useEffect, useMemo, useRef } from 'react';
-import styled from 'styled-components';
-import { Category, Dialog, DialogState, LoadingOverlay, NavDropdown, NavDropdownButton, NavDropdownContainer, PrimaryBoldHeading, PrimaryButton, SecondarySmallText, TaskStepDoneIcon, useDropdown, } from '../..';
-import { AlertMessage, AlertMessageType } from '../AlertMessage';
-import { PrimaryButtonSmall, } from './EditorHeader';
-const DropdownWrapper = ({ disabled, button, primary, children }) => {
-    const { isOpen, toggleOpen, wrapperRef } = useDropdown();
-    return (React.createElement(NavDropdownContainer, { id: 'user-dropdown', ref: wrapperRef },
-        React.createElement(NavDropdownButton, { as: (primary && PrimaryButton) || undefined, disabled: disabled, isOpen: isOpen, onClick: toggleOpen }, button),
-        isOpen && React.createElement(NavDropdown, { direction: "left" }, children)));
-};
-const StepDetails = ({ icon, label, description, role }) => (React.createElement(React.Fragment, null,
-    icon && React.createElement(TaskStatus, null, icon),
-    React.createElement(TaskContainer, null,
-        React.createElement(PrimaryBoldHeading, null, label),
-        React.createElement(SecondarySmallText, null, description),
-        React.createElement(SecondarySmallText, null,
-            "Actor: ",
-            role.label))));
-export const ProceedView = ({ currentStepTransition, onTransitionClick, disable, dialogData, previousStepType, currentStepType, isAnnotator, isProofer, hasPendingSuggestions, onCancelClick, continueDialogAction, message: Message, }) => {
-    const dialogMessages = useMemo(() => hasPendingSuggestions &&
-        !isAnnotator &&
-        !isProofer &&
-        dialogData.state !== DialogState.SUCCESS
-        ? {
-            header: 'The task can not be transitioned to the next step',
-            message: `There are still pending suggestions in the document.
-                It is not possible to complete the task without having them approved or rejected.`,
-            actions: {
-                primary: {
-                    action: onCancelClick,
-                    title: 'Ok',
-                },
-                onClose: onCancelClick,
-            },
-        }
-        : dialogData.state === DialogState.SUCCESS
-            ? {
-                header: 'Content reassigned successfully',
-                message: `to the ${currentStepType.label}`,
-                actions: {
-                    primary: {
-                        action: onCancelClick,
-                        title: 'Close',
-                    },
-                    onClose: onCancelClick,
-                },
-            }
-            : {
-                header: 'Are you sure?',
-                message: 'You are about to complete your task. If you confirm, you will no longer be able to make any changes.',
-                actions: {
-                    primary: {
-                        action: continueDialogAction,
-                        title: 'Continue',
-                    },
-                    secondary: {
-                        action: onCancelClick,
-                        title: 'Cancel',
-                    },
-                    onClose: onCancelClick,
-                },
-            }, [
-        dialogData,
-        continueDialogAction,
-        onCancelClick,
-        currentStepType,
-        hasPendingSuggestions,
-        isAnnotator,
-        isProofer,
-    ]);
-    const prevDialogMsgs = useRef();
-    const prevDialogueState = useRef();
-    useEffect(() => {
-        prevDialogMsgs.current = dialogMessages;
-        prevDialogueState.current = dialogData.state;
-    }, [dialogData.state]);
-    const messages = dialogData.state === DialogState.CLOSED && prevDialogMsgs.current
-        ? prevDialogMsgs.current
-        : dialogMessages;
-    const finalState = dialogData.state === DialogState.CLOSED && prevDialogueState.current
-        ? prevDialogueState.current
-        : dialogData.state;
-    return (React.createElement(React.Fragment, null,
-        (currentStepTransition && (currentStepTransition === null || currentStepTransition === void 0 ? void 0 : currentStepTransition.length) > 1 && (React.createElement(DropdownWrapper, { button: 'Complete task', disabled: disable, primary: true },
-            React.createElement(TaskDropdown, null, currentStepTransition &&
-                currentStepTransition.map((transition, index) => (React.createElement(Task, { key: 'task_' + transition.type.id, className: transition.status.id === 'success' ? 'happyPath' : '', value: index, onClick: onTransitionClick },
-                    React.createElement("strong", null, transition.type.label),
-                    transition.type.description))))))) || (React.createElement(PrimaryButtonSmall, { value: 0, onClick: onTransitionClick, disabled: disable }, "Complete task")),
-        finalState === DialogState.LOADING && (React.createElement(LoadingOverlay, null,
-            React.createElement(Message, { isCentered: true }, "Proceeding with your submission\u2026"))),
-        React.createElement(Dialog, { isOpen: dialogData.state !== DialogState.CLOSED &&
-                dialogData.state !== DialogState.LOADING, category: Category.confirmation, header: messages.header, message: messages.message, actions: messages.actions },
-            finalState === DialogState.SUCCESS && (React.createElement(Grid, null,
-                previousStepType && (React.createElement(StepDetails, Object.assign({}, previousStepType, { icon: React.createElement(React.Fragment, null,
-                        React.createElement(TaskStepDoneIcon, null),
-                        React.createElement(Line, null)) }))),
-                React.createElement(StepDetails, Object.assign({}, currentStepType)))),
-            finalState === DialogState.ERROR && (React.createElement(AlertMessage, { type: AlertMessageType.error, hideCloseButton: true }, dialogData.error)))));
-};
-const TaskDropdown = styled.div `
-  display: flex;
-  flex-direction: column;
-  padding: ${(props) => props.theme.grid.unit * 2}px 0;
-`;
-const Task = styled.button `
-  background: transparent;
-  border: none;
-  color: ${(props) => props.theme.colors.text.secondary};
-  cursor: pointer;
-  font: ${(props) => props.theme.font.weight.normal}
-    ${(props) => props.theme.font.size.small} /
-    ${(props) => props.theme.font.lineHeight.normal}
-    ${(props) => props.theme.font.family.sans};
-  order: 1;
-  outline: none;
-  padding: ${(props) => props.theme.grid.unit * 2}px
-    ${(props) => props.theme.grid.unit * 4}px;
-  text-align: left;
-  width: ${(props) => props.theme.grid.unit * 66}px;
-
-  &:not([disabled]):hover,
-  &:not([disabled]):focus {
-    background-color: ${(props) => props.theme.colors.button.default.background.hover};
-  }
-
-  strong {
-    color: ${(props) => props.theme.colors.text.primary};
-    display: block;
-    font-size: ${(props) => props.theme.font.size.normal};
-    line-height: ${(props) => props.theme.font.lineHeight.normal};
-  }
-
-  &.happyPath {
-    border-bottom: 1px solid ${(props) => props.theme.colors.border.tertiary};
-    order: 0;
-  }
-`;
-const TextAreaWrapper = styled.div `
-  margin-top: ${(props) => props.theme.grid.unit * 4}px;
-`;
-const Grid = styled.div `
-  display: grid;
-  grid-template-columns: max-content auto;
-  gap: 0 ${(props) => props.theme.grid.unit * 2}px;
-  margin-top: ${(props) => props.theme.grid.unit * 4}px;
-  background: ${(props) => props.theme.colors.background.secondary};
-  padding: ${(props) => props.theme.grid.unit * 6}px;
-`;
-const Line = styled.hr `
-  margin: 5px 0 0 0;
-  flex: 1;
-  border: 1px dashed #c9c9c9;
-`;
-const TaskStatus = styled.div `
-  grid-column: 1;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding-top: 5px;
-`;
-const TaskContainer = styled.div `
-  grid-column: 2;
-  margin-bottom: 8px;
-`;