Skip to content

Commit 67814e7

Browse files
jstriebjstrieb
committed
Rearrange files to emphasize app-specific code
- General UI components go in `src/components` - Library code goes in `src/lib` - App-specific code stays at the top level in `src` In general, components should be composable, and top-level UI "views" should be compositions of components with app logic.
1 parent 92d0469 commit 67814e7

25 files changed

+51
-41
lines changed

‎README.md‎

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -327,22 +327,27 @@ the application from the highest to lowest level.
327327
throughout the application
328328
- `Sheet.newCell` is responsible for reactively rederiving the store that
329329
computes a cell's value; it is run whenever the cell's value changes
330-
- [`src/store.js`](src/store.js) – implementation of "rederivable" stores that
331-
can change their derived dependencies without invalidating their object
332-
reference
330+
- [`src/lib/store.js`](src/lib/store.js) – implementation of "rederivable"
331+
stores that can change their derived dependencies without invalidating their
332+
object reference
333333
- Every cell's value is a rederivable store that is rederived when its formula
334334
changes, and updated whenever any of its dependencies' values changes
335335
- [`src/formula.js`](src/formula.js) – formula parsing logic
336-
- [`src/parsers.js`](src/parsers.js) – parser combinator library used for formula parsing
337-
- [`src/keyboard.js`](src/keyboard.js) – mapping of keyboard shortcuts to handlers
338-
- [`src/*.svelte`](src/) – UI components
336+
- [`src/parsers.js`](src/lib/parsers.js) – parser combinator library used for
337+
formula parsing
338+
- [`src/keyboard.js`](src/keyboard.js) – mapping of keyboard shortcuts to
339+
handlers
340+
- [`src/*.svelte`](src/) – UI "views" consisting of the composition of
341+
components with logic
342+
- [`src/components/*.svelte`](src/components/) – atomic UI components
339343
- [`src/formula-functions.js`](src/formula-functions.js) – "standard library"
340344
formula functions available in every spreadsheet
341345
- Includes functionality to `eval` user code and add functions to the formula
342346
function object
343347
- [`src/global.css`](src/global.css) and [`public/*`](public/) – global
344348
stylesheet, favicons, etc.
345-
- [`src/compress.js`](src/compress.js) – compress and decompress text using PNGs
349+
- [`src/lib/compress.js`](src/lib/compress.js) – compress and decompress text
350+
using PNGs
346351
- [`test/*`](test/) – test suite and related functions
347352
348353
## Cool Code Highlights

‎index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<!--
22
Created by Jacob Strieb.
3-
Fall 2024 - Spring 2025
3+
Fall 2024 - Fall 2025
44
-->
55
<!doctype html>
66
<html lang="en">
@@ -59,7 +59,7 @@
5959

6060
import "./src/global.css";
6161
import App from "./src/App.svelte";
62-
import { decompressText } from "./src/compress.js";
62+
import { decompressText } from "./src/lib/compress.js";
6363

6464
// Decompression must be async, so we wait until it's complete to initialize
6565
// and mount the main component. The globals object is created when the App

‎src/App.svelte‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -101,28 +101,30 @@
101101
</style>
102102

