rme 0.0.50 → 0.0.51

package/dist/index.d.ts

@@ -241,6 +241,11 @@ type Props = {
 };
 declare const ThemeProvider: React.FC<Props>;
 
+interface PreviewProps {
+    doc: Node;
+}
+declare const Preview: React.FC<PreviewProps>;
+
 interface WarpperProps$1 {
     codeEditor?: boolean;
     dark?: boolean;
@@ -425,4 +430,4 @@ declare const lightTheme: {
     };
 };
 
-export { type CreateWysiwygDelegateOptions, type DocToString, Editor, type EditorChangeEventParams, type EditorChangeHandler, type EditorContext, type EditorDelegate, extensions as EditorExtensions, type EditorProps, type EditorRef, type EditorState, type EditorViewType, type Note, SourceCodeThemeWrapper, _default$1 as SourceEditor, type StringToDoc, ThemeProvider, _default as WysiwygEditor, WysiwygThemeWrapper, buildMarkdownParser, buildMarkdownSerializer, changeTheme, common, computeChange, createSourceCodeDelegate, createSourceCodeManager, createWysiwygDelegate, darkTheme, getLanguageMap, lightTheme, loadLanguage, tableSelectorSize, wysiwygTransformer };
+export { type CreateWysiwygDelegateOptions, type DocToString, Editor, type EditorChangeEventParams, type EditorChangeHandler, type EditorContext, type EditorDelegate, extensions as EditorExtensions, type EditorProps, type EditorRef, type EditorState, type EditorViewType, type Note, Preview, SourceCodeThemeWrapper, _default$1 as SourceEditor, type StringToDoc, ThemeProvider, _default as WysiwygEditor, WysiwygThemeWrapper, buildMarkdownParser, buildMarkdownSerializer, changeTheme, common, computeChange, createSourceCodeDelegate, createSourceCodeManager, createWysiwygDelegate, darkTheme, getLanguageMap, lightTheme, loadLanguage, tableSelectorSize, wysiwygTransformer };

package/dist/index.mjs

@@ -4376,14 +4376,10 @@ import { memo as memo5, useCallback as useCallback5, useMemo as useMemo4 } from
 
 // src/editor/components/Text/index.tsx
 import { useRemirrorContext } from "@remirror/react";
-import styled from "styled-components";
 import { jsx } from "react/jsx-runtime";
-var Container = styled.div`
-
-`;
 var Text = ({ children, ...props }) => {
   const { getRootProps } = useRemirrorContext();
-  return /* @__PURE__ */ jsx(Container, { ...props, ...getRootProps(), children });
+  return /* @__PURE__ */ jsx("div", { ...props, ...getRootProps(), children });
 };
 var Text_default = Text;
 
@@ -7296,8 +7292,8 @@ var styledLightTheme = {
 };
 
 // src/editor/theme/WysiwygThemeWrapper.tsx
-import styled2, { css as css2 } from "styled-components";
-var WysiwygThemeWrapper = styled2.div.attrs((p) => p)`
+import styled, { css } from "styled-components";
+var WysiwygThemeWrapper = styled.div.attrs((p) => p)`
   width: 100%;
   position: relative;
   white-space: pre-wrap;
@@ -8137,14 +8133,14 @@ var WysiwygThemeWrapper = styled2.div.attrs((p) => p)`
     }
   }
 
-  ${(props) => props.dark && css2`
+  ${(props) => props.dark && css`
       color-scheme: dark;
     `}
 `;
 
 // src/editor/theme/SourceCodeThemeWrapper.tsx
-import styled3, { css as css3 } from "styled-components";
-var SourceCodeThemeWrapper = styled3.div.attrs((p) => p)`
+import styled2, { css as css2 } from "styled-components";
+var SourceCodeThemeWrapper = styled2.div.attrs((p) => p)`
   width: 100%;
   position: relative;
   white-space: pre-wrap;
@@ -8199,7 +8195,7 @@ var SourceCodeThemeWrapper = styled3.div.attrs((p) => p)`
     }
   }
 
-  ${(props) => props.dark && css3`
+  ${(props) => props.dark && css2`
       color-scheme: dark;
     `}
 `;
@@ -13741,7 +13737,7 @@ var cssLanguage = /* @__PURE__ */ LRLanguage.define({
     wordChars: "-"
   }
 });
