gio
/
think
mirror of https://github.com/fantasticit/think.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

tiptap: fix resize container size

This commit is contained in:
fantasticit 2022-04-26 19:14:01 +08:00
parent 2e6a013203
commit c5462efcb4
3 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/client/src/tiptap/wrappers/iframe/index.module.scss
View File

@ -17,6 +17,7 @@
.innerWrap { .innerWrap {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%;
overflow: hidden; overflow: hidden;
border-radius: var(--border-radius); border-radius: var(--border-radius);
flex: 1; flex: 1;

6
packages/client/src/tiptap/wrappers/iframe/index.tsx
View File

@ -29,7 +29,7 @@ export const IframeWrapper = ({ editor, node, updateAttributes }) => {
)} )}
</NodeViewContent> </NodeViewContent>
), ),
[url] [url, width, height]
); );
if (!isEditable && !url) { if (!isEditable && !url) {
@ -39,8 +39,8 @@ export const IframeWrapper = ({ editor, node, updateAttributes }) => {
return ( return (
<NodeViewWrapper> <NodeViewWrapper>
{isEditable ? ( {isEditable ? (
<Resizeable height={height} width={width} onChange={onResize}> <Resizeable height={height} width={width} onChangeEnd={onResize}>
{content} <div style={{ width, height, maxWidth: '100%' }}>{content}</div>
</Resizeable> </Resizeable>
) : ( ) : (
<div style={{ width, height, maxWidth: '100%' }}>{content}</div> <div style={{ width, height, maxWidth: '100%' }}>{content}</div>

4
packages/client/src/tiptap/wrappers/image/index.tsx
View File

@ -80,7 +80,7 @@ export const ImageWrapper = ({ editor, node, updateAttributes }) => {
if (isEditable) { if (isEditable) {
return ( return (
<Resizeable className={cls('render-wrapper')} width={width} height={height} onChange={onResize}> <Resizeable className={cls('render-wrapper')} width={width} height={height} onChangeEnd={onResize}>
{img} {img}
</Resizeable> </Resizeable>
); );
@ -91,7 +91,7 @@ export const ImageWrapper = ({ editor, node, updateAttributes }) => {
{img} {img}
</div> </div>
); );
}, [error, src, isEditable]); }, [error, src, isEditable, width, height]);
return ( return (
<NodeViewWrapper as="div" style={{ textAlign, fontSize: 0, maxWidth: '100%' }}> <NodeViewWrapper as="div" style={{ textAlign, fontSize: 0, maxWidth: '100%' }}>