Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-31 02:16:05 +01:00
Code Issues Packages Projects Releases Activity

chore(react/ribbon): add blur & keydown events

Browse Source
This commit is contained in:
Elian Doran
2025-08-23 19:54:02 +03:00
parent 3f3c7cfe88
commit efd713dc61
3 changed files with 6 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
apps/client/src/widgets/attribute_widgets/attribute_editor.ts
View File

@@ -1,42 +1,4 @@
import { t } from "../../services/i18n.js";
import NoteContextAwareWidget from "../note_context_aware_widget.js";
import contextMenuService from "../../menus/context_menu.js";
import { AttributeEditor, type EditorConfig, type ModelElement, type MentionFeed, type ModelNode, type ModelPosition } from "@triliumnext/ckeditor5";
import noteCreateService from "../../services/note_create.js";
import attributeService from "../../services/attributes.js";
import type AttributeDetailWidget from "./attribute_detail.js";
import type { CommandData, EventData, EventListener, FilteredCommandNames } from "../../components/app_context.js";
import type { default as FAttribute, AttributeType } from "../../entities/fattribute.js";
export default class AttributeEditorWidget extends NoteContextAwareWidget implements EventListener<"entitiesReloaded">, EventListener<"addNewLabel">, EventListener<"addNewRelation"> { export default class AttributeEditorWidget extends NoteContextAwareWidget implements EventListener<"entitiesReloaded">, EventListener<"addNewLabel">, EventListener<"addNewRelation"> {
private attributeDetailWidget: AttributeDetailWidget;
private $editor!: JQuery<HTMLElement>;
private $addNewAttributeButton!: JQuery<HTMLElement>;
private $saveAttributesButton!: JQuery<HTMLElement>;
private textEditor!: AttributeEditor;
private lastUpdatedNoteId!: string | undefined;
constructor(attributeDetailWidget: AttributeDetailWidget) {
super();
this.attributeDetailWidget = attributeDetailWidget;
}
doRender() {
this.$widget = $(TPL);
this.$editor = this.$widget.find(".attribute-list-editor");
this.initialized = this.initEditor();
this.$editor.on("keydown", async (e) => {
this.attributeDetailWidget.hide();
});
this.$editor.on("blur", () => setTimeout(() => this.save(), 100)); // Timeout to fix https://github.com/zadam/trilium/issues/4160
this.$saveAttributesButton.on("click", () => this.save());
}
// triggered from keyboard shortcut // triggered from keyboard shortcut
async addNewLabelEvent({ ntxId }: EventData<"addNewLabel">) { async addNewLabelEvent({ ntxId }: EventData<"addNewLabel">) {

7
apps/client/src/widgets/react/CKEditor.tsx
View File

@@ -11,9 +11,11 @@ interface CKEditorOpts {
disableSpellcheck?: boolean; disableSpellcheck?: boolean;
onChange?: (newValue?: string) => void; onChange?: (newValue?: string) => void;
onClick?: (e: MouseEvent, pos?: ModelPosition | null) => void; onClick?: (e: MouseEvent, pos?: ModelPosition | null) => void;
onKeyDown?: (e: KeyboardEvent) => void;
onBlur?: () => void;
} }
export default function CKEditor({ currentValue, className, tabIndex, editor, config, disableNewlines, disableSpellcheck, onChange, onClick }: CKEditorOpts) { export default function CKEditor({ currentValue, editor, config, disableNewlines, disableSpellcheck, onChange, onClick, ...restProps }: CKEditorOpts) {
const editorContainerRef = useRef<HTMLDivElement>(null); const editorContainerRef = useRef<HTMLDivElement>(null);
const textEditorRef = useRef<CKTextEditor>(null); const textEditorRef = useRef<CKTextEditor>(null);
@@ -62,14 +64,13 @@ export default function CKEditor({ currentValue, className, tabIndex, editor, co
return ( return (
<div <div
ref={editorContainerRef} ref={editorContainerRef}
className={className}
tabIndex={tabIndex}
onClick={(e) => { onClick={(e) => {
if (onClick) { if (onClick) {
const pos = textEditorRef.current?.model.document.selection.getFirstPosition(); const pos = textEditorRef.current?.model.document.selection.getFirstPosition();
onClick(e, pos); onClick(e, pos);
} }
}} }}
{...restProps}
/> />
) )
} }

2
apps/client/src/widgets/ribbon/components/AttributeEditor.tsx
View File

@@ -282,6 +282,8 @@ export default function AttributeEditor({ note, componentId }: { note: FNote, co
setState("showHelpTooltip"); setState("showHelpTooltip");
} }
}} }}
onKeyDown={() => attributeDetailWidget.hide()}
onBlur={() => save()}
disableNewlines disableSpellcheck disableNewlines disableSpellcheck
/> />