diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
deleted file mode 100644
index 2418c26..0000000
--- a/.devcontainer/devcontainer.json
+++ /dev/null
@@ -1,22 +0,0 @@
-// For format details, see https://aka.ms/devcontainer.json. For config options, see the
-// README at: https://github.com/devcontainers/templates/tree/main/src/typescript-node
-{
- "name": "Node.js & TypeScript",
- // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
- "image": "mcr.microsoft.com/devcontainers/typescript-node:1-22-bookworm",
-
- // Features to add to the dev container. More info: https://containers.dev/features.
- "features": { "ghcr.io/devcontainers-extra/features/ripgrep:1": {} },
-
- // Use 'forwardPorts' to make a list of ports inside the container available locally.
- // "forwardPorts": [5173],
-
- // Use 'postCreateCommand' to run commands after the container is created.
- "postCreateCommand": "npm install"
-
- // Configure tool-specific properties.
- // "customizations": {},
-
- // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
- // "remoteUser": "root"
-}
diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 0000000..36d5a7a
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,2 @@
+[*]
+max_line_length = 100
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..ad92582
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+ "editor.formatOnSave": true
+}
diff --git a/package-lock.json b/package-lock.json
index 371b641..6221909 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -16,7 +16,7 @@
"downloadjs": "^1.4.7",
"i18next": "^25.3.2",
"i18next-browser-languagedetector": "8.2.0",
- "lodash": "^4.17.5",
+ "lodash-es": "^4.17.21",
"mobx": "^6.13.0",
"mobx-react-observer": "^1.1.0",
"react": "^19.1.0",
@@ -3500,10 +3500,10 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
- "node_modules/lodash": {
+ "node_modules/lodash-es": {
"version": "4.17.21",
- "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
- "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
+ "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+ "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
"license": "MIT"
},
"node_modules/lodash.merge": {
diff --git a/package.json b/package.json
index 18c04eb..d801956 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,7 @@
"downloadjs": "^1.4.7",
"i18next": "^25.3.2",
"i18next-browser-languagedetector": "8.2.0",
- "lodash": "^4.17.5",
+ "lodash-es": "^4.17.21",
"mobx": "^6.13.0",
"mobx-react-observer": "^1.1.0",
"react": "^19.1.0",
diff --git a/src/ColorDropDownField.jsx b/src/ColorDropDownField.jsx
index b05ab57..4e22dcb 100644
--- a/src/ColorDropDownField.jsx
+++ b/src/ColorDropDownField.jsx
@@ -1,4 +1,3 @@
-import { range } from "lodash";
import Color from "color";
import DropDownField from "./DropDownField";
@@ -7,7 +6,7 @@ const colors = [
{ key: "transparent" },
{ key: "black" },
{ key: "gray" },
- ...range(1, 10).map((v) => ({
+ ...Array.from({ length: 9 }, (_, i) => i + 1).map((v) => ({
key: Color.rgb(255, 255, 255)
.darken(v / 10.0)
.string(),
diff --git a/src/PracticePage.jsx b/src/PracticePage.jsx
index 61fb2f7..6260d7d 100644
--- a/src/PracticePage.jsx
+++ b/src/PracticePage.jsx
@@ -1,5 +1,3 @@
-import { times } from "lodash";
-
import LineSet from "./LineSet";
import WatermarkSVG from "./WatermarkSVG";
@@ -36,7 +34,7 @@ const PracticePage = ({ store }) => {
style={{ backgroundColor: "white" }}
>
- {times(count, (i) => (
+ {[...Array(count)].map((_, i) => (
{
))}
- {times(count, (i) => (
+ {[...Array(count)].map((_, i) => (
{
@@ -16,13 +16,13 @@ export const trackEvent = (action, label) => {
gtagEvent(action, { eventLabel: label });
};
-export const presetChange = partial(trackEvent, "select_preset");
+export const presetChange = (label) => trackEvent("select_preset", label);
-export const ratiosChange = partial(trackEvent, "change_ratios");
+export const ratiosChange = (label) => trackEvent("change_ratios", label);
-export const xHeightChange = partial(trackEvent, "change_x_height");
+export const xHeightChange = (label) => trackEvent("change_x_height", label);
-export const outputAttempt = partial(trackEvent, "output_attempt");
+export const outputAttempt = (label) => trackEvent("output_attempt", label);
export const gaLangChange = (lng) => {
gtagEvent("language_change", { language: lng });
diff --git a/src/lines.js b/src/lines.js
index d8cab94..eb4325c 100644
--- a/src/lines.js
+++ b/src/lines.js
@@ -1,5 +1,3 @@
-import { merge } from "lodash";
-
export const basicLine = (width, offset) => {
return {
x1: 0,
@@ -25,12 +23,12 @@ export const lineDash = (name) => {
};
export const composeLine = (spec) => {
- return merge(
- basicLine(spec.width, spec.offset),
- color(spec.color),
- thickness(spec.thickness),
- lineDash(spec.dash),
- );
+ return {
+ ...basicLine(spec.width, spec.offset),
+ ...color(spec.color),
+ ...thickness(spec.thickness),
+ ...lineDash(spec.dash),
+ };
};
export const defaultLineSpec = (overrides = {}) => {
diff --git a/src/store.js b/src/store.js
index c658967..fef86a9 100644
--- a/src/store.js
+++ b/src/store.js
@@ -1,5 +1,5 @@
-import { reduce, range } from "lodash";
-import { action, computed, observable, makeObservable } from "mobx";
+import range from "lodash-es/range";
+import { action, computed, makeObservable, observable } from "mobx";
import { composeLine, defaultLineSpec } from "./lines";
@@ -195,7 +195,7 @@ class PenStore {
}
get lineSetHeight() {
- return reduce(this.heights, (sum, h) => sum + h, 0);
+ return this.heights.reduce((sum, h) => sum + h, 0);
}
get guideLineSet() {
diff --git a/vite.config.js b/vite.config.js
index c7979d7..a3a624a 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,4 +1,5 @@
import { defineConfig } from "vite";
+
import react from "@vitejs/plugin-react";
import observerPlugin from "mobx-react-observer/babel-plugin";
@@ -8,15 +9,7 @@ export default defineConfig({
rollupOptions: {
output: {
manualChunks: {
- uicore: [
- "react",
- "react-dom",
- "mobx",
- "mobx-react-observer",
- "i18next",
- "react-i18next",
- "lodash",
- ],
+ react: ["react", "react-dom", "react-i18next", "i18next", "mobx", "mobx-react-observer"],
},
},
},
@@ -28,9 +21,6 @@ export default defineConfig({
},
}),
],
- server: {
- host: true,
- },
test: {
environment: "jsdom",
},