Add Typst integration (and appease clippy) #1587

Xyndra · 2025-11-14T21:34:08Z

Fixes #644

Current state (as of first commit): button with a menu that has a preview button and renders into a vector
Ideal end state: button with a menu that automatically updates its preview, rendering into an image or vector format that contains its original text for editing, but can also cancel in cases where some resources went missing and can't be recovered

Xyndra · 2025-11-14T23:14:16Z

Live preview
Higher resolution in the preview
Fix monospace
~~Option between image and vector format~~ (considered unimportant/useless for first version)
Allow for changing text after inserting (with proper cancel button)
Possibly some kind of auto-saving for changes since there are a lot of important changes happening without closing the menu and the menu can simply be closed with escape atm
Consider shipping fonts for typst

Xyndra · 2025-11-14T23:58:40Z

how it looks atm:

Xyndra · 2025-11-15T00:09:21Z

I would appreciate feedback, especially from @flxzt, both about the looks/idea and the code

files

to work properly.

Xyndra · 2025-11-15T14:13:31Z

I am unsure whether to increment the save version number, would need some info from the maintainers.
It does not crash in either direction, but accessing it with an older version removes the Typst text metadata.

background transparent by default

Xyndra · 2025-11-16T11:53:22Z

I think this is enough for a first version. The auto-save and option between pixel and vector are not must-haves, and about incrementing the version number, I would need feedback from maintainers (most of the save format seems to be from @flxzt)

anesthetice · 2025-11-16T12:21:05Z

Not a maintainer, but looks pretty promising! I have a couple of comments / suggestions though (not in order of importance or anything):

(also saw you just commit something as I'm writing this, I hope my comments aren't already out-of-date)

Any reason for using version 0.12.0 of typst when 0.14.0 is out?
I would move the typst-related code in crates/rnote-engine/src/utils.rs to their own file
Is there a way to import typst packages (e.g. CeTZ)?
I realize I am way too dependent on code-completion (e.g. from tinymist) to write typst, but somewhat hard to use without to be frank.

As for the UI

Finally, I'm still not too familiar with GTK and more complicated Rnote internals as a whole, so I can't comment on much more..

Xyndra · 2025-11-16T12:25:30Z

Not a maintainer, but looks pretty promising! I have a couple of comments / suggestions though (not in order of importance or anything):

(also saw you just commit something as I'm writing this, I hope my comments aren't already out-of-date)
* Any reason for using version `0.12.0` of typst when `0.14.0` is out?

