@manuscripts/body-editor 3.12.31 → 3.12.33

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

@@ -137,7 +137,7 @@ const AuthorDetailsForm = ({ values, onChange, onSave, actionsRef, isEmailRequir
                         (0, formik_1.getIn)(formik.errors, 'ORCID');
                     return (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(style_guide_1.Label, { htmlFor: "orcid" }, "ORCID"),
-                        react_1.default.createElement(TextFieldWithError, { id: 'orcid', type: "url", placeholder: 'https://orcid.org/...', ...props.field, pattern: ORCID_INPUT_PATTERN, title: "Please enter a valid ORCID URL: https://orcid.org/xxxx-xxxx-xxxx-xxxx", error: hasError }),
+                        react_1.default.createElement(TextFieldWithError, { id: 'orcid', disabled: values.isAuthenticated, type: "url", placeholder: 'https://orcid.org/...', ...props.field, pattern: ORCID_INPUT_PATTERN, title: "Please enter a valid ORCID URL: https://orcid.org/xxxx-xxxx-xxxx-xxxx", error: hasError }),
                         hasError && (react_1.default.createElement(style_guide_1.InputErrorText, null, (0, formik_1.getIn)(formik.errors, 'ORCID')))));
                 })),
             react_1.default.createElement(style_guide_1.FormRow, null,

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

@@ -58,6 +58,7 @@ const react_dnd_1 = require("react-dnd");
 const styled_components_1 = __importDefault(require("styled-components"));
 const authors_1 = require("../../lib/authors");
 const dnd_1 = require("../../lib/dnd");
+const styled_components_2 = require("../references/ReferenceForm/styled-components");
 const AuthorContainer = (0, style_guide_1.withNavigableListItem)(styled_components_1.default.div `
   padding: ${(props) => props.theme.grid.unit * 2}px 0
     ${(props) => props.theme.grid.unit * 2}px;
@@ -125,11 +126,9 @@ const DragHandle = (0, styled_components_1.default)(style_guide_1.DraggableIcon)
   margin-left: -4px;
   margin-right: -12px;
 `;
-const RemoveButton = (0, styled_components_1.default)(style_guide_1.SecondaryIconButton) `
-  svg {
-    path[fill='white'] {
-      fill: white;
-    }
+const RemoveButton = (0, styled_components_1.default)(styled_components_2.DeleteButton) `
+  .icon_element {
+    fill: ${(props) => (props.disabled && '#c9c9c9') || '#6E6E6E'} !important;
   }
 `;
 const StyledCrclTickAnimation = (0, styled_components_1.default)(style_guide_1.CrclTickAnimation) `

package/dist/cjs/components/modal-drawer/GenericDrawerGroup.js

@@ -34,7 +34,7 @@ function DrawerGroup({ removeItem, selectedItems, onSelect, items, showDrawer, s
             })), onRemove: removeItem, placeholder: `No ${title} assigned` }),
         showDrawer && (react_1.default.createElement(Drawer, { items: items, selectedItems: selectedItems, title: title, onSelect: onSelect, onBack: () => setShowDrawer(false), width: "100%" }))));
 }
-exports.AssignButton = styled_components_1.default.button `
+exports.AssignButton = (0, styled_components_1.default)(style_guide_1.IconButton) `
   color: ${(props) => props.theme.colors.brand.default};
   background: none;
   border: none;
