diff --git a/packages/engine-render/src/components/docs/document.ts b/packages/engine-render/src/components/docs/document.ts index 41d5227a518..980d8883484 100644 --- a/packages/engine-render/src/components/docs/document.ts +++ b/packages/engine-render/src/components/docs/document.ts @@ -566,7 +566,7 @@ export class Documents extends DocComponent { if (verticalAlign === VerticalAlign.MIDDLE) { offsetTop = (this.height - pageHeight) / 2; } else if (verticalAlign === VerticalAlign.TOP) { - offsetTop = 0; + offsetTop = pagePaddingTop; } else { // VerticalAlign.UNSPECIFIED follow the same rule as HorizontalAlign.BOTTOM. offsetTop = this.height - pageHeight - pagePaddingBottom; } diff --git a/packages/engine-render/src/components/sheets/sheet-skeleton.ts b/packages/engine-render/src/components/sheets/sheet-skeleton.ts index 0022d075341..3715c601d4a 100644 --- a/packages/engine-render/src/components/sheets/sheet-skeleton.ts +++ b/packages/engine-render/src/components/sheets/sheet-skeleton.ts @@ -201,7 +201,7 @@ export interface IDocumentLayoutObject { } const DEFAULT_PADDING_DATA = { - t: 1, + t: 0, b: 1, l: 2, r: 2, @@ -1811,7 +1811,7 @@ export class SpreadsheetSkeleton extends Skeleton { const { textRotation, paddingData = { - t: 1, + t: 0, r: 2, b: 1, l: 2, diff --git a/packages/sheets-ui/src/controllers/editor/start-edit.controller.ts b/packages/sheets-ui/src/controllers/editor/start-edit.controller.ts index f841b30ff12..f4db10b07d0 100644 --- a/packages/sheets-ui/src/controllers/editor/start-edit.controller.ts +++ b/packages/sheets-ui/src/controllers/editor/start-edit.controller.ts @@ -241,7 +241,7 @@ export class StartEditController extends Disposable { if (verticalAlign === VerticalAlign.MIDDLE) { offsetTop = (editorHeight - actualHeight) / 2 / scaleY; } else if (verticalAlign === VerticalAlign.TOP) { - offsetTop = 0; + offsetTop = paddingData.t || 0; } else { // VerticalAlign.UNSPECIFIED follow the same rule as HorizontalAlign.BOTTOM. offsetTop = (editorHeight - actualHeight) / scaleY - (paddingData.b || 0); } diff --git a/packages/sheets-ui/src/views/defined-name/DefinedName.tsx b/packages/sheets-ui/src/views/defined-name/DefinedName.tsx index a12b6cfb1be..9a597d4df2f 100644 --- a/packages/sheets-ui/src/views/defined-name/DefinedName.tsx +++ b/packages/sheets-ui/src/views/defined-name/DefinedName.tsx @@ -39,7 +39,7 @@ export function DefinedName() { return (
- + }>
diff --git a/packages/sheets-ui/src/views/defined-name/DefinedNameInput.tsx b/packages/sheets-ui/src/views/defined-name/DefinedNameInput.tsx index ccf502e67a8..b7e549477e3 100644 --- a/packages/sheets-ui/src/views/defined-name/DefinedNameInput.tsx +++ b/packages/sheets-ui/src/views/defined-name/DefinedNameInput.tsx @@ -71,8 +71,11 @@ export const DefinedNameInput = (props: IDefinedNameInputProps) => { const sheetId = workbook.getActiveSheet().getSheetId(); const [nameValue, setNameValue] = useState(name); + const [formulaOrRefStringValue, setFormulaOrRefStringValue] = useState(formulaOrRefString); + const [commentValue, setCommentValue] = useState(comment); + const [localSheetIdValue, setLocalSheetIdValue] = useState(localSheetId); const [validString, setValidString] = useState(''); @@ -81,8 +84,6 @@ export const DefinedNameInput = (props: IDefinedNameInputProps) => { const [validFormulaOrRange, setValidFormulaOrRange] = useState(true); - const [updateFormulaOrRefStringValue, setUpdateFormulaOrRefStringValue] = useState(formulaOrRefString); - const options = [{ label: localeService.t('definedName.scopeWorkbook'), value: SCOPE_WORKBOOK_VALUE, @@ -104,7 +105,6 @@ export const DefinedNameInput = (props: IDefinedNameInputProps) => { } setFormulaOrRefStringValue(formulaOrRefStringCache); - setUpdateFormulaOrRefStringValue(formulaOrRefStringCache); setValidString(''); }, [state]); @@ -135,11 +135,11 @@ export const DefinedNameInput = (props: IDefinedNameInputProps) => { }; const rangeSelectorChange = (ranges: IUnitRange[]) => { - setUpdateFormulaOrRefStringValue(convertRangeToString(ranges)); + setFormulaOrRefStringValue(convertRangeToString(ranges)); }; const formulaEditorChange = (value: Nullable) => { - setUpdateFormulaOrRefStringValue(value || ''); + setFormulaOrRefStringValue(value || ''); }; const confirmChange = () => { @@ -167,7 +167,7 @@ export const DefinedNameInput = (props: IDefinedNameInputProps) => { return; } - if (updateFormulaOrRefStringValue.length === 0) { + if (formulaOrRefStringValue.length === 0) { setValidString(localeService.t('definedName.formulaOrRefStringEmpty')); return; } @@ -185,7 +185,7 @@ export const DefinedNameInput = (props: IDefinedNameInputProps) => { confirm && confirm({ id: id || '', name: nameValue, - formulaOrRefString: lexerTreeBuilder.convertRefersToAbsolute(updateFormulaOrRefStringValue, AbsoluteRefType.ALL, AbsoluteRefType.ALL), + formulaOrRefString: lexerTreeBuilder.convertRefersToAbsolute(formulaOrRefStringValue, AbsoluteRefType.ALL, AbsoluteRefType.ALL), comment: commentValue, localSheetId: localSheetIdValue, }); @@ -194,10 +194,10 @@ export const DefinedNameInput = (props: IDefinedNameInputProps) => { const typeValueChange = (value: string | number | boolean) => { const type = value as string; if (type === 'formula' && formulaOrRefStringValue.substring(0, 1) !== operatorToken.EQUALS) { - setUpdateFormulaOrRefStringValue(`${operatorToken.EQUALS}`); + setFormulaOrRefStringValue(`${operatorToken.EQUALS}`); setFormulaOrRefStringValue(`${operatorToken.EQUALS}`); } else if (formulaOrRefStringValue.substring(0, 1) === operatorToken.EQUALS) { - setUpdateFormulaOrRefStringValue(''); + setFormulaOrRefStringValue(''); setFormulaOrRefStringValue(''); } setTypeValue(type); diff --git a/packages/sheets-ui/src/views/defined-name/index.module.less b/packages/sheets-ui/src/views/defined-name/index.module.less index 69e9a6f1019..32a1ad5b387 100644 --- a/packages/sheets-ui/src/views/defined-name/index.module.less +++ b/packages/sheets-ui/src/views/defined-name/index.module.less @@ -7,6 +7,8 @@ border-right: 1px solid rgb(var(--border-color)); + height: 100%; + &-drop-down { display: flex; align-items: center; diff --git a/packages/ui/src/components/editor/TextEditor.tsx b/packages/ui/src/components/editor/TextEditor.tsx index 033560db1f0..68f2b1589bb 100644 --- a/packages/ui/src/components/editor/TextEditor.tsx +++ b/packages/ui/src/components/editor/TextEditor.tsx @@ -182,22 +182,29 @@ export function TextEditor(props: ITextEditorProps & Omit) => { const unitId = editor.editorUnitId; const isLegality = editorService.checkValueLegality(unitId); - const rect = editor.getBoundingClientRect(); - setValidationOffset([rect.left, rect.top]); - if (rect.left + rect.top > 0) { - setValidationVisible(!isLegality); - } - if (editor.onlyInputFormula()) { - setValidationContent(localeService.t('textEditor.formulaError')); - } else { - setValidationContent(localeService.t('textEditor.rangeError')); - } + setTimeout(() => { + const rect = editor.getBoundingClientRect(); + setValidationOffset([rect.left, rect.top - 16]); + if (rect.left + rect.top > 0) { + setValidationVisible(!isLegality); + } + + if (editor.onlyInputFormula()) { + setValidationContent(localeService.t('textEditor.formulaError')); + } else { + setValidationContent(localeService.t('textEditor.rangeError')); + } + }, 100); - onValid && onValid(isLegality); - onChange && onChange(editorService.getValue(id)); + const currentValue = editorService.getValue(unitId); + + if (currentValue !== value) { + onValid && onValid(isLegality); + onChange && onChange(editorService.getValue(id)); + } }, 30); const valueChangeSubscription = editorService.valueChange$.subscribe((editor) => { diff --git a/packages/ui/src/components/range-selector/RangeSelector.tsx b/packages/ui/src/components/range-selector/RangeSelector.tsx index c25a8777f37..e14bfd820b2 100644 --- a/packages/ui/src/components/range-selector/RangeSelector.tsx +++ b/packages/ui/src/components/range-selector/RangeSelector.tsx @@ -253,12 +253,23 @@ export function RangeSelector(props: IRangeSelectorProps) { function handleTextValueChange(value: Nullable) { setRangeValue(value || ''); - if (value === '') { + const valueArray = value?.split(',') || []; + + if (value === '' || valueArray.length === 0) { + onChange && onChange([]); + return; + } + + const result = valueArray.every((refString) => { + return isReferenceString(refString.trim()); + }); + + if (!result) { onChange && onChange([]); return; } - const ranges = value?.split(',').map((ref) => { + const ranges = valueArray.map((ref) => { const unitRange = deserializeRangeWithSheet(ref); return { unitId: unitRange.unitId, diff --git a/packages/ui/src/services/layout/layout.service.ts b/packages/ui/src/services/layout/layout.service.ts index f772cdadc20..9f5718a391e 100644 --- a/packages/ui/src/services/layout/layout.service.ts +++ b/packages/ui/src/services/layout/layout.service.ts @@ -18,6 +18,7 @@ import type { ContextService, Nullable } from '@univerjs/core'; import { Disposable, DocumentDataModel, FOCUSING_UNIVER_EDITOR, IContextService, ILogService, IUniverInstanceService, LifecycleStages, OnLifecycle, remove, SlideDataModel, toDisposable, UniverInstanceType, Workbook } from '@univerjs/core'; import { createIdentifier, type IDisposable } from '@wendellhu/redi'; import { fromEvent } from 'rxjs'; +import { IEditorService } from '../editor/editor.service'; type FocusHandlerFn = (unitId: string) => void; @@ -65,7 +66,8 @@ export class DesktopLayoutService extends Disposable implements ILayoutService { constructor( @IContextService private readonly _contextService: ContextService, @IUniverInstanceService private readonly _univerInstanceService: IUniverInstanceService, - @ILogService private readonly _logService: ILogService + @ILogService private readonly _logService: ILogService, + @IEditorService private readonly _editorService: IEditorService ) { super(); @@ -147,6 +149,7 @@ export class DesktopLayoutService extends Disposable implements ILayoutService { fromEvent(window, 'focusin').subscribe((event) => { const target = event.target as HTMLElement; if (collectionOfCnForFocusableEle.some((item) => target.classList.contains(item))) { + this._editorService.blur(); queueMicrotask(() => this.focus()); return; }