103103
<script>
104-
import Button from "./Button.svelte";
105-
import CodeEditor from "./CodeEditor.svelte";
106-
import Details from "./Details.svelte";
107-
import Dialog from "./Dialog.svelte";
108104
import FormulaBar from "./FormulaBar.svelte";
109105
import Llm from "./Llm.svelte";
110106
import SaveLoad from "./SaveLoad.svelte";
111107
import Settings from "./Settings.svelte";
112-
import ShyMenu from "./ShyMenu.svelte";
113108
import Table from "./Table.svelte";
114109
import Tabs from "./Tabs.svelte";
115110
116111
import { State, Sheet } from "./classes.svelte.js";
117-
import { compressText } from "./compress.js";
118112
import { evalDebounced, functions } from "./formula-functions.svelte.js";
113+
import { actions, keyboardHandler, keybindings } from "./keyboard.js";
114+
115+
import Button from "./components/Button.svelte";
116+
import CodeEditor from "./components/CodeEditor.svelte";
117+
import Details from "./components/Details.svelte";
118+
import Dialog from "./components/Dialog.svelte";
119+
import ShyMenu from "./components/ShyMenu.svelte";
120+
121+
import { compressText } from "./lib/compress.js";
119122
import {
120123
debounce,
121124
replaceValues,
122125
nextZIndex,
123126
domToImage,
124-
} from "./helpers.js";
125-
import { actions, keyboardHandler, keybindings } from "./keyboard.js";
127+
} from "./lib/helpers.js";
126128
127129
let { urlData } = $props();
128130
let globals = $state(

‎src/Llm.svelte‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -53,10 +53,10 @@
5353
</style>
5454

5555
<script>
56-
import Button from "./Button.svelte";
57-
import CodeEditor from "./CodeEditor.svelte";
58-
import Details from "./Details.svelte";
59-
import Select from "./Select.svelte";
56+
import Button from "./components/Button.svelte";
57+
import CodeEditor from "./components/CodeEditor.svelte";
58+
import Details from "./components/Details.svelte";
59+
import Select from "./components/Select.svelte";
6060
6161
// May appear unused, but actually used during evals
6262
import { llmToolFunctions, llmModels } from "./llm.svelte.js";

‎src/SaveLoad.svelte‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -47,11 +47,12 @@
4747
</style>
4848

4949
<script>
50-
import Button from "./Button.svelte";
51-
import FileBrowser from "./FileBrowser.svelte";
50+
import Button from "./components/Button.svelte";
51+
import FileBrowser from "./components/FileBrowser.svelte";
5252
5353
import { State } from "./classes.svelte";
54-
import { compressText, decompressText } from "./compress.js";
54+
55+
import { compressText, decompressText } from "./lib/compress.js";
5556
5657
let { imageData, globals = $bindable() } = $props();
5758

‎src/Settings.svelte‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@
77
</style>
88

99
<script>
10-
import Button from "./Button.svelte";
11-
import NumericInput from "./NumericInput.svelte";
10+
import Button from "./components/Button.svelte";
11+
import NumericInput from "./components/NumericInput.svelte";
1212
1313
let { globals = $bindable() } = $props();
1414

‎src/Table.svelte‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -170,9 +170,10 @@
170170
</style>
171171

172172
<script>
173-
import Button from "./Button.svelte";
174173
import Cell from "./Cell.svelte";
175-
import NumericInput from "./NumericInput.svelte";
174+
175+
import Button from "./components/Button.svelte";
176+
import NumericInput from "./components/NumericInput.svelte";
176177
177178
let { globals = $bindable(), table = $bindable() } = $props();
178179
let selected = $derived(globals.selected);

‎src/Tabs.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@
8484
</style>
8585

8686
<script>
87-
import ContextMenu from "./ContextMenu.svelte";
87+
import ContextMenu from "./components/ContextMenu.svelte";
8888
8989
let { globals = $bindable(), value = $bindable() } = $props();
9090
let tabs = $derived(globals.sheets.map((s) => s.name));

‎src/classes.svelte.js‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import { formula } from "./formula.js";
2-
import { debounce, randomId } from "./helpers.js";
3-
import { ParseError } from "./parsers.js";
4-
import { rederivable } from "./store.js";
52
import { functions, evalCode } from "./formula-functions.svelte.js";
63

4+
import { debounce, randomId } from "./lib/helpers.js";
5+
import { ParseError } from "./lib/parsers.js";
6+
import { rederivable } from "./lib/store.js";
7+
78
import { get } from "svelte/store";
89

910
export const DEFAULT_WIDTH = 56,

src/Button.svelte renamed to src/components/Button.svelte

File renamed without changes.

0 commit comments

Comments
 (0)