obsidian-plugin/murashit_codex-panel
1
0
Fork 0
mirror of https://github.com/murashit/codex-panel.git synced 2026-07-22 17:30:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Tune rewrite popover height behavior

Browse source
This commit is contained in:
murashit 2026-05-18 13:07:47 +09:00
parent d6244d2589
commit 20d3bb4251
2 changed files with 25 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
src/editor-rewrite/popover.ts
View file

@ -28,6 +28,7 @@ export class RewriteSelectionPopover {
private instructionEl: HTMLTextAreaElement | null = null;
private generateButton: HTMLButtonElement | null = null;
private applyButton: HTMLButtonElement | null = null;
private footerEl: HTMLElement | null = null;
private statusEl: HTMLElement | null = null;
private diffEl: HTMLElement | null = null;
private debugEl: HTMLDetailsElement | null = null;
@ -48,7 +49,11 @@ export class RewriteSelectionPopover {
attr: { placeholder: "How should Codex rewrite the selected text?" },
});
instructionEl.value = this.options.session.instruction;
instructionEl.oninput = () => this.syncControls();
instructionEl.oninput = () => {
this.syncInstructionHeight();
this.syncControls();
this.position();
};
instructionEl.onkeydown = (event) => {
if (!isRewriteGenerateKey(event, this.options.sendShortcut)) return;
event.preventDefault();
@ -72,6 +77,7 @@ export class RewriteSelectionPopover {
this.diffEl = root.createDiv({ cls: "codex-panel-rewrite-popover__diff" });
const footer = root.createDiv({ cls: "codex-panel-rewrite-popover__footer" });
this.footerEl = footer;
const applyButton = createIconButton(footer, "check", "Apply rewrite", "codex-panel-rewrite-popover__icon-button mod-cta");
applyButton.onclick = () => this.apply();
this.applyButton = applyButton;
@ -87,6 +93,7 @@ export class RewriteSelectionPopover {
});
this.setStatus("");
this.syncInstructionHeight();
this.syncControls();
this.position();
instructionEl.focus();
@ -99,6 +106,7 @@ export class RewriteSelectionPopover {
this.instructionEl = null;
this.generateButton = null;
this.applyButton = null;
this.footerEl = null;
this.statusEl = null;
this.diffEl = null;
this.debugEl = null;
@ -221,6 +229,13 @@ export class RewriteSelectionPopover {
this.applyButton.disabled = generating || this.options.session.replacementText === null;
this.applyButton.classList.toggle("is-hidden", this.options.session.replacementText === null);
}
this.footerEl?.classList.toggle("is-hidden", this.options.session.replacementText === null);
}
private syncInstructionHeight(): void {
if (!this.instructionEl) return;
this.instructionEl.setCssProps({ height: "auto" });
this.instructionEl.setCssProps({ height: `${this.instructionEl.scrollHeight}px` });
}
private position(): void {

11
styles.css
View file

@ -1413,8 +1413,10 @@
}
.codex-panel-rewrite-popover__instruction {
min-height: 72px;
resize: vertical;
min-height: calc((var(--icon-s, 16px) + var(--size-2-3, 6px) * 2) * 2 + var(--size-2-1, 2px));
max-height: min(168px, 28vh);
resize: none;
overflow-y: auto;
}
.codex-panel-rewrite-popover__prompt-row {
@ -1437,6 +1439,11 @@
justify-content: flex-end;
}
.codex-panel-rewrite-popover__footer.is-hidden,
.codex-panel-rewrite-popover__diff:empty {
display: none;
}
.codex-panel-rewrite-popover__icon-button {
--icon-size: var(--icon-s, 16px);
--icon-stroke: var(--icon-s-stroke-width, 2px);