tiptap: adapter to dark mode

This commit is contained in:
fantasticit 2022-05-12 12:28:04 +08:00
parent 53e0732996
commit eef66e2554
1 changed files with 5 additions and 1 deletions

View File

@ -2,11 +2,13 @@ import { useEffect, useRef, useState } from 'react';
import { Modal } from '@douyinfe/semi-ui'; import { Modal } from '@douyinfe/semi-ui';
import { Editor } from 'tiptap/editor'; import { Editor } from 'tiptap/editor';
import { useToggle } from 'hooks/use-toggle'; import { useToggle } from 'hooks/use-toggle';
import { Theme, useTheme } from 'hooks/use-theme';
import { OPEN_FLOW_SETTING_MODAL, subject, cancelSubject } from '../_event'; import { OPEN_FLOW_SETTING_MODAL, subject, cancelSubject } from '../_event';
type IProps = { editor: Editor }; type IProps = { editor: Editor };
export const FlowSettingModal: React.FC<IProps> = ({ editor }) => { export const FlowSettingModal: React.FC<IProps> = ({ editor }) => {
const { theme } = useTheme();
const $iframe = useRef<HTMLIFrameElement>(); const $iframe = useRef<HTMLIFrameElement>();
const [initialData, setInitialData] = useState(''); const [initialData, setInitialData] = useState('');
const [visible, toggleVisible] = useToggle(false); const [visible, toggleVisible] = useToggle(false);
@ -53,7 +55,9 @@ export const FlowSettingModal: React.FC<IProps> = ({ editor }) => {
<div style={{ height: '100%', margin: '0 -24px' }}> <div style={{ height: '100%', margin: '0 -24px' }}>
<iframe <iframe
ref={$iframe} ref={$iframe}
src={`${process.env.DRAWIO_URL}?embed=1&lang=zh&hide-pages=1&drafts=0&client=1&spin=0&grid=1`} src={`${process.env.DRAWIO_URL}?embed=1&ui=${
theme === Theme.dark ? 'dark' : 'atlas'
}&lang=zh&hide-pages=1&drafts=0&client=1&spin=1&grid=1`}
style={{ width: '100%', height: '100%' }} style={{ width: '100%', height: '100%' }}
frameBorder={0} frameBorder={0}
></iframe> ></iframe>