Skip to content

Commit c4f4f99

Browse files
chelprocchelproc
committed
update
1 parent c59a730 commit c4f4f99

File tree

23 files changed

+1345
-776
lines changed

23 files changed

+1345
-776
lines changed

‎biome.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
2+
"$schema": "https://biomejs.dev/schemas/2.2.2/schema.json",
33
"vcs": {
44
"enabled": true,
55
"clientKind": "git",

‎package-lock.json‎

Lines changed: 1021 additions & 659 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 19 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -10,34 +10,36 @@
1010
"type-check": "tsc",
1111
"type-check:watch": "tsc --watch",
1212
"check": "biome check",
13-
"check:fix": "biome check --fix"
13+
"check:fix": "biome check --fix",
14+
"test": "vitest"
1415
},
1516
"dependencies": {
1617
"@emotion/react": "^11.14.0",
17-
"@emotion/styled": "^11.14.0",
18-
"@mui/icons-material": "^6.3.0",
19-
"@mui/material": "^6.3.0",
18+
"@emotion/styled": "^11.14.1",
19+
"@mui/icons-material": "^7.3.1",
20+
"@mui/material": "^7.3.1",
21+
"es-toolkit": "^1.39.10",
2022
"eventemitter3": "^5.0.1",
21-
"lodash-es": "^4.17.21",
2223
"memoize-one": "^6.0.0",
23-
"mnemonist": "^0.39.8",
24+
"mnemonist": "^0.40.3",
2425
"nullthrows": "^1.1.1",
25-
"react": "^19.0.0",
26-
"react-dom": "^19.0.0",
26+
"react": "^19.1.1",
27+
"react-dom": "^19.1.1",
2728
"react-use": "^17.6.0",
2829
"tiny-invariant": "^1.3.3",
29-
"transformation-matrix": "^2.16.1",
30-
"zustand": "^5.0.2"
30+
"transformation-matrix": "^3.1.0",
31+
"zustand": "^5.0.8"
3132
},
3233
"devDependencies": {
33-
"@biomejs/biome": "^1.9.4",
34+
"@biomejs/biome": "^2.2.2",
3435
"@tsconfig/strictest": "^2.0.5",
3536
"@types/lodash-es": "^4.17.12",
36-
"@types/react": "^19.0.2",
37-
"@types/react-dom": "^19.0.2",
38-
"@vitejs/plugin-react": "^4.3.4",
39-
"type-fest": "^4.31.0",
40-
"typescript": "^5.7.2",
41-
"vite": "^6.0.6"
37+
"@types/react": "^19.1.12",
38+
"@types/react-dom": "^19.1.9",
39+
"@vitejs/plugin-react": "^5.0.2",
40+
"type-fest": "^4.41.0",
41+
"typescript": "^5.9.2",
42+
"vite": "^7.1.3",
43+
"vitest": "^3.2.4"
4244
}
4345
}