@@ -43,10 +43,16 @@ exports.AssignButton = styled_components_1.default.button `
   font: ${(props) => props.theme.font.weight.normal}
     ${(props) => props.theme.font.size.normal}
     ${(props) => props.theme.font.family.sans};
-  display: flex;
-  align-items: center;
   gap: 4px;
-  margin-bottom: ${(props) => props.theme.grid.unit * 2}px;
+  width: auto;
+  height: 24px;
+
+  &:disabled {
+    color: #c9c9c9 !important;
+    background-color: unset !important;
+    border: unset;
+  }
+
   &:hover {
     opacity: 0.8;
   }

package/dist/cjs/components/toolbar/InsertEmbedDialog.js

@@ -56,7 +56,6 @@ const style_guide_1 = require("@manuscripts/style-guide");
 const react_1 = __importStar(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const commands_1 = require("../../commands");
-const oembed_1 = require("../../lib/oembed");
 const url_1 = require("../../lib/url");
 const use_do_with_debounce_1 = require("../../lib/use-do-with-debounce");
 const editor_props_1 = require("../../plugins/editor-props");
@@ -98,8 +97,10 @@ const InsertEmbedDialog = ({ state, dispatch, pos, }) => {
     };
     (0, react_1.useEffect)(() => {
         debounce(async () => {
-            const html = await (0, oembed_1.getOEmbedHTML)(url, 368, 217);
-            setOEmbedHTML(html);
+            if (url && (0, url_1.allowedHref)(url)) {
+                const html = await (0, editor_props_1.getEditorProps)(state).fetchOEmbedHtml(url, 368, 217);
+                setOEmbedHTML(html);
+            }
         });
     }, [url]);
     const operation = pos !== undefined && attrs?.href ? 'Update' : 'Insert';

package/dist/cjs/lib/__tests__/plugins.test.js

@@ -43,6 +43,7 @@ const buildProps = (doc) => ({
         category.id,
         category,
     ])),
+    fetchOEmbedHtml: async () => undefined,
 });
 describe('editor view', () => {
     const doc = transform_1.schema.nodeFromJSON(doc_json_1.default);

package/dist/cjs/lib/normalize.js

@@ -28,6 +28,7 @@ const normalizeAuthor = (author) => {
         email: trim(author.email),
         isCorresponding: author.isCorresponding || false,
         ORCID: trim(author.ORCID),
+        isAuthenticated: author.isAuthenticated || false,
         priority: author.priority,
         isJointContributor: author.isJointContributor || false,
         degrees: author.degrees || [],

package/dist/cjs/testing/default-editor-data.js

@@ -63,4 +63,5 @@ exports.defaultEditorProps = {
         category.id,
         category,
     ])),
+    fetchOEmbedHtml: async () => undefined,
 };

package/dist/cjs/versions.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MATHJAX_VERSION = exports.VERSION = void 0;
-exports.VERSION = '3.12.31';
+exports.VERSION = '3.12.33';
 exports.MATHJAX_VERSION = '3.2.2';

package/dist/cjs/views/embed.js

@@ -9,7 +9,6 @@ const prosemirror_state_1 = require("prosemirror-state");
 const InsertEmbedDialog_1 = require("../components/toolbar/InsertEmbedDialog");
 const get_media_type_1 = require("../lib/get-media-type");
 const media_1 = require("../lib/media");
-const oembed_1 = require("../lib/oembed");
 const url_1 = require("../lib/url");
 const block_view_1 = __importDefault(require("./block_view"));
 const creators_1 = require("./creators");
@@ -204,7 +203,7 @@ class EmbedView extends block_view_1.default {
         const container = document.createElement('div');
         container.classList.add('embed-preview');
         try {
-            const html = await (0, oembed_1.getOEmbedHTML)(this.node.attrs.href, 643, 363);
+            const html = await this.props.fetchOEmbedHtml(this.node.attrs.href, 643, 363);
             if (html) {
                 container.innerHTML = html;
             }

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

@@ -98,7 +98,7 @@ export const AuthorDetailsForm = ({ values, onChange, onSave, actionsRef, isEmai
                         getIn(formik.errors, 'ORCID');
                     return (React.createElement(React.Fragment, null,
                         React.createElement(Label, { htmlFor: "orcid" }, "ORCID"),
-                        React.createElement(TextFieldWithError, { id: 'orcid', type: "url", placeholder: 'https://orcid.org/...', ...props.field, pattern: ORCID_INPUT_PATTERN, title: "Please enter a valid ORCID URL: https://orcid.org/xxxx-xxxx-xxxx-xxxx", error: hasError }),
+                        React.createElement(TextFieldWithError, { id: 'orcid', disabled: values.isAuthenticated, type: "url", placeholder: 'https://orcid.org/...', ...props.field, pattern: ORCID_INPUT_PATTERN, title: "Please enter a valid ORCID URL: https://orcid.org/xxxx-xxxx-xxxx-xxxx", error: hasError }),
                         hasError && (React.createElement(InputErrorText, null, getIn(formik.errors, 'ORCID')))));
                 })),
             React.createElement(FormRow, null,

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

@@ -13,12 +13,13 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { Avatar, CorrespondingAuthorIcon, CrclTickAnimation, DeleteIcon, DraggableIcon, SecondaryIconButton, withNavigableListItem, } from '@manuscripts/style-guide';
+import { Avatar, CorrespondingAuthorIcon, CrclTickAnimation, DeleteIcon, DraggableIcon, withNavigableListItem, } from '@manuscripts/style-guide';
 import React, { useRef, useState } from 'react';
 import { useDrag, useDrop } from 'react-dnd';
 import styled from 'styled-components';
 import { authorLabel } from '../../lib/authors';
 import { getDropSide } from '../../lib/dnd';
+import { DeleteButton } from '../references/ReferenceForm/styled-components';
 const AuthorContainer = withNavigableListItem(styled.div `
   padding: ${(props) => props.theme.grid.unit * 2}px 0
     ${(props) => props.theme.grid.unit * 2}px;
