tiptap: fix flow style

This commit is contained in:
fantasticit 2022-05-12 20:50:24 +08:00
parent eef66e2554
commit e1d52607e1
2 changed files with 12 additions and 3 deletions

View File

@ -14,6 +14,7 @@ interface IProps {
onChange?: (arg: ISize) => void;
onChangeEnd?: (arg: ISize) => void;
className?: string;
style?: React.CSSProperties;
}
const MIN_WIDTH = 50;
@ -42,6 +43,7 @@ export const Resizeable: React.FC<IProps> = ({
className,
onChange,
onChangeEnd,
style = {},
children,
}) => {
const $container = useRef<HTMLDivElement>(null);
@ -126,7 +128,7 @@ export const Resizeable: React.FC<IProps> = ({
id="js-resizeable-container"
className={cls(className, styles.resizable)}
ref={$container}
style={{ width, height }}
style={{ ...style, width, height }}
>
{isEditable && (
<>

View File

@ -10,7 +10,7 @@ import { getEditorContainerDOMSize } from 'tiptap/prose-utils';
import { Flow } from 'tiptap/core/extensions/flow';
import styles from './index.module.scss';
const INHERIT_SIZE_STYLE = { width: '100%', height: '100%', maxWidth: '100%', overflow: 'hidden', padding: '1rem' };
const INHERIT_SIZE_STYLE = { width: '100%', height: '100%', maxWidth: '100%', overflow: 'hidden' };
const ICON_STYLE = { fontSize: '0.85em' };
export const FlowWrapper = ({ editor, node, updateAttributes }) => {
@ -100,7 +100,14 @@ export const FlowWrapper = ({ editor, node, updateAttributes }) => {
return (
<NodeViewWrapper className={cls(styles.wrap, isActive && styles.isActive)}>
<Resizeable isEditable={isEditable} width={width} height={height} maxWidth={maxWidth} onChangeEnd={onResize}>
<Resizeable
style={{ overflow: 'hidden' }}
isEditable={isEditable}
width={width}
height={height}
maxWidth={maxWidth}
onChangeEnd={onResize}
>
<div
className={cls(styles.renderWrap, 'render-wrapper')}
style={{ ...INHERIT_SIZE_STYLE, backgroundColor: bgColorOpacity }}