@manuscripts/style-guide 1.12.16 → 1.13.0

package/dist/cjs/components/Comments/ResolveButton.js

@@ -1,66 +0,0 @@
-"use strict";
-/*!
- * © 2021 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 __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ResolveButton = void 0;
-const react_1 = __importDefault(require("react"));
-const styled_components_1 = __importDefault(require("styled-components"));
-const icons_1 = require("../icons");
-const Tooltip_1 = require("../Tooltip");
-const ResolveButton = ({ id, resolved, resolvedCallback }) => {
-    return (react_1.default.createElement(Container, null,
-        react_1.default.createElement(Button, { className: resolved ? 'resolved' : '', "data-tooltip-id": id, onClick: resolvedCallback },
-            react_1.default.createElement(icons_1.CommentResolveIcon, null)),
-        react_1.default.createElement(Tooltip_1.Tooltip, { id: id, place: "bottom" }, (resolved && 'Unresolve') || 'Resolve')));
-};
-exports.ResolveButton = ResolveButton;
-const Container = styled_components_1.default.div `
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-right: ${(props) => props.theme.grid.unit};
-`;
-const Button = styled_components_1.default.button `
-  display: flex;
-  align-items: center;
-  width: 24px;
-  height: 24px;
-  border-radius: 12px;
-  border: none;
-  background: #ffffff;
-  padding: 0;
-  cursor: pointer;
-
-  &.resolved {
-    background: #f2fbfc;
-    border: 1px solid #bce7f6;
-    path {
-      fill: #1a9bc7;
-    }
-  }
-
-  &:not([disabled]):hover,
-  &:not([disabled]):active {
-    path {
-      fill: #1a9bc7;
-    }
-    background: #f2fbfc;
-    border: 1px solid #c9c9c9;
-  }
-`;

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

@@ -1,21 +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 __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("./CommentBody"), exports);
-__exportStar(require("./CommentTarget"), exports);
-__exportStar(require("./CommentUser"), exports);
-__exportStar(require("./ResolveButton"), exports);
-__exportStar(require("./CommentWrapper"), exports);

package/dist/cjs/components/ManuscriptNoteList.js

@@ -1,210 +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 __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());
-    });
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LabelText = exports.LightRelativeDate = exports.ReplyBodyContainer = exports.NoteBodyContainer = exports.ManuscriptNoteList = void 0;
-const json_schema_1 = require("@manuscripts/json-schema");
-const transform_1 = require("@manuscripts/transform");
-const react_1 = __importStar(require("react"));
-const styled_components_1 = __importDefault(require("styled-components"));
-const uuid_1 = require("uuid");
-const comments_1 = require("../lib/comments");
-const Button_1 = require("./Button");
-const Checkbox_1 = require("./Checkbox");
-const CommentTarget_1 = require("./Comments/CommentTarget");
-const CommentWrapper_1 = require("./Comments/CommentWrapper");
-const icons_1 = require("./icons");
-const RelativeDate_1 = require("./RelativeDate");
-exports.ManuscriptNoteList = react_1.default.memo(({ createKeyword, deleteModel, getCollaboratorById, currentUserId, displayName, getKeyword, listCollaborators, listKeywords, notes, noteSource, saveModel, selected, can, }) => {
-    const [newComment, setNewComment] = (0, react_1.useState)();
-    const [selectResolved, setSelectResolved] = (0, react_1.useState)(false);
-    const [noteTarget, setNoteTarget] = (0, react_1.useState)();
-    (0, react_1.useEffect)(() => {
-        if (noteTarget && !newComment) {
-            const newComment = (0, transform_1.buildNote)(noteTarget, noteSource);
-            newComment.displayName = displayName;
-            if (currentUserId) {
-                const contribution = (0, transform_1.buildContribution)(currentUserId);
-                newComment.contributions = [contribution];
-            }
-            else {
-                newComment.contributions = [];
-            }
-            setNewComment(newComment);
-        }
-    }, [noteTarget, currentUserId, displayName, newComment, noteSource]);
-    const items = (0, react_1.useMemo)(() => {
-        const combinedComments = [...notes];
-        if (newComment) {
-            combinedComments.push(newComment);
-        }
-        const commentsTreeMap = (0, comments_1.buildNoteTree)(combinedComments);
-        return Array.from(commentsTreeMap.entries());
-    }, [notes, newComment]);
-    const handleAddNewNote = (0, react_1.useCallback)((event) => {
-        event.preventDefault();
-        setNoteTarget(json_schema_1.ObjectTypes.ManuscriptNote + ':' + (0, uuid_1.v4)().toUpperCase());
-        setSelectResolved(false);
-    }, [setNoteTarget]);
-    const deleteNote = (0, react_1.useCallback)((id) => {
-        return deleteModel(id).finally(() => {
-            if (newComment && newComment._id === id) {
-                setNoteTarget(undefined);
-                setNewComment(undefined);
-            }
-        });
-    }, [deleteModel, newComment, setNoteTarget]);
-    const saveNote = (0, react_1.useCallback)((note) => {
-        return saveModel(note).then((note) => {
-            if (newComment && newComment._id === note._id) {
-                setNoteTarget(undefined);
-                setNewComment(undefined);
-            }
-            return note;
-        });
-    }, [newComment, setNoteTarget, saveModel]);
-    const isNew = (0, react_1.useCallback)((note) => {
-        return newComment ? newComment._id === note._id : false;
-    }, [newComment]);
-    const handleOnSelectChange = (0, react_1.useCallback)((e) => setSelectResolved(e.target.checked), []);
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(ActionHeader, { withAddButton: can.createNotes },
-            can.createNotes && (react_1.default.createElement(AddNoteButton, { onClick: handleAddNewNote },
-                "Add ",
-                react_1.default.createElement(icons_1.AddIcon, null))),
-            items.length > 0 && (react_1.default.createElement(Checkbox, null,
-                react_1.default.createElement(Checkbox_1.CheckboxField, { checked: selectResolved, onChange: handleOnSelectChange }),
-                react_1.default.createElement(exports.LabelText, null, "See resolved")))),
-        items.length >= 0 && (react_1.default.createElement(NoteListContainer, { "data-cy": "notes-list" }, items.map(([target, noteData]) => {
-            const isSelected = (selected &&
-                (selected.node.attrs.id === target ||
-                    selected.node.attrs.rid === target)) ||
-                false;
-            const selectedNoteData = selectResolved
-                ? noteData
-                : noteData.filter((note) => !note.comment.resolved);
-            return (react_1.default.createElement(CommentTarget_1.CommentTarget, { key: target, isSelected: isSelected }, selectedNoteData.map(({ comment, children }) => (react_1.default.createElement(NoteThread, { key: comment._id },
-                react_1.default.createElement(exports.NoteBodyContainer, { isSelected: isSelected, isNew: isNew(comment) },
-                    react_1.default.createElement(CommentWrapper_1.CommentWrapper, { createKeyword: createKeyword, comment: comment, deleteComment: deleteNote, handleSetResolved: () => __awaiter(void 0, void 0, void 0, function* () {
-                            return yield saveModel(Object.assign(Object.assign({}, comment), { resolved: !comment.resolved }));
-                        }), getCollaborator: getCollaboratorById, getKeyword: getKeyword, listCollaborators: listCollaborators, listKeywords: listKeywords, saveComment: saveNote, handleCreateReply: setNoteTarget, isNew: isNew(comment), isSelected: isSelected, isProdNote: true, can: can })),
-                children.map((note) => (react_1.default.createElement(exports.ReplyBodyContainer, { key: note._id },
-                    react_1.default.createElement(CommentWrapper_1.CommentWrapper, { createKeyword: createKeyword, comment: note, deleteComment: deleteNote, getCollaborator: getCollaboratorById, getKeyword: getKeyword, isReply: true, listCollaborators: listCollaborators, listKeywords: listKeywords, saveComment: saveNote, handleCreateReply: setNoteTarget, isNew: isNew(note), isProdNote: true, can: can })))))))));
-        })))));
-});
-const AddNoteButton = (0, styled_components_1.default)(Button_1.IconTextButton) `
-  svg {
-    margin: 0 0 0 ${(props) => props.theme.grid.unit * 4}px;
-    path {
-      fill: ${(props) => props.theme.colors.text.secondary};
-      stroke: ${(props) => props.theme.colors.text.secondary};
-    }
-  }
-  font-size: ${(props) => props.theme.font.size.normal};
-`;
-const NoteListContainer = styled_components_1.default.div `
-  flex: 1;
-  overflow-y: auto;
-`;
-exports.NoteBodyContainer = styled_components_1.default.div `
-  padding: ${(props) => props.theme.grid.unit * 4}px 0
-    ${(props) => props.theme.grid.unit * 2}px;
-  background: ${(props) => props.theme.colors.background.primary};
-
-  ${(props) => borderStyle(props.theme.colors.border.secondary)};
-  ${(props) => (props.isNew || props.isSelected) &&
-    borderStyle(props.theme.colors.border.primary)}
-  ${(props) => props.isSelected &&
-    `background: ${props.theme.colors.background.selected};`}
-
-  .tooltip {
-    border-radius: 6px;
-    padding: 8px;
-    text-align: center;
-  }
-`;
-const borderStyle = (color) => `
-    ${'border: 1px solid ' + color};
-    ${'border-left: 4px solid ' + color};
-`;
-const NoteThread = styled_components_1.default.div `
-  margin: ${(props) => props.theme.grid.unit * 4}px 0;
-`;
-exports.ReplyBodyContainer = styled_components_1.default.div `
-  padding: ${(props) => props.theme.grid.unit * 4}px 0
-    ${(props) => props.theme.grid.unit * 2}px;
-  margin-left: ${(props) => props.theme.grid.unit * 8}px;
-  border: 1px solid ${(props) => props.theme.colors.border.secondary};
-  border-top: none;
-`;
-exports.LightRelativeDate = (0, styled_components_1.default)(RelativeDate_1.RelativeDate) `
-  font-size: ${(props) => props.theme.font.size.small};
-  color: ${(props) => props.theme.colors.text.secondary};
-  letter-spacing: -0.2px;
-`;
-const ActionHeader = styled_components_1.default.div `
-  display: flex;
-  align-items: center;
-  justify-content: ${(props) => (props.withAddButton && 'space-between') || 'flex-end'};
-  padding-left: ${(props) => props.theme.grid.unit * 8}px;
-`;
-exports.LabelText = styled_components_1.default.div `
-  font-family: ${(props) => props.theme.font.family.sans};
-  color: ${(props) => props.theme.colors.text.primary};
-  font-size: 14px;
-  line-height: 24px;
-  margin: 0 !important;
-`;
-const Checkbox = (0, styled_components_1.default)(Checkbox_1.CheckboxLabel) `
-  div {
-    color: ${(props) => props.theme.colors.text.primary};
-  }
-`;

package/dist/es/components/Comments/CommentActions.js

@@ -1,68 +0,0 @@
-/*!
- * © 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.
- */
-import React, { useCallback, useMemo } from 'react';
-import styled from 'styled-components';
-import { useDropdown } from '../../hooks/use-dropdown';
-import { IconTextButton } from '../Button';
-import { DropdownButton, DropdownContainer, DropdownList } from '../Dropdown';
-import { DotsIcon } from '../icons';
-import { ResolveButton } from './ResolveButton';
-export const CommentActions = ({ id, target, can, isResolved, handleSetResolved, deleteComment, setIsEditing, isOwnComment, isProdNote, }) => {
-    const { isOpen, toggleOpen, wrapperRef } = useDropdown();
-    const handleRequestEdit = useCallback(() => {
-        setIsEditing(true);
-    }, [setIsEditing]);
-    const handleRequestDelete = useCallback(() => deleteComment(id, target), [deleteComment, id, target]);
-    const canResolve = useMemo(() => {
-        if (!isProdNote) {
-            return ((isOwnComment && (can === null || can === void 0 ? void 0 : can.resolveOwnComment)) || (can === null || can === void 0 ? void 0 : can.resolveOthersComment));
-        }
-        return can === null || can === void 0 ? void 0 : can.handleNotes;
-    }, [isProdNote, isOwnComment, can]);
-    const canHandle = useMemo(() => {
-        if (!isProdNote) {
-            return ((isOwnComment && (can === null || can === void 0 ? void 0 : can.handleOwnComments)) || (can === null || can === void 0 ? void 0 : can.handleOthersComments));
-        }
-        return can === null || can === void 0 ? void 0 : can.handleNotes;
-    }, [isProdNote, isOwnComment, can]);
-    return (React.createElement(Container, null,
-        canResolve && handleSetResolved && (React.createElement(ResolveButton, { id: id, resolved: isResolved, resolvedCallback: handleSetResolved, "aria-label": 'resolve comment' })),
-        canHandle && (React.createElement(DropdownContainer, { ref: wrapperRef },
-            React.createElement(ActionDropdownButton, { onClick: toggleOpen, className: "note-actions", "aria-label": 'actions list' },
-                React.createElement(DotsIcon, null)),
-            isOpen && (React.createElement(DropdownList, { direction: 'right', width: 125, height: 96, onClick: toggleOpen },
-                React.createElement(ActionButton, { onClick: handleRequestEdit }, "Edit"),
-                React.createElement(ActionButton, { onClick: handleRequestDelete }, "Delete")))))));
-};
-const Container = styled.div `
-  display: flex;
-  align-items: center;
-  height: ${(props) => props.theme.grid.unit * 6}px;
-`;
-const ActionButton = styled(IconTextButton) `
-  display: inline-block;
-  text-align: left;
-  padding-left: ${(props) => props.theme.grid.unit * 4}px;
-`;
-const ActionDropdownButton = styled(DropdownButton) `
-  &:not([disabled]):focus {
-    circle {
-      fill: ${(props) => props.theme.colors.brand.medium};
-    }
-    opacity: 1;
-  }
-  margin-left: ${(props) => props.theme.grid.unit}px;
-`;

