Editor does not close

[danielo515]

Hello.
I am building a little utility to make writting search and replace in vim easier, but I'm facing a little problem (that was not happening in my first iteration of the script).
For some reason, after submitting the editor will not close.
It shows what looks like a loading bar and keeps open. It performs all the expected actions, it is just that does notk close. There are no errors on the global or scripts logs.

By the way, in case of running errors, there is no popup or anything, I had to run the script in a browser to find an error related to string.replaceAll.

Here is the script:

// Name: make vim regex

import '@johnlindquist/kit';

function transformToVimRegex(text: string) {
  const replaced = text.replaceAll(/[\n]+/g, '\\_s+');
  return `:%s/\\v${replaced}`
}

const content = await clipboard.readText();
const previewer = await widget(`
<h1 class="text-2xl p-5 whitespace-nowrap ">
{{content}}
</h1>`, {
	transparent: true,
	draggable: true,
	hasShadow: true,
	alwaysOnTop: true,
});

let regex = "";

const _ = await editor({
	value: content,
  preview: (() => Promise.resolve(regex) ) as any,
  hasPreview: true,
	onInput(value) {
    regex = transformToVimRegex(value || "");
		previewer.setState({content: regex});
	},
});
await copy(regex);
previewer.close();

[danielo515]

By the way, I finally made the previewer of the editor to work, and it is almost exactly the same thing as the one I was using manually, except that it seems to have less control? Or you can return any html just like what you do with widgets? Can I position it?

[johnlindquist]

@danielo515 Sorry, can you be more specific with your question? I don't understand what you're asking

[danielo515]

If you try the script I provided, the editor does not close when you save. There is a hit saying cmd + s to submit, but that does not closes the editor. My guess is that, if you provide editor options then you need to provide an onsubmit handler or something like that.
Does that make more sense?

[Ambushfall]

For unknown reasons to me the way the widget handles state is kind of weird.

I'll shortly explain, as soon as you implement everything the same, but remove the widget it will work and close normally.

Now I've found a weird way around that.

// await copy(regex)
await setSelectedText(regex)

// Name: make vim regex

import '@johnlindquist/kit';

function transformToVimRegex(text: string) {
  const replaced = text.replaceAll(/[\n]+/g, '\\_s+');
  return `:%s/\\v${replaced}`
}

const content = await clipboard.readText();
const previewer = await widget(`
<h1 class="text-2xl p-5 whitespace-nowrap ">
{{content}}
</h1>`, {
	transparent: true,
	draggable: true,
	hasShadow: true,
	alwaysOnTop: true,
});

let regex = "";

const _ = await editor({
	value: content,
  preview: (() => Promise.resolve(regex) ) as any,
  hasPreview: true,
	onInput(value) {
    regex = transformToVimRegex(value || "");
		previewer.setState({content: regex});
	},
});
// await copy(regex);
await setSelectedText(regex)
previewer.close();

[johnlindquist]

@danielo515 @Ambushfall

If your goal is to hide the prompt, use:

await hide()

Right after the editor

If your goal is to terminate the script, add

exit()

to the end of the script

The bug

programmatically invoking close() on the widget isn't firing the closeHandler which needs to run:

process.removeAllListeners("message")

Otherwise the script keeps listening for events for the widget and the UI stays "open"

Note: Closing the widget with the keyboard/mouse does invoke the close handler

I'll get that sorted in the next build.

[danielo515]

My intention is to close everything after the editor saves.
The way (I think) I got around it, was by adding some shortcuts, correct me if I'm wrong about this. It apparently works, but I wanted to report the issue anyway.
This is the code that I think works:

const result = await editor({
	value: content.trim(),
  x: center,
  y: previewHeight + 24,
  width: previewWidth,

  description: "This will be transformed to vim regex and copied to your clipboard",
  shortcuts: [
    {
      name: "Save and Close",
      key: "escape",
      onPress: async (input) => {
        await submit(transformToVimRegex(input || ""));
        await hide()
      },
      bar: "right",
    },
  ],
  onAbandon: async () => {
    await hide();
  },
  onInput(value) {
    const regex = transformToVimRegex(value || "");
		previewer.setState({content: regex});
	},
});

await copy(result);
previewer.close();