mirrors/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2025-08-04 21:37:59 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Replace TS relative @ import path (#1087)

Browse source 
Migrated the import shortcut used in Svelte from @ to @graphite for better future package compatibility

Co-authored-by: Andre Roelofs <andreroelofsai@gmail.com>
Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
Andre Roelofs 2023-03-26 01:39:38 +01:00 • committed by Keavon Chambers
parent 5c0a075313
commit 639a24d8ad
83 changed files with 465 additions and 465 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/.eslintrc.js
View file

@ -48,7 +48,7 @@ module.exports = {
"no-bitwise": "off",
"no-shadow": "off",
"no-use-before-define": "off",
"no-restricted-imports": ["error", { patterns: [".*", "!@/*"] }],
"no-restricted-imports": ["error", { patterns: [".*", "!@graphite/*"] }],
// TypeScript plugin config
"@typescript-eslint/indent": "off",

4
frontend/src/App.svelte
View file

@ -1,9 +1,9 @@
<script lang="ts">
import { onMount, onDestroy } from "svelte";
import { initWasm, createEditor } from "@/wasm-communication/editor";
import { initWasm, createEditor } from "@graphite/wasm-communication/editor";
import Editor from "@/components/Editor.svelte";
import Editor from "@graphite/components/Editor.svelte";
let editor: ReturnType<typeof createEditor> | undefined = undefined;

34
frontend/src/components/Editor.svelte
View file

@ -1,24 +1,24 @@
<script lang="ts">
import { onMount, onDestroy, setContext } from "svelte";
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";
import { createHyperlinkManager } from "@/io-managers/hyperlinks";
import { createInputManager } from "@/io-managers/input";
import { createLocalizationManager } from "@/io-managers/localization";
import { createPanicManager } from "@/io-managers/panic";
import { createPersistenceManager } from "@/io-managers/persistence";
import { createDialogState } from "@/state-providers/dialog";
import { createDocumentState } from "@/state-providers/document";
import { createFontsState } from "@/state-providers/fonts";
import { createFullscreenState } from "@/state-providers/fullscreen";
import { createNodeGraphState } from "@/state-providers/node-graph";
import { createPortfolioState } from "@/state-providers/portfolio";
import { createWorkspaceState } from "@/state-providers/workspace";
import type { createEditor } from "@graphite/wasm-communication/editor";
import { operatingSystem } from "@graphite/utility-functions/platform";
import { createClipboardManager } from "@graphite/io-managers/clipboard";
import { createDragManager } from "@graphite/io-managers/drag";
import { createHyperlinkManager } from "@graphite/io-managers/hyperlinks";
import { createInputManager } from "@graphite/io-managers/input";
import { createLocalizationManager } from "@graphite/io-managers/localization";
import { createPanicManager } from "@graphite/io-managers/panic";
import { createPersistenceManager } from "@graphite/io-managers/persistence";
import { createDialogState } from "@graphite/state-providers/dialog";
import { createDocumentState } from "@graphite/state-providers/document";
import { createFontsState } from "@graphite/state-providers/fonts";
import { createFullscreenState } from "@graphite/state-providers/fullscreen";
import { createNodeGraphState } from "@graphite/state-providers/node-graph";
import { createPortfolioState } from "@graphite/state-providers/portfolio";
import { createWorkspaceState } from "@graphite/state-providers/workspace";
import MainWindow from "@/components/window/MainWindow.svelte";
import MainWindow from "@graphite/components/window/MainWindow.svelte";
// Graphite WASM editor instance
export let editor: ReturnType<typeof createEditor>;

26
frontend/src/components/floating-menus/ColorPicker.svelte
View file

@ -1,20 +1,20 @@
<script lang="ts">
import { onDestroy, createEventDispatcher, getContext } from "svelte";
import { clamp } from "@/utility-functions/math";
import { type HSV, type RGB } from "@/wasm-communication/messages";
import { Color } from "@/wasm-communication/messages";
import { clamp } from "@graphite/utility-functions/math";
import { type HSV, type RGB } from "@graphite/wasm-communication/messages";
import { Color } from "@graphite/wasm-communication/messages";
import FloatingMenu, { type MenuDirection } from "@/components/layout/FloatingMenu.svelte";
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import IconButton from "@/components/widgets/buttons/IconButton.svelte";
import DropdownInput from "@/components/widgets/inputs/DropdownInput.svelte";
import NumberInput from "@/components/widgets/inputs/NumberInput.svelte";
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 FloatingMenu, { type MenuDirection } from "@graphite/components/layout/FloatingMenu.svelte";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconButton from "@graphite/components/widgets/buttons/IconButton.svelte";
import DropdownInput from "@graphite/components/widgets/inputs/DropdownInput.svelte";
import NumberInput from "@graphite/components/widgets/inputs/NumberInput.svelte";
import TextInput from "@graphite/components/widgets/inputs/TextInput.svelte";
import Separator from "@graphite/components/widgets/labels/Separator.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import type { Editor } from "@graphite/wasm-communication/editor";
type PresetColors = "none" | "black" | "white" | "red" | "yellow" | "green" | "cyan" | "blue" | "magenta";

14
frontend/src/components/floating-menus/DialogModal.svelte
View file

@ -1,13 +1,13 @@
<script lang="ts">
import { getContext, onMount } from "svelte";
import FloatingMenu from "@/components/layout/FloatingMenu.svelte";
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
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 FloatingMenu from "@graphite/components/layout/FloatingMenu.svelte";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import TextButton from "@graphite/components/widgets/buttons/TextButton.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import WidgetLayout from "@graphite/components/widgets/WidgetLayout.svelte";
import type { DialogState } from "@graphite/state-providers/dialog";
const dialog = getContext<DialogState>("dialog");

2
frontend/src/components/floating-menus/EyedropperPreview.svelte
View file

@ -10,7 +10,7 @@
<script lang="ts">
import { onMount } from "svelte";
import FloatingMenu from "@/components/layout/FloatingMenu.svelte";
import FloatingMenu from "@graphite/components/layout/FloatingMenu.svelte";
const temporaryCanvas = document.createElement("canvas");
temporaryCanvas.width = ZOOM_WINDOW_DIMENSIONS;

16
frontend/src/components/floating-menus/MenuList.svelte
View file

@ -3,15 +3,15 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import type { MenuListEntry } from "@/wasm-communication/messages";
import type { MenuListEntry } from "@graphite/wasm-communication/messages";
import FloatingMenu, { type MenuDirection } from "@/components/layout/FloatingMenu.svelte";
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import Separator from "@/components/widgets/labels/Separator.svelte";
import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
import UserInputLabel from "@/components/widgets/labels/UserInputLabel.svelte";
import FloatingMenu, { type MenuDirection } from "@graphite/components/layout/FloatingMenu.svelte";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import Separator from "@graphite/components/widgets/labels/Separator.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import UserInputLabel from "@graphite/components/widgets/labels/UserInputLabel.svelte";
let self: FloatingMenu | undefined;
let scroller: LayoutCol | undefined;

2
frontend/src/components/layout/FloatingMenu.svelte
View file

@ -6,7 +6,7 @@
<script lang="ts">
import { afterUpdate, createEventDispatcher, tick } from "svelte";
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
const POINTER_STRAY_DISTANCE = 100;

22
frontend/src/components/panels/Document.svelte
View file

@ -1,8 +1,8 @@
<script lang="ts">
import { getContext, onMount, tick } from "svelte";
import { textInputCleanup } from "@/utility-functions/keyboard-entry";
import { extractPixelData, rasterizeSVGCanvas } from "@/utility-functions/rasterization";
import { textInputCleanup } from "@graphite/utility-functions/keyboard-entry";
import { extractPixelData, rasterizeSVGCanvas } from "@graphite/utility-functions/rasterization";
import {
type MouseCursorIcon,
type XY,
@ -17,16 +17,16 @@
UpdateDocumentScrollbars,
UpdateEyedropperSamplingState,
UpdateMouseCursor,
} from "@/wasm-communication/messages";
} from "@graphite/wasm-communication/messages";
import EyedropperPreview, { ZOOM_WINDOW_DIMENSIONS } from "@/components/floating-menus/EyedropperPreview.svelte";
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
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 { DocumentState } from "@/state-providers/document";
import EyedropperPreview, { ZOOM_WINDOW_DIMENSIONS } from "@graphite/components/floating-menus/EyedropperPreview.svelte";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import CanvasRuler from "@graphite/components/widgets/metrics/CanvasRuler.svelte";
import PersistentScrollbar from "@graphite/components/widgets/metrics/PersistentScrollbar.svelte";
import WidgetLayout from "@graphite/components/widgets/WidgetLayout.svelte";
import type { Editor } from "@graphite/wasm-communication/editor";
import type { DocumentState } from "@graphite/state-providers/document";
let rulerHorizontal: CanvasRuler | undefined;
let rulerVertical: CanvasRuler | undefined;

18
frontend/src/components/panels/LayerTree.svelte
View file

@ -1,8 +1,8 @@
<script lang="ts">
import { getContext, onMount, tick } from "svelte";
import { beginDraggingElement } from "@/io-managers/drag";
import { platformIsMac } from "@/utility-functions/platform";
import { beginDraggingElement } from "@graphite/io-managers/drag";
import { platformIsMac } from "@graphite/utility-functions/platform";
import {
type LayerType,
type LayerTypeData,
@ -13,14 +13,14 @@
UpdateDocumentLayerTreeStructureJs,
UpdateLayerTreeOptionsLayout,
layerTypeData,
} from "@/wasm-communication/messages";
} from "@graphite/wasm-communication/messages";
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
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 LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconButton from "@graphite/components/widgets/buttons/IconButton.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import WidgetLayout from "@graphite/components/widgets/WidgetLayout.svelte";
import type { Editor } from "@graphite/wasm-communication/editor";
type LayerListingInfo = {
folderIndex: number;

22
frontend/src/components/panels/NodeGraph.svelte
View file

@ -1,19 +1,19 @@
<script lang="ts">
import { getContext, onMount, tick } from "svelte";
import type { IconName } from "@/utility-functions/icons";
import type { IconName } from "@graphite/utility-functions/icons";
import { UpdateNodeGraphSelection, type FrontendNodeLink, type FrontendNodeType, type FrontendNode } from "@/wasm-communication/messages";
import { UpdateNodeGraphSelection, type FrontendNodeLink, type FrontendNodeType, type FrontendNode } from "@graphite/wasm-communication/messages";
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import TextButton from "@/components/widgets/buttons/TextButton.svelte";
import TextInput from "@/components/widgets/inputs/TextInput.svelte";
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 { NodeGraphState } from "@/state-providers/node-graph";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import TextButton from "@graphite/components/widgets/buttons/TextButton.svelte";
import TextInput from "@graphite/components/widgets/inputs/TextInput.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import WidgetLayout from "@graphite/components/widgets/WidgetLayout.svelte";
import type { Editor } from "@graphite/wasm-communication/editor";
import type { NodeGraphState } from "@graphite/state-providers/node-graph";
const WHEEL_RATE = (1 / 600) * 3;
const GRID_COLLAPSE_SPACING = 10;

10
frontend/src/components/panels/Properties.svelte
View file

@ -1,12 +1,12 @@
<script lang="ts">
import { getContext, onMount } from "svelte";
import { defaultWidgetLayout, patchWidgetLayout, UpdatePropertyPanelOptionsLayout, UpdatePropertyPanelSectionsLayout } from "@/wasm-communication/messages";
import { defaultWidgetLayout, patchWidgetLayout, UpdatePropertyPanelOptionsLayout, UpdatePropertyPanelSectionsLayout } from "@graphite/wasm-communication/messages";
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 LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import WidgetLayout from "@graphite/components/widgets/WidgetLayout.svelte";
import type { Editor } from "@graphite/wasm-communication/editor";
const editor = getContext<Editor>("editor");

6
frontend/src/components/widgets/WidgetLayout.svelte
View file

@ -1,8 +1,8 @@
<script lang="ts">
import { isWidgetColumn, isWidgetRow, isWidgetSection, type WidgetLayout } from "@/wasm-communication/messages";
import { isWidgetColumn, isWidgetRow, isWidgetSection, type WidgetLayout } from "@graphite/wasm-communication/messages";
import WidgetSection from "@/components/widgets/groups/WidgetSection.svelte";
import WidgetRow from "@/components/widgets/WidgetRow.svelte";
import WidgetSection from "@graphite/components/widgets/groups/WidgetSection.svelte";
import WidgetRow from "@graphite/components/widgets/WidgetRow.svelte";
export let layout: WidgetLayout;
let className = "";

50
frontend/src/components/widgets/WidgetRow.svelte
View file

@ -1,31 +1,31 @@
<script lang="ts">
import { debouncer } from "@/utility-functions/debounce";
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 { debouncer } from "@graphite/utility-functions/debounce";
import type { Widget } from "@graphite/wasm-communication/messages";
import { narrowWidgetProps } from "@graphite/wasm-communication/messages";
import { isWidgetColumn, isWidgetRow, type WidgetColumn, type WidgetRow } from "@graphite/wasm-communication/messages";
import PivotAssist from "@/components/widgets/assists/PivotAssist.svelte";
import BreadcrumbTrailButtons from "@/components/widgets/buttons/BreadcrumbTrailButtons.svelte";
import IconButton from "@/components/widgets/buttons/IconButton.svelte";
import ParameterExposeButton from "@/components/widgets/buttons/ParameterExposeButton.svelte";
import PopoverButton from "@/components/widgets/buttons/PopoverButton.svelte";
import TextButton from "@/components/widgets/buttons/TextButton.svelte";
import CheckboxInput from "@/components/widgets/inputs/CheckboxInput.svelte";
import ColorInput from "@/components/widgets/inputs/ColorInput.svelte";
import DropdownInput from "@/components/widgets/inputs/DropdownInput.svelte";
import FontInput from "@/components/widgets/inputs/FontInput.svelte";
import LayerReferenceInput from "@/components/widgets/inputs/LayerReferenceInput.svelte";
import NumberInput from "@/components/widgets/inputs/NumberInput.svelte";
import OptionalInput from "@/components/widgets/inputs/OptionalInput.svelte";
import RadioInput from "@/components/widgets/inputs/RadioInput.svelte";
import SwatchPairInput from "@/components/widgets/inputs/SwatchPairInput.svelte";
import TextAreaInput from "@/components/widgets/inputs/TextAreaInput.svelte";
import TextInput from "@/components/widgets/inputs/TextInput.svelte";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import Separator from "@/components/widgets/labels/Separator.svelte";
import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
import PivotAssist from "@graphite/components/widgets/assists/PivotAssist.svelte";
import BreadcrumbTrailButtons from "@graphite/components/widgets/buttons/BreadcrumbTrailButtons.svelte";
import IconButton from "@graphite/components/widgets/buttons/IconButton.svelte";
import ParameterExposeButton from "@graphite/components/widgets/buttons/ParameterExposeButton.svelte";
import PopoverButton from "@graphite/components/widgets/buttons/PopoverButton.svelte";
import TextButton from "@graphite/components/widgets/buttons/TextButton.svelte";
import CheckboxInput from "@graphite/components/widgets/inputs/CheckboxInput.svelte";
import ColorInput from "@graphite/components/widgets/inputs/ColorInput.svelte";
import DropdownInput from "@graphite/components/widgets/inputs/DropdownInput.svelte";
import FontInput from "@graphite/components/widgets/inputs/FontInput.svelte";
import LayerReferenceInput from "@graphite/components/widgets/inputs/LayerReferenceInput.svelte";
import NumberInput from "@graphite/components/widgets/inputs/NumberInput.svelte";
import OptionalInput from "@graphite/components/widgets/inputs/OptionalInput.svelte";
import RadioInput from "@graphite/components/widgets/inputs/RadioInput.svelte";
import SwatchPairInput from "@graphite/components/widgets/inputs/SwatchPairInput.svelte";
import TextAreaInput from "@graphite/components/widgets/inputs/TextAreaInput.svelte";
import TextInput from "@graphite/components/widgets/inputs/TextInput.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import Separator from "@graphite/components/widgets/labels/Separator.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import { getContext } from "svelte";
import type { Editor } from "@/wasm-communication/editor";
import type { Editor } from "@graphite/wasm-communication/editor";
const SUFFIX_WIDGETS = ["PopoverButton"];

2
frontend/src/components/widgets/assists/PivotAssist.svelte
View file

@ -1,7 +1,7 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import type { PivotPosition } from "@/wasm-communication/messages";
import type { PivotPosition } from "@graphite/wasm-communication/messages";
// emits: ["update:position"],
const dispatch = createEventDispatcher<{ position: PivotPosition }>();

4
frontend/src/components/widgets/buttons/BreadcrumbTrailButtons.svelte
View file

@ -1,6 +1,6 @@
<script lang="ts">
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import TextButton from "@/components/widgets/buttons/TextButton.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import TextButton from "@graphite/components/widgets/buttons/TextButton.svelte";
export let labels: string[];
export let disabled = false;

4
frontend/src/components/widgets/buttons/IconButton.svelte
View file

@ -1,7 +1,7 @@
<script lang="ts">
import { type IconName, type IconSize } from "@/utility-functions/icons";
import { type IconName, type IconSize } from "@graphite/utility-functions/icons";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
export let icon: IconName;
export let size: IconSize;

2
frontend/src/components/widgets/buttons/ParameterExposeButton.svelte
View file

@ -1,5 +1,5 @@
<script lang="ts">
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
export let exposed: boolean;
export let dataType: string;

8
frontend/src/components/widgets/buttons/PopoverButton.svelte
View file

@ -1,9 +1,9 @@
<script lang="ts">
import type { IconName } from "@/utility-functions/icons";
import type { IconName } from "@graphite/utility-functions/icons";
import FloatingMenu from "@/components/layout/FloatingMenu.svelte";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import IconButton from "@/components/widgets/buttons/IconButton.svelte";
import FloatingMenu from "@graphite/components/layout/FloatingMenu.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconButton from "@graphite/components/widgets/buttons/IconButton.svelte";
export let icon: IconName = "DropdownArrow";
export let tooltip: string | undefined = undefined;

6
frontend/src/components/widgets/buttons/TextButton.svelte
View file

@ -1,8 +1,8 @@
<script lang="ts">
import type { IconName } from "@/utility-functions/icons";
import type { IconName } from "@graphite/utility-functions/icons";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
export let label: string;
export let icon: IconName | undefined = undefined;

10
frontend/src/components/widgets/groups/WidgetSection.svelte
View file

@ -1,11 +1,11 @@
<script lang="ts">
import { isWidgetRow, isWidgetSection, type LayoutGroup, type WidgetSection as WidgetSectionFromJsMessages } from "@/wasm-communication/messages";
import { isWidgetRow, isWidgetSection, type LayoutGroup, type WidgetSection as WidgetSectionFromJsMessages } from "@graphite/wasm-communication/messages";
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
import WidgetRow from "@/components/widgets/WidgetRow.svelte";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import WidgetRow from "@graphite/components/widgets/WidgetRow.svelte";
import { getContext } from "svelte";
import type { Editor } from "@/wasm-communication/editor";
import type { Editor } from "@graphite/wasm-communication/editor";
const editor = getContext<Editor>("editor");

6
frontend/src/components/widgets/inputs/CheckboxInput.svelte
View file

@ -1,10 +1,10 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import type { IconName } from "@/utility-functions/icons";
import type { IconName } from "@graphite/utility-functions/icons";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
// emits: ["update:checked"],
const dispatch = createEventDispatcher<{ checked: boolean }>();

8
frontend/src/components/widgets/inputs/ColorInput.svelte
View file

@ -1,11 +1,11 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import type { Color } from "@/wasm-communication/messages";
import type { Color } from "@graphite/wasm-communication/messages";
import ColorPicker from "@/components/floating-menus/ColorPicker.svelte";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
import ColorPicker from "@graphite/components/floating-menus/ColorPicker.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
// emits: ["update:value"],
const dispatch = createEventDispatcher<{ value: Color }>();

10
frontend/src/components/widgets/inputs/DropdownInput.svelte
View file

@ -1,12 +1,12 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import type { MenuListEntry } from "@/wasm-communication/messages";
import type { MenuListEntry } from "@graphite/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 MenuList from "@graphite/components/floating-menus/MenuList.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
const DASH_ENTRY = { label: "-" };

4
frontend/src/components/widgets/inputs/FieldInput.svelte
View file

@ -1,9 +1,9 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import { platformIsMac } from "@/utility-functions/platform";
import { platformIsMac } from "@graphite/utility-functions/platform";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
// emits: ["update:value", "textFocused", "textChanged", "cancelTextChange"],
const dispatch = createEventDispatcher<{

12
frontend/src/components/widgets/inputs/FontInput.svelte
View file

@ -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 "@graphite/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 MenuList from "@graphite/components/floating-menus/MenuList.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import type { FontsState } from "@graphite/state-providers/fonts";
const fonts = getContext<FontsState>("fonts");

14
frontend/src/components/widgets/inputs/LayerReferenceInput.svelte
View file

@ -1,15 +1,15 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import { currentDraggingElement } from "@/io-managers/drag";
import { currentDraggingElement } from "@graphite/io-managers/drag";
import type { LayerType, LayerTypeData } from "@/wasm-communication/messages";
import { layerTypeData } from "@/wasm-communication/messages";
import type { LayerType, LayerTypeData } from "@graphite/wasm-communication/messages";
import { layerTypeData } from "@graphite/wasm-communication/messages";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import IconButton from "@/components/widgets/buttons/IconButton.svelte";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconButton from "@graphite/components/widgets/buttons/IconButton.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
// emits: ["update:value"],
const dispatch = createEventDispatcher<{ value: string | undefined }>();

12
frontend/src/components/widgets/inputs/MenuBarInput.svelte
View file

@ -1,13 +1,13 @@
<script lang="ts">
import { getContext, onMount } from "svelte";
import { platformIsMac } from "@/utility-functions/platform";
import { type KeyRaw, type LayoutKeysGroup, type MenuBarEntry, type MenuListEntry, UpdateMenuBarLayout } from "@/wasm-communication/messages";
import { platformIsMac } from "@graphite/utility-functions/platform";
import { type KeyRaw, type LayoutKeysGroup, type MenuBarEntry, type MenuListEntry, UpdateMenuBarLayout } from "@graphite/wasm-communication/messages";
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 MenuList from "@graphite/components/floating-menus/MenuList.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import type { Editor } from "@graphite/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";

4
frontend/src/components/widgets/inputs/NumberInput.svelte
View file

@ -1,9 +1,9 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import { type NumberInputMode, type NumberInputIncrementBehavior } from "@/wasm-communication/messages";
import { type NumberInputMode, type NumberInputIncrementBehavior } from "@graphite/wasm-communication/messages";
import FieldInput from "@/components/widgets/inputs/FieldInput.svelte";
import FieldInput from "@graphite/components/widgets/inputs/FieldInput.svelte";
// emits: ["update:value"],
const dispatch = createEventDispatcher<{ value: number | undefined }>();

6
frontend/src/components/widgets/inputs/OptionalInput.svelte
View file

@ -1,8 +1,8 @@
<script lang="ts">
import type { IconName } from "@/utility-functions/icons";
import type { IconName } from "@graphite/utility-functions/icons";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import CheckboxInput from "@/components/widgets/inputs/CheckboxInput.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import CheckboxInput from "@graphite/components/widgets/inputs/CheckboxInput.svelte";
export let checked: boolean;
export let disabled = false;

8
frontend/src/components/widgets/inputs/RadioInput.svelte
View file

@ -1,11 +1,11 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import { type RadioEntries, type RadioEntryData } from "@/wasm-communication/messages";
import { type RadioEntries, type RadioEntryData } from "@graphite/wasm-communication/messages";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
// emits: ["update:selectedIndex"],
const dispatch = createEventDispatcher<{ selectedIndex: number }>();

10
frontend/src/components/widgets/inputs/SwatchPairInput.svelte
View file

@ -1,12 +1,12 @@
<script lang="ts">
import { getContext } from "svelte";
import type { Color } from "@/wasm-communication/messages";
import type { Color } from "@graphite/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 type { Editor } from "@/wasm-communication/editor";
import ColorPicker from "@graphite/components/floating-menus/ColorPicker.svelte";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import type { Editor } from "@graphite/wasm-communication/editor";
const editor = getContext<Editor>("editor");

2
frontend/src/components/widgets/inputs/TextAreaInput.svelte
View file

@ -1,7 +1,7 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import FieldInput from "@/components/widgets/inputs/FieldInput.svelte";
import FieldInput from "@graphite/components/widgets/inputs/FieldInput.svelte";
// emits: ["update:value", "commitText"],
const dispatch = createEventDispatcher<{ commitText: string }>();

2
frontend/src/components/widgets/inputs/TextInput.svelte
View file

@ -1,7 +1,7 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import FieldInput from "@/components/widgets/inputs/FieldInput.svelte";
import FieldInput from "@graphite/components/widgets/inputs/FieldInput.svelte";
// emits: ["update:value", "commitText"],
const dispatch = createEventDispatcher<{ commitText: string }>();

4
frontend/src/components/widgets/labels/IconLabel.svelte
View file

@ -1,7 +1,7 @@
<script lang="ts">
import { type IconName, ICONS, ICON_SVG_STRINGS } from "@/utility-functions/icons";
import { type IconName, ICONS, ICON_SVG_STRINGS } from "@graphite/utility-functions/icons";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
let className = "";
export { className as class };

2
frontend/src/components/widgets/labels/Separator.svelte
View file

@ -1,5 +1,5 @@
<script lang="ts">
import { type SeparatorDirection, type SeparatorType } from "@/wasm-communication/messages";
import { type SeparatorDirection, type SeparatorType } from "@graphite/wasm-communication/messages";
export let direction: SeparatorDirection = "Horizontal";
export let type: SeparatorType = "Unrelated";

16
frontend/src/components/widgets/labels/UserInputLabel.svelte
View file

@ -1,14 +1,14 @@
<script lang="ts">
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";
import type { IconName } from "@graphite/utility-functions/icons";
import { platformIsMac } from "@graphite/utility-functions/platform";
import { type KeyRaw, type LayoutKeysGroup, type Key, type MouseMotion } from "@graphite/wasm-communication/messages";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import Separator from "@/components/widgets/labels/Separator.svelte";
import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import Separator from "@graphite/components/widgets/labels/Separator.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import { getContext } from "svelte";
import type { FullscreenState } from "@/state-providers/fullscreen";
import type { FullscreenState } from "@graphite/state-providers/fullscreen";
type LabelData = { label?: string; icon?: IconName; width: string };

8
frontend/src/components/window/MainWindow.svelte
View file

@ -3,10 +3,10 @@
</script>
<script lang="ts">
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import StatusBar from "@/components/window/status-bar/StatusBar.svelte";
import TitleBar from "@/components/window/title-bar/TitleBar.svelte";
import Workspace from "@/components/window/workspace/Workspace.svelte";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import StatusBar from "@graphite/components/window/status-bar/StatusBar.svelte";
import TitleBar from "@graphite/components/window/title-bar/TitleBar.svelte";
import Workspace from "@graphite/components/window/workspace/Workspace.svelte";
let platform: ApplicationPlatform = "Web";
let maximized: true;

12
frontend/src/components/window/status-bar/StatusBar.svelte
View file

@ -1,13 +1,13 @@
<script lang="ts">
import { getContext, onMount } from "svelte";
import { platformIsMac } from "@/utility-functions/platform";
import { type HintData, type HintInfo, type LayoutKeysGroup, UpdateInputHints } from "@/wasm-communication/messages";
import { platformIsMac } from "@graphite/utility-functions/platform";
import { type HintData, type HintInfo, type LayoutKeysGroup, UpdateInputHints } from "@graphite/wasm-communication/messages";
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 LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import Separator from "@graphite/components/widgets/labels/Separator.svelte";
import UserInputLabel from "@graphite/components/widgets/labels/UserInputLabel.svelte";
import type { Editor } from "@graphite/wasm-communication/editor";
const editor = getContext<Editor>("editor");

14
frontend/src/components/window/title-bar/TitleBar.svelte
View file

@ -3,13 +3,13 @@
</script>
<script lang="ts">
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import MenuBarInput from "@/components/widgets/inputs/MenuBarInput.svelte";
import WindowButtonsMac from "@/components/window/title-bar/WindowButtonsMac.svelte";
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 LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import MenuBarInput from "@graphite/components/widgets/inputs/MenuBarInput.svelte";
import WindowButtonsMac from "@graphite/components/window/title-bar/WindowButtonsMac.svelte";
import WindowButtonsWeb from "@graphite/components/window/title-bar/WindowButtonsWeb.svelte";
import WindowButtonsWindows from "@graphite/components/window/title-bar/WindowButtonsWindows.svelte";
import WindowTitle from "@graphite/components/window/title-bar/WindowTitle.svelte";
import type { PortfolioState } from "@graphite/state-providers/portfolio";
import { getContext } from "svelte";
export let platform: Platform;

2
frontend/src/components/window/title-bar/WindowButtonsMac.svelte
View file

@ -1,5 +1,5 @@
<script lang="ts">
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
export let maximized = false;
</script>

8
frontend/src/components/window/title-bar/WindowButtonsWeb.svelte
View file

@ -1,10 +1,10 @@
<script lang="ts">
import { getContext } from "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 { FullscreenState } from "@/state-providers/fullscreen";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import type { FullscreenState } from "@graphite/state-providers/fullscreen";
const fullscreen = getContext<FullscreenState>("fullscreen");

4
frontend/src/components/window/title-bar/WindowButtonsWindows.svelte
View file

@ -1,6 +1,6 @@
<script lang="ts">
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
export let maximized = false;
</script>

4
frontend/src/components/window/title-bar/WindowTitle.svelte
View file

@ -1,6 +1,6 @@
<script lang="ts">
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import TextLabel from "@/components/widgets/labels/TextLabel.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
export let text: string;
</script>

30
frontend/src/components/window/workspace/Panel.svelte
View file

@ -1,11 +1,11 @@
<script lang="ts" context="module">
import Document from "@/components/panels/Document.svelte";
import IconButton from "@/components/widgets/buttons/IconButton.svelte";
import LayerTree from "@/components/panels/LayerTree.svelte";
import NodeGraph from "@/components/panels/NodeGraph.svelte";
import PopoverButton from "@/components/widgets/buttons/PopoverButton.svelte";
import Properties from "@/components/panels/Properties.svelte";
import TextButton from "@/components/widgets/buttons/TextButton.svelte";
import Document from "@graphite/components/panels/Document.svelte";
import IconButton from "@graphite/components/widgets/buttons/IconButton.svelte";
import LayerTree from "@graphite/components/panels/LayerTree.svelte";
import NodeGraph from "@graphite/components/panels/NodeGraph.svelte";
import PopoverButton from "@graphite/components/widgets/buttons/PopoverButton.svelte";
import Properties from "@graphite/components/panels/Properties.svelte";
import TextButton from "@graphite/components/widgets/buttons/TextButton.svelte";
const PANEL_COMPONENTS = {
Document,
@ -19,16 +19,16 @@
<script lang="ts">
import { getContext, tick } from "svelte";
import { platformIsMac, isEventSupported } from "@/utility-functions/platform";
import { platformIsMac, isEventSupported } from "@graphite/utility-functions/platform";
import { type LayoutKeysGroup, type Key } from "@/wasm-communication/messages";
import { type LayoutKeysGroup, type Key } from "@graphite/wasm-communication/messages";
import LayoutCol from "@/components/layout/LayoutCol.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 UserInputLabel from "@/components/widgets/labels/UserInputLabel.svelte";
import type { Editor } from "@/wasm-communication/editor";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import IconLabel from "@graphite/components/widgets/labels/IconLabel.svelte";
import TextLabel from "@graphite/components/widgets/labels/TextLabel.svelte";
import UserInputLabel from "@graphite/components/widgets/labels/UserInputLabel.svelte";
import type { Editor } from "@graphite/wasm-communication/editor";
const editor = getContext<Editor>("editor");

18
frontend/src/components/window/workspace/Workspace.svelte
View file

@ -1,14 +1,14 @@
<script lang="ts">
import DialogModal from "@/components/floating-menus/DialogModal.svelte";
import LayoutCol from "@/components/layout/LayoutCol.svelte";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import Panel from "@/components/window/workspace/Panel.svelte";
import DialogModal from "@graphite/components/floating-menus/DialogModal.svelte";
import LayoutCol from "@graphite/components/layout/LayoutCol.svelte";
import LayoutRow from "@graphite/components/layout/LayoutRow.svelte";
import Panel from "@graphite/components/window/workspace/Panel.svelte";
import { getContext } from "svelte";
import type { Editor } from "@/wasm-communication/editor";
import type { WorkspaceState } from "@/state-providers/workspace";
import type { PortfolioState } from "@/state-providers/portfolio";
import type { DialogState } from "@/state-providers/dialog";
import type { FrontendDocumentDetails } from "@/wasm-communication/messages";
import type { Editor } from "@graphite/wasm-communication/editor";
import type { WorkspaceState } from "@graphite/state-providers/workspace";
import type { PortfolioState } from "@graphite/state-providers/portfolio";
import type { DialogState } from "@graphite/state-providers/dialog";
import type { FrontendDocumentDetails } from "@graphite/wasm-communication/messages";
const MIN_PANEL_SIZE = 100;
const PANEL_SIZES = {

4
frontend/src/io-managers/clipboard.ts
View file

@ -1,5 +1,5 @@
import { type Editor } from "@/wasm-communication/editor";
import { TriggerTextCopy } from "@/wasm-communication/messages";
import { type Editor } from "@graphite/wasm-communication/editor";
import { TriggerTextCopy } from "@graphite/wasm-communication/messages";
export function createClipboardManager(editor: Editor): void {
// Subscribe to process backend event

4
frontend/src/io-managers/hyperlinks.ts
View file

@ -1,5 +1,5 @@
import { type Editor } from "@/wasm-communication/editor";
import { TriggerVisitLink } from "@/wasm-communication/messages";
import { type Editor } from "@graphite/wasm-communication/editor";
import { TriggerVisitLink } from "@graphite/wasm-communication/messages";
export function createHyperlinkManager(editor: Editor): void {
// Subscribe to process backend event

18
frontend/src/io-managers/input.ts
View file

@ -1,14 +1,14 @@
import { get } from "svelte/store";
import { type DialogState } from "@/state-providers/dialog";
import { type FullscreenState } from "@/state-providers/fullscreen";
import { type PortfolioState } from "@/state-providers/portfolio";
import { makeKeyboardModifiersBitfield, textInputCleanup, getLocalizedScanCode } from "@/utility-functions/keyboard-entry";
import { platformIsMac } from "@/utility-functions/platform";
import { extractPixelData } from "@/utility-functions/rasterization";
import { stripIndents } from "@/utility-functions/strip-indents";
import { type Editor } from "@/wasm-communication/editor";
import { TriggerPaste } from "@/wasm-communication/messages";
import { type DialogState } from "@graphite/state-providers/dialog";
import { type FullscreenState } from "@graphite/state-providers/fullscreen";
import { type PortfolioState } from "@graphite/state-providers/portfolio";
import { makeKeyboardModifiersBitfield, textInputCleanup, getLocalizedScanCode } from "@graphite/utility-functions/keyboard-entry";
import { platformIsMac } from "@graphite/utility-functions/platform";
import { extractPixelData } from "@graphite/utility-functions/rasterization";
import { stripIndents } from "@graphite/utility-functions/strip-indents";
import { type Editor } from "@graphite/wasm-communication/editor";
import { TriggerPaste } from "@graphite/wasm-communication/messages";
type EventName = keyof HTMLElementEventMap | keyof WindowEventHandlersEventMap | "modifyinputfield";
type EventListenerTarget = {

4
frontend/src/io-managers/localization.ts
View file

@ -1,5 +1,5 @@
import { type Editor } from "@/wasm-communication/editor";
import { TriggerAboutGraphiteLocalizedCommitDate } from "@/wasm-communication/messages";
import { type Editor } from "@graphite/wasm-communication/editor";
import { TriggerAboutGraphiteLocalizedCommitDate } from "@graphite/wasm-communication/messages";
export function createLocalizationManager(editor: Editor): void {
function localizeTimestamp(utc: string): string {

16
frontend/src/io-managers/panic.ts
View file

@ -1,11 +1,11 @@
import { wipeDocuments } from "@/io-managers/persistence";
import { type DialogState } from "@/state-providers/dialog";
import { type IconName } from "@/utility-functions/icons";
import { browserVersion, operatingSystem } from "@/utility-functions/platform";
import { stripIndents } from "@/utility-functions/strip-indents";
import { type Editor } from "@/wasm-communication/editor";
import type { TextLabel } from "@/wasm-communication/messages";
import { type TextButtonWidget, type WidgetLayout, Widget, DisplayDialogPanic } from "@/wasm-communication/messages";
import { wipeDocuments } from "@graphite/io-managers/persistence";
import { type DialogState } from "@graphite/state-providers/dialog";
import { type IconName } from "@graphite/utility-functions/icons";
import { browserVersion, operatingSystem } from "@graphite/utility-functions/platform";
import { stripIndents } from "@graphite/utility-functions/strip-indents";
import { type Editor } from "@graphite/wasm-communication/editor";
import type { TextLabel } from "@graphite/wasm-communication/messages";
import { type TextButtonWidget, type WidgetLayout, Widget, DisplayDialogPanic } from "@graphite/wasm-communication/messages";
export function createPanicManager(editor: Editor, dialogState: DialogState): void {
// Code panic dialog and console error

6
frontend/src/io-managers/persistence.ts
View file

@ -1,9 +1,9 @@
import { createStore, del, get, set, update } from "idb-keyval";
import { get as getFromStore } from "svelte/store";
import { type PortfolioState } from "@/state-providers/portfolio";
import { type Editor } from "@/wasm-communication/editor";
import { TriggerIndexedDbWriteDocument, TriggerIndexedDbRemoveDocument, TriggerSavePreferences, TriggerLoadAutoSaveDocuments, TriggerLoadPreferences } from "@/wasm-communication/messages";
import { type PortfolioState } from "@graphite/state-providers/portfolio";
import { type Editor } from "@graphite/wasm-communication/editor";
import { TriggerIndexedDbWriteDocument, TriggerIndexedDbRemoveDocument, TriggerSavePreferences, TriggerLoadAutoSaveDocuments, TriggerLoadPreferences } from "@graphite/wasm-communication/messages";
const graphiteStore = createStore("graphite", "store");

2
frontend/src/main.ts
View file

@ -5,7 +5,7 @@
// The library replaces the Reflect API on the window to support more features.
import "reflect-metadata";
import App from "@/App.svelte";
import App from "@graphite/App.svelte";
document.body.setAttribute("data-app-container", "");

6
frontend/src/state-providers/dialog.ts
View file

@ -1,8 +1,8 @@
import {writable} from "svelte/store";
import { type IconName } from "@/utility-functions/icons";
import { type Editor } from "@/wasm-communication/editor";
import { type TextButtonWidget, type WidgetLayout, defaultWidgetLayout, DisplayDialog, DisplayDialogDismiss, UpdateDialogDetails, patchWidgetLayout } from "@/wasm-communication/messages";
import { type IconName } from "@graphite/utility-functions/icons";
import { type Editor } from "@graphite/wasm-communication/editor";
import { type TextButtonWidget, type WidgetLayout, defaultWidgetLayout, DisplayDialog, DisplayDialogDismiss, UpdateDialogDetails, patchWidgetLayout } from "@graphite/wasm-communication/messages";
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
export function createDialogState(editor: Editor) {

4
frontend/src/state-providers/document.ts
View file

@ -1,7 +1,7 @@
import {tick} from "svelte";
import {writable} from "svelte/store";
import { type Editor } from "@/wasm-communication/editor";
import { type Editor } from "@graphite/wasm-communication/editor";
import {
defaultWidgetLayout,
patchWidgetLayout,
@ -11,7 +11,7 @@ import {
UpdateToolOptionsLayout,
UpdateToolShelfLayout,
UpdateWorkingColorsLayout,
} from "@/wasm-communication/messages";
} from "@graphite/wasm-communication/messages";
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
export function createDocumentState(editor: Editor) {

4
frontend/src/state-providers/fonts.ts
View file

@ -1,7 +1,7 @@
import { writable } from "svelte/store";
import { type Editor } from "@/wasm-communication/editor";
import { TriggerFontLoad } from "@/wasm-communication/messages";
import { type Editor } from "@graphite/wasm-communication/editor";
import { TriggerFontLoad } from "@graphite/wasm-communication/messages";
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
export function createFontsState(editor: Editor) {

2
frontend/src/state-providers/fullscreen.ts
View file

@ -1,6 +1,6 @@
import {writable} from "svelte/store";
import { type Editor } from "@/wasm-communication/editor";
import { type Editor } from "@graphite/wasm-communication/editor";
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
export function createFullscreenState(_: Editor) {

4
frontend/src/state-providers/node-graph.ts
View file

@ -1,7 +1,7 @@
import {tick} from "svelte";
import {writable} from "svelte/store";
import { type Editor } from "@/wasm-communication/editor";
import { type Editor } from "@graphite/wasm-communication/editor";
import {
type FrontendNode,
type FrontendNodeLink,
@ -12,7 +12,7 @@ import {
UpdateZoomWithScroll,
defaultWidgetLayout,
patchWidgetLayout,
} from "@/wasm-communication/messages";
} from "@graphite/wasm-communication/messages";
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
export function createNodeGraphState(editor: Editor) {

10
frontend/src/state-providers/portfolio.ts
View file

@ -2,10 +2,10 @@
import {writable} from "svelte/store";
import { downloadFileText, downloadFileBlob, upload } from "@/utility-functions/files";
import { imaginateGenerate, imaginateCheckConnection, imaginateTerminate, updateBackendImage } from "@/utility-functions/imaginate";
import { extractPixelData, rasterizeSVG, rasterizeSVGCanvas } from "@/utility-functions/rasterization";
import { type Editor } from "@/wasm-communication/editor";
import { downloadFileText, downloadFileBlob, upload } from "@graphite/utility-functions/files";
import { imaginateGenerate, imaginateCheckConnection, imaginateTerminate, updateBackendImage } from "@graphite/utility-functions/imaginate";
import { extractPixelData, rasterizeSVG, rasterizeSVGCanvas } from "@graphite/utility-functions/rasterization";
import { type Editor } from "@graphite/wasm-communication/editor";
import {
type FrontendDocumentDetails,
TriggerFileDownload,
@ -20,7 +20,7 @@ import {
UpdateOpenDocumentsList,
UpdateImageData,
TriggerRevokeBlobUrl,
} from "@/wasm-communication/messages";
} from "@graphite/wasm-communication/messages";
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
export function createPortfolioState(editor: Editor) {

4
frontend/src/state-providers/workspace.ts
View file

@ -3,8 +3,8 @@
import {tick} from "svelte";
import {writable} from "svelte/store";
import { type Editor } from "@/wasm-communication/editor";
import { UpdateNodeGraphVisibility } from "@/wasm-communication/messages";
import { type Editor } from "@graphite/wasm-communication/editor";
import { UpdateNodeGraphVisibility } from "@graphite/wasm-communication/messages";
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
export function createWorkspaceState(editor: Editor) {

248
frontend/src/utility-functions/icons.ts
View file

@ -1,47 +1,47 @@
/* eslint-disable import/first */
// Graphics
import GraphiteLogotypeSolid from "@/../assets/graphics/graphite-logotype-solid.svg";
import GraphiteLogotypeSolid from "@graphite/../assets/graphics/graphite-logotype-solid.svg";
const GRAPHICS = {
GraphiteLogotypeSolid: { svg: GraphiteLogotypeSolid, size: undefined },
} as const;
// 12px Solid
import Add from "@/../assets/icon-12px-solid/add.svg";
import Checkmark from "@/../assets/icon-12px-solid/checkmark.svg";
import CloseX from "@/../assets/icon-12px-solid/close-x.svg";
import DropdownArrow from "@/../assets/icon-12px-solid/dropdown-arrow.svg";
import Edit from "@/../assets/icon-12px-solid/edit.svg";
import Empty12px from "@/../assets/icon-12px-solid/empty-12px.svg";
import FullscreenEnter from "@/../assets/icon-12px-solid/fullscreen-enter.svg";
import FullscreenExit from "@/../assets/icon-12px-solid/fullscreen-exit.svg";
import Grid from "@/../assets/icon-12px-solid/grid.svg";
import Info from "@/../assets/icon-12px-solid/info.svg";
import KeyboardArrowDown from "@/../assets/icon-12px-solid/keyboard-arrow-down.svg";
import KeyboardArrowLeft from "@/../assets/icon-12px-solid/keyboard-arrow-left.svg";
import KeyboardArrowRight from "@/../assets/icon-12px-solid/keyboard-arrow-right.svg";
import KeyboardArrowUp from "@/../assets/icon-12px-solid/keyboard-arrow-up.svg";
import KeyboardBackspace from "@/../assets/icon-12px-solid/keyboard-backspace.svg";
import KeyboardCommand from "@/../assets/icon-12px-solid/keyboard-command.svg";
import KeyboardControl from "@/../assets/icon-12px-solid/keyboard-control.svg";
import KeyboardEnter from "@/../assets/icon-12px-solid/keyboard-enter.svg";
import KeyboardOption from "@/../assets/icon-12px-solid/keyboard-option.svg";
import KeyboardShift from "@/../assets/icon-12px-solid/keyboard-shift.svg";
import KeyboardSpace from "@/../assets/icon-12px-solid/keyboard-space.svg";
import KeyboardTab from "@/../assets/icon-12px-solid/keyboard-tab.svg";
import Link from "@/../assets/icon-12px-solid/link.svg";
import Overlays from "@/../assets/icon-12px-solid/overlays.svg";
import Remove from "@/../assets/icon-12px-solid/remove.svg";
import ResetColors from "@/../assets/icon-12px-solid/reset-colors.svg";
import Snapping from "@/../assets/icon-12px-solid/snapping.svg";
import Swap from "@/../assets/icon-12px-solid/swap.svg";
import VerticalEllipsis from "@/../assets/icon-12px-solid/vertical-ellipsis.svg";
import Warning from "@/../assets/icon-12px-solid/warning.svg";
import WindowButtonWinClose from "@/../assets/icon-12px-solid/window-button-win-close.svg";
import WindowButtonWinMaximize from "@/../assets/icon-12px-solid/window-button-win-maximize.svg";
import WindowButtonWinMinimize from "@/../assets/icon-12px-solid/window-button-win-minimize.svg";
import WindowButtonWinRestoreDown from "@/../assets/icon-12px-solid/window-button-win-restore-down.svg";
import Add from "@graphite/../assets/icon-12px-solid/add.svg";
import Checkmark from "@graphite/../assets/icon-12px-solid/checkmark.svg";
import CloseX from "@graphite/../assets/icon-12px-solid/close-x.svg";
import DropdownArrow from "@graphite/../assets/icon-12px-solid/dropdown-arrow.svg";
import Edit from "@graphite/../assets/icon-12px-solid/edit.svg";
import Empty12px from "@graphite/../assets/icon-12px-solid/empty-12px.svg";
import FullscreenEnter from "@graphite/../assets/icon-12px-solid/fullscreen-enter.svg";
import FullscreenExit from "@graphite/../assets/icon-12px-solid/fullscreen-exit.svg";
import Grid from "@graphite/../assets/icon-12px-solid/grid.svg";
import Info from "@graphite/../assets/icon-12px-solid/info.svg";
import KeyboardArrowDown from "@graphite/../assets/icon-12px-solid/keyboard-arrow-down.svg";
import KeyboardArrowLeft from "@graphite/../assets/icon-12px-solid/keyboard-arrow-left.svg";
import KeyboardArrowRight from "@graphite/../assets/icon-12px-solid/keyboard-arrow-right.svg";
import KeyboardArrowUp from "@graphite/../assets/icon-12px-solid/keyboard-arrow-up.svg";
import KeyboardBackspace from "@graphite/../assets/icon-12px-solid/keyboard-backspace.svg";
import KeyboardCommand from "@graphite/../assets/icon-12px-solid/keyboard-command.svg";
import KeyboardControl from "@graphite/../assets/icon-12px-solid/keyboard-control.svg";
import KeyboardEnter from "@graphite/../assets/icon-12px-solid/keyboard-enter.svg";
import KeyboardOption from "@graphite/../assets/icon-12px-solid/keyboard-option.svg";
import KeyboardShift from "@graphite/../assets/icon-12px-solid/keyboard-shift.svg";
import KeyboardSpace from "@graphite/../assets/icon-12px-solid/keyboard-space.svg";
import KeyboardTab from "@graphite/../assets/icon-12px-solid/keyboard-tab.svg";
import Link from "@graphite/../assets/icon-12px-solid/link.svg";
import Overlays from "@graphite/../assets/icon-12px-solid/overlays.svg";
import Remove from "@graphite/../assets/icon-12px-solid/remove.svg";
import ResetColors from "@graphite/../assets/icon-12px-solid/reset-colors.svg";
import Snapping from "@graphite/../assets/icon-12px-solid/snapping.svg";
import Swap from "@graphite/../assets/icon-12px-solid/swap.svg";
import VerticalEllipsis from "@graphite/../assets/icon-12px-solid/vertical-ellipsis.svg";
import Warning from "@graphite/../assets/icon-12px-solid/warning.svg";
import WindowButtonWinClose from "@graphite/../assets/icon-12px-solid/window-button-win-close.svg";
import WindowButtonWinMaximize from "@graphite/../assets/icon-12px-solid/window-button-win-maximize.svg";
import WindowButtonWinMinimize from "@graphite/../assets/icon-12px-solid/window-button-win-minimize.svg";
import WindowButtonWinRestoreDown from "@graphite/../assets/icon-12px-solid/window-button-win-restore-down.svg";
const SOLID_12PX = {
Add: { svg: Add, size: 12 },
@ -81,61 +81,61 @@ const SOLID_12PX = {
} as const;
// 16px Solid
import AlignBottom from "@/../assets/icon-16px-solid/align-bottom.svg";
import AlignHorizontalCenter from "@/../assets/icon-16px-solid/align-horizontal-center.svg";
import AlignLeft from "@/../assets/icon-16px-solid/align-left.svg";
import AlignRight from "@/../assets/icon-16px-solid/align-right.svg";
import AlignTop from "@/../assets/icon-16px-solid/align-top.svg";
import AlignVerticalCenter from "@/../assets/icon-16px-solid/align-vertical-center.svg";
import BooleanDifference from "@/../assets/icon-16px-solid/boolean-difference.svg";
import BooleanIntersect from "@/../assets/icon-16px-solid/boolean-intersect.svg";
import BooleanSubtractBack from "@/../assets/icon-16px-solid/boolean-subtract-back.svg";
import BooleanSubtractFront from "@/../assets/icon-16px-solid/boolean-subtract-front.svg";
import BooleanUnion from "@/../assets/icon-16px-solid/boolean-union.svg";
import CheckboxChecked from "@/../assets/icon-16px-solid/checkbox-checked.svg";
import CheckboxUnchecked from "@/../assets/icon-16px-solid/checkbox-unchecked.svg";
import Copy from "@/../assets/icon-16px-solid/copy.svg";
import EyeHidden from "@/../assets/icon-16px-solid/eye-hidden.svg";
import EyeVisible from "@/../assets/icon-16px-solid/eye-visible.svg";
import Eyedropper from "@/../assets/icon-16px-solid/eyedropper.svg";
import File from "@/../assets/icon-16px-solid/file.svg";
import FlipHorizontal from "@/../assets/icon-16px-solid/flip-horizontal.svg";
import FlipVertical from "@/../assets/icon-16px-solid/flip-vertical.svg";
import Folder from "@/../assets/icon-16px-solid/folder.svg";
import GraphiteLogo from "@/../assets/icon-16px-solid/graphite-logo.svg";
import NodeArtboard from "@/../assets/icon-16px-solid/node-artboard.svg";
import NodeBlur from "@/../assets/icon-16px-solid/node-blur.svg";
import NodeBrushwork from "@/../assets/icon-16px-solid/node-brushwork.svg";
import NodeColorCorrection from "@/../assets/icon-16px-solid/node-color-correction.svg";
import NodeFolder from "@/../assets/icon-16px-solid/node-folder.svg";
import NodeGradient from "@/../assets/icon-16px-solid/node-gradient.svg";
import NodeImage from "@/../assets/icon-16px-solid/node-image.svg";
import NodeImaginate from "@/../assets/icon-16px-solid/node-imaginate.svg";
import NodeMagicWand from "@/../assets/icon-16px-solid/node-magic-wand.svg";
import NodeMask from "@/../assets/icon-16px-solid/node-mask.svg";
import NodeMotionBlur from "@/../assets/icon-16px-solid/node-motion-blur.svg";
import NodeNodes from "@/../assets/icon-16px-solid/node-nodes.svg";
import NodeOutput from "@/../assets/icon-16px-solid/node-output.svg";
import NodeShape from "@/../assets/icon-16px-solid/node-shape.svg";
import NodeText from "@/../assets/icon-16px-solid/node-text.svg";
import NodeTransform from "@/../assets/icon-16px-solid/node-transform.svg";
import Paste from "@/../assets/icon-16px-solid/paste.svg";
import Random from "@/../assets/icon-16px-solid/random.svg";
import Regenerate from "@/../assets/icon-16px-solid/regenerate.svg";
import Reload from "@/../assets/icon-16px-solid/reload.svg";
import Rescale from "@/../assets/icon-16px-solid/rescale.svg";
import Reset from "@/../assets/icon-16px-solid/reset.svg";
import Settings from "@/../assets/icon-16px-solid/settings.svg";
import Trash from "@/../assets/icon-16px-solid/trash.svg";
import ViewModeNormal from "@/../assets/icon-16px-solid/view-mode-normal.svg";
import ViewModeOutline from "@/../assets/icon-16px-solid/view-mode-outline.svg";
import ViewModePixels from "@/../assets/icon-16px-solid/view-mode-pixels.svg";
import ViewportDesignMode from "@/../assets/icon-16px-solid/viewport-design-mode.svg";
import ViewportGuideMode from "@/../assets/icon-16px-solid/viewport-guide-mode.svg";
import ViewportSelectMode from "@/../assets/icon-16px-solid/viewport-select-mode.svg";
import ZoomIn from "@/../assets/icon-16px-solid/zoom-in.svg";
import ZoomOut from "@/../assets/icon-16px-solid/zoom-out.svg";
import ZoomReset from "@/../assets/icon-16px-solid/zoom-reset.svg";
import AlignBottom from "@graphite/../assets/icon-16px-solid/align-bottom.svg";
import AlignHorizontalCenter from "@graphite/../assets/icon-16px-solid/align-horizontal-center.svg";
import AlignLeft from "@graphite/../assets/icon-16px-solid/align-left.svg";
import AlignRight from "@graphite/../assets/icon-16px-solid/align-right.svg";
import AlignTop from "@graphite/../assets/icon-16px-solid/align-top.svg";
import AlignVerticalCenter from "@graphite/../assets/icon-16px-solid/align-vertical-center.svg";
import BooleanDifference from "@graphite/../assets/icon-16px-solid/boolean-difference.svg";
import BooleanIntersect from "@graphite/../assets/icon-16px-solid/boolean-intersect.svg";
import BooleanSubtractBack from "@graphite/../assets/icon-16px-solid/boolean-subtract-back.svg";
import BooleanSubtractFront from "@graphite/../assets/icon-16px-solid/boolean-subtract-front.svg";
import BooleanUnion from "@graphite/../assets/icon-16px-solid/boolean-union.svg";
import CheckboxChecked from "@graphite/../assets/icon-16px-solid/checkbox-checked.svg";
import CheckboxUnchecked from "@graphite/../assets/icon-16px-solid/checkbox-unchecked.svg";
import Copy from "@graphite/../assets/icon-16px-solid/copy.svg";
import EyeHidden from "@graphite/../assets/icon-16px-solid/eye-hidden.svg";
import EyeVisible from "@graphite/../assets/icon-16px-solid/eye-visible.svg";
import Eyedropper from "@graphite/../assets/icon-16px-solid/eyedropper.svg";
import File from "@graphite/../assets/icon-16px-solid/file.svg";
import FlipHorizontal from "@graphite/../assets/icon-16px-solid/flip-horizontal.svg";
import FlipVertical from "@graphite/../assets/icon-16px-solid/flip-vertical.svg";
import Folder from "@graphite/../assets/icon-16px-solid/folder.svg";
import GraphiteLogo from "@graphite/../assets/icon-16px-solid/graphite-logo.svg";
import NodeArtboard from "@graphite/../assets/icon-16px-solid/node-artboard.svg";
import NodeBlur from "@graphite/../assets/icon-16px-solid/node-blur.svg";
import NodeBrushwork from "@graphite/../assets/icon-16px-solid/node-brushwork.svg";
import NodeColorCorrection from "@graphite/../assets/icon-16px-solid/node-color-correction.svg";
import NodeFolder from "@graphite/../assets/icon-16px-solid/node-folder.svg";
import NodeGradient from "@graphite/../assets/icon-16px-solid/node-gradient.svg";
import NodeImage from "@graphite/../assets/icon-16px-solid/node-image.svg";
import NodeImaginate from "@graphite/../assets/icon-16px-solid/node-imaginate.svg";
import NodeMagicWand from "@graphite/../assets/icon-16px-solid/node-magic-wand.svg";
import NodeMask from "@graphite/../assets/icon-16px-solid/node-mask.svg";
import NodeMotionBlur from "@graphite/../assets/icon-16px-solid/node-motion-blur.svg";
import NodeNodes from "@graphite/../assets/icon-16px-solid/node-nodes.svg";
import NodeOutput from "@graphite/../assets/icon-16px-solid/node-output.svg";
import NodeShape from "@graphite/../assets/icon-16px-solid/node-shape.svg";
import NodeText from "@graphite/../assets/icon-16px-solid/node-text.svg";
import NodeTransform from "@graphite/../assets/icon-16px-solid/node-transform.svg";
import Paste from "@graphite/../assets/icon-16px-solid/paste.svg";
import Random from "@graphite/../assets/icon-16px-solid/random.svg";
import Regenerate from "@graphite/../assets/icon-16px-solid/regenerate.svg";
import Reload from "@graphite/../assets/icon-16px-solid/reload.svg";
import Rescale from "@graphite/../assets/icon-16px-solid/rescale.svg";
import Reset from "@graphite/../assets/icon-16px-solid/reset.svg";
import Settings from "@graphite/../assets/icon-16px-solid/settings.svg";
import Trash from "@graphite/../assets/icon-16px-solid/trash.svg";
import ViewModeNormal from "@graphite/../assets/icon-16px-solid/view-mode-normal.svg";
import ViewModeOutline from "@graphite/../assets/icon-16px-solid/view-mode-outline.svg";
import ViewModePixels from "@graphite/../assets/icon-16px-solid/view-mode-pixels.svg";
import ViewportDesignMode from "@graphite/../assets/icon-16px-solid/viewport-design-mode.svg";
import ViewportGuideMode from "@graphite/../assets/icon-16px-solid/viewport-guide-mode.svg";
import ViewportSelectMode from "@graphite/../assets/icon-16px-solid/viewport-select-mode.svg";
import ZoomIn from "@graphite/../assets/icon-16px-solid/zoom-in.svg";
import ZoomOut from "@graphite/../assets/icon-16px-solid/zoom-out.svg";
import ZoomReset from "@graphite/../assets/icon-16px-solid/zoom-reset.svg";
const SOLID_16PX = {
AlignBottom: { svg: AlignBottom, size: 16 },
@ -196,17 +196,17 @@ const SOLID_16PX = {
} as const;
// 16px Two-Tone
import MouseHintDrag from "@/../assets/icon-16px-two-tone/mouse-hint-drag.svg";
import MouseHintLmbDouble from "@/../assets/icon-16px-two-tone/mouse-hint-lmb-double.svg";
import MouseHintLmbDrag from "@/../assets/icon-16px-two-tone/mouse-hint-lmb-drag.svg";
import MouseHintLmb from "@/../assets/icon-16px-two-tone/mouse-hint-lmb.svg";
import MouseHintMmbDrag from "@/../assets/icon-16px-two-tone/mouse-hint-mmb-drag.svg";
import MouseHintMmb from "@/../assets/icon-16px-two-tone/mouse-hint-mmb.svg";
import MouseHintNone from "@/../assets/icon-16px-two-tone/mouse-hint-none.svg";
import MouseHintRmbDrag from "@/../assets/icon-16px-two-tone/mouse-hint-rmb-drag.svg";
import MouseHintRmb from "@/../assets/icon-16px-two-tone/mouse-hint-rmb.svg";
import MouseHintScrollDown from "@/../assets/icon-16px-two-tone/mouse-hint-scroll-down.svg";
import MouseHintScrollUp from "@/../assets/icon-16px-two-tone/mouse-hint-scroll-up.svg";
import MouseHintDrag from "@graphite/../assets/icon-16px-two-tone/mouse-hint-drag.svg";
import MouseHintLmbDouble from "@graphite/../assets/icon-16px-two-tone/mouse-hint-lmb-double.svg";
import MouseHintLmbDrag from "@graphite/../assets/icon-16px-two-tone/mouse-hint-lmb-drag.svg";
import MouseHintLmb from "@graphite/../assets/icon-16px-two-tone/mouse-hint-lmb.svg";
import MouseHintMmbDrag from "@graphite/../assets/icon-16px-two-tone/mouse-hint-mmb-drag.svg";
import MouseHintMmb from "@graphite/../assets/icon-16px-two-tone/mouse-hint-mmb.svg";
import MouseHintNone from "@graphite/../assets/icon-16px-two-tone/mouse-hint-none.svg";
import MouseHintRmbDrag from "@graphite/../assets/icon-16px-two-tone/mouse-hint-rmb-drag.svg";
import MouseHintRmb from "@graphite/../assets/icon-16px-two-tone/mouse-hint-rmb.svg";
import MouseHintScrollDown from "@graphite/../assets/icon-16px-two-tone/mouse-hint-scroll-down.svg";
import MouseHintScrollUp from "@graphite/../assets/icon-16px-two-tone/mouse-hint-scroll-up.svg";
const TWO_TONE_16PX = {
MouseHintDrag: { svg: MouseHintDrag, size: 16 },
@ -223,29 +223,29 @@ const TWO_TONE_16PX = {
} as const;
// 24px Two-Tone
import GeneralArtboardTool from "@/../assets/icon-24px-two-tone/general-artboard-tool.svg";
import GeneralEyedropperTool from "@/../assets/icon-24px-two-tone/general-eyedropper-tool.svg";
import GeneralFillTool from "@/../assets/icon-24px-two-tone/general-fill-tool.svg";
import GeneralGradientTool from "@/../assets/icon-24px-two-tone/general-gradient-tool.svg";
import GeneralNavigateTool from "@/../assets/icon-24px-two-tone/general-navigate-tool.svg";
import GeneralSelectTool from "@/../assets/icon-24px-two-tone/general-select-tool.svg";
import RasterBrushTool from "@/../assets/icon-24px-two-tone/raster-brush-tool.svg";
import RasterCloneTool from "@/../assets/icon-24px-two-tone/raster-clone-tool.svg";
import RasterDetailTool from "@/../assets/icon-24px-two-tone/raster-detail-tool.svg";
import RasterHealTool from "@/../assets/icon-24px-two-tone/raster-heal-tool.svg";
import RasterImaginateTool from "@/../assets/icon-24px-two-tone/raster-imaginate-tool.svg";
import RasterNodesTool from "@/../assets/icon-24px-two-tone/raster-nodes-tool.svg";
import RasterPatchTool from "@/../assets/icon-24px-two-tone/raster-patch-tool.svg";
import RasterRelightTool from "@/../assets/icon-24px-two-tone/raster-relight-tool.svg";
import VectorEllipseTool from "@/../assets/icon-24px-two-tone/vector-ellipse-tool.svg";
import VectorFreehandTool from "@/../assets/icon-24px-two-tone/vector-freehand-tool.svg";
import VectorLineTool from "@/../assets/icon-24px-two-tone/vector-line-tool.svg";
import VectorPathTool from "@/../assets/icon-24px-two-tone/vector-path-tool.svg";
import VectorPenTool from "@/../assets/icon-24px-two-tone/vector-pen-tool.svg";
import VectorRectangleTool from "@/../assets/icon-24px-two-tone/vector-rectangle-tool.svg";
import VectorShapeTool from "@/../assets/icon-24px-two-tone/vector-shape-tool.svg";
import VectorSplineTool from "@/../assets/icon-24px-two-tone/vector-spline-tool.svg";
import VectorTextTool from "@/../assets/icon-24px-two-tone/vector-text-tool.svg";
import GeneralArtboardTool from "@graphite/../assets/icon-24px-two-tone/general-artboard-tool.svg";
import GeneralEyedropperTool from "@graphite/../assets/icon-24px-two-tone/general-eyedropper-tool.svg";
import GeneralFillTool from "@graphite/../assets/icon-24px-two-tone/general-fill-tool.svg";
import GeneralGradientTool from "@graphite/../assets/icon-24px-two-tone/general-gradient-tool.svg";
import GeneralNavigateTool from "@graphite/../assets/icon-24px-two-tone/general-navigate-tool.svg";
import GeneralSelectTool from "@graphite/../assets/icon-24px-two-tone/general-select-tool.svg";
import RasterBrushTool from "@graphite/../assets/icon-24px-two-tone/raster-brush-tool.svg";
import RasterCloneTool from "@graphite/../assets/icon-24px-two-tone/raster-clone-tool.svg";
import RasterDetailTool from "@graphite/../assets/icon-24px-two-tone/raster-detail-tool.svg";
import RasterHealTool from "@graphite/../assets/icon-24px-two-tone/raster-heal-tool.svg";
import RasterImaginateTool from "@graphite/../assets/icon-24px-two-tone/raster-imaginate-tool.svg";
import RasterNodesTool from "@graphite/../assets/icon-24px-two-tone/raster-nodes-tool.svg";
import RasterPatchTool from "@graphite/../assets/icon-24px-two-tone/raster-patch-tool.svg";
import RasterRelightTool from "@graphite/../assets/icon-24px-two-tone/raster-relight-tool.svg";
import VectorEllipseTool from "@graphite/../assets/icon-24px-two-tone/vector-ellipse-tool.svg";
import VectorFreehandTool from "@graphite/../assets/icon-24px-two-tone/vector-freehand-tool.svg";
import VectorLineTool from "@graphite/../assets/icon-24px-two-tone/vector-line-tool.svg";
import VectorPathTool from "@graphite/../assets/icon-24px-two-tone/vector-path-tool.svg";
import VectorPenTool from "@graphite/../assets/icon-24px-two-tone/vector-pen-tool.svg";
import VectorRectangleTool from "@graphite/../assets/icon-24px-two-tone/vector-rectangle-tool.svg";
import VectorShapeTool from "@graphite/../assets/icon-24px-two-tone/vector-shape-tool.svg";
import VectorSplineTool from "@graphite/../assets/icon-24px-two-tone/vector-spline-tool.svg";
import VectorTextTool from "@graphite/../assets/icon-24px-two-tone/vector-text-tool.svg";
const TWO_TONE_24PX = {
GeneralArtboardTool: { svg: GeneralArtboardTool, size: 24 },

12
frontend/src/utility-functions/imaginate.ts
View file

@ -1,11 +1,11 @@
/* eslint-disable camelcase */
// import { escapeJSON } from "@/utility-functions/escape";
import { blobToBase64 } from "@/utility-functions/files";
import { type RequestResult, requestWithUploadDownloadProgress } from "@/utility-functions/network";
import { type Editor } from "@/wasm-communication/editor";
import type { XY } from "@/wasm-communication/messages";
import { type ImaginateGenerationParameters } from "@/wasm-communication/messages";
// import { escapeJSON } from "@graphite/utility-functions/escape";
import { blobToBase64 } from "@graphite/utility-functions/files";
import { type RequestResult, requestWithUploadDownloadProgress } from "@graphite/utility-functions/network";
import { type Editor } from "@graphite/wasm-communication/editor";
import type { XY } from "@graphite/wasm-communication/messages";
import { type ImaginateGenerationParameters } from "@graphite/wasm-communication/messages";
const MAX_POLLING_RETRIES = 4;
const SERVER_STATUS_CHECK_TIMEOUT = 5000;

2
frontend/src/utility-functions/rasterization.ts
View file

@ -1,4 +1,4 @@
import { replaceBlobURLsWithBase64 } from "@/utility-functions/files";
import { replaceBlobURLsWithBase64 } from "@graphite/utility-functions/files";
// Rasterize the string of an SVG document at a given width and height and return the canvas it was drawn onto during the rasterization process
export async function rasterizeSVGCanvas(svg: string, width: number, height: number, backgroundColor?: string): Promise<HTMLCanvasElement> {

10
frontend/src/wasm-communication/editor.ts
View file

@ -1,7 +1,7 @@
import type WasmBindgenPackage from "@/../wasm/pkg";
import { panicProxy } from "@/utility-functions/panic-proxy";
import { type JsMessageType } from "@/wasm-communication/messages";
import { createSubscriptionRouter, type SubscriptionRouter } from "@/wasm-communication/subscription-router";
import type WasmBindgenPackage from "@graphite/../wasm/pkg";
import { panicProxy } from "@graphite/utility-functions/panic-proxy";
import { type JsMessageType } from "@graphite/wasm-communication/messages";
import { createSubscriptionRouter, type SubscriptionRouter } from "@graphite/wasm-communication/subscription-router";
export type WasmRawInstance = typeof WasmBindgenPackage;
export type WasmEditorInstance = InstanceType<WasmRawInstance["JsEditorHandle"]>;
@ -58,7 +58,7 @@ export async function initWasm(): Promise<void> {
// Import the WASM module JS bindings and wrap them in the panic proxy
// eslint-disable-next-line import/no-cycle
wasmImport = await import("@/../wasm/pkg").then(panicProxy);
wasmImport = await import("@graphite/../wasm/pkg").then(panicProxy);
// Provide a random starter seed which must occur after initializing the WASM module, since WASM can't generate its own random numbers
const randomSeedFloat = Math.floor(Math.random() * Number.MAX_SAFE_INTEGER);

6
frontend/src/wasm-communication/messages.ts
View file

@ -2,10 +2,10 @@
import { Transform, Type, plainToClass } from "class-transformer";
import { type IconName, type IconSize } from "@/utility-functions/icons";
import { type WasmEditorInstance, type WasmRawInstance } from "@/wasm-communication/editor";
import { type IconName, type IconSize } from "@graphite/utility-functions/icons";
import { type WasmEditorInstance, type WasmRawInstance } from "@graphite/wasm-communication/editor";
import type MenuList from "@/components/floating-menus/MenuList.svelte";
import type MenuList from "@graphite/components/floating-menus/MenuList.svelte";
export class JsMessage {
// The marker provides a way to check if an object is a sub-class constructor for a jsMessage.

4
frontend/src/wasm-communication/subscription-router.ts
View file

@ -1,7 +1,7 @@
import { plainToInstance } from "class-transformer";
import { type WasmEditorInstance, type WasmRawInstance } from "@/wasm-communication/editor";
import { type JsMessageType, messageMakers, type JsMessage } from "@/wasm-communication/messages";
import { type WasmEditorInstance, type WasmRawInstance } from "@graphite/wasm-communication/editor";
import { type JsMessageType, messageMakers, type JsMessage } from "@graphite/wasm-communication/messages";
type JsMessageCallback<T extends JsMessage> = (messageData: T) => void;
// Don't know a better way of typing this since it can be any subclass of JsMessage

2
frontend/tsconfig.json
View file

@ -14,7 +14,7 @@
"baseUrl": ".",
"types": ["node", "svelte", "svelte/store", "svelte/motion", "svelte/transition", "svelte/animate", "svelte/easing"],
"paths": {
"@/*": ["src/*"]
"@graphite/*": ["src/*"]
},
"lib": ["esnext", "dom", "dom.iterable", "scripthost"]
},

2
frontend/wasm/src/editor_api.rs
View file

@ -30,7 +30,7 @@ pub fn set_random_seed(seed: u64) {
/// We directly interface with the updateImage JS function for massively increased performance over serializing and deserializing.
/// This avoids creating a json with a list millions of numbers long.
#[wasm_bindgen(module = "@/wasm-communication/editor")]
#[wasm_bindgen(module = "@graphite/wasm-communication/editor")]
extern "C" {
fn updateImage(path: Vec<u64>, mime: String, imageData: &[u8], document_id: u64);
fn fetchImage(path: Vec<u64>, mime: String, document_id: u64, identifier: String);

2
frontend/webpack.config.ts
View file

@ -113,7 +113,7 @@ const config: webpack.Configuration = {
},
plugins: [
// WASM Pack Plugin integrates compiled Rust code (.wasm) and generated wasm-bindgen code (.js) with the webpack bundle
// Use this JS to import the bundled Rust entry points: const wasm = import("@/../wasm/pkg").then(panicProxy);
// Use this JS to import the bundled Rust entry points: const wasm = import("@graphite/../wasm/pkg").then(panicProxy);
// Then call WASM functions with: (await wasm).functionName()
// https://github.com/wasm-tool/wasm-pack-plugin
new WasmPackPlugin({