package/dist/es/components/Comments/CommentBody.js

@@ -1,131 +0,0 @@
-/*!
- * © 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.
- */
-import { Field, Form, Formik } from 'formik';
-import React, { useEffect } from 'react';
-import styled from 'styled-components';
-import { ButtonGroup, PrimaryButton, SecondaryButton } from '../Button';
-import { FormError } from '../Form';
-import { CommentReplyIcon } from '../icons';
-import { Tooltip } from '../Tooltip';
-export const CommentBody = React.memo(({ comment, saveComment, deleteComment, isReply, isNew, handleCreateReply, setIsEditing, scrollIntoHighlight, onFocusOut, isEditing, isProdNote, }) => {
-    useEffect(() => {
-        if (isNew) {
-            setIsEditing(true);
-        }
-    }, [isNew, setIsEditing]);
-    const cancelEditing = () => {
-        setIsEditing(false);
-        if (isNew) {
-            deleteComment(comment._id);
-        }
-    };
-    return (React.createElement(React.Fragment, null, isEditing ? (React.createElement(Formik, { initialValues: comment, onSubmit: (values, actions) => {
-            actions.setSubmitting(true);
-            saveComment(values);
-            setIsEditing(false);
-        } }, ({ errors, values, setFieldValue }) => (React.createElement(Form, null,
-        errors.contents && React.createElement(FormError, null, errors.contents),
-        React.createElement(Field, { name: 'contents' }, (props) => (React.createElement(CommentContent, null,
-            React.createElement(StyledCommentField, { id: comment._id, autoFocus: isEditing, value: values.contents, onChange: (event) => setFieldValue(props.field.name, event.target.value), onBlur: (event) => onFocusOut &&
-                    onFocusOut(comment._id, event.target.value), placeholder: !isReply ? 'Comment...' : 'Reply...' })))),
-        React.createElement(EditingCommentFooter, null,
-            React.createElement(Actions, null,
-                React.createElement(SecondaryButton, { onClick: cancelEditing }, "Cancel"),
-                React.createElement(PrimaryButton, { disabled: !values.contents.replace(/<[^>]+>/g, '').length ||
-                        (!isNew &&
-                            (comment.contents === values.contents ||
-                                !values.contents.replace(/<[^>]+>/g, '').length)), type: "submit" }, "Save"))))))) : (React.createElement("div", null,
-        React.createElement(CommentContent, { onClick: () => scrollIntoHighlight && scrollIntoHighlight(comment) },
-            React.createElement(StyledCommentViewer, { "data-cy": "note-text" }, comment.contents)),
-        !isReply && (React.createElement(CommentFooter, null,
-            React.createElement("span", null,
-                React.createElement(ActionButton, { hidden: !isProdNote, "data-tooltip-id": `reply-${comment._id}`, onClick: () => handleCreateReply(comment._id), "aria-label": 'reply', className: "reply-button note-actions" },
-                    React.createElement(CommentReplyIcon, null))),
-            React.createElement(Tooltip, { id: `reply-${comment._id}`, place: "bottom" }, "Reply")))))));
-});
-const CommentFooter = styled.div `
-  margin-bottom: ${(props) => props.theme.grid.unit * 2}px;
-  padding: ${(props) => props.theme.grid.unit * 2}px
-    ${(props) => props.theme.grid.unit * 2}px 0;
-  display: flex;
-  justify-content: flex-end;
-  height: ${(props) => props.theme.grid.unit * 6}px;
-`;
-const EditingCommentFooter = styled(CommentFooter) `
-  justify-content: flex-end;
-  padding: ${(props) => props.theme.grid.unit * 2}px
-    ${(props) => props.theme.grid.unit * 4}px 0;
-`;
-const ActionButton = styled.button `
-  border: none;
-  background: none;
-  cursor: pointer;
-  &:not([disabled]):hover {
-    path {
-      stroke: ${(props) => props.theme.colors.brand.medium};
-    }
-  }
-`;
-const CommentContent = styled.div `
-  cursor: pointer;
-  padding: 0 ${(props) => props.theme.grid.unit * 4}px;
-`;
-const StyledCommentField = styled.textarea `
-  cursor: text;
-  font-family: ${(props) => props.theme.font.family.sans};
-  color: ${(props) => props.theme.colors.text.primary};
-  margin: ${(props) => props.theme.grid.unit * 2}px 0;
-  resize: none;
-
-  width: 100%;
-  outline: 0;
-  border: 1px solid #e2e2e2;
-  border-radius: 6px;
-
-  &:focus {
-    background: #f2fbfc;
-    border: 1px solid #bce7f6;
-    border-radius: 6px;
-  }
-
-  .empty-node::before {
-    position: absolute;
-    color: #c9c9c9;
-    cursor: text;
-    pointer-events: none;
-  }
-
-  box-sizing: border-box;
-  padding: 3px 16px 3px 16px;
-  font-style: normal;
-  font-weight: normal;
-  font-size: 14px;
-  line-height: 24px;
-`;
-const StyledCommentViewer = styled.div `
-  flex: 1;
-
-  font-family: ${(props) => props.theme.font.family.sans};
-  line-height: 1.06;
-  letter-spacing: -0.2px;
-  color: ${(props) => props.theme.colors.text.primary};
-  margin: ${(props) => props.theme.grid.unit * 2}px 0;
-`;
-const Actions = styled(ButtonGroup) `
-  & button:not(:last-of-type) {
-    margin-right: 4px;
-  }
-`;

