Rename /frontend/wasm -> /frontend/wrapper (#3927)

.nix/pkgs/graphite.nix

@@ -32,7 +32,7 @@ let
     ];
     buildInputs = [ pkgs.openssl ];
     env.CARGO_PROFILE = if dev then "dev" else "release";
-    cargoExtraArgs = "--target wasm32-unknown-unknown -p graphite-wasm --no-default-features --features native";
+    cargoExtraArgs = "--target wasm32-unknown-unknown -p graphite-wasm-wrapper --no-default-features --features native";
     doCheck = false;
   };
   resources = deps.crane.lib.buildPackage (

Cargo.lock

@@ -2439,7 +2439,7 @@ dependencies = [
 ]
 
 [[package]]
-name = "graphite-wasm"
+name = "graphite-wasm-wrapper"
 version = "0.0.0"
 dependencies = [
  "graph-craft",

Cargo.toml

@@ -8,7 +8,7 @@ members = [
 	"desktop/platform/mac",
 	"desktop/platform/win",
 	"editor",
-	"frontend/wasm",
+	"frontend/wrapper",
 	"libraries/dyn-any",
 	"libraries/math-parser",
 	"node-graph/libraries/*",
@@ -30,7 +30,7 @@ members = [
 ]
 default-members = [
 	"editor",
-	"frontend/wasm",
+	"frontend/wrapper",
 	"libraries/dyn-any",
 	"libraries/math-parser",
 	"node-graph/graph-craft",

editor/src/messages/portfolio/document/overlays/mod.rs

@@ -2,7 +2,7 @@ pub mod grid_overlays;
 mod overlays_message;
 mod overlays_message_handler;
 pub mod utility_functions;
-// Native (non‑wasm)
+// Native (non‑Wasm)
 #[cfg(not(target_family = "wasm"))]
 pub mod utility_types_native;
 #[cfg(not(target_family = "wasm"))]

frontend/README.md

@@ -10,7 +10,7 @@ Images that are used in components and embedded into the application bundle by t
 
 Source code for the web app in the form of Svelte components and [TypeScript](https://www.typescriptlang.org/) files.
 
-## WebAssembly wrapper: `wasm/`
+## Editor wrapper: `wrapper/`
 
 Wraps the editor backend codebase (`/editor`) and provides a JS-centric API for the web app to use as an entry point, unburdened by Rust's complex data types that are incompatible with JS data types. Bindings (JS functions that call into the Wasm module) are provided by [wasm-bindgen](https://rustwasm.github.io/docs/wasm-bindgen/) in concert with [wasm-pack](https://github.com/rustwasm/wasm-pack).
 

frontend/eslint.config.js

@@ -68,7 +68,7 @@ export default defineConfig([
 				{
 					patterns: [
 						{ group: ["./**", "../**"], message: "\nImports must be absolute (e.g. '/src/<subpath>') not relative (e.g. './<subpath>')." },
-						{ group: ["src/**", "assets/**", "wasm/**"], message: "\nLocal imports must start with '/' (e.g. '/src/<subpath>' not 'src/<subpath>')." },
+						{ group: ["src/**", "assets/**", "wrapper/**"], message: "\nLocal imports must start with '/' (e.g. '/src/<subpath>' not 'src/<subpath>')." },
 					],
 				},
 			],

frontend/package.json

@@ -19,12 +19,12 @@
 		"fix": "eslint --fix",
 		"---------- INTERNAL ----------": "",
 		"setup": "node package-installer.js && node branding-installer.js",
-		"native:build-dev": "wasm-pack build ./wasm --dev --target=web --no-default-features --features native && vite build --mode native",
+		"native:build-dev": "wasm-pack build ./wrapper --dev --target=web --no-default-features --features native && vite build --mode native",
-		"native:build-production": "wasm-pack build ./wasm --release --target=web --no-default-features --features native && vite build --mode native",
+		"native:build-production": "wasm-pack build ./wrapper --release --target=web --no-default-features --features native && vite build --mode native",
-		"wasm:build-dev": "wasm-pack build ./wasm --dev --target=web",
+		"wasm:build-dev": "wasm-pack build ./wrapper --dev --target=web",
-		"wasm:build-production": "wasm-pack build ./wasm --release --target=web",
+		"wasm:build-production": "wasm-pack build ./wrapper --release --target=web",
-		"wasm:watch-dev": "cargo watch --postpone --watch-when-idle --workdir=wasm --shell \"wasm-pack build . --dev --target=web -- --color=always\"",
+		"wasm:watch-dev": "cargo watch --postpone --watch-when-idle --workdir=wrapper --shell \"wasm-pack build . --dev --target=web -- --color=always\"",
-		"wasm:watch-production": "cargo watch --postpone --watch-when-idle --workdir=wasm --shell \"wasm-pack build . --release --target=web -- --color=always\""
+		"wasm:watch-production": "cargo watch --postpone --watch-when-idle --workdir=wrapper --shell \"wasm-pack build . --release --target=web -- --color=always\""
 	},
 	"//": "NOTE: `source-sans-pro` is never to be upgraded to 3.x because that renders a pixel above its intended position.",
 	"dependencies": {

frontend/src/App.svelte

@@ -5,16 +5,16 @@
 	import type { MessageName, SubscriptionsRouter } from "/src/subscriptions-router";
 	import { loadDemoArtwork } from "/src/utility-functions/network";
 	import { operatingSystem } from "/src/utility-functions/platform";
-	import init, { EditorWrapper, receiveNativeMessage } from "/wasm/pkg/graphite_wasm";
+	import init, { EditorWrapper, receiveNativeMessage } from "/wrapper/pkg/graphite_wasm_wrapper";
-	import type { FrontendMessage } from "/wasm/pkg/graphite_wasm";
+	import type { FrontendMessage } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	let subscriptions: SubscriptionsRouter | undefined = undefined;
 	let editor: EditorWrapper | undefined = undefined;
 
 	onMount(async () => {
-		// Initialize the Wasm module
+		// Initialize the editor wrapper
-		const wasm = await init();
+		const wrapper = await init();
-		for (const [name, f] of Object.entries(wasm)) {
+		for (const [name, f] of Object.entries(wrapper)) {
 			if (name.startsWith("__node_registry")) f();
 		}
 		window.imageCanvases = {};

frontend/src/README.md

@@ -6,7 +6,7 @@ Svelte components that build the Graphite editor GUI from layouts, panels, widge
 
 ## Managers: `managers/`
 
-TypeScript files, constructed by the editor frontend, which manage the input/output of browser APIs and link this functionality with the editor backend. These files subscribe to frontend messages to execute JS APIs, and in response to these APIs or user interactions, they may call functions in the backend (defined in `/frontend/wasm/editor_wrapper.rs`).
+TypeScript files, constructed by the editor frontend, which manage the input/output of browser APIs and link this functionality with the editor backend. These files subscribe to frontend messages to execute JS APIs, and in response to these APIs or user interactions, they may call functions in the backend (defined in `/frontend/wrapper/editor_wrapper.rs`).
 
 Each manager module stores its dependencies (like `subscriptionsRouter` and `editorWrapper`) in module-level variables and exports a `create*()` and `destroy*()` function pair. `Editor.svelte` calls each `create*()` constructor in its `onMount` and calls each `destroy*()` in its `onDestroy`. Managers replace themselves during HMR updates if they are modified live during development.
 
@@ -30,7 +30,7 @@ Associates messages from the backend with subscribers in the frontend, and route
 
 ## Svelte app entry point: `App.svelte`
 
-The entry point for the Svelte application. Initializes the Wasm module, creates the `EditorWrapper` backend instance and the subscriptions router, and renders `Editor.svelte` once both are ready. The `EditorWrapper` is the wasm-bindgen interface to the Rust editor backend (defined in `/frontend/wasm/editor_wrapper.rs`), providing access to callable backend functions. Both the editor and subscriptions router are passed as props to `Editor.svelte` and set as Svelte contexts for use throughout the component tree.
+The entry point for the Svelte application. Initializes and creates the `EditorWrapper` backend instance and the subscriptions router and renders `Editor.svelte` once both are ready. The `EditorWrapper` is the wasm-bindgen interface to the Rust editor backend (defined in `/frontend/wrapper/editor_wrapper.rs`), providing access to callable backend functions. Both the editor and subscriptions router are passed as props to `Editor.svelte` and set as Svelte contexts for use throughout the component tree.
 
 ## Editor base instance: `Editor.svelte`
 

frontend/src/components/Editor.svelte

@@ -16,7 +16,7 @@
 	import { createPortfolioStore, destroyPortfolioStore } from "/src/stores/portfolio";
 	import { createTooltipStore, destroyTooltipStore } from "/src/stores/tooltip";
 	import type { SubscriptionsRouter } from "/src/subscriptions-router";
-	import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	// Graphite Wasm editor and subscriptions router
 	export let subscriptions: SubscriptionsRouter;

frontend/src/components/floating-menus/ColorPicker.svelte

@@ -28,8 +28,8 @@
 		colorEquals,
 		gradientFirstColor,
 	} from "/src/utility-functions/colors";
-	import { isPlatformNative } from "/wasm/pkg/graphite_wasm";
+	import { isPlatformNative } from "/wrapper/pkg/graphite_wasm_wrapper";
-	import type { FillChoice, MenuDirection, Color } from "/wasm/pkg/graphite_wasm";
+	import type { FillChoice, MenuDirection, Color } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	type PresetColors = "None" | "Black" | "White" | "Red" | "Yellow" | "Green" | "Cyan" | "Blue" | "Magenta";
 

frontend/src/components/floating-menus/MenuList.svelte

@@ -11,7 +11,7 @@
 	import Separator from "/src/components/widgets/labels/Separator.svelte";
 	import ShortcutLabel from "/src/components/widgets/labels/ShortcutLabel.svelte";
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
-	import type { MenuListEntry, MenuDirection } from "/wasm/pkg/graphite_wasm";
+	import type { MenuListEntry, MenuDirection } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	let self: FloatingMenu | undefined;
 	let scroller: LayoutCol | undefined;

frontend/src/components/floating-menus/NodeCatalog.svelte

@@ -6,7 +6,7 @@
 	import TextInput from "/src/components/widgets/inputs/TextInput.svelte";
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
 	import type { NodeGraphStore } from "/src/stores/node-graph";
-	import type { FrontendNodeType } from "/wasm/pkg/graphite_wasm";
+	import type { FrontendNodeType } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{ selectNodeType: string }>();
 	const nodeGraph = getContext<NodeGraphStore>("nodeGraph");

frontend/src/components/floating-menus/Tooltip.svelte

@@ -5,7 +5,7 @@
 	import ShortcutLabel from "/src/components/widgets/labels/ShortcutLabel.svelte";
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
 	import type { TooltipStore } from "/src/stores/tooltip";
-	import type { EditorWrapper, LabeledShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper, LabeledShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const tooltip = getContext<TooltipStore>("tooltip");
 	const editor = getContext<EditorWrapper>("editor");

frontend/src/components/layout/FloatingMenu.svelte

@@ -20,7 +20,7 @@
 	import { onMount, onDestroy, afterUpdate, createEventDispatcher, tick } from "svelte";
 	import LayoutCol from "/src/components/layout/LayoutCol.svelte";
 	import { browserVersion } from "/src/utility-functions/platform";
-	import type { MenuDirection } from "/wasm/pkg/graphite_wasm";
+	import type { MenuDirection } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const BUTTON_LEFT = 0;
 	const POINTER_STRAY_DISTANCE = 100;

frontend/src/components/layout/LayoutCol.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	let className = "";
 	export { className as class };

frontend/src/components/layout/LayoutRow.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	let className = "";
 	export { className as class };

frontend/src/components/panels/Data.svelte

@@ -4,7 +4,7 @@
 	import WidgetLayout from "/src/components/widgets/WidgetLayout.svelte";
 	import type { SubscriptionsRouter } from "/src/subscriptions-router";
 	import { patchLayout } from "/src/utility-functions/widgets";
-	import type { Layout } from "/wasm/pkg/graphite_wasm";
+	import type { Layout } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const subscriptions = getContext<SubscriptionsRouter>("subscriptions");
 

frontend/src/components/panels/Document.svelte

@@ -17,7 +17,7 @@
 	import { textInputCleanup } from "/src/utility-functions/keyboard-entry";
 	import { rasterizeSVGCanvas } from "/src/utility-functions/rasterization";
 	import { setupViewportResizeObserver } from "/src/utility-functions/viewports";
-	import type { Color, EditorWrapper, MenuDirection, MouseCursorIcon } from "/wasm/pkg/graphite_wasm";
+	import type { Color, EditorWrapper, MenuDirection, MouseCursorIcon } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	let rulerHorizontal: RulerInput | undefined;
 	let rulerVertical: RulerInput | undefined;

frontend/src/components/panels/Layers.svelte

@@ -13,7 +13,7 @@
 	import { pasteFile } from "/src/utility-functions/files";
 	import { operatingSystem } from "/src/utility-functions/platform";
 	import { patchLayout } from "/src/utility-functions/widgets";
-	import type { EditorWrapper, LayerPanelEntry, LayerStructureEntry, Layout } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper, LayerPanelEntry, LayerStructureEntry, Layout } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	type LayerListingInfo = {
 		folderIndex: number;

frontend/src/components/panels/Properties.svelte

@@ -4,7 +4,7 @@
 	import WidgetLayout from "/src/components/widgets/WidgetLayout.svelte";
 	import type { SubscriptionsRouter } from "/src/subscriptions-router";
 	import { patchLayout } from "/src/utility-functions/widgets";
-	import type { Layout } from "/wasm/pkg/graphite_wasm";
+	import type { Layout } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const subscriptions = getContext<SubscriptionsRouter>("subscriptions");
 

frontend/src/components/panels/Welcome.svelte

@@ -8,8 +8,8 @@
 	import type { SubscriptionsRouter } from "/src/subscriptions-router";
 	import { pasteFile } from "/src/utility-functions/files";
 	import { patchLayout } from "/src/utility-functions/widgets";
-	import { isPlatformNative } from "/wasm/pkg/graphite_wasm";
+	import { isPlatformNative } from "/wrapper/pkg/graphite_wasm_wrapper";
-	import type { EditorWrapper, Layout } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper, Layout } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const subscriptions = getContext<SubscriptionsRouter>("subscriptions");
 	const editor = getContext<EditorWrapper>("editor");

frontend/src/components/views/Graph.svelte

@@ -11,7 +11,7 @@
 	import type { DocumentStore } from "/src/stores/document";
 	import type { NodeGraphStore } from "/src/stores/node-graph";
 	import { closeContextMenu } from "/src/stores/node-graph";
-	import type { EditorWrapper, FrontendGraphInput, FrontendGraphOutput, FrontendNode } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper, FrontendGraphInput, FrontendGraphOutput, FrontendNode } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const GRID_COLLAPSE_SPACING = 10;
 	const GRID_SIZE = 24;

frontend/src/components/widgets/WidgetLayout.svelte

@@ -2,7 +2,7 @@
 	import WidgetSection from "/src/components/widgets/WidgetSection.svelte";
 	import WidgetSpan from "/src/components/widgets/WidgetSpan.svelte";
 	import WidgetTable from "/src/components/widgets/WidgetTable.svelte";
-	import type { Layout, LayoutTarget } from "/wasm/pkg/graphite_wasm";
+	import type { Layout, LayoutTarget } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	export let layout: Layout;
 	export let layoutTarget: LayoutTarget;

frontend/src/components/widgets/WidgetSection.svelte

@@ -4,7 +4,7 @@
 	import IconButton from "/src/components/widgets/buttons/IconButton.svelte";
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
 	import WidgetSpan from "/src/components/widgets/WidgetSpan.svelte";
-	import type { EditorWrapper, LayoutTarget, WidgetSection as WidgetSectionData } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper, LayoutTarget, WidgetSection as WidgetSectionData } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	export let widgetData: WidgetSectionData;
 	export let layoutTarget: LayoutTarget;

frontend/src/components/widgets/WidgetSpan.svelte

@@ -23,7 +23,7 @@
 	import ShortcutLabel from "/src/components/widgets/labels/ShortcutLabel.svelte";
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
 	import { parseFillChoice } from "/src/utility-functions/colors";
-	import type { EditorWrapper, LayoutTarget, Widget, WidgetInstance } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper, LayoutTarget, Widget, WidgetInstance } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	// Extract the discriminant key names from the Widget tagged enum union (e.g. "TextButton" | "CheckboxInput" | ...)
 	type WidgetKind = Widget extends infer T ? (T extends Record<infer K, unknown> ? K & string : never) : never;

frontend/src/components/widgets/WidgetTable.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import WidgetSpan from "/src/components/widgets/WidgetSpan.svelte";
-	import type { LayoutTarget, WidgetTable } from "/wasm/pkg/graphite_wasm";
+	import type { LayoutTarget, WidgetTable } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	export let widgetData: WidgetTable;
 	export let layoutTarget: LayoutTarget;

frontend/src/components/widgets/buttons/BreadcrumbTrailButtons.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
 	import TextButton from "/src/components/widgets/buttons/TextButton.svelte";
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	// Content
 	export let labels: string[];

frontend/src/components/widgets/buttons/IconButton.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import IconLabel from "/src/components/widgets/labels/IconLabel.svelte";
 	import type { IconName, IconSize } from "/src/icons";
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	// Content
 	export let icon: IconName;

frontend/src/components/widgets/buttons/ImageButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { IMAGE_BASE64_STRINGS } from "/src/utility-functions/images";
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	let className = "";
 	export { className as class };

frontend/src/components/widgets/buttons/ParameterExposeButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
-	import type { FrontendGraphDataType, ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { FrontendGraphDataType, ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	// Content
 	export let exposed: boolean;

frontend/src/components/widgets/buttons/PopoverButton.svelte

@@ -5,7 +5,7 @@
 	import IconLabel from "/src/components/widgets/labels/IconLabel.svelte";
 	import WidgetLayout from "/src/components/widgets/WidgetLayout.svelte";
 	import type { IconName, PopoverButtonStyle } from "/src/icons";
-	import type { MenuDirection, ActionShortcut, Layout, LayoutTarget } from "/wasm/pkg/graphite_wasm";
+	import type { MenuDirection, ActionShortcut, Layout, LayoutTarget } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	export let layoutTarget: LayoutTarget;
 

frontend/src/components/widgets/buttons/TextButton.svelte

@@ -5,7 +5,7 @@
 	import IconLabel from "/src/components/widgets/labels/IconLabel.svelte";
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
 	import type { IconName } from "/src/icons";
-	import type { MenuListEntry, ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { MenuListEntry, ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{ selectedEntryValuePath: string[] }>();
 

frontend/src/components/widgets/inputs/CheckboxInput.svelte

@@ -3,7 +3,7 @@
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
 	import IconLabel from "/src/components/widgets/labels/IconLabel.svelte";
 	import type { IconName } from "/src/icons";
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{ checked: boolean }>();
 	const backupId = String(Math.random()).substring(2);

frontend/src/components/widgets/inputs/ColorInput.svelte

@@ -3,7 +3,7 @@
 	import ColorPicker from "/src/components/floating-menus/ColorPicker.svelte";
 	import LayoutCol from "/src/components/layout/LayoutCol.svelte";
 	import { contrastingOutlineFactor, fillChoiceColor, fillChoiceGradientStops, colorToHexOptionalAlpha, gradientToLinearGradientCSS } from "/src/utility-functions/colors";
-	import type { FillChoice, MenuDirection, ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { FillChoice, MenuDirection, ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{ value: FillChoice; startHistoryTransaction: undefined }>();
 

frontend/src/components/widgets/inputs/CurveInput.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { createEventDispatcher } from "svelte";
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
-	import type { Curve, CurveManipulatorGroup, ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { Curve, CurveManipulatorGroup, ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{
 		value: Curve;

frontend/src/components/widgets/inputs/DropdownInput.svelte

@@ -4,7 +4,7 @@
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
 	import IconLabel from "/src/components/widgets/labels/IconLabel.svelte";
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
-	import type { MenuListEntry, ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { MenuListEntry, ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const DASH_ENTRY: MenuListEntry = {
 		value: "",

frontend/src/components/widgets/inputs/FieldInput.svelte

@@ -3,7 +3,7 @@
 	import { preventEscapeClosingParentFloatingMenu } from "/src/components/layout/FloatingMenu.svelte";
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
 	import { operatingSystem } from "/src/utility-functions/platform";
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{
 		value: string;

frontend/src/components/widgets/inputs/NumberInput.svelte

@@ -4,8 +4,8 @@
 	import FieldInput from "/src/components/widgets/inputs/FieldInput.svelte";
 	import { PRESS_REPEAT_DELAY_MS, PRESS_REPEAT_INTERVAL_MS } from "/src/managers/input";
 	import { browserVersion } from "/src/utility-functions/platform";
-	import { evaluateMathExpression, isPlatformNative } from "/wasm/pkg/graphite_wasm";
+	import { evaluateMathExpression, isPlatformNative } from "/wrapper/pkg/graphite_wasm_wrapper";
-	import type { ActionShortcut, EditorWrapper, NumberInputIncrementBehavior, NumberInputMode } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut, EditorWrapper, NumberInputIncrementBehavior, NumberInputMode } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const BUTTONS_LEFT = 0b0000_0001;
 	const BUTTONS_RIGHT = 0b0000_0010;

frontend/src/components/widgets/inputs/RadioInput.svelte

@@ -3,7 +3,7 @@
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
 	import IconLabel from "/src/components/widgets/labels/IconLabel.svelte";
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
-	import type { RadioEntryData } from "/wasm/pkg/graphite_wasm";
+	import type { RadioEntryData } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{ selectedIndex: number }>();
 

frontend/src/components/widgets/inputs/ReferencePointInput.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { createEventDispatcher } from "svelte";
-	import type { ReferencePoint, ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ReferencePoint, ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{ value: ReferencePoint }>();
 

frontend/src/components/widgets/inputs/SpectrumInput.svelte

@@ -9,8 +9,8 @@
 	import LayoutCol from "/src/components/layout/LayoutCol.svelte";
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
 	import { colorToHexOptionalAlpha, colorToRgbCSS, gradientFirstColor, gradientLastColor, gradientToLinearGradientCSS } from "/src/utility-functions/colors";
-	import { evaluateGradientAtPosition } from "/wasm/pkg/graphite_wasm";
+	import { evaluateGradientAtPosition } from "/wrapper/pkg/graphite_wasm_wrapper";
-	import type { Color, GradientStops } from "/wasm/pkg/graphite_wasm";
+	import type { Color, GradientStops } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const BUTTON_LEFT = 0;
 	const BUTTON_RIGHT = 2;

frontend/src/components/widgets/inputs/TextAreaInput.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { createEventDispatcher } from "svelte";
 	import FieldInput from "/src/components/widgets/inputs/FieldInput.svelte";
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{ commitText: string }>();
 

frontend/src/components/widgets/inputs/TextInput.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { createEventDispatcher } from "svelte";
 	import FieldInput from "/src/components/widgets/inputs/FieldInput.svelte";
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dispatch = createEventDispatcher<{ commitText: string }>();
 

frontend/src/components/widgets/inputs/WorkingColorsInput.svelte

@@ -4,7 +4,7 @@
 	import LayoutCol from "/src/components/layout/LayoutCol.svelte";
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
 	import { fillChoiceColor, colorToRgbaCSS } from "/src/utility-functions/colors";
-	import type { Color, EditorWrapper } from "/wasm/pkg/graphite_wasm";
+	import type { Color, EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const editor = getContext<EditorWrapper>("editor");
 

frontend/src/components/widgets/labels/IconLabel.svelte

@@ -2,7 +2,7 @@
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
 	import { ICONS, ICON_SVG_STRINGS } from "/src/icons";
 	import type { IconName } from "/src/icons";
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	let className = "";
 	export { className as class };

frontend/src/components/widgets/labels/ImageLabel.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	let className = "";
 	export { className as class };

frontend/src/components/widgets/labels/Separator.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { SeparatorDirection, SeparatorStyle } from "/wasm/pkg/graphite_wasm";
+	import type { SeparatorDirection, SeparatorStyle } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	// Content
 	export let direction: SeparatorDirection = "Horizontal";

frontend/src/components/widgets/labels/ShortcutLabel.svelte

@@ -4,7 +4,7 @@
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
 	import type { IconName } from "/src/icons";
 	import { operatingSystem } from "/src/utility-functions/platform";
-	import type { ActionShortcut, Key, LabeledShortcut, MouseMotion } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut, Key, LabeledShortcut, MouseMotion } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	// Content
 	export let shortcut: ActionShortcut;

frontend/src/components/widgets/labels/TextLabel.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { onMount, onDestroy } from "svelte";
-	import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+	import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	let className = "";
 	export { className as class };

frontend/src/components/window/MainWindow.svelte

@@ -10,7 +10,7 @@
 	import type { AppWindowStore } from "/src/stores/app-window";
 	import type { DialogStore } from "/src/stores/dialog";
 	import type { TooltipStore } from "/src/stores/tooltip";
-	import { isPlatformNative } from "/wasm/pkg/graphite_wasm";
+	import { isPlatformNative } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const dialog = getContext<DialogStore>("dialog");
 	const tooltip = getContext<TooltipStore>("tooltip");

frontend/src/components/window/Panel.svelte

@@ -9,7 +9,7 @@
 	import Welcome from "/src/components/panels/Welcome.svelte";
 	import IconButton from "/src/components/widgets/buttons/IconButton.svelte";
 	import TextLabel from "/src/components/widgets/labels/TextLabel.svelte";
-	import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	type PanelType = keyof typeof PANEL_COMPONENTS;
 

frontend/src/components/window/StatusBar.svelte

@@ -5,7 +5,7 @@
 	import WidgetLayout from "/src/components/widgets/WidgetLayout.svelte";
 	import type { SubscriptionsRouter } from "/src/subscriptions-router";
 	import { patchLayout } from "/src/utility-functions/widgets";
-	import type { Layout } from "/wasm/pkg/graphite_wasm";
+	import type { Layout } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const subscriptions = getContext<SubscriptionsRouter>("subscriptions");
 

frontend/src/components/window/TitleBar.svelte

@@ -9,8 +9,8 @@
 	import type { TooltipStore } from "/src/stores/tooltip";
 	import type { SubscriptionsRouter } from "/src/subscriptions-router";
 	import { patchLayout } from "/src/utility-functions/widgets";
-	import type { EditorWrapper, Layout } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper, Layout } from "/wrapper/pkg/graphite_wasm_wrapper";
-	import { isPlatformNative } from "/wasm/pkg/graphite_wasm";
+	import { isPlatformNative } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const keyboardLockApiSupported = navigator.keyboard !== undefined && "lock" in navigator.keyboard;
 

frontend/src/components/window/Workspace.svelte

@@ -4,7 +4,7 @@
 	import LayoutRow from "/src/components/layout/LayoutRow.svelte";
 	import Panel from "/src/components/window/Panel.svelte";
 	import type { PortfolioStore } from "/src/stores/portfolio";
-	import type { EditorWrapper, OpenDocument } from "/wasm/pkg/graphite_wasm";
+	import type { EditorWrapper, OpenDocument } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 	const MIN_PANEL_SIZE = 100;
 	const PANEL_SIZES = {

frontend/src/managers/clipboard.ts

@@ -1,6 +1,6 @@
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
 import { insertAtCaret, readAtCaret } from "/src/utility-functions/clipboard";
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 let subscriptionsRouter: SubscriptionsRouter | undefined = undefined;
 let editorWrapper: EditorWrapper | undefined = undefined;

frontend/src/managers/fonts.ts

@@ -1,5 +1,5 @@
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 type ApiResponse = { family: string; variants: string[]; files: Record<string, string> }[];
 

frontend/src/managers/input.ts

@@ -20,7 +20,7 @@ import {
 	onPaste,
 	onPointerLockChange,
 } from "/src/utility-functions/input";
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 type EventName = keyof HTMLElementEventMap | keyof WindowEventHandlersEventMap | "modifyinputfield" | "pointerlockchange" | "pointerlockerror";
 type EventListenerTarget = {

frontend/src/managers/localization.ts

@@ -1,6 +1,6 @@
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
 import { localizeTimestamp } from "/src/utility-functions/time";
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 let subscriptionsRouter: SubscriptionsRouter | undefined = undefined;
 let editorWrapper: EditorWrapper | undefined = undefined;

frontend/src/managers/persistence.ts

@@ -1,7 +1,7 @@
 import type { PortfolioStore } from "/src/stores/portfolio";
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
 import { saveEditorPreferences, loadEditorPreferences, storeDocument, removeDocument, loadFirstDocument, loadRestDocuments, saveActiveDocument } from "/src/utility-functions/persistence";
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 let subscriptionsRouter: SubscriptionsRouter | undefined = undefined;
 let editorWrapper: EditorWrapper | undefined = undefined;

frontend/src/stores/app-window.ts

@@ -1,7 +1,7 @@
 import { writable } from "svelte/store";
 import type { Writable } from "svelte/store";
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
-import type { AppWindowPlatform } from "/wasm/pkg/graphite_wasm";
+import type { AppWindowPlatform } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export type AppWindowStore = ReturnType<typeof createAppWindowStore>;
 

frontend/src/stores/dialog.ts

@@ -4,7 +4,7 @@ import type { Writable } from "svelte/store";
 import type { IconName } from "/src/icons";
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
 import { patchLayout } from "/src/utility-functions/widgets";
-import type { EditorWrapper, Layout } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper, Layout } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export type DialogStore = ReturnType<typeof createDialogStore>;
 

frontend/src/stores/document.ts

@@ -3,7 +3,7 @@ import { writable } from "svelte/store";
 import type { Writable } from "svelte/store";
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
 import { patchLayout } from "/src/utility-functions/widgets";
-import type { Layout } from "/wasm/pkg/graphite_wasm";
+import type { Layout } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export type DocumentStore = ReturnType<typeof createDocumentStore>;
 

frontend/src/stores/node-graph.ts

@@ -2,7 +2,7 @@ import { writable } from "svelte/store";
 import type { Writable } from "svelte/store";
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
 import type { MessageBody } from "/src/subscriptions-router";
-import type { NodeGraphErrorDiagnostic, BoxSelection, FrontendClickTargets, ContextMenuInformation, FrontendNode, FrontendNodeType, WirePath } from "/wasm/pkg/graphite_wasm";
+import type { NodeGraphErrorDiagnostic, BoxSelection, FrontendClickTargets, ContextMenuInformation, FrontendNode, FrontendNodeType, WirePath } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export type NodeGraphStore = ReturnType<typeof createNodeGraphStore>;
 

frontend/src/stores/portfolio.ts

@@ -3,7 +3,7 @@ import type { Writable } from "svelte/store";
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
 import { downloadFile, downloadFileBlob, upload } from "/src/utility-functions/files";
 import { rasterizeSVG } from "/src/utility-functions/rasterization";
-import type { EditorWrapper, OpenDocument } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper, OpenDocument } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export type PortfolioStore = ReturnType<typeof createPortfolioStore>;
 

frontend/src/stores/tooltip.ts

@@ -2,7 +2,7 @@ import { writable } from "svelte/store";
 import type { Writable } from "svelte/store";
 import type { SubscriptionsRouter } from "/src/subscriptions-router";
 import { operatingSystem } from "/src/utility-functions/platform";
-import type { ActionShortcut } from "/wasm/pkg/graphite_wasm";
+import type { ActionShortcut } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export type TooltipStore = ReturnType<typeof createTooltipStore>;
 

frontend/src/subscriptions-router.ts

@@ -1,4 +1,4 @@
-import type { FrontendMessage, LayoutTarget, WidgetDiff } from "/wasm/pkg/graphite_wasm";
+import type { FrontendMessage, LayoutTarget, WidgetDiff } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 // Type convert a union of messages into a map of messages
 export type ToMessageMap<T> = {

frontend/src/utility-functions/clipboard.ts

@@ -1,6 +1,6 @@
 import { extractPixelData } from "/src/utility-functions/rasterization";
 import { stripIndents } from "/src/utility-functions/strip-indents";
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export function readAtCaret(cut: boolean): string | undefined {
 	const element = window.document.activeElement;

frontend/src/utility-functions/colors.ts

@@ -1,5 +1,5 @@
-import { sampleInterpolatedGradient } from "/wasm/pkg/graphite_wasm";
+import { sampleInterpolatedGradient } from "/wrapper/pkg/graphite_wasm_wrapper";
-import type { Color, FillChoice, GradientStops } from "/wasm/pkg/graphite_wasm";
+import type { Color, FillChoice, GradientStops } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 // Channels can have any range (0-1, 0-255, 0-100, 0-360) in the context they are being used in, these are just containers for the numbers
 export type HSV = { h: number; s: number; v: number };

frontend/src/utility-functions/files.ts

@@ -1,5 +1,5 @@
 import { extractPixelData } from "/src/utility-functions/rasterization";
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export function downloadFileURL(filename: string, url: string) {
 	const element = document.createElement("a");

frontend/src/utility-functions/input.ts

@@ -6,8 +6,8 @@ import type { PortfolioStore } from "/src/stores/portfolio";
 import { pasteFile } from "/src/utility-functions/files";
 import { makeKeyboardModifiersBitfield, textInputCleanup, getLocalizedScanCode } from "/src/utility-functions/keyboard-entry";
 import { operatingSystem } from "/src/utility-functions/platform";
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
-import { isPlatformNative } from "/wasm/pkg/graphite_wasm";
+import { isPlatformNative } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 const BUTTON_LEFT = 0;
 const BUTTON_MIDDLE = 1;

frontend/src/utility-functions/network.ts

@@ -1,4 +1,4 @@
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export type RequestResult = { body: string; status: number };
 

frontend/src/utility-functions/persistence.ts

@@ -2,7 +2,7 @@ import * as idb from "idb-keyval";
 import { get } from "svelte/store";
 import type { PortfolioStore } from "/src/stores/portfolio";
 import type { MessageBody } from "/src/subscriptions-router";
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export async function storeCurrentDocumentId(documentId: string) {
 	const indexedDbStorage = idb.createStore("graphite", "store");

frontend/src/utility-functions/viewports.ts

@@ -1,4 +1,4 @@
-import type { EditorWrapper } from "/wasm/pkg/graphite_wasm";
+import type { EditorWrapper } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 export function setupViewportResizeObserver(editor: EditorWrapper): () => void {
 	const viewports = Array.from(window.document.querySelectorAll("[data-viewport-container]"));

frontend/src/utility-functions/widgets.ts

@@ -1,4 +1,4 @@
-import type { Layout, LayoutGroup, WidgetDiff, WidgetInstance } from "/wasm/pkg/graphite_wasm";
+import type { Layout, LayoutGroup, WidgetDiff, WidgetInstance } from "/wrapper/pkg/graphite_wasm_wrapper";
 
 type UIItem = Layout | LayoutGroup | WidgetInstance[] | WidgetInstance;
 // Updates a widget layout based on a list of updates, giving the new layout by mutating the `layout` argument

frontend/wrapper/Cargo.toml

@@ -1,5 +1,5 @@
 [package]
-name = "graphite-wasm"
+name = "graphite-wasm-wrapper"
 publish = false
 version = "0.0.0"
 rust-version = "1.88"

frontend/wrapper/README.md

@@ -1,4 +1,4 @@
-# Overview of `/frontend/wasm/`
+# Overview of `/frontend/wrapper/`
 
 ## Wasm wrapper API: `src/editor_wrapper.rs`
 

node-graph/nodes/raster/Cargo.toml

@@ -62,7 +62,7 @@ fastnoise-lite = { workspace = true, optional = true }
 serde = { workspace = true, optional = true }
 kurbo = { workspace = true, optional = true }
 
-# Workspace wasm dependencies
+# Workspace Wasm dependencies
 tsify = { workspace = true, optional = true }
 wasm-bindgen = { workspace = true, optional = true }
 

website/content/volunteer/guide/codebase-overview/_index.md

@@ -23,7 +23,7 @@ Graphite is built from several main software components. New developers may choo
 
 *Location: [`/frontend/src`](https://github.com/GraphiteEditor/Graphite/tree/master/frontend/src)*
 
-The frontend is the GUI for Graphite which users see and interact with. It is built using web technologies with TypeScript and Svelte (HTML and SCSS). The frontend's philosophy is to be as lightweight and minimal as possible. It acts as the entry point for user input and then quickly hands off its work to the WebAssembly editor backend via its [Wasm wrapper API](https://github.com/GraphiteEditor/Graphite/tree/master/frontend/wasm). That API is written in Rust but has TypeScript bindings generated by the [wasm-bindgen](https://github.com/rustwasm/wasm-bindgen) tooling that is part of the Vite-based build toolchain. The frontend is built of many [components](https://github.com/GraphiteEditor/Graphite/tree/master/frontend/src/components) that recursively form the window, panels, and widgets that make up the user interface.
+The frontend is the GUI for Graphite which users see and interact with. It is built using web technologies with TypeScript and Svelte (HTML and SCSS). The frontend's philosophy is to be as lightweight and minimal as possible. It acts as the entry point for user input and then quickly hands off its work to the WebAssembly editor backend via its [Wasm wrapper API](https://github.com/GraphiteEditor/Graphite/tree/master/frontend/wrapper). That API is written in Rust but has TypeScript bindings generated by the [wasm-bindgen](https://github.com/rustwasm/wasm-bindgen) tooling that is part of the Vite-based build toolchain. The frontend is built of many [components](https://github.com/GraphiteEditor/Graphite/tree/master/frontend/src/components) that recursively form the window, panels, and widgets that make up the user interface.
 
 ### Editor
 
@@ -54,7 +54,7 @@ This diagram shows the structure of the crates that comprise the Graphite codeba
 
 ## Frontend/backend communication
 
-Frontend-to-backend communication is achieved through a thin Rust translation layer in [`/frontend/wasm/src/editor_wrapper.rs`](https://github.com/GraphiteEditor/Graphite/tree/master/frontend/wasm/src/editor_wrapper.rs) which wraps the editor backend's Rust-based message system API and provides the TypeScript-compatible API of callable functions. These wrapper functions are compiled by [wasm-bindgen](https://github.com/rustwasm/wasm-bindgen) into autogenerated TS functions that serve as an entry point from TS into the Wasm binary.
+Frontend-to-backend communication is achieved through a thin Rust translation layer in [`/frontend/wrapper/src/editor_wrapper.rs`](https://github.com/GraphiteEditor/Graphite/tree/master/frontend/wrapper/src/editor_wrapper.rs) which wraps the editor backend's Rust-based message system API and provides the TypeScript-compatible API of callable functions. These wrapper functions are compiled by [wasm-bindgen](https://github.com/rustwasm/wasm-bindgen) into autogenerated TS functions that serve as an entry point from TS into the Wasm binary.
 
 Backend-to-frontend communication happens by sending a queue of messages to the frontend message dispatcher. After the TS has called any wrapper API function to get into backend code execution, the editor's business logic runs and queues up each [`FrontendMessage`](https://github.com/GraphiteEditor/Graphite/tree/master/editor/src/messages/frontend/frontend_message.rs) which get mapped from Rust to JavaScript data structures in [`/frontend/src/messages.ts`](https://github.com/GraphiteEditor/Graphite/tree/master/frontend/src/messages.ts). Various TS code subscribes to these messages by calling: