feat: Full width images (#4389)
* feat: Full width images * lint * fix: Enable TOC overlaid on full size images * Vendorize react-medium-image-zoom * tsc * fix * Remove body scroll lock
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
import * as React from "react";
|
||||
import ImageZoom from "react-medium-image-zoom";
|
||||
import Frame from "../components/Frame";
|
||||
import ImageZoom from "../components/ImageZoom";
|
||||
import { EmbedProps as Props } from ".";
|
||||
|
||||
const IFRAME_REGEX = /^https:\/\/(invis\.io\/.*)|(projects\.invisionapp\.com\/share\/.*)$/;
|
||||
@@ -9,19 +9,18 @@ const IMAGE_REGEX = /^https:\/\/(opal\.invisionapp\.com\/static-signed\/live-emb
|
||||
function InVision(props: Props) {
|
||||
if (IMAGE_REGEX.test(props.attrs.href)) {
|
||||
return (
|
||||
<ImageZoom
|
||||
// @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
|
||||
className={props.isSelected ? "ProseMirror-selectednode" : ""}
|
||||
image={{
|
||||
src: props.attrs.href,
|
||||
alt: "InVision Embed",
|
||||
style: {
|
||||
maxWidth: "100%",
|
||||
maxHeight: "75vh",
|
||||
},
|
||||
}}
|
||||
shouldRespectMaxDimension
|
||||
/>
|
||||
<div className={props.isSelected ? "ProseMirror-selectednode" : ""}>
|
||||
<ImageZoom zoomMargin={24}>
|
||||
<img
|
||||
src={props.attrs.href}
|
||||
alt="InVision Embed"
|
||||
style={{
|
||||
maxWidth: "100%",
|
||||
maxHeight: "75vh",
|
||||
}}
|
||||
/>
|
||||
</ImageZoom>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user