Assorted code file cleanup following Svelte switch

2026-09-25 10:48:12 +08:00 · 2023-03-10 15:48:04 -08:00
parent 0c8df9bf51
commit dd458deb32
34 changed files with 61 additions and 60 deletions
@@ -1,4 +1,4 @@
-<svg width="937" height="240" viewBox="0 0 937 240" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
+<svg viewBox="0 0 937 240" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
 	<path d="M934.29,139.3c-3.08,2.94-6.82,5.09-10.91,6.27c-3.49,1.06-7.1,1.63-10.74,1.71c-6.08,0.08-11.98-2.06-16.6-6.02c-4.78-4.01-7.49-10.63-8.14-19.86l48.01-6.02c0-8.68-2.58-15.71-7.73-21.08c-5.16-5.37-12.72-8.06-22.7-8.06c-7.19-0.04-14.29,1.57-20.75,4.72c-6.37,3.07-11.75,7.86-15.54,13.83c-3.91,6.08-5.86,13.46-5.86,22.14c0,8.03,1.76,14.98,5.29,20.83c3.41,5.76,8.38,10.44,14.32,13.51c6.21,3.19,13.11,4.81,20.1,4.72c9.01,0,16.14-2.2,21.41-6.59c5.51-4.74,9.78-10.74,12.45-17.5L934.29,139.3z M891.64,99.01c2.28-3.85,5.26-5.78,8.95-5.78c3.79,0,6.48,1.84,8.06,5.53c1.68,4.2,2.59,8.66,2.69,13.18l-23.6,2.93C888.06,108.15,889.37,102.86,891.64,99.01" />
 	<path d="M844.61,151.33c-7.06,0-10.58-4.34-10.58-13.02v-34.5c0-4.34,2.17-6.51,6.51-6.51h14.65v-8.62h-21.16c0-4.12,0.05-8.19,0.16-12.21c0.11-4.01,0.59-11.63,0.91-15.76l-25.49,11.81v16.16h-9.77v8.62h9.77v44.27c0,7.16,2.01,13.02,6.02,17.58c4.01,4.56,9.87,6.83,17.58,6.84c4.07,0.13,8.11-0.71,11.8-2.44c3.03-1.49,5.72-3.6,7.89-6.18c1.98-2.37,3.62-5,4.88-7.81l-2.6-2.6C852.42,149.81,848.59,151.4,844.61,151.33" />
 	<path d="M783.25,154.67c-0.64-2.97-0.91-6-0.81-9.03v-38.9c0-5.21,0.08-9.52,0.24-12.94s0.3-5.94,0.41-7.57l-0.98-0.98l-35.48,16.44l1.63,3.74c1.09-0.4,2.2-0.73,3.34-0.98c0.94-0.21,1.89-0.31,2.85-0.32c0.97-0.07,1.92,0.22,2.69,0.81c0.59,0.54,0.89,1.63,0.9,3.26v37.43c0.08,3.03-0.14,6.05-0.65,9.03c-0.44,2.01-1.2,3.34-2.28,3.99c-1.35,0.73-2.86,1.12-4.39,1.14v3.74h41.5v-3.74c-2.06,0-4.1-0.39-6.02-1.14C784.64,157.85,783.56,156.38,783.25,154.67 M771.04,77.28c3.74,0.07,7.35-1.44,9.93-4.15c2.64-2.59,4.11-6.15,4.07-9.85c0.03-3.72-1.44-7.3-4.07-9.93c-2.56-2.75-6.17-4.29-9.93-4.23c-3.81-0.09-7.48,1.45-10.09,4.23c-2.64,2.63-4.1,6.21-4.07,9.93c0.02,7.75,6.32,14.02,14.07,14C770.98,77.29,771.01,77.29,771.04,77.28" />
@@ -4,7 +4,7 @@
 		"beforeBuildCommand": "npm run build",
 		"beforeDevCommand": "npm start",
 		"distDir": "../public",