package/dist/es/components/Comments/CommentTarget.js

@@ -1,29 +0,0 @@
-/*!
- * © 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.
- */
-import React, { useEffect } from 'react';
-export const CommentTarget = React.memo(({ isSelected, children }) => {
-    const threadRef = React.createRef();
-    useEffect(() => {
-        if (threadRef.current && isSelected) {
-            threadRef.current.scrollIntoView({
-                behavior: 'smooth',
-                block: 'start',
-                inline: 'nearest',
-            });
-        }
-    });
-    return (React.createElement("div", { "data-cy": "comment-target", ref: threadRef }, children));
-});

package/dist/es/components/Comments/CommentUser.js

@@ -1,69 +0,0 @@
-/*!
- * © 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.
- */
-import React from 'react';
-import styled from 'styled-components';
-import { Avatar } from '../Avatar';
-import { LightRelativeDate } from '../ManuscriptNoteList';
-const CommentUserContainer = styled.div `
-  display: flex;
-`;
-const CommentUserName = styled.div `
-  margin: 0 ${(props) => props.theme.grid.unit * 2}px;
-  font-weight: ${(props) => props.theme.font.weight.normal};
-  max-width: ${(props) => props.theme.grid.unit * 50}px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-`;
-const DateText = styled(CommentUserName) `
-  font-size: ${(props) => props.theme.font.size.small};
-  line-height: ${(props) => props.theme.font.lineHeight.normal};
-  font-weight: ${(props) => props.theme.font.weight.normal};
-  color: ${(props) => props.theme.colors.text.secondary};
-`;
-const Header = styled.div `
-  display: flex;
-  flex-direction: column;
-  font-size: ${(props) => props.theme.font.size.normal};
-`;
-export const CommentUser = ({ contributions, getCollaboratorById, displayName, createdAt }) => {
-    if (!contributions || !contributions.length) {
-        return (React.createElement(CommentUserContainer, null,
-            React.createElement(Header, null,
-                React.createElement(Avatar, { size: 20 })),
-            React.createElement(Header, null,
-                React.createElement(CommentUserName, null,
-                    "By ",
-                    displayName || '(unknown user)'),
-                React.createElement(DateText, null,
-                    React.createElement(LightRelativeDate, { createdAt: createdAt })))));
-    }
-    const [contribution] = contributions;
-    const user = getCollaboratorById(contribution.profileID);
-    const buildName = (name) => [name.given, name.family].filter((item) => item).join(' ');
-    if (!user) {
-        return null;
-    }
-    return (React.createElement(CommentUserContainer, null,
-        React.createElement(Header, null,
-            React.createElement(Avatar, { size: 20 })),
-        React.createElement(Header, null,
-            React.createElement(CommentUserName, null,
-                "By ",
-                buildName(user.bibliographicName)),
-            React.createElement(DateText, null,
-                React.createElement(LightRelativeDate, { createdAt: createdAt })))));
-};