-function css4() {
+function css3() {
   return new LanguageSupport(cssLanguage, cssLanguage.data.of({ autocomplete: cssCompletionSource }));
 }
 
@@ -14934,7 +14930,7 @@ function html(config = {}) {
     htmlLanguage.data.of({ autocomplete: htmlCompletionSourceWith(config) }),
     config.autoCloseTags !== false ? autoCloseTags2 : [],
     javascript().support,
-    css4().support
+    css3().support
   ]);
 }
 var selfClosers2 = /* @__PURE__ */ new Set(/* @__PURE__ */ "area base br col command embed frame hr img input keygen link meta param source track wbr menuitem".split(" "));
@@ -15297,7 +15293,7 @@ var ImageToolTips = (props) => {
 };
 
 // src/editor/components/Resizable/Resizable.tsx
-import styled5 from "styled-components";
+import styled4 from "styled-components";
 import { useRef, useEffect, useCallback, memo, useState as useState2 } from "react";
 
 // node_modules/@remirror/core-helpers/dist/remirror-core-helpers.js
@@ -15479,9 +15475,9 @@ var errorMessageMap = {
 };
 
 // src/editor/components/Resizable/ResizableHandle.tsx
-import styled4, { css as css5 } from "styled-components";
+import styled3, { css as css4 } from "styled-components";
 import { jsx as jsx4 } from "react/jsx-runtime";
-var ResizableHandleContainer = styled4.span`
+var ResizableHandleContainer = styled3.span`
   position: absolute;
   border-radius: 12px;
   border: 2px solid #fff;
