Feat/7023 dify editor can resize the image (#7296)

This commit is contained in:
crazywoola 2024-08-15 14:23:56 +08:00 committed by GitHub
parent 3f9720bca0
commit 603a89055c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -14,6 +14,7 @@ import cn from '@/utils/classnames'
import CopyBtn from '@/app/components/base/copy-btn'
import SVGBtn from '@/app/components/base/svg'
import Flowchart from '@/app/components/base/mermaid'
import ImageGallery from '@/app/components/base/image-gallery'
// Available language https://github.com/react-syntax-highlighter/react-syntax-highlighter/blob/master/AVAILABLE_LANGUAGES_HLJS.MD
const capitalizationLanguageNameMap: Record<string, string> = {
@ -46,9 +47,9 @@ const getCorrectCapitalizationLanguageName = (language: string) => {
const preprocessLaTeX = (content: string) => {
if (typeof content !== 'string')
return content
return content.replace(/\\\[(.*?)\\\]/gs, (_, equation) => `$$${equation}$$`)
.replace(/\\\((.*?)\\\)/gs, (_, equation) => `$$${equation}$$`)
.replace(/(^|[^\\])\$(.+?)\$/gs, (_, prefix, equation) => `${prefix}$${equation}$`)
return content.replace(/\\\[(.*?)\\\]/g, (_, equation) => `$$${equation}$$`)
.replace(/\\\((.*?)\\\)/g, (_, equation) => `$$${equation}$$`)
.replace(/(^|[^\\])\$(.+?)\$/g, (_, prefix, equation) => `${prefix}$${equation}$`)
}
export function PreCode(props: { children: any }) {
@ -58,12 +59,6 @@ export function PreCode(props: { children: any }) {
<pre ref={ref}>
<span
className="copy-code-button"
onClick={() => {
if (ref.current) {
const code = ref.current.innerText
// copyToClipboard(code);
}
}}
></span>
{props.children}
</pre>
@ -172,7 +167,7 @@ const CodeBlock: CodeComponent = memo(({ inline, className, children, ...props }
{children}
</code>
)
}, [children, className, inline, isSVG, language, languageShowName, match, props])
}, [chartData, children, className, inline, isSVG, language, languageShowName, match, props])
})
CodeBlock.displayName = 'CodeBlock'
@ -188,17 +183,9 @@ export function Markdown(props: { content: string; className?: string }) {
]}
components={{
code: CodeBlock,
img({ src, alt, ...props }) {
img({ src }) {
return (
// eslint-disable-next-line @next/next/no-img-element
<img
src={src}
alt={alt}
width={250}
height={250}
className="max-w-full h-auto align-middle border-none rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 ease-in-out mt-2 mb-2"
{...props}
/>
<ImageGallery srcs={[src || '']} />
)
},
p: (paragraph) => {
@ -208,14 +195,7 @@ export function Markdown(props: { content: string; className?: string }) {
return (
<>
{/* eslint-disable-next-line @next/next/no-img-element */}
<img
src={image.properties.src}
width={250}
height={250}
className="max-w-full h-auto align-middle border-none rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 ease-in-out mt-2 mb-2"
alt={image.properties.alt}
/>
<ImageGallery srcs={[image.properties.src]} />
<p>{paragraph.children.slice(1)}</p>
</>
)