Refactor the TypeScript data flow for full type safety and auto-generation of Rust types (#3865)

* Migrate Specta to Tsify to auto-generate messages.ts, working except colors and widgets

* Adopt the generated FillColor/Color/GradientStops

* Fix widget typing

* Separate WidgetGroup enum variants into wrapper structs

* Small rename

* Simplify widgets further

* Clean up message type references

* Switch type imports to the auto-generated file

* Remove lowercase serde rename

* Fix FillChoice deserialization

* Fix small regression from #3837

* Improve type safety

* Make WidgetSpan type-safe

* More cleanup and type safety

* More type safety

* More type safety

* Get the rest to type-check without errors; improve widget builder macro to have optional icons; improve Svelte 5 configs

* Cargo fmt

* Fix imports

* Update outdated readme info

* Fix lint command rename references

* Fix typos

* One more typos fix

* Remove unnecessary dep: prefix from the edited Cargo.toml files

* Remove excess parts from Cargo.toml

* Fix compiling on desktop

* Revert "Remove excess parts from Cargo.toml"

This reverts commit 6b711117b3a5d5d8a3ee20f36a43bc74930b7c82.

* Update dev docs with simpler, more accurate instructions
This commit is contained in:
Keavon Chambers
2026-03-09 16:35:04 -07:00
parent fbd2658148
commit 52d2b38a82
199 changed files with 2265 additions and 2811 deletions
@@ -1,6 +1,6 @@
<script lang="ts">
import type { ActionShortcut, Key, LabeledShortcut, MouseMotion } from "@graphite/../wasm/pkg/graphite_wasm";
import type { IconName } from "@graphite/icons";
import type { ActionShortcut, KeyRaw, LabeledShortcut, MouseMotion } from "@graphite/messages";
import { operatingSystem } from "@graphite/utility-functions/platform";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
@@ -16,7 +16,7 @@
if (typeof labeledKeyOrMouseMotion === "string") return { mouseMotion: labeledKeyOrMouseMotion };
// `key` is the name of the `Key` enum in Rust, while `label` is the localized string to display (if it doesn't become an icon)
let key = labeledKeyOrMouseMotion.key;
let key: Key | "Option" = labeledKeyOrMouseMotion.key;
const label = labeledKeyOrMouseMotion.label;
// Replace Alt and Accel keys with their Mac-specific equivalents
@@ -57,7 +57,7 @@
return consolidatedList;
}
function keyboardHintIcon(input: KeyRaw): IconName | undefined {
function keyboardHintIcon(input: Key | "Option"): IconName | undefined {
switch (input) {
case "ArrowDown":
return "KeyboardArrowDown";
@@ -89,7 +89,20 @@
}
function mouseHintIcon(input: MouseMotion): IconName {
return `MouseHint${input}` as IconName;
return {
None: "MouseHintNone" as const,
Lmb: "MouseHintLmb" as const,
Rmb: "MouseHintRmb" as const,
Mmb: "MouseHintMmb" as const,
ScrollUp: "MouseHintScrollUp" as const,
ScrollDown: "MouseHintScrollDown" as const,
Drag: "MouseHintDrag" as const,
LmbDouble: "MouseHintLmbDouble" as const,
LmbDrag: "MouseHintLmbDrag" as const,
RmbDrag: "MouseHintRmbDrag" as const,
RmbDouble: "MouseHintRmbDouble" as const,
MmbDrag: "MouseHintMmbDrag" as const,
}[input];
}
</script>