FIX: More consistent naming conventions in widget

webapp/IronCalc/src/IronCalc.tsx

@@ -1,7 +1,7 @@
 import "./index.css";
 import type { Model } from "@ironcalc/wasm";
 import ThemeProvider from "@mui/material/styles/ThemeProvider";
-import Workbook from "./components/workbook.tsx";
+import Workbook from "./components/Workbook/Workbook.tsx";
 import { WorkbookState } from "./components/workbookState.ts";
 import { theme } from "./theme.ts";
 import "./i18n";

webapp/IronCalc/src/components/BorderPicker/BorderPicker.tsx

@@ -20,9 +20,9 @@ import {
   BorderRightIcon,
   BorderStyleIcon,
   BorderTopIcon,
-} from "../icons";
+} from "../../icons";
-import { theme } from "../theme";
+import { theme } from "../../theme";
-import ColorPicker from "./ColorPicker";
+import ColorPicker from "../ColorPicker/ColorPicker";
 
 type BorderPickerProps = {
   className?: string;

webapp/IronCalc/src/components/ColorPicker/ColorPicker.tsx

@@ -5,7 +5,7 @@ import type React from "react";
 import { useEffect, useRef, useState } from "react";
 import { HexColorInput, HexColorPicker } from "react-colorful";
 import { useTranslation } from "react-i18next";
-import { theme } from "../theme";
+import { theme } from "../../theme";
 
 type ColorPickerProps = {
   color: string;

webapp/IronCalc/src/components/FormatMenu/FormatMenu.tsx

@@ -1,7 +1,7 @@
 import { Menu, MenuItem, styled } from "@mui/material";
 import { type ComponentProps, useCallback, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
-import FormatPicker from "./formatPicker";
+import FormatPicker from "./FormatPicker";
 import { NumberFormats } from "./formatUtil";
 
 type FormatMenuProps = {

webapp/IronCalc/src/components/FormatMenu/FormatPicker.tsx

@@ -3,7 +3,7 @@ import { Dialog, TextField } from "@mui/material";
 import { Check, X } from "lucide-react";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { theme } from "../theme";
+import { theme } from "../../theme";
 
 type FormatPickerProps = {
   className?: string;

webapp/IronCalc/src/components/FormulaBar/FormulaBar.tsx

@@ -1,14 +1,14 @@
 import type { Model } from "@ironcalc/wasm";
 import { styled } from "@mui/material";
-import { Fx } from "../icons";
+import { Fx } from "../../icons";
-import { theme } from "../theme";
+import { theme } from "../../theme";
 import {
   COLUMN_WIDTH_SCALE,
   ROW_HEIGH_SCALE,
-} from "./WorksheetCanvas/constants";
+} from "../WorksheetCanvas/constants";
-import { FORMULA_BAR_HEIGHT } from "./constants";
+import { FORMULA_BAR_HEIGHT } from "../constants";
-import Editor from "./editor/editor";
+import Editor from "../Editor/Editor";
-import type { WorkbookState } from "./workbookState";
+import type { WorkbookState } from "../workbookState";
 
 type FormulaBarProps = {
   cellAddress: string;

webapp/IronCalc/src/components/SheetTabBar/SheetTab.tsx

@@ -3,8 +3,8 @@ import type { MenuItemProps } from "@mui/material";
 import { ChevronDown } from "lucide-react";
 import { useRef, useState } from "react";
 import { theme } from "../../theme";
-import ColorPicker from "../ColorPicker";
+import ColorPicker from "../ColorPicker/ColorPicker";
-import { isInReferenceMode } from "../editor/util";
+import { isInReferenceMode } from "../Editor/util";
 import type { WorkbookState } from "../workbookState";
 import SheetDeleteDialog from "./SheetDeleteDialog";
 import SheetRenameDialog from "./SheetRenameDialog";

webapp/IronCalc/src/components/SheetTabBar/SheetTabBar.tsx

@@ -3,8 +3,8 @@ import { Menu, Plus } from "lucide-react";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { theme } from "../../theme";
+import { StyledButton } from "../Toolbar/Toolbar";
 import { NAVIGATION_HEIGHT } from "../constants";
-import { StyledButton } from "../toolbar";
 import type { WorkbookState } from "../workbookState";
 import SheetListMenu from "./SheetListMenu";
 import SheetTab from "./SheetTab";

webapp/IronCalc/src/components/Toolbar/Toolbar.tsx

@@ -36,19 +36,19 @@ import {
   ArrowMiddleFromLine,
   DecimalPlacesDecreaseIcon,
   DecimalPlacesIncreaseIcon,
-} from "../icons";
+} from "../../icons";
-import { theme } from "../theme";
+import { theme } from "../../theme";
-import ColorPicker from "./ColorPicker";
+import BorderPicker from "../BorderPicker/BorderPicker";
-import NameManagerDialog from "./NameManagerDialog";
+import ColorPicker from "../ColorPicker/ColorPicker";
-import type { NameManagerProperties } from "./NameManagerDialog/NameManagerDialog";
+import FormatMenu from "../FormatMenu/FormatMenu";
-import BorderPicker from "./borderPicker";
-import { TOOLBAR_HEIGHT } from "./constants";
-import FormatMenu from "./formatMenu";
 import {
   NumberFormats,
   decreaseDecimalPlaces,
   increaseDecimalPlaces,
-} from "./formatUtil";
+} from "../FormatMenu/formatUtil";
+import NameManagerDialog from "../NameManagerDialog";
+import type { NameManagerProperties } from "../NameManagerDialog/NameManagerDialog";
+import { TOOLBAR_HEIGHT } from "../constants";
 
 type ToolbarProperties = {
   canUndo: boolean;

webapp/IronCalc/src/components/Workbook/Workbook.tsx

@@ -6,26 +6,26 @@ import type {
 } from "@ironcalc/wasm";
 import { styled } from "@mui/material/styles";
 import { useCallback, useEffect, useRef, useState } from "react";
-import SheetTabBar from "./SheetTabBar/SheetTabBar";
+import FormulaBar from "../FormulaBar/FormulaBar";
+import SheetTabBar from "../SheetTabBar";
+import Toolbar from "../Toolbar/Toolbar";
+import Worksheet from "../Worksheet/Worksheet";
 import {
   COLUMN_WIDTH_SCALE,
   LAST_COLUMN,
   ROW_HEIGH_SCALE,
-} from "./WorksheetCanvas/constants";
+} from "../WorksheetCanvas/constants";
 import {
   CLIPBOARD_ID_SESSION_STORAGE_KEY,
   getNewClipboardId,
-} from "./clipboard";
+} from "../clipboard";
-import FormulaBar from "./formulabar";
-import Toolbar from "./toolbar";
-import useKeyboardNavigation from "./useKeyboardNavigation";
 import {
   type NavigationKey,
   getCellAddress,
   getFullRangeToString,
-} from "./util";
+} from "../util";
-import type { WorkbookState } from "./workbookState";
+import type { WorkbookState } from "../workbookState";
-import Worksheet from "./worksheet";
+import useKeyboardNavigation from "./useKeyboardNavigation";
 
 const Workbook = (props: { model: Model; workbookState: WorkbookState }) => {
   const { model, workbookState } = props;

webapp/IronCalc/src/components/Workbook/useKeyboardNavigation.ts

@@ -1,5 +1,5 @@
 import { type KeyboardEvent, type RefObject, useCallback } from "react";
-import { type NavigationKey, isEditingKey, isNavigationKey } from "./util";
+import { type NavigationKey, isEditingKey, isNavigationKey } from "../util";
 
 export enum Border {
   Top = "top",

webapp/IronCalc/src/components/Worksheet/CellContextMenu.tsx

@@ -8,7 +8,7 @@ import {
 } from "lucide-react";
 import { useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { theme } from "../theme";
+import { theme } from "../../theme";
 
 const red_color = theme.palette.error.main;
 

webapp/IronCalc/src/components/Worksheet/Worksheet.tsx

@@ -1,7 +1,6 @@
 import { type Model, columnNameFromNumber } from "@ironcalc/wasm";
 import { styled } from "@mui/material/styles";
 import { useEffect, useLayoutEffect, useRef, useState } from "react";
-import CellContextMenu from "./CellContextMenu";
 import {
   COLUMN_WIDTH_SCALE,
   LAST_COLUMN,
@@ -9,17 +8,18 @@ import {
   ROW_HEIGH_SCALE,
   outlineBackgroundColor,
   outlineColor,
-} from "./WorksheetCanvas/constants";
+} from "../WorksheetCanvas/constants";
-import WorksheetCanvas from "./WorksheetCanvas/worksheetCanvas";
+import WorksheetCanvas from "../WorksheetCanvas/worksheetCanvas";
 import {
   FORMULA_BAR_HEIGHT,
   NAVIGATION_HEIGHT,
   TOOLBAR_HEIGHT,
-} from "./constants";
+} from "../constants";
-import Editor from "./editor/editor";
+import Editor from "../Editor/Editor";
-import type { Cell } from "./types";
+import type { Cell } from "../types";
+import { AreaType, type WorkbookState } from "../workbookState";
+import CellContextMenu from "./CellContextMenu";
 import usePointer from "./usePointer";
-import { AreaType, type WorkbookState } from "./workbookState";
 
 function useWindowSize() {
   const [size, setSize] = useState([0, 0]);

webapp/IronCalc/src/components/Worksheet/usePointer.ts

@@ -1,14 +1,14 @@
 import type { Model } from "@ironcalc/wasm";
 import { type PointerEvent, type RefObject, useCallback, useRef } from "react";
-import type WorksheetCanvas from "./WorksheetCanvas/worksheetCanvas";
+import type WorksheetCanvas from "../WorksheetCanvas/worksheetCanvas";
 import {
   headerColumnWidth,
   headerRowHeight,
-} from "./WorksheetCanvas/worksheetCanvas";
+} from "../WorksheetCanvas/worksheetCanvas";
-import { isInReferenceMode } from "./editor/util";
+import { isInReferenceMode } from "../Editor/util";
-import type { Cell } from "./types";
+import type { Cell } from "../types";
-import { rangeToStr } from "./util";
+import { rangeToStr } from "../util";
-import type { WorkbookState } from "./workbookState";
+import type { WorkbookState } from "../workbookState";
 
 interface PointerSettings {
   canvasElement: RefObject<HTMLCanvasElement | null>;

webapp/IronCalc/src/components/WorksheetCanvas/worksheetCanvas.ts

@@ -1,6 +1,6 @@
 import type { Model } from "@ironcalc/wasm";
 import { columnNameFromNumber } from "@ironcalc/wasm";
-import { getColor } from "../editor/util";
+import { getColor } from "../Editor/util";
 import type { Cell } from "../types";
 import type { WorkbookState } from "../workbookState";
 import {

webapp/IronCalc/src/components/tests/util.test.ts

@@ -1,7 +1,10 @@
 import { readFile } from "node:fs/promises";
 import { type SelectedView, initSync } from "@ironcalc/wasm";
 import { expect, test } from "vitest";
-import { decreaseDecimalPlaces, increaseDecimalPlaces } from "../formatUtil";
+import {
+  decreaseDecimalPlaces,
+  increaseDecimalPlaces,
+} from "../FormatMenu/formatUtil";
 import { getFullRangeToString, isNavigationKey } from "../util";
 
 test("checks arrow left is a navigation key", () => {