mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-07-16 01:26:37 +08:00
Merge to master (#435)
* Fix/venus spanish (#423) fix: update venus spanish language Co-authored-by: DarkSky <25152247+darkskygit@users.noreply.github.com> * fix: can not convert url text to link after paste * fix: double link icon size error * feat(code): enhance markdown parse code * fix(code): add robust * fix: remove special menu * chore: clean code * fix: ime with command menu * fix(code): langs[lang] is not a function * fix: can't add image and delete more action button (#430) * feat: add zh_Hant for venus (#431) * fix: lang select in code block is insanity * GitHub Doc Updates (#421) * Update types-of-contributions.md * Update README.md Tidy up links section * fix: inline menu position (#433) Co-authored-by: DarkSky <25152247+darkskygit@users.noreply.github.com> Co-authored-by: QiShaoXuan <qishaoxuan777@gmail.com> Co-authored-by: tzhangchi <terry.zhangchi@outlook.com> Co-authored-by: lawvs <18554747+lawvs@users.noreply.github.com> Co-authored-by: DiamondThree <diamond.shx@gmail.com> Co-authored-by: CJSS <CJSS@users.noreply.github.com> Co-authored-by: Qi <474021214@qq.com>
This commit is contained in:
zuomeng wang
@@ -116,7 +116,7 @@ const CodeBlock = styled('div')(({ theme }) => ({
|
||||
flexWrap: 'wrap',
|
||||
justifyContent: 'space-between',
|
||||
opacity: 0,
|
||||
transition: 'opacity 1.5s',
|
||||
transition: 'opacity .15s',
|
||||
},
|
||||
'.copy-block': {
|
||||
padding: '0px 10px',
|
||||
@@ -139,10 +139,21 @@ const CodeBlock = styled('div')(({ theme }) => ({
|
||||
outline: 'none !important',
|
||||
},
|
||||
}));
|
||||
const StyledOperationalPanel = styled('div')<{ show: boolean }>(({ show }) => {
|
||||
return {
|
||||
display: 'flex',
|
||||
flexWrap: 'wrap',
|
||||
justifyContent: 'space-between',
|
||||
opacity: show ? 1 : 0,
|
||||
transition: 'opacity .15s',
|
||||
};
|
||||
});
|
||||
export const CodeView = ({ block, editor }: CreateCodeView) => {
|
||||
const initValue: string = block.getProperty('text')?.value?.[0]?.text;
|
||||
const langType: string = block.getProperty('lang');
|
||||
const [extensions, setExtensions] = useState<Extension[]>();
|
||||
const [showOperationPanel, setShowOperationPanel] = useState(false);
|
||||
const isSelecting = useRef(false);
|
||||
const codeMirror = useRef<ReactCodeMirrorRef>();
|
||||
const focusCode = () => {
|
||||
if (codeMirror.current) {
|
||||
@@ -160,7 +171,7 @@ export const CodeView = ({ block, editor }: CreateCodeView) => {
|
||||
};
|
||||
const handleLangChange = (lang: string) => {
|
||||
block.setProperty('lang', lang);
|
||||
setExtensions([langs[lang]()]);
|
||||
langs[lang] && setExtensions([langs[lang]()]);
|
||||
};
|
||||
useEffect(() => {
|
||||
handleLangChange(langType ? langType : DEFAULT_LANG);
|
||||
@@ -181,8 +192,15 @@ export const CodeView = ({ block, editor }: CreateCodeView) => {
|
||||
onKeyDown={e => {
|
||||
e.stopPropagation();
|
||||
}}
|
||||
onMouseEnter={() => {
|
||||
isSelecting.current = false;
|
||||
setShowOperationPanel(true);
|
||||
}}
|
||||
onMouseLeave={() => {
|
||||
!isSelecting.current && setShowOperationPanel(false);
|
||||
}}
|
||||
>
|
||||
<div className="operation">
|
||||
<StyledOperationalPanel show={showOperationPanel}>
|
||||
<div className="select">
|
||||
<Select
|
||||
width={128}
|
||||
@@ -192,6 +210,9 @@ export const CodeView = ({ block, editor }: CreateCodeView) => {
|
||||
onChange={(selectedValue: string) => {
|
||||
handleLangChange(selectedValue);
|
||||
}}
|
||||
onListboxOpenChange={() => {
|
||||
isSelecting.current = true;
|
||||
}}
|
||||
>
|
||||
{Object.keys(langs).map(item => {
|
||||
return (
|
||||
@@ -208,7 +229,7 @@ export const CodeView = ({ block, editor }: CreateCodeView) => {
|
||||
Copy
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</StyledOperationalPanel>
|
||||
|
||||
<CodeMirror
|
||||
ref={codeMirror}
|
||||
|
||||
@@ -5,10 +5,10 @@ import {
|
||||
BlockEditor,
|
||||
HTML2BlockResult,
|
||||
} from '@toeverything/framework/virgo';
|
||||
import { unescape } from 'html-escaper';
|
||||
import {
|
||||
Block2HtmlProps,
|
||||
commonBlock2HtmlContent,
|
||||
commonHTML2block,
|
||||
} from '../../utils/commonBlockClip';
|
||||
import { CodeView } from './CodeView';
|
||||
|
||||
@@ -34,12 +34,30 @@ export class CodeBlock extends BaseView {
|
||||
element: Element;
|
||||
editor: BlockEditor;
|
||||
}): Promise<HTML2BlockResult> {
|
||||
return commonHTML2block({
|
||||
element,
|
||||
editor,
|
||||
type: this.type,
|
||||
tagName: 'CODE',
|
||||
});
|
||||
// debugger;
|
||||
if (element.tagName === 'CODE') {
|
||||
return [
|
||||
{
|
||||
type: this.type,
|
||||
properties: {
|
||||
text: {
|
||||
value: [
|
||||
{
|
||||
text: unescape(
|
||||
(element as HTMLElement).innerText
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
lang:
|
||||
element.classList[0] &&
|
||||
element.classList[0].substr(9),
|
||||
},
|
||||
children: [],
|
||||
},
|
||||
];
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
override async block2html(props: Block2HtmlProps) {
|
||||
|
||||
@@ -168,7 +168,9 @@ export const ImageView = ({ block, editor }: ImageView) => {
|
||||
<BlockPendantProvider editor={editor} block={block}>
|
||||
<ImageBlock>
|
||||
<div style={{ position: 'relative' }} ref={resizeBox}>
|
||||
{!isSelect ? <ImageShade onClick={handleClick} /> : null}
|
||||
{!isSelect && imgUrl ? (
|
||||
<ImageShade onClick={handleClick} />
|
||||
) : null}
|
||||
{imgUrl ? (
|
||||
<div
|
||||
onMouseDown={e => {
|
||||
|
||||
@@ -1,17 +1,17 @@
|
||||
import {
|
||||
BaseView,
|
||||
CreateView,
|
||||
AsyncBlock,
|
||||
HTML2BlockResult,
|
||||
BlockEditor,
|
||||
} from '@toeverything/framework/virgo';
|
||||
import { Protocol } from '@toeverything/datasource/db-service';
|
||||
import { TextView } from './TextView';
|
||||
import {
|
||||
AsyncBlock,
|
||||
BaseView,
|
||||
BlockEditor,
|
||||
CreateView,
|
||||
HTML2BlockResult,
|
||||
} from '@toeverything/framework/virgo';
|
||||
import {
|
||||
Block2HtmlProps,
|
||||
commonBlock2HtmlContent,
|
||||
commonHTML2block,
|
||||
} from '../../utils/commonBlockClip';
|
||||
import { TextView } from './TextView';
|
||||
|
||||
export class TextBlock extends BaseView {
|
||||
type = Protocol.Block.Type.text;
|
||||
@@ -41,12 +41,12 @@ export class TextBlock extends BaseView {
|
||||
tagName: [
|
||||
'DIV',
|
||||
'P',
|
||||
'PRE',
|
||||
// 'PRE',
|
||||
'B',
|
||||
'A',
|
||||
'EM',
|
||||
'U',
|
||||
'CODE',
|
||||
// 'CODE',
|
||||
'S',
|
||||
'DEL',
|
||||
],
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
import { useState } from 'react';
|
||||
|
||||
import { CustomText, TextProps } from '@toeverything/components/common';
|
||||
import {
|
||||
BlockPendantProvider,
|
||||
@@ -11,9 +9,11 @@ import {
|
||||
import { styled } from '@toeverything/components/ui';
|
||||
import { Protocol } from '@toeverything/datasource/db-service';
|
||||
import { CreateView } from '@toeverything/framework/virgo';
|
||||
import { useState } from 'react';
|
||||
import { BlockContainer } from '../../components/BlockContainer';
|
||||
import { TextManage } from '../../components/text-manage';
|
||||
import { dedentBlock, tabBlock } from '../../utils/indent';
|
||||
|
||||
interface CreateTextView extends CreateView {
|
||||
// TODO: need to optimize
|
||||
containerClassName?: string;
|
||||
@@ -247,6 +247,9 @@ export const TextView = ({
|
||||
await block.setProperty('text', {
|
||||
value: options?.['text'] as CustomText[],
|
||||
});
|
||||
setTimeout(async () => {
|
||||
await editor.selectionManager.activeNodeByNodeId(block.id);
|
||||
}, 100);
|
||||
block.firstCreateFlag = true;
|
||||
};
|
||||
const onTab: TextProps['handleTab'] = async ({ isShiftKey }) => {
|
||||
|
||||
Reference in New Issue
Block a user