@manuscripts/body-editor 3.12.17 → 3.12.20

package/styles/AdvancedEditor.css

@@ -162,6 +162,10 @@
     [caption listing] auto !important;
 }
 
+.ProseMirror .figure-block {
+  text-align: center;
+}
+
 .ProseMirror .figure-block-group .figure-block {
   border: none;
   border-radius: 0;
@@ -254,16 +258,6 @@
   padding-bottom: 20px;
 }
 
-.ProseMirror .figure-block > figcaption {
-  grid-column-start: 1;
-  grid-column-end: -1;
-  margin-top: 30px;
-}
-
-.ProseMirror .figure-caption {
-  display: none;
-}
-
 .ProseMirror .figure.placeholder {
   align-items: center;
   border-radius: 16px;
@@ -319,22 +313,6 @@
   border: none;
 }
 
-.ProseMirror figcaption {
-  background: white;
-  font-size: 14px;
-  margin-top: 1em;
-  text-align: center;
-  word-wrap: break-word;
-}
-
-.ProseMirror .block-table_element figcaption {
-  text-align: left;
-}
-
-.ProseMirror .figure-block > figcaption .figure-label {
-  display: initial !important;
-}
-
 .ProseMirror .figure-block[id^='MPTable'] {
   border-collapse: collapse;
   empty-cells: show;
@@ -365,11 +343,6 @@
   border-bottom-width: 1pt !important;
 }
 
-.ProseMirror .figure-block[id^='MPTable'] > figcaption {
-  grid-row: 2 !important;
-  text-align: center !important;
-}
-
 .position-menu-button:focus-visible {
   outline: none;
 }