‎src/pages/edit/Editor/components/NodePinPropertyEditor.tsx‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Button, Popover, Stack, TextField, Typography } from "@mui/material";
2-
import { zip } from "lodash-es";
2+
import { zip } from "es-toolkit";
33
import nullthrows from "nullthrows";
44
import { useState } from "react";
55
import invariant from "tiny-invariant";
@@ -124,12 +124,13 @@ export function CCComponentEditorNodePinPropertyEditor() {
124124
nodePin.id,
125125
);
126126
for (const connection of connections) {
127-
const anotherNodePinId = connection.from === nodePin.id
128-
? connection.to
129-
: connection.from;
130-
if (!store.nodePins.isConnectable(
131-
nodePin.id, anotherNodePinId
132-
)) {
127+
const anotherNodePinId =
128+
connection.from === nodePin.id
129+
? connection.to
130+
: connection.from;
131+
if (
132+
!store.nodePins.isConnectable(nodePin.id, anotherNodePinId)
133+
) {
133134
store.connections.unregister([connection.id]);
134135
}
135136
}

‎src/pages/edit/Editor/renderer/Background.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ export default function CCComponentEditorRendererBackground() {
66
const viewBox = componentEditorState.getViewBox();
77

88
return (
9+
// biome-ignore lint/a11y/noStaticElementInteractions: SVG
910
<rect
1011
{...viewBox}
1112
onClick={() => {

‎src/pages/edit/Editor/renderer/Connection.tsx‎

Lines changed: 49 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,42 @@
11
import nullthrows from "nullthrows";
2+
import { useState } from "react";
23
import { theme } from "../../../../common/theme";
34
import type { CCConnectionId } from "../../../../store/connection";
45
import { useStore } from "../../../../store/react";
56
import ensureStoreItem from "../../../../store/react/error";
67
import { useNode } from "../../../../store/react/selectors";
7-
import getCCComponentEditorRendererNodeGeometry from "./Node.geometry";
88
import { useComponentEditorStore } from "../store";
9+
import getCCComponentEditorRendererNodeGeometry from "./Node.geometry";
910

1011
export type CCComponentEditorRendererConnectionCoreProps = {
1112
from: { x: number; y: number };
1213
to: { x: number; y: number };
1314
connectionId?: CCConnectionId;
15+
onMouseEnter?: React.MouseEventHandler<SVGPathElement>;
16+
onMouseLeave?: React.MouseEventHandler<SVGPathElement>;
1417
};
18+
1519
export function CCComponentEditorRendererConnectionCore({
1620
from,
1721
to,
1822
connectionId,
23+
onMouseEnter,
24+
onMouseLeave,
1925
}: CCComponentEditorRendererConnectionCoreProps) {
2026
const straightGap = 10;
2127
const direction = from.x < to.x ? 1 : -1;
2228

2329
const componentEditorState = useComponentEditorStore()();
2430

25-
2631
const handleClick = (e: React.MouseEvent) => {
2732
if (!connectionId) {
2833
return;
2934
}
30-
componentEditorState.selectConnection(
31-
[connectionId],
32-
!e.shiftKey
33-
)
34-
}
35+
componentEditorState.selectConnection([connectionId], !e.shiftKey);
36+
};
3537

3638
return (
39+
// biome-ignore lint/a11y/noStaticElementInteractions: SVG
3740
<path
3841
d={[
3942
`M ${from.x} ${from.y}`,
@@ -48,7 +51,12 @@ export function CCComponentEditorRendererConnectionCore({
4851
].join(" ")}`,
4952
`h ${straightGap * direction}`,
5053
].join(" ")}
51-
stroke={connectionId && componentEditorState.selectedConnectionIds.has(connectionId) ? theme.palette.primary: theme.palette.textPrimary}
54+
stroke={
55+
connectionId &&
56+
componentEditorState.selectedConnectionIds.has(connectionId)
57+
? theme.palette.primary
58+
: theme.palette.textPrimary
59+
}
5260
strokeWidth="2"
5361
fill="none"
5462
onClick={handleClick}
@@ -58,12 +66,12 @@ export function CCComponentEditorRendererConnectionCore({
5866
}
5967
e.preventDefault();
6068
e.stopPropagation();
61-
componentEditorState.selectConnection(
62-
[connectionId],
63-
true
64-
);
69+
componentEditorState.selectConnection([connectionId], true);
6570
componentEditorState.openContextMenu(e);
6671
}}
72+
id={connectionId}
73+
onMouseEnter={onMouseEnter}
74+
onMouseLeave={onMouseLeave}
6775
/>
6876
);
6977
}
@@ -75,6 +83,7 @@ const CCComponentEditorRendererConnection = ensureStoreItem(
7583
(props, store) => store.connections.get(props.connectionId),
7684
({ connectionId }: CCComponentEditorRendererConnectionProps) => {
7785
const { store } = useStore();
86+
const componentEditorState = useComponentEditorStore()();
7887
const connection = nullthrows(store.connections.get(connectionId));
7988
const fromNodePin = nullthrows(store.nodePins.get(connection.from));
8089
const toNodePin = nullthrows(store.nodePins.get(connection.to));
@@ -95,12 +104,35 @@ const CCComponentEditorRendererConnection = ensureStoreItem(
95104
toNodeGeometry.nodePinPositionById.get(toNodePin.id),
96105
);
97106

107+
const [isHovered, setIsHovered] = useState(false);
108+
109+
// const fromNodePinValue = componentEditorState.getNodePinValue(fromNodePin.id);
110+
98111
return (
99-
<CCComponentEditorRendererConnectionCore
100-
from={fromNodePinPosition}
101-
to={toNodePinPosition}
102-
connectionId={connectionId}
103-
/>
112+
<>
113+
<CCComponentEditorRendererConnectionCore
114+
from={fromNodePinPosition}
115+
to={toNodePinPosition}
116+
connectionId={connectionId}
117+
onMouseEnter={() => {
118+
setIsHovered(true);
119+
}}
120+
onMouseLeave={() => {
121+
setIsHovered(false);
122+
}}
123+
/>
124+
{isHovered && componentEditorState.editorMode === "play" && (
125+
<text fontSize={10} fill={theme.palette.textPrimary}>
126+
<textPath
127+
href={`#${connectionId}`}
128+
startOffset="50%"
129+
textAnchor="middle"
130+
>
131+
hoge
132+
</textPath>
133+
</text>
134+
)}
135+
</>
104136
);
105137
},
106138
);

‎src/pages/edit/Editor/renderer/Node.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ const CCComponentEditorRendererNode = ensureStoreItem(
6161

6262
return (
6363
<>
64+
{/** biome-ignore lint/a11y/noStaticElementInteractions: SVG */}
6465
<g
6566
onPointerDown={handlePointerDown}
6667
onPointerMove={handlePointerMove}
@@ -78,7 +79,7 @@ const CCComponentEditorRendererNode = ensureStoreItem(
7879
fill={theme.palette.textPrimary}
7980
x={geometry.x}
8081
y={geometry.y - 5}
81-
textAnchor="bottom"
82+
textAnchor="end"
8283
fontSize={12}
8384
>
8485
{component.name}

‎src/pages/edit/Editor/renderer/NodePin.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -171,9 +171,7 @@ export default function CCComponentEditorRendererNodePin({
171171
}
172172
fill={theme.palette.textPrimary}
173173
>
174-
{nodePin.manualBitWidth >= 100
175-
? "99+"
176-
: nodePin.manualBitWidth}
174+
{nodePin.manualBitWidth >= 100 ? "99+" : nodePin.manualBitWidth}
177175
</text>
178176
)}
179177
</g>
@@ -186,7 +184,9 @@ export default function CCComponentEditorRendererNodePin({
186184
}[componentPin.type]
187185
}
188186
y={position.y}
189-
textAnchor={{ input: "start", output: "end" }[componentPin.type]}
187+
textAnchor={
188+
{ input: "start" as const, output: "end" as const }[componentPin.type]
189+
}
190190
dominantBaseline="central"
191191
fontSize={12}
192192
fill={theme.palette.textPrimary}

‎src/pages/edit/Editor/store/slices/core/index.ts‎

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -69,13 +69,9 @@ export const createComponentEditorStoreCoreSlice: ComponentEditorSliceCreator<
6969
const value = get().inputValues.get(componentPinId);
7070
if (!value) {
7171
const bitWidthStatus =
72-
store.componentPins.getComponentPinBitWidthStatus(
73-
componentPinId,
74-
);
72+
store.componentPins.getComponentPinBitWidthStatus(componentPinId);
7573
if (bitWidthStatus.isFixed) {
76-
const newValue = new Array(bitWidthStatus.bitWidth).fill(
77-
false,
78-
);
74+
const newValue = new Array(bitWidthStatus.bitWidth).fill(false);
7975
return newValue;
8076
}
8177
if (bitWidthStatus.fixMode === "manual") {
@@ -169,7 +165,7 @@ export const createComponentEditorStoreCoreSlice: ComponentEditorSliceCreator<
169165
.join() +
170166
store.nodePins
171167
.getMany()
172-
.map((nodePin) => nodePin.id + "_" + (nodePin.manualBitWidth || 0))
168+
.map((nodePin) => `${nodePin.id}_${nodePin.manualBitWidth || 0}`)
173169
.join(",") +
174170
store.connections
175171
.getMany()

‎src/pages/edit/Editor/store/slices/core/types.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import type { SimulationValue } from ".";
21
import type { Vector2 } from "../../../../../../common/vector2";
32
import type { CCComponentPinId } from "../../../../../../store/componentPin";
43
import type { CCConnectionId } from "../../../../../../store/connection";
54
import type { CCNodeId } from "../../../../../../store/node";
65
import type { CCNodePinId } from "../../../../../../store/nodePin";
6+
import type { SimulationValue } from ".";
77

88
export type EditorMode = EditorModeEdit | EditorModePlay;
99
export type EditorModeEdit = "edit";

0 commit comments

Comments
 (0)