-		"devPath": "http://127.0.0.1:8080"
+		"devPath": "http://127.0.0.1:8080/"
 	},
 	"package": {
 		"productName": "Graphite",
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { onMount, onDestroy, setContext } from "svelte";
-	import { type createEditor } from "@/wasm-communication/editor";
+	import type { createEditor } from "@/wasm-communication/editor";
 	import { operatingSystem } from "@/utility-functions/platform";
 	import { createClipboardManager } from "@/io-managers/clipboard";
 	import { createDragManager } from "@/io-managers/drag";
@@ -14,7 +14,7 @@
 	import TextInput from "@/components/widgets/inputs/TextInput.svelte";
 	import Separator from "@/components/widgets/labels/Separator.svelte";
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
 	type PresetColors = "none" | "black" | "white" | "red" | "yellow" | "green" | "cyan" | "blue" | "magenta";
@@ -7,7 +7,7 @@
 	import TextButton from "@/components/widgets/buttons/TextButton.svelte";
 	import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
 	import WidgetLayout from "@/components/widgets/WidgetLayout.svelte";
-	import { type DialogState } from "@/state-providers/dialog";
+	import type { DialogState } from "@/state-providers/dialog";
 	const dialog = getContext<DialogState>("dialog");
@@ -3,7 +3,7 @@
 <script lang="ts">
 	import { createEventDispatcher } from "svelte";
-	import { type MenuListEntry } from "@/wasm-communication/messages";
+	import type { MenuListEntry } from "@/wasm-communication/messages";
 	import FloatingMenu, { type MenuDirection } from "@/components/layout/FloatingMenu.svelte";
 	import LayoutCol from "@/components/layout/LayoutCol.svelte";
@@ -6,8 +6,8 @@
 	export { styleName as style };
 	export let styles: Record<string, string | number | undefined> = {};
 	export let tooltip: string | undefined = undefined;
-	export let scrollableX: boolean = false;
+	export let scrollableX = false;
-	export let scrollableY: boolean = false;
+	export let scrollableY = false;
 	let self: HTMLDivElement;
@@ -6,8 +6,8 @@
 	export { styleName as style };
 	export let styles: Record<string, string | number | undefined> = {};
 	export let tooltip: string | undefined = undefined;
-	export let scrollableX: boolean = false;
+	export let scrollableX = false;
-	export let scrollableY: boolean = false;
+	export let scrollableY = false;
 	let self: HTMLDivElement;
@@ -25,8 +25,8 @@
 	import CanvasRuler from "@/components/widgets/metrics/CanvasRuler.svelte";
 	import PersistentScrollbar from "@/components/widgets/metrics/PersistentScrollbar.svelte";
 	import WidgetLayout from "@/components/widgets/WidgetLayout.svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
-	import { type DocumentState } from "@/state-providers/document";
+	import type { DocumentState } from "@/state-providers/document";
 	let rulerHorizontal: CanvasRuler;
 	let rulerVertical: CanvasRuler;
@@ -50,13 +50,13 @@
 	// Rulers
 	let rulerOrigin: XY = { x: 0, y: 0 };
-	let rulerSpacing: number = 100;
+	let rulerSpacing = 100;
-	let rulerInterval: number = 100;
+	let rulerInterval = 100;
 	// Rendered SVG viewport data
-	let artworkSvg: string = "";
+	let artworkSvg = "";
-	let artboardSvg: string = "";
+	let artboardSvg = "";
-	let overlaysSvg: string = "";
+	let overlaysSvg = "";
 	// Rasterized SVG viewport data, or none if it's not up-to-date
 	let rasterizedCanvas: HTMLCanvasElement | undefined = undefined;
@@ -20,7 +20,7 @@
 	import IconButton from "@/components/widgets/buttons/IconButton.svelte";
 	import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
 	import WidgetLayout from "@/components/widgets/WidgetLayout.svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
 	type LayerListingInfo = {
 		folderIndex: number;
@@ -47,7 +47,7 @@
 	const editor = getContext<Editor>("editor");
 	// Layer data
-	let layerCache: Map<string, LayerPanelEntry> = new Map(); // TODO: replace with BigUint64Array as index
+	let layerCache = new Map<string, LayerPanelEntry>(); // TODO: replace with BigUint64Array as index
 	let layers: LayerListingInfo[] = [];
 	// Interactive dragging
@@ -12,8 +12,8 @@
 	import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
 	import WidgetLayout from "@/components/widgets/WidgetLayout.svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
-	import { type NodeGraphState } from "@/state-providers/node-graph";
+	import type { NodeGraphState } from "@/state-providers/node-graph";
 	const WHEEL_RATE = (1 / 600) * 3;
 	const GRID_COLLAPSE_SPACING = 10;
@@ -6,7 +6,7 @@
 	import LayoutCol from "@/components/layout/LayoutCol.svelte";
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
 	import WidgetLayout from "@/components/widgets/WidgetLayout.svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
 	const editor = getContext<Editor>("editor");
@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { debouncer } from "@/utility-functions/debounce";
-	import { narrowWidgetProps, Widget } from "@/wasm-communication/messages";
+	import type { Widget } from "@/wasm-communication/messages";
 	import { narrowWidgetProps } from "@/wasm-communication/messages";
 	import { isWidgetColumn, isWidgetRow, type WidgetColumn, type WidgetRow } from "@/wasm-communication/messages";
 	import PivotAssist from "@/components/widgets/assists/PivotAssist.svelte";
@@ -24,7 +25,7 @@
 	import Separator from "@/components/widgets/labels/Separator.svelte";
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
 	import { getContext } from "svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
 	const SUFFIX_WIDGETS = ["PopoverButton"];
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { createEventDispatcher } from "svelte";
-	import { type PivotPosition } from "@/wasm-communication/messages";
+	import type { PivotPosition } from "@/wasm-communication/messages";
 	// emits: ["update:position"],
 	const dispatch = createEventDispatcher<{ position: PivotPosition }>();
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { type IconName } from "@/utility-functions/icons";
+	import type { IconName } from "@/utility-functions/icons";
 	import FloatingMenu from "@/components/layout/FloatingMenu.svelte";
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
@@ -1,16 +1,16 @@
 <script lang="ts">
-	import { type IconName } from "@/utility-functions/icons";
+	import type { IconName } from "@/utility-functions/icons";
 	import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
 	export let label: string;
 	export let icon: IconName | undefined = undefined;
-	export let emphasized: boolean = false;
+	export let emphasized = false;
-	export let minWidth: number = 0;
+	export let minWidth = 0;
-	export let disabled: boolean = false;
+	export let disabled = false;
 	export let tooltip: string | undefined = undefined;
-	export let sharpRightCorners: boolean = false;
+	export let sharpRightCorners = false;
 	// Callbacks
 	// TODO: Replace this with an event binding (and on other components that do this)
@@ -5,7 +5,7 @@
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
 	import WidgetRow from "@/components/widgets/WidgetRow.svelte";
 	import { getContext } from "svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
 	const editor = getContext<Editor>("editor");
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { createEventDispatcher } from "svelte";
-	import { type IconName } from "@/utility-functions/icons";
+	import type { IconName } from "@/utility-functions/icons";
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
 	import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { createEventDispatcher } from "svelte";
-	import { Color } from "@/wasm-communication/messages";
+	import type { Color } from "@/wasm-communication/messages";
 	import ColorPicker from "@/components/floating-menus/ColorPicker.svelte";
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { createEventDispatcher } from "svelte";
-	import { type MenuListEntry } from "@/wasm-communication/messages";
+	import type { MenuListEntry } from "@/wasm-communication/messages";
 	import MenuList from "@/components/floating-menus/MenuList.svelte";
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
@@ -1,13 +1,13 @@
 <script lang="ts">
 	import { createEventDispatcher, getContext, onMount, tick } from "svelte";
-	import { type MenuListEntry } from "@/wasm-communication/messages";
+	import type { MenuListEntry } from "@/wasm-communication/messages";
 	import MenuList from "@/components/floating-menus/MenuList.svelte";
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
 	import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
-	import { type FontsState } from "@/state-providers/fonts";
+	import type { FontsState } from "@/state-providers/fonts";
 	const fonts = getContext<FontsState>("fonts");
@@ -7,7 +7,7 @@
 	import MenuList from "@/components/floating-menus/MenuList.svelte";
 	import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
 	// TODO: Apparently, Safari does not support the Keyboard.lock() API but does relax its authority over certain keyboard shortcuts in fullscreen mode, which we should take advantage of
 	const accelKey = platformIsMac() ? "Command" : "Control";
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { type IconName } from "@/utility-functions/icons";
+	import type { IconName } from "@/utility-functions/icons";
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
 	import CheckboxInput from "@/components/widgets/inputs/CheckboxInput.svelte";
@@ -1,12 +1,12 @@
 <script lang="ts">
 	import { getContext } from "svelte";
-	import { type Color } from "@/wasm-communication/messages";
+	import type { Color } from "@/wasm-communication/messages";
 	import ColorPicker from "@/components/floating-menus/ColorPicker.svelte";
 	import LayoutCol from "@/components/layout/LayoutCol.svelte";
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
-	import { Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
 	const editor = getContext<Editor>("editor");
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { type IconName } from "@/utility-functions/icons";
+	import type { IconName } from "@/utility-functions/icons";
 	import { platformIsMac } from "@/utility-functions/platform";
 	import { type KeyRaw, type LayoutKeysGroup, type Key, type MouseMotion } from "@/wasm-communication/messages";
@@ -8,7 +8,7 @@
 	import Separator from "@/components/widgets/labels/Separator.svelte";
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
 	import { getContext } from "svelte";
-	import { type FullscreenState } from "@/state-providers/fullscreen";
+	import type { FullscreenState } from "@/state-providers/fullscreen";
 	type LabelData = { label?: string; icon?: IconName; width: string };
@@ -12,8 +12,8 @@
 	export let origin: number;
 	export let numberInterval: number;
 	export let majorMarkSpacing: number;
-	export let mediumDivisions: number = 5;
+	export let mediumDivisions = 5;
-	export let minorDivisions: number = 2;
+	export let minorDivisions = 2;
 	let canvasRuler: HTMLDivElement;
 	let rulerLength = 0;
@@ -18,8 +18,8 @@
 	const dispatch = createEventDispatcher<{ handlePosition: number; pressTrack: number }>();
 	export let direction: ScrollbarDirection = "Vertical";
-	export let handlePosition: number = 0.5;
+	export let handlePosition = 0.5;
-	export let handleLength: number = 0.5;
+	export let handleLength = 0.5;
 	let scrollTrack: HTMLDivElement;
 	let dragging = false;
@@ -7,7 +7,7 @@
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
 	import Separator from "@/components/widgets/labels/Separator.svelte";
 	import UserInputLabel from "@/components/widgets/labels/UserInputLabel.svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
 	const editor = getContext<Editor>("editor");
@@ -9,7 +9,7 @@
 	import WindowButtonsWeb from "@/components/window/title-bar/WindowButtonsWeb.svelte";
 	import WindowButtonsWindows from "@/components/window/title-bar/WindowButtonsWindows.svelte";
 	import WindowTitle from "@/components/window/title-bar/WindowTitle.svelte";
-	import { type PortfolioState } from "@/state-providers/portfolio";
+	import type { PortfolioState } from "@/state-providers/portfolio";
 	import { getContext } from "svelte";
 	export let platform: Platform;
@@ -4,7 +4,7 @@
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
 	import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
-	import { FullscreenState } from "@/state-providers/fullscreen";
+	import type { FullscreenState } from "@/state-providers/fullscreen";
 	const fullscreen = getContext<FullscreenState>("fullscreen");
@@ -28,7 +28,7 @@
 	import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
 	import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
 	import UserInputLabel from "@/components/widgets/labels/UserInputLabel.svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
 	const editor = getContext<Editor>("editor");
@@ -4,11 +4,11 @@
 	import LayoutRow from "@/components/layout/LayoutRow.svelte";
 	import Panel from "@/components/window/workspace/Panel.svelte";
 	import { getContext } from "svelte";
-	import { type Editor } from "@/wasm-communication/editor";
+	import type { Editor } from "@/wasm-communication/editor";
-	import { type WorkspaceState } from "@/state-providers/workspace";
+	import type { WorkspaceState } from "@/state-providers/workspace";
-	import { type PortfolioState } from "@/state-providers/portfolio";
+	import type { PortfolioState } from "@/state-providers/portfolio";
-	import { type DialogState } from "@/state-providers/dialog";
+	import type { DialogState } from "@/state-providers/dialog";
-	import { FrontendDocumentDetails } from "@/wasm-communication/messages";
+	import type { FrontendDocumentDetails } from "@/wasm-communication/messages";
 	const MIN_PANEL_SIZE = 100;
 	const PANEL_SIZES = {
@@ -2,7 +2,7 @@
 	"description": "A convenience package for calling the real package.json in ./frontend",
 	"private": true,
 	"scripts": {
-		"start": "cd frontend && npm run serve",
+		"start": "cd frontend && npm start",
-		"serve": "cd frontend && npm run serve"
+		"serve": "cd frontend && npm start"
 	}
 }
@@ -50,7 +50,7 @@ We provide default configurations for VS Code users. When you open the project,
 Visit our [**task board**](https://github.com/GraphiteEditor/Graphite/projects/1) board and look through the current sprint's column. You are also welcome to work on tasks prioritized for upcoming sprints. Find any issues with the green "Available" tag.
-Pay attention to the tags which provide some useful information like which ones are a [**Good First Issue**](https://github.com/GraphiteEditor/Graphite/issues?q=is%3Aissue+is%3Aopen+label%3AAvailable+label%3A%22Good+First+Issue%22+) and whether they involve [**only Rust**](https://github.com/GraphiteEditor/Graphite/issues?q=is%3Aissue+is%3Aopen+label%3ARust+label%3AAvailable+-label%3AWeb+), [**only Web**](https://github.com/GraphiteEditor/Graphite/issues?q=is%3Aissue+is%3Aopen+label%3AWeb+label%3AAvailable+-label%3ARust+) (HTML/CSS/TypeScript/Vue.js), or [**both**](https://github.com/GraphiteEditor/Graphite/issues?q=is%3Aissue+is%3Aopen+label%3AAvailable+label%3ARust+label%3AWeb+). Feel free to pick whatever task interests you, then comment on the issue that you would like to start. After commenting, you can dig in right away, then we will assign the issue to your GitHub user to keep the status of things organized.
+Pay attention to the tags which provide some useful information like which ones are a [**Good First Issue**](https://github.com/GraphiteEditor/Graphite/issues?q=is%3Aissue+is%3Aopen+label%3AAvailable+label%3A%22Good+First+Issue%22+) and whether they involve [**only Rust**](https://github.com/GraphiteEditor/Graphite/issues?q=is%3Aissue+is%3Aopen+label%3ARust+label%3AAvailable+-label%3AWeb+), [**only Web**](https://github.com/GraphiteEditor/Graphite/issues?q=is%3Aissue+is%3Aopen+label%3AWeb+label%3AAvailable+-label%3ARust+) (HTML/CSS/TypeScript/Svelte), or [**both**](https://github.com/GraphiteEditor/Graphite/issues?q=is%3Aissue+is%3Aopen+label%3AAvailable+label%3ARust+label%3AWeb+). Feel free to pick whatever task interests you, then comment on the issue that you would like to start. After commenting, you can dig in right away, then we will assign the issue to your GitHub user to keep the status of things organized.
 ## Mentorship.
@@ -62,7 +62,7 @@ Look for `README.md` files within select folders of the codebase and read the co
 ## Codebase overview.
-The Graphite Editor is built as a web app powered by Vue.js in the frontend and Rust in the backend which is compiled to WebAssembly (wasm) and run in the browser.
+The Graphite Editor is built as a web app powered by Svelte in the frontend and Rust in the backend which is compiled to WebAssembly (wasm) and run in the browser.
 The Editor's frontend web code lives in `/frontend/src` and the backend Rust code lives in `/editor`. The web-based frontend is intended to be semi-temporary and eventually replaceable with a pure-Rust GUI frontend. Therefore, all backend code should be unaware of JavaScript or web concepts and all Editor application logic should be written in Rust not JS.