@@ -86,11 +87,9 @@ const DragHandle = styled(DraggableIcon) `
   margin-left: -4px;
   margin-right: -12px;
 `;
-const RemoveButton = styled(SecondaryIconButton) `
-  svg {
-    path[fill='white'] {
-      fill: white;
-    }
+const RemoveButton = styled(DeleteButton) `
+  .icon_element {
+    fill: ${(props) => (props.disabled && '#c9c9c9') || '#6E6E6E'} !important;
   }
 `;
 const StyledCrclTickAnimation = styled(CrclTickAnimation) `

package/dist/es/components/modal-drawer/GenericDrawerGroup.js

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { outlineStyle, SelectedItemsBox, } from '@manuscripts/style-guide';
+import { outlineStyle, SelectedItemsBox, IconButton, } from '@manuscripts/style-guide';
 import React from 'react';
 import styled from 'styled-components';
 export function DrawerGroup({ removeItem, selectedItems, onSelect, items, showDrawer, setShowDrawer, title, labelField, Drawer, cy, Icon, buttonText, }) {
@@ -27,7 +27,7 @@ export function DrawerGroup({ removeItem, selectedItems, onSelect, items, showDr
             })), onRemove: removeItem, placeholder: `No ${title} assigned` }),
         showDrawer && (React.createElement(Drawer, { items: items, selectedItems: selectedItems, title: title, onSelect: onSelect, onBack: () => setShowDrawer(false), width: "100%" }))));
 }
-export const AssignButton = styled.button `
+export const AssignButton = styled(IconButton) `
   color: ${(props) => props.theme.colors.brand.default};
   background: none;
   border: none;