* I would move the typst-related code in [crates/rnote-engine/src/utils.rs](https://github.com/flxzt/rnote/pull/1587/files#diff-69e14b6632502e3ecc34bc99cab25aebed4717bb0b288df3f5f8fb96808827a4) to their own file

* Is there a way to import typst packages (e.g. CeTZ)?

* I realize I am way too dependent on code-completion (e.g. from tinymist) to write typst, but somewhat hard to use without to be frank.
As for the UI

Finally, I'm still not too familiar with GTK and more complicated Rnote internals as a whole, so I can't comment on much more..

Thanks for the feedback, you are right, I did seem to make a few oversights. I will look into all of them, but I can already say that tinymist integration is close to impossible, at least for me. That is something that would require IDE-like infrastructure, which a simple GTK text field most likely does not have.

anesthetice · 2025-11-16T12:47:54Z

There does seem to be a library GtkSourceView for gtk4 that helps with code completion, but still probably a herculean task to set up and integrate with something like tinymist.

Xyndra · 2025-11-16T12:51:10Z

Yeah, that is something that is definitely too much for a first version, maybe at a later point in time. This is also not meant to be a Typst IDE, just a way to write something scientific like with LaTeX.

useless UI elements

Xyndra · 2025-11-16T13:41:32Z

Lilaq is now working

Xyndra · 2025-11-16T13:44:26Z

I have now fixed all the feedback except for the misalignment of the middle line (which is draggable, and honestly not that bad), and the tinymist stuff since that is way too hard

Xyndra · 2025-11-17T13:08:58Z

@flxzt I fixed all the clippy messages, if that was what is keeping you from merging this. Would be nice if you could merge this, since I have other changes conflicting with this I want to work on

flxzt · 2025-11-17T18:51:15Z

Typst support is something that is super exciting, this is quite incredible!

I need to do a proper review on this huge diff. It looks good, but it might take a little while until I am able to do it

Also, remove random vertical seperater from shape page

Vim habits caused me so much pain before this lol Also, I switched the position of the insert button

Xyndra · 2025-11-18T16:08:47Z

Btw if this ever gets merged, I also have another branch based on this where I also added a marker tool

Doublonmousse · 2025-11-19T07:09:57Z

One trick that could be used for the IDE part is the use of temporary files.

I've seen it done on some GUI sftp software. Show the folder content, and if you want to edit a text file on remote, you can "open with" your favorite IDE and it just opens the file with the IDE. Internally, it downloads and copy the file to a temp folder, calls the "open with" command on the file (so you can choose any program that opens txt), and more importantly watches the files so that when you save it in the IDE, it syncs the change back to the remote.

Using the same tactic here, we could make it possible to edit each typst element in vscode with all the benefits of the IDE support

Xyndra · 2025-11-20T11:41:37Z

I also noticed I need to set the flag for the flatpak somewhere so that it is allowed to access the internet for typst plugins

hoellwerth · 2025-12-13T17:14:06Z

Wonderful feature! It also integrates well with whole app.

Is there a possibility of rendering in white font when dark style is active? Maybe also allow exiting the typst editor by pressing 'Esc'

Also when double-clicking an existing typst text, which is not tha unintuitive, it opens the windows twice.

Xyndra · 2025-12-13T17:23:12Z

Is there a possibility of a white font when dark style is active?

This is not really something for the wrapper but rather for the file (you can change font color and background color in typst), but in the future, maybe it could put the color from the current tool as text color. I think that is a bit much for a first attempt though, as there are already huge changes.

Maybe also allow exiting the typst editor by pressing 'Esc'

See the conversation above, allowing 'esc' to exit would lead to the entire file being lost, which can be really annoying, especially for people frequently using vim where you esc+:+w+enter to save a file. As mentioned above, maybe this could be solved by implementing an "open in editor", but since this is cross-platform, even supporting embedded, which I can't test, I am not sure if that is a good idea to add.

Also when double-clicking an existing typst text, which is not tha unintuitive, it opens the windows twice.

I noticed that too, however that is a bit hard to fix with the project structure. This happens because renderer and drawing are decoupled and the popup sometimes is not fast enough. For me, this only occurs the first time since once Typst is loaded, it is fast enough to open before I can click again, but that probably depends on system load

hoellwerth · 2025-12-13T17:29:16Z

Thanks for the really fast reply, Sorry for not entirely reading the conversation, I guess I was just too excited for the change! can't wait to see this in upstream and really looking forward to future features.

Doublonmousse

For other comments on the thread

See the conversation above, allowing 'esc' to exit would lead to the entire file being lost, which can be really annoying, especially for people frequently using vim where you esc+:+w+enter to save a file. As mentioned above, maybe this could be solved by implementing an "open in editor", but since this is cross-platform, even supporting embedded, which I can't test, I am not sure if that is a good idea to add.

I'm not getting this (is it because you call update on the VectorImage on confirmation only ?). Do note that on the dialog itself, you can use https://world.pages.gitlab.gnome.org/Rust/libadwaita-rs/stable/latest/docs/libadwaita/struct.Dialog.html#method.connect_close_attempt or connect_close and do some additional processing before closing the dialog

maybe set the text to be what's on the window
and/or check if the text has changed, and if so force a new save/cancel dialog so you can't accidentally erase things

This is not really something for the wrapper but rather for the file (you can change font color and background color in typst), but in the future, maybe it could put the color from the current tool as text color. I think that is a bit much for a first attempt though, as there are already huge changes.

One idea is to get the background color from the settings and put this just below the typst code preview. That way it's not dependent on the light/dark mode, but whether or not the typst svg would be visible on a blank page.

Doublonmousse · 2025-12-26T22:48:40Z

crates/rnote-engine/Cargo.toml

+typst = { workspace = true, optional = true }
+typst-kit = { workspace = true, optional = true }
+typst-svg = { workspace = true, optional = true }

 [dev-dependencies]
 approx = { workspace = true }

 [features]
 cli = ["dep:clap"]
 default = []
-ui = ["dep:gtk4"]
+ui = ["dep:gtk4", "dep:typst", "dep:typst-kit", "dep:typst-svg"]


I don't think making typst optional works in that case.

Remember that the rnote-cli + the thumbnailer must be capable of rendering a rnote file to pdf/svg

Doublonmousse · 2025-12-26T23:28:14Z

crates/rnote-engine/src/engine/import.rs


+    /// Insert an SVG image as a VectorImage stroke.
+    /// If `typst_source` is provided, it will be stored with the image for later editing.
+    pub fn insert_svg_image(


These functions feel a little bit out of place somehow. I think you could very well use import_generated_content with some adaptations (to not select the newly added svg)

Doublonmousse · 2025-12-26T23:31:36Z

crates/rnote-engine/src/engine/import.rs

+    }
+
+    /// Update an existing Typst stroke with new SVG data and source code.
+    pub fn update_typst_stroke(


For this one, half of it could be a method in VectorImage like update_image and the rest that would stay would be related to the widget flags and store (if it doesn't come from the widget flags handler)

Another thing on typing : I'm not sure the best way to go is to add a field to a VectorImage (which can be or not be from a typst edition).

Maybe it's a little better to add a separate typst type.

Note for compatibility : this PR needs to bump the rnote file version as the extra field makes it (probably) forward compatible (because of the serde skip if the typst source is one) but not backwards if a typst element is added

Doublonmousse · 2025-12-26T23:38:53Z

crates/rnote-engine/src/pens/typewriter/penevents.rs

+                        if let Some(ref typst_source) = vectorimage.typst_source {
+                            // Signal to UI that a Typst element was clicked for editing
+                            *engine_view.clicked_typst_stroke =
+                                Some((stroke_key, typst_source.clone()));


Why do we need the typst source here ?

Maybe signaling could be done in handle_pen_event_up if you want only up events ? or select on down, act and reset on up ?

Doublonmousse · 2025-12-26T23:41:36Z

crates/rnote-engine/src/typst.rs

+    }
+
+    fn today(&self, _offset: Option<i64>) -> Option<Datetime> {
+        Datetime::from_ymd(2024, 1, 1)


Do we care about the date ? Maybe a None (if we don't) or getting the date from the rust std to the datetime type would be better

Doublonmousse · 2025-12-26T23:44:15Z

crates/rnote-ui/data/ui/penssidebar/penssidebar.ui

        <property name="transition_type">GTK_STACK_TRANSITION_TYPE_SLIDE_LEFT_RIGHT</property>
+        <property name="interpolate_size">True</property>
+        <property name="hhomogeneous">False</property>
+        <property name="vhomogeneous">False</property>


I don't know if I prefer with or without the *homogeneous setting

Doublonmousse · 2025-12-26T23:56:33Z

crates/rnote-ui/src/dialogs/typsteditor.rs

+    dialog.present(Some(appwindow));
+}
+
+fn svg_to_texture(svg: &str) -> anyhow::Result<gdk4::Texture> {


There's probably everything you need in other functions.

There is an to_memtexture for the conversion from image to gdk4::MemoryTexture, and the VectorImage from_svg_str + gen_images for generating the image itself

Doublonmousse · 2025-12-27T00:06:47Z

crates/rnote-engine/src/engine/mod.rs

    }

+    /// Takes the clicked Typst stroke if any, clearing it from the engine.
+    pub fn take_clicked_typst_stroke(&mut self) -> Option<(StrokeKey, String)> {


It's not great because you essentially take on each up event (which is a lot) vs doing a (is it some) and then taking

Doublonmousse · 2025-12-27T00:14:33Z

crates/rnote-engine/src/engine/mod.rs

    pub camera: &'a mut Camera,
    pub audioplayer: &'a mut Option<AudioPlayer>,
    pub animation: &'a mut Animation,
+    pub clicked_typst_stroke: &'a mut Option<(StrokeKey, String)>,


I don't like this too much.
This is why you have double editors: in the time between the first click and the first editor popping up, any intermediary event can query another editor.

I want to do this another way

set the fact that a typst stroke is selected in the widget flags

Maybe keep only the strokekey here (and you may test for the presence of the typst source before pushing a Some in here, so Some for this means we selected a typst stroke)

add a boolean property (either here, or preferably in the appwindow) to indicate whether or not an editor is opened (and to be safe this has to be large : set to true before querying the first editor, set to false after the editor is closed, and so that if it set to true no new editor is queried)

That way, the decision to open a new editor can be taken from the widget flags handler.

This is open to discussion as I'm not 100 % sure of everything here

Doublonmousse · 2025-12-27T12:46:29Z

Another though : you could store the selected typst stroke in the typewriter states so that signaling to open the editor is easier :

note that the stroke was selected on handle_pen_down
send some signals on handle_pen_up (at that point you'd know it's both a pen up and a typst stroke was selected)

Xyndra added 3 commits November 14, 2025 22:28

basic typst rendering into image git checkout -b typst! AI Warning

52287b7

Misc. sanitiy changes

c076247

Add live preview and better popup scaling - another AI warning!!!

432cd99

Xyndra added 2 commits November 15, 2025 00:42

Render SVG at intrinsic size doubled to fix bad resolution

6dc8389

Fix monospace

a99b8d4

Edit Typst source (supports rotation and scaling) and store it in the

38e2c61

files

Xyndra force-pushed the typst branch from 3af5c11 to 38e2c61 Compare November 15, 2025 01:35

Xyndra added 2 commits November 15, 2025 14:49

Use Typsts own font loading system with embedded fonts to get flatpaks

3af98c9

to work properly.

Remove unused fontdb dependency

3f73da5

Extract the default template out of a oneline statement, and make the

ae6b37e

background transparent by default

Xyndra marked this pull request as ready for review November 16, 2025 11:51

Xyndra added 2 commits November 16, 2025 14:23

Extract the Typst stuff out of utils, update typst to 0.14.0, remove

00ac273

useless UI elements

Allow for typst packages (slight AI warning)

69e197a

Xyndra added 2 commits November 16, 2025 16:04

Run cargo fmt

670c6fc

Appease clippy

bd5b7f0

Xyndra changed the title ~~Add Typst integration~~ Add Typst integration (and appease clippy) Nov 17, 2025

Merge branch 'main' into typst

ef891c0

Xyndra added 3 commits November 18, 2025 16:16

Size pen sidebar based on content

e1af7c5

Also, remove random vertical seperater from shape page

Add proper typst logo

78ff531

Stop closing when pressing escape in the Typst window

09ad5d0

Vim habits caused me so much pain before this lol Also, I switched the position of the insert button

Merge branch 'main' into typst

984c863

Doublonmousse reviewed Dec 27, 2025

View reviewed changes

Uh oh!

Add Typst integration (and appease clippy) #1587

Are you sure you want to change the base?

Add Typst integration (and appease clippy) #1587

Uh oh!

Conversation

Xyndra commented Nov 14, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Xyndra commented Nov 14, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Xyndra commented Nov 14, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Xyndra commented Nov 15, 2025

Uh oh!

Xyndra commented Nov 15, 2025

Uh oh!

Xyndra commented Nov 16, 2025

Uh oh!

anesthetice commented Nov 16, 2025

Uh oh!

Xyndra commented Nov 16, 2025

Uh oh!

anesthetice commented Nov 16, 2025

Uh oh!

Xyndra commented Nov 16, 2025

Uh oh!

Xyndra commented Nov 16, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Xyndra commented Nov 16, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Xyndra commented Nov 17, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

flxzt commented Nov 17, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Xyndra commented Nov 18, 2025

Uh oh!

Doublonmousse commented Nov 19, 2025

Uh oh!

Xyndra commented Nov 20, 2025

Uh oh!

hoellwerth commented Dec 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Xyndra commented Dec 13, 2025

Uh oh!

hoellwerth commented Dec 13, 2025

Uh oh!

Doublonmousse left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Doublonmousse commented Dec 27, 2025

Xyndra commented Nov 14, 2025 •

edited

Loading

Xyndra commented Nov 14, 2025 •

edited

Loading

Xyndra commented Nov 14, 2025 •

edited

Loading

Xyndra commented Nov 16, 2025 •

edited

Loading

Xyndra commented Nov 16, 2025 •

edited

Loading

Xyndra commented Nov 17, 2025 •

edited

Loading

flxzt commented Nov 17, 2025 •

edited

Loading

hoellwerth commented Dec 13, 2025 •

edited

Loading