@@ -15493,11 +15489,11 @@ var ResizableHandleContainer = styled4.span`
 
   ${(props) => {
   if (props.visible) {
-    return css5`
+    return css4`
         opacity: 1;
       `;
   } else {
-    return css5`
+    return css4`
         opacity: 0;
       `;
   }
@@ -15506,31 +15502,31 @@ var ResizableHandleContainer = styled4.span`
   ${(props) => {
   switch (props.handleType) {
     case 7 /* BottomLeft */:
-      return css5`
+      return css4`
           left: -6px;
           bottom: -10px;
           cursor: sw-resize;
         `;
     case 6 /* BottomRight */:
-      return css5`
+      return css4`
           right: -6px;
           bottom: -10px;
           cursor: se-resize;
         `;
     case 5 /* TopLeft */:
-      return css5`
+      return css4`
           left: -6px;
           top: -6px;
           cursor: nw-resize;
         `;
     case 4 /* TopRight */:
-      return css5`
+      return css4`
           right: -6px;
           top: -6px;
           cursor: ne-resize;
         `;
     case 1 /* Left */:
-      return css5`
+      return css4`
           left: 6px;
           top: calc(50% - 20px);
           height: 30px;
@@ -15538,7 +15534,7 @@ var ResizableHandleContainer = styled4.span`
           cursor: col-resize;
         `;
     case 0 /* Right */:
-      return css5`
+      return css4`
           right: 6px;
           top: calc(50% - 20px);
           height: 30px;
@@ -15546,7 +15542,7 @@ var ResizableHandleContainer = styled4.span`
           cursor: col-resize;
         `;
     case 2 /* Top */:
-      return css5`
+      return css4`
           left: calc(50% - 20px);
           top: 6px;
           height: 6px;
@@ -15554,7 +15550,7 @@ var ResizableHandleContainer = styled4.span`
           cursor: row-resize;
         `;
     case 3 /* Bottom */:
-      return css5`
+      return css4`
           right: calc(50% - 20px);
           bottom: 6px;
           height: 6px;
@@ -15585,7 +15581,7 @@ var ResizableHandle = (props) => {
 
 // src/editor/components/Resizable/Resizable.tsx
 import { jsx as jsx5, jsxs } from "react/jsx-runtime";
-var ResizableContainer = styled5.div`
+var ResizableContainer = styled4.div`
   display: inline-block;
   position: relative;
   max-width: 100%;
@@ -16600,7 +16596,6 @@ import { memo as memo4, useMemo as useMemo3, useCallback as useCallback4 } from
 // src/editor/components/WysiwygEditor/delegate.ts
 import { createReactManager } from "@remirror/react";
 import { isExtension } from "@remirror/core";
-import "prosemirror-flat-list/dist/style.css";
 function isMarkdownNodeExtension(extension9) {
   return !!(isExtension(extension9) && extension9.fromMarkdown && extension9.toMarkdown);
 }
@@ -16663,10 +16658,10 @@ import {
   MenuList
 } from "@mui/material";
 import { useCommands } from "@remirror/react";
-import styled6 from "styled-components";
+import styled5 from "styled-components";
 import { useTranslation } from "react-i18next";
 import { jsx as jsx10, jsxs as jsxs2 } from "react/jsx-runtime";
-var Container2 = styled6.div`
+var Container = styled5.div`
   position: absolute;
 
   .MuiList-padding {
@@ -16719,7 +16714,7 @@ var ActiveCellMenu = (props) => {
   };
   const { ref, key, x, y } = positioner;
   return /* @__PURE__ */ jsxs2(
-    Container2,
+    Container,
     {
       ref,
       style: {
@@ -16777,10 +16772,10 @@ var ActiveCellMenu_default = ActiveCellMenu;
 
 // src/editor/toolbar/TableToolbar/TableBar.tsx
 import { useCommands as useCommands2 } from "@remirror/react";
-import styled7 from "styled-components";
+import styled6 from "styled-components";
 import { Tooltip as Tooltip2 } from "zens";
 import { jsx as jsx11 } from "react/jsx-runtime";
-var Container3 = styled7.div`
+var Container2 = styled6.div`
   position: absolute;
   color: ${(props) => props.theme.dangerColor};
 `;
@@ -16789,7 +16784,7 @@ function TableBar(props) {
   const commands = useCommands2();
   const { ref, key, x, y } = positioner;
   return /* @__PURE__ */ jsx11(
-    Container3,
+    Container2,
     {
       ref,
       style: {
@@ -16918,9 +16913,9 @@ import { ProsemirrorDevTools } from "@remirror/dev";
 
 // src/editor/components/ErrorBoundary.tsx
 import React from "react";
-import styled8 from "styled-components";
+import styled7 from "styled-components";
 import { Fragment as Fragment4, jsx as jsx13, jsxs as jsxs3 } from "react/jsx-runtime";
-var Title = styled8.h1`
+var Title = styled7.h1`
     color: ${({ theme }) => theme.dangerColor};
 `;
 var ErrorBoundary = class extends React.Component {
@@ -16953,13 +16948,13 @@ import { usePopper } from "react-popper";
 
 // src/editor/toolbar/SlashMenu/styles.tsx
 import { memo as memo3, useCallback as useCallback2, useEffect as useEffect4, useMemo, useRef as useRef5, useState as useState6 } from "react";
-import styled10, { css as css6 } from "styled-components";
+import styled9, { css as css5 } from "styled-components";
 
 // src/editor/toolbar/SlashMenu/TablePanel.tsx
 import { forwardRef, useState as useState5, useImperativeHandle, memo as memo2 } from "react";
-import styled9 from "styled-components";
+import styled8 from "styled-components";
 import { jsx as jsx14, jsxs as jsxs4 } from "react/jsx-runtime";
-var TablePanelCell = styled9.div.attrs((p) => p)`
+var TablePanelCell = styled8.div.attrs((p) => p)`
   border: 1px solid ${(props) => props.theme.borderColor};
   margin-right: 1px;
   margin-bottom: 1px;
@@ -17228,7 +17223,7 @@ var SlashMenuRoot = memo3(
     ] });
   }
 );
-var MenuPanel = styled10.div.attrs((p) => p)`
+var MenuPanel = styled9.div.attrs((p) => p)`
   display: flex;
   min-width: 130px;
   flex-direction: column;
@@ -17246,7 +17241,7 @@ var MenuPanel = styled10.div.attrs((p) => p)`
   outline: none;
   overflow: visible;
 `;
-var MenuItem2 = styled10.li.attrs((props) => ({
+var MenuItem2 = styled9.li.attrs((props) => ({
   ...props
 }))`
   display: flex;
@@ -17263,7 +17258,7 @@ var MenuItem2 = styled10.li.attrs((props) => ({
 
   ${(p) => {
   if (p.selected) {
-    return css6`
+    return css5`
         background-color: ${(props) => props.theme.contextMenuBgColorHover};
         color: hsl(204 20% 100%);
       `;
@@ -17931,8 +17926,8 @@ function isTableElement(element) {
 }
 function isContainingBlock(element) {
   const webkit = isWebKit();
-  const css7 = getComputedStyle(element);
-  return css7.transform !== "none" || css7.perspective !== "none" || (css7.containerType ? css7.containerType !== "normal" : false) || !webkit && (css7.backdropFilter ? css7.backdropFilter !== "none" : false) || !webkit && (css7.filter ? css7.filter !== "none" : false) || ["transform", "perspective", "filter"].some((value) => (css7.willChange || "").includes(value)) || ["paint", "layout", "strict", "content"].some((value) => (css7.contain || "").includes(value));
+  const css6 = getComputedStyle(element);
+  return css6.transform !== "none" || css6.perspective !== "none" || (css6.containerType ? css6.containerType !== "normal" : false) || !webkit && (css6.backdropFilter ? css6.backdropFilter !== "none" : false) || !webkit && (css6.filter ? css6.filter !== "none" : false) || ["transform", "perspective", "filter"].some((value) => (css6.willChange || "").includes(value)) || ["paint", "layout", "strict", "content"].some((value) => (css6.contain || "").includes(value));
 }
 function getContainingBlock(element) {
   let currentNode = getParentNode(element);
@@ -18010,9 +18005,9 @@ function getOverflowAncestors(node, list, traverseIframes) {
 
 // node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
 function getCssDimensions(element) {
-  const css7 = getComputedStyle(element);
-  let width = parseFloat(css7.width) || 0;
-  let height = parseFloat(css7.height) || 0;
+  const css6 = getComputedStyle(element);
+  let width = parseFloat(css6.width) || 0;
+  let height = parseFloat(css6.height) || 0;
   const hasOffset = isHTMLElement(element);
   const offsetWidth = hasOffset ? element.offsetWidth : width;
   const offsetHeight = hasOffset ? element.offsetHeight : height;
@@ -18106,9 +18101,9 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
     while (currentIFrame && offsetParent && offsetWin !== currentWin) {
       const iframeScale = getScale(currentIFrame);
       const iframeRect = currentIFrame.getBoundingClientRect();
-      const css7 = getComputedStyle(currentIFrame);
-      const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css7.paddingLeft)) * iframeScale.x;
-      const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css7.paddingTop)) * iframeScale.y;
+      const css6 = getComputedStyle(currentIFrame);
+      const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css6.paddingLeft)) * iframeScale.x;
+      const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css6.paddingTop)) * iframeScale.y;
       x *= iframeScale.x;
       y *= iframeScale.y;
       width *= iframeScale.x;
@@ -18890,6 +18885,7 @@ var useContextMounted = (onContextMounted) => {
 };
 
 // src/editor/components/Editor.tsx
+import "prosemirror-flat-list/dist/style.css";
 import { jsx as jsx19 } from "react/jsx-runtime";
 var Editor = memo6(
   forwardRef2((props, ref) => {
@@ -18970,9 +18966,19 @@ var ThemeProvider = ({ theme, i18n, children }) => {
   }, [mode, theme?.codemirrorTheme, changeTheme]);
   return /* @__PURE__ */ jsx20(ScThemeProvider, { theme: themeToken, children });
 };
+
+// src/editor/components/Preview/preview.tsx
+import { prosemirrorNodeToHtml } from "remirror";
+import { jsx as jsx21 } from "react/jsx-runtime";
+var Preview = (props) => {
+  const { doc } = props;
+  const html2 = prosemirrorNodeToHtml(doc);
+  return /* @__PURE__ */ jsx21(WysiwygThemeWrapper, { dangerouslySetInnerHTML: { __html: html2 } });
+};
 export {
   Editor,
   extensions_default as EditorExtensions,
+  Preview,
   SourceCodeThemeWrapper,
   SourceEditor_default as SourceEditor,
   ThemeProvider,