@@ -36,10 +36,16 @@ export const AssignButton = styled.button `
   font: ${(props) => props.theme.font.weight.normal}
     ${(props) => props.theme.font.size.normal}
     ${(props) => props.theme.font.family.sans};
-  display: flex;
-  align-items: center;
   gap: 4px;
-  margin-bottom: ${(props) => props.theme.grid.unit * 2}px;
+  width: auto;
+  height: 24px;
+
+  &:disabled {
+    color: #c9c9c9 !important;
+    background-color: unset !important;
+    border: unset;
+  }
+
   &:hover {
     opacity: 0.8;
   }

package/dist/es/components/toolbar/InsertEmbedDialog.js

@@ -17,7 +17,6 @@ import { ButtonGroup, DialogModalBody, MessageContainer, PrimaryBoldHeading, Pri
 import React, { useEffect, useState } from 'react';
 import styled from 'styled-components';
 import { insertEmbed } from '../../commands';
-import { getOEmbedHTML } from '../../lib/oembed';
 import { allowedHref } from '../../lib/url';
 import { useDoWithDebounce } from '../../lib/use-do-with-debounce';
 import { getEditorProps } from '../../plugins/editor-props';
@@ -59,8 +58,10 @@ export const InsertEmbedDialog = ({ state, dispatch, pos, }) => {
     };
     useEffect(() => {
         debounce(async () => {
-            const html = await getOEmbedHTML(url, 368, 217);
-            setOEmbedHTML(html);
+            if (url && allowedHref(url)) {
+                const html = await getEditorProps(state).fetchOEmbedHtml(url, 368, 217);
+                setOEmbedHTML(html);
+            }
         });
     }, [url]);
     const operation = pos !== undefined && attrs?.href ? 'Update' : 'Insert';

package/dist/es/lib/__tests__/plugins.test.js

@@ -38,6 +38,7 @@ const buildProps = (doc) => ({
         category.id,
         category,
     ])),
+    fetchOEmbedHtml: async () => undefined,
 });
 describe('editor view', () => {
     const doc = schema.nodeFromJSON(jsonDoc);

package/dist/es/lib/normalize.js

@@ -25,6 +25,7 @@ export const normalizeAuthor = (author) => {
         email: trim(author.email),
         isCorresponding: author.isCorresponding || false,
         ORCID: trim(author.ORCID),
+        isAuthenticated: author.isAuthenticated || false,
         priority: author.priority,
         isJointContributor: author.isJointContributor || false,
         degrees: author.degrees || [],

package/dist/es/testing/default-editor-data.js

@@ -57,4 +57,5 @@ export const defaultEditorProps = {
         category.id,
         category,
     ])),
+    fetchOEmbedHtml: async () => undefined,
 };

package/dist/es/versions.js

@@ -1,2 +1,2 @@
-export const VERSION = '3.12.31';
+export const VERSION = '3.12.33';
 export const MATHJAX_VERSION = '3.2.2';

package/dist/es/views/embed.js

@@ -3,7 +3,6 @@ import { NodeSelection } from 'prosemirror-state';
 import { NoPreviewMessageWithLink, openEmbedDialog, } from '../components/toolbar/InsertEmbedDialog';
 import { getMediaTypeInfo } from '../lib/get-media-type';
 import { addInteractionHandlers, createFileHandlers, createFileUploader, createMediaPlaceholder, createReactTools, createUnsupportedFormat, MediaType, } from '../lib/media';
-import { getOEmbedHTML } from '../lib/oembed';
 import { allowedHref } from '../lib/url';
 import BlockView from './block_view';
 import { createEditableNodeView } from './creators';
@@ -198,7 +197,7 @@ export class EmbedView extends BlockView {
         const container = document.createElement('div');
         container.classList.add('embed-preview');
         try {
-            const html = await getOEmbedHTML(this.node.attrs.href, 643, 363);
+            const html = await this.props.fetchOEmbedHtml(this.node.attrs.href, 643, 363);
             if (html) {
                 container.innerHTML = html;
             }

package/dist/types/components/modal-drawer/GenericDrawerGroup.d.ts

@@ -39,5 +39,15 @@ interface EmbeddedDrawerProps<T extends Base> {
     onSelect: (id: string) => void;
 }
 export declare function DrawerGroup<T extends Base>({ removeItem, selectedItems, onSelect, items, showDrawer, setShowDrawer, title, labelField, Drawer, cy, Icon, buttonText, }: DrawerGroupProps<T>): React.JSX.Element;
-export declare const AssignButton: import("styled-components").StyledComponent<"button", any, {}, never>;
+export declare const AssignButton: import("styled-components").StyledComponent<"button", any, {
+    type: "button" | "submit" | "reset";
+} & {
+    danger?: boolean;
+    disabled?: boolean;
+    mini?: boolean;
+} & {
+    defaultColor?: boolean;
+    size?: number;
+    iconColor?: string;
+}, "type">;
 export {};

package/dist/types/configs/ManuscriptsEditor.d.ts

@@ -25,6 +25,7 @@ import { Language } from '../lib/languages';
 import { Capabilities } from '../lib/capabilities';
 import { FileAttachment, FileManagement } from '../lib/files';
 import { PopperManager } from '../lib/popper';
+export type FetchOEmbedHtml = (url: string, maxWidth: number, maxHeight: number) => Promise<string | undefined>;
 export type CSLProps = {
     style?: string;
     locale?: string;
@@ -56,6 +57,7 @@ export interface EditorProps {
     lockBody: boolean;
     isViewingMode?: boolean;
     hiddenNodeTypes?: ManuscriptNodeType[] | undefined;
+    fetchOEmbedHtml: FetchOEmbedHtml;
 }
 export type ExternalProps = Omit<EditorProps, 'popper' | 'dispatch'>;
 export declare const createEditorState: (props: EditorProps) => EditorState;

package/dist/types/index.d.ts

@@ -32,6 +32,7 @@ export * from './lib/footnotes';
 export * from './lib/template';
 export * from './lib/doc';
 export * from './lib/media';
+export type { FetchOEmbedHtml } from './configs/ManuscriptsEditor';
 export * from './plugins/comments';
 export { selectedSuggestionKey } from './plugins/selected-suggestion';
 export * from './selection';

package/dist/types/versions.d.ts

@@ -1,2 +1,2 @@
-export declare const VERSION = "3.12.31";
+export declare const VERSION = "3.12.33";
 export declare const MATHJAX_VERSION = "3.2.2";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/body-editor",
   "description": "Prosemirror components for editing and viewing manuscripts",
-  "version": "3.12.31",
+  "version": "3.12.33",
   "repository": "github:Atypon-OpenSource/manuscripts-body-editor",
   "license": "Apache-2.0",
   "main": "dist/cjs",
@@ -37,9 +37,9 @@
     "@citation-js/plugin-pubmed": "0.3.0",
     "@citation-js/plugin-ris": "0.7.18",
     "@iarna/word-count": "1.1.2",
-    "@manuscripts/style-guide": "3.5.10",
+    "@manuscripts/style-guide": "3.5.11",
     "@manuscripts/track-changes-plugin": "2.3.10",
-    "@manuscripts/transform": "4.3.37",
+    "@manuscripts/transform": "4.3.38",
     "@popperjs/core": "2.11.8",
     "citeproc": "2.4.63",
     "codemirror": "5.65.19",
@@ -50,7 +50,6 @@
     "history": "5.3.0",
     "lodash": "4.17.21",
     "mathjax": "3.2.2",
-    "oembed-providers": "1.0.20250430",
     "prosemirror-collab": "1.3.1",
     "prosemirror-commands": "1.7.1",
     "prosemirror-dropcursor": "1.8.2",

package/dist/cjs/lib/oembed.js

@@ -1,84 +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.getOEmbedHTML = exports.getOEmbedUrl = void 0;
-const oembed_providers_1 = __importDefault(require("oembed-providers"));
-const getOEmbedUrl = async (url, width, height) => {
-    let oembedUrl;
-    for (const provider of oembed_providers_1.default) {
-        if (provider) {
-            const { provider_url, endpoints } = provider;
-            for (const endpoint of endpoints) {
-                if (endpoint.schemes &&
-                    endpoint.schemes.find((schema) => globToRegex(schema).test(url))) {
-                    oembedUrl = endpoint.url.replace('{format}', 'json');
-                    break;
-                }
-                else if (!endpoint.schemes && url.startsWith(provider_url)) {
-                    oembedUrl = endpoint.url.replace('{format}', 'json');
-                    break;
-                }
-            }
-        }
-    }
-    if (oembedUrl) {
-        const params = new URLSearchParams();
-        params.append('url', url);
-        params.set('format', 'json');
-        params.append('maxwidth', width.toString());
-        params.append('maxheight', height.toString());
-        return `${oembedUrl}?${params.toString()}`;
-    }
-    else {
-        try {
-            const response = await fetch(url, { method: 'HEAD' });
-            let oembedUrl;
-            const linkHeader = response.headers.get('link');
-            if (linkHeader) {
-                linkHeader.split(',').map((link) => {
-                    const typeMatch = /type="([^"]*)"/.exec(link);
-                    if (typeMatch &&
-                        (typeMatch[1] === 'application/json+oembed' ||
-                            typeMatch[1] === 'text/xml+oembed')) {
-                        oembedUrl = /<([^>]*)>/.exec(link);
-                    }
-                });
-            }
-            return oembedUrl;
-        }
-        catch (e) {
-            return undefined;
-        }
-    }
-};
-exports.getOEmbedUrl = getOEmbedUrl;
-const globToRegex = (glob) => {
-    const regex = glob
-        .replace(/\./g, '\\.')
-        .replace(/\*/g, '.*');
-    return new RegExp(`^${regex}$`);
-};
-const getOEmbedHTML = async (url, width, height) => {
-    try {
-        const oembedUrl = await (0, exports.getOEmbedUrl)(url, width, height);
-        if (!oembedUrl) {
-            return;
-        }
-        const response = await fetch(oembedUrl);
-        if (response.status === 200) {
-            const json = await response.json();
-            return json.html || renderAlternativeHTML(json);
-        }
-    }
-    catch (e) {
-        return;
-    }
-};
-exports.getOEmbedHTML = getOEmbedHTML;
-const renderAlternativeHTML = (oembed) => {
-    if (oembed.type === 'photo') {
-        return `<img src="${oembed.url}">`;
-    }
-};

package/dist/es/lib/oembed.js

@@ -1,76 +0,0 @@
-import providers from 'oembed-providers';
-export const getOEmbedUrl = async (url, width, height) => {
-    let oembedUrl;
-    for (const provider of providers) {
-        if (provider) {
-            const { provider_url, endpoints } = provider;
-            for (const endpoint of endpoints) {
-                if (endpoint.schemes &&
-                    endpoint.schemes.find((schema) => globToRegex(schema).test(url))) {
-                    oembedUrl = endpoint.url.replace('{format}', 'json');
-                    break;
-                }
-                else if (!endpoint.schemes && url.startsWith(provider_url)) {
-                    oembedUrl = endpoint.url.replace('{format}', 'json');
-                    break;
-                }
-            }
-        }
-    }
-    if (oembedUrl) {
-        const params = new URLSearchParams();
-        params.append('url', url);
-        params.set('format', 'json');
-        params.append('maxwidth', width.toString());
-        params.append('maxheight', height.toString());
-        return `${oembedUrl}?${params.toString()}`;
-    }
-    else {
-        try {
-            const response = await fetch(url, { method: 'HEAD' });
-            let oembedUrl;
-            const linkHeader = response.headers.get('link');
-            if (linkHeader) {
-                linkHeader.split(',').map((link) => {
-                    const typeMatch = /type="([^"]*)"/.exec(link);
-                    if (typeMatch &&
-                        (typeMatch[1] === 'application/json+oembed' ||
-                            typeMatch[1] === 'text/xml+oembed')) {
-                        oembedUrl = /<([^>]*)>/.exec(link);
-                    }
-                });
-            }
-            return oembedUrl;
-        }
-        catch (e) {
-            return undefined;
-        }
-    }
-};
-const globToRegex = (glob) => {
-    const regex = glob
-        .replace(/\./g, '\\.')
-        .replace(/\*/g, '.*');
-    return new RegExp(`^${regex}$`);
-};
-export const getOEmbedHTML = async (url, width, height) => {
-    try {
-        const oembedUrl = await getOEmbedUrl(url, width, height);
-        if (!oembedUrl) {
-            return;
-        }
-        const response = await fetch(oembedUrl);
-        if (response.status === 200) {
-            const json = await response.json();
-            return json.html || renderAlternativeHTML(json);
-        }
-    }
-    catch (e) {
-        return;
-    }
-};
-const renderAlternativeHTML = (oembed) => {
-    if (oembed.type === 'photo') {
-        return `<img src="${oembed.url}">`;
-    }
-};

package/dist/types/lib/oembed.d.ts

@@ -1,8 +0,0 @@
-export type ProviderJson = {
-    type: 'photo' | 'video' | 'link' | 'rich';
-    html?: string;
-    url?: string;
-    title?: string;
-};
-export declare const getOEmbedUrl: (url: string, width: number, height: number) => Promise<string | undefined>;
-export declare const getOEmbedHTML: (url: string, width: number, height: number) => Promise<any>;