@@ -449,11 +422,6 @@ ProseMirror .block-embed .position-menu {
 .ProseMirror .block-affiliations {
   grid-template-columns: 52px auto 100px;
 }
-.ProseMirror .block-container.block-box_element > .block.box-element {
-  position: relative;
-  display: grid;
-  grid-template-columns: auto;
-}
 
 .ProseMirror .box-element .block-container .block {
   background: var(--box-element-bg-color);
@@ -462,8 +430,8 @@ ProseMirror .block-embed .position-menu {
   border-right: 2px solid #e2e2e2;
 }
 
-.ProseMirror .box-element::after,
-.box-element > .block-section::before {
+.ProseMirror .box-element > .block-section::before,
+.ProseMirror .box-element > .block-section::after {
   content: ' ';
   margin-left: 52px;
   margin-right: 52px;
@@ -471,11 +439,16 @@ ProseMirror .block-embed .position-menu {
   height: 0;
 }
 
-.box-element > figcaption {
-  margin-left: 54px;
-  margin-right: 54px;
-  padding-bottom: 6px;
-  text-align: left;
+.ProseMirror .box-element > .block-section {
+  padding-top: 6px;
+}
+
+.ProseMirror .box-element > .element-label {
+  margin-left: 52px;
+}
+
+.ProseMirror .box-element > .caption-title {
+  margin-right: 52px;
 }
 
 .ProseMirror
@@ -496,9 +469,7 @@ ProseMirror .block-embed .position-menu {
   > h1.empty-node[data-placeholder]::before {
   font-size: 16pt;
 }
-.box-element section figcaption {
-  background: var(--box-element-bg-color);
-}
+
 .unsupported-format-label {
   font-size: 140%;
   line-height: 1.3;
@@ -1854,8 +1825,7 @@ th:hover > .table-context-menu-button,
 
 .ProseMirror .block-image_element .block:focus-visible,
 .ProseMirror .block-figure_element .block:focus-visible,
-.ProseMirror .block-embed .block:focus-visible,
-.ProseMirror .supplement-caption:focus-visible {
+.ProseMirror .block-embed .block:focus-visible {
   outline: none;
 }
 

package/styles/Editor.css

@@ -308,82 +308,55 @@
   padding-top: 1em;
 }
 
-.ProseMirror .caption-title:not(.empty-node) {
+/* Caption and Element Label */
+
+.ProseMirror .caption-title:not(.empty-node), .ProseMirror .element-label {
   font-weight: bold;
 }
 
-.ProseMirror .caption-description {
+.ProseMirror .element-label, .ProseMirror .caption-description, .ProseMirror .caption-title {
+  font-size: 14px;
+  outline: none;
   margin: 0;
-  outline: none !important;
+  display: inline;
 }
 
-.ProseMirror .suppress-title .caption-description {
+.ProseMirror .element-label + .caption-description > p:first-child {
   display: inline;
-  outline: none !important;
-}
-.ProseMirror .caption-title {
-  outline: none !important;
 }
 
-.ProseMirror .caption-title.empty-node::before {
-  content: 'Caption Title...';
-  color: #000;
-  cursor: text;
+.ProseMirror .caption-description > p {
+  margin: 0;
 }
 
-.ProseMirror .block-box_element .caption-title.empty-node::before {
-  content: none;
+.ProseMirror .element-label {
+  margin-right: 5px;
 }
 
-.ProseMirror .block-box_element label.caption-title.placeholder.empty-node {
-  display: inline-flex;
+.ProseMirror .block-equation_element .element-label {
+  display: block;
+  text-align: center;
 }
 
-.ProseMirror .block-box_element .caption-title.empty-node::after {
+.ProseMirror .caption-title.empty-node::before {
   content: 'Caption Title...';
-  color: #999;
-  font-style: italic;
-  pointer-events: none;
+  color: #000;
+  cursor: text;
 }
 
-.ProseMirror .caption-description.empty-node::before {
+.ProseMirror .caption-description > p.empty-node::before {
   content: 'Caption...';
   color: #000;
   cursor: text;
 }
 
-.ProseMirror .block-table_element .caption-description.empty-node::before {
-  content: 'Table caption';
-}
-
 .ProseMirror .block-table_element .caption-title.empty-node::before {
   content: 'Table title';
 }
 
-.ProseMirror .suppress-caption .caption-description {
-  display: none;
-}
-
-.ProseMirror .suppress-caption figcaption > .figure-label {
-  display: none !important;
-}
-
-.ProseMirror .suppress-title .caption-title {
-  display: none;
-}
-
-.ProseMirror .figure-label {
-  font-weight: bold;
-  font-size: 14px;
-  margin-right: 5px;
-  white-space: nowrap;
-}
-
-.block-image_element .figure-label {
-  display: block;
-  text-align: center;
-  grid-column-start: 1;
-  grid-column-end: -1;
+.ProseMirror .box-element > .caption-title.empty-node::before {
+  color: #999;
+  font-style: italic;
 }
 
 .ProseMirror .executable-container {
@@ -860,21 +833,18 @@
   max-width: 100%;
 }
 
-.ProseMirror figcaption .equation,
 .ProseMirror p .equation {
   display: inline;
   vertical-align: baseline;
   padding: 0 5px;
 }
 
-.ProseMirror figcaption .equation-placeholder,
 .ProseMirror p .equation-placeholder {
   display: inline;
 }
 
 .ProseMirror .code-placeholder,
-.ProseMirror .equation-placeholder,
-.ProseMirror .caption-placeholder {
+.ProseMirror .equation-placeholder {
   color: #c9c9c9;
 }
 
@@ -1229,23 +1199,22 @@
   border-bottom: none;
 }
 
-.ProseMirror .supplement-item figcaption {
-  text-align: left;
-  margin-top: 0;
-}
-
 .ProseMirror .supplement-item .caption-title.empty-node::before {
   content: 'Insert caption title...';
   color: #c9c9c9;
   font-style: italic;
 }
 
-.ProseMirror .supplement-item .caption-description.empty-node::before {
+.ProseMirror .supplement-item .caption-description > p.empty-node::before {
   content: 'Insert caption...';
   color: #c9c9c9;
   font-style: italic;
 }
 
+.ProseMirror .supplement-item .caption-description > p {
+  text-align: start;
+}
+
 .ProseMirror .supplement-file-info {
   display: flex;
   align-items: center;
@@ -1341,10 +1310,6 @@
   cursor: move;
 }
 
-.ProseMirror .supplement-item:hover figcaption {
-  background-color: #f2f2f2 !important;
-}
-
 .ProseMirror .supplement-item .drag-icon {
   position: absolute;
   top: 50%;

package/dist/cjs/components/authors/AffiliationDrawer.js

@@ -1,24 +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.AffiliationsDrawer = void 0;
-const style_guide_1 = require("@manuscripts/style-guide");
-const react_1 = __importDefault(require("react"));
-const AffiliationsDrawer = ({ items, selectedItems = [], onSelect, ...drawerProps }) => {
-    return (react_1.default.createElement(style_guide_1.Drawer, { ...drawerProps },
-        react_1.default.createElement(style_guide_1.DrawerItemsList, null, items.map((item) => (react_1.default.createElement(style_guide_1.DrawerListItem, { "data-cy": "item", key: item.id, selected: selectedItems?.map((a) => a.id).includes(item.id), onClick: () => onSelect(item.id) },
-            react_1.default.createElement(style_guide_1.DrawerIcon, null, selectedItems?.map((a) => a.id).includes(item.id) ? (react_1.default.createElement(style_guide_1.AddedIcon, { width: 22, height: 22 })) : (react_1.default.createElement(style_guide_1.AddIcon, { width: 22, height: 22 }))),
-            react_1.default.createElement(style_guide_1.DrawerLabelContainer, null,
-                react_1.default.createElement(style_guide_1.DrawerItemLabel, null, item.institution),
-                react_1.default.createElement(style_guide_1.DrawerItemMeta, null,
-                    item.city && (react_1.default.createElement(react_1.default.Fragment, null,
-                        item.city,
-                        item.county || item.country ? ', ' : '')),
-                    item.county && (react_1.default.createElement(react_1.default.Fragment, null,
-                        item.county,
-                        item.country ? ', ' : '')),
-                    item.country && react_1.default.createElement(react_1.default.Fragment, null, item.country)))))))));
-};
-exports.AffiliationsDrawer = AffiliationsDrawer;

package/dist/es/components/authors/AffiliationDrawer.js

@@ -1,17 +0,0 @@
-import { AddedIcon, AddIcon, Drawer, DrawerIcon, DrawerItemLabel, DrawerItemMeta, DrawerItemsList, DrawerLabelContainer, DrawerListItem, } from '@manuscripts/style-guide';
-import React from 'react';
-export const AffiliationsDrawer = ({ items, selectedItems = [], onSelect, ...drawerProps }) => {
-    return (React.createElement(Drawer, { ...drawerProps },
-        React.createElement(DrawerItemsList, null, items.map((item) => (React.createElement(DrawerListItem, { "data-cy": "item", key: item.id, selected: selectedItems?.map((a) => a.id).includes(item.id), onClick: () => onSelect(item.id) },
-            React.createElement(DrawerIcon, null, selectedItems?.map((a) => a.id).includes(item.id) ? (React.createElement(AddedIcon, { width: 22, height: 22 })) : (React.createElement(AddIcon, { width: 22, height: 22 }))),
-            React.createElement(DrawerLabelContainer, null,
-                React.createElement(DrawerItemLabel, null, item.institution),
-                React.createElement(DrawerItemMeta, null,
-                    item.city && (React.createElement(React.Fragment, null,
-                        item.city,
-                        item.county || item.country ? ', ' : '')),
-                    item.county && (React.createElement(React.Fragment, null,
-                        item.county,
-                        item.country ? ', ' : '')),
-                    item.country && React.createElement(React.Fragment, null, item.country)))))))));
-};

package/dist/types/components/authors/AffiliationDrawer.d.ts

@@ -1,12 +0,0 @@
-import { DrawerProps } from '@manuscripts/style-guide';
-import React from 'react';
-import { AffiliationAttrs } from '../../lib/authors';
-interface AffiliationsDrawerProps {
-    items: AffiliationAttrs[];
-    selectedItems: {
-        id: string;
-    }[];
-    onSelect: (id: string) => void;
-}
-export declare const AffiliationsDrawer: React.FC<AffiliationsDrawerProps & Omit<DrawerProps, 'children'>>;
-export {};