@dahawa/hawa-code 2.3.1 → 2.3.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cli.js +3 -3
- package/hands.js +3 -3
- package/package.json +1 -1
- package/webServer/app.js +44 -44
- package/webServer/index.html +2 -1
- package/webServer/interrupt-icon.svg +3 -0
- package/webServer/logo.svg +1 -0
- package/webServer/send-icon.svg +3 -0
- package/webServer/style.css +207 -36
package/webServer/index.html
CHANGED
|
@@ -3,7 +3,8 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="UTF-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
-
<title>Hawa Code
|
|
6
|
+
<title>Hawa Code</title>
|
|
7
|
+
<link rel="icon" type="image/svg+xml" href="/logo.svg">
|
|
7
8
|
<link rel="stylesheet" href="/style.css">
|
|
8
9
|
</head>
|
|
9
10
|
<body>
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 1024 1024">
|
|
2
|
+
<path d="M331.946667 379.904c-11.946667 23.466667-11.946667 54.186667-11.946667 115.626667v32.938666c0 61.44 0 92.16 11.946667 115.626667 10.538667 20.650667 27.306667 37.418667 47.957333 47.957333 23.466667 11.946667 54.186667 11.946667 115.626667 11.946667h32.938666c61.44 0 92.16 0 115.626667-11.946667 20.650667-10.538667 37.418667-27.306667 47.957333-47.957333 11.946667-23.466667 11.946667-54.186667 11.946667-115.626667v-32.938666c0-61.44 0-92.16-11.946667-115.626667a109.696 109.696 0 0 0-47.957333-47.957333c-23.466667-11.946667-54.186667-11.946667-115.626667-11.946667h-32.938666c-61.44 0-92.16 0-115.626667 11.946667-20.650667 10.538667-37.418667 27.306667-47.957333 47.957333z" fill="currentColor"/>
|
|
3
|
+
</svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="2048" height="2048" viewBox="0 0 2048 2048"><defs><linearGradient id="a" x1="0" y1="0" x2="0" y2="1"><stop offset="0%" stop-color="#2aa5f5"/><stop offset="100%" stop-color="#1977c8"/></linearGradient></defs><path fill="url(#a)" fill-rule="evenodd" d="m1019 121 780 439 5 918-789 444-774-445 5-917Zm-66 458-328 833 78 43 75-41 95-242h300l96 242 75 41 78-43-319-833H953Zm71 181-123 324h246l-123-324Z"/></svg>
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 1024 1024">
|
|
2
|
+
<path d="M705.536 433.664a38.4 38.4 0 1 1-54.272 54.272L550.4 387.114667V729.6a38.4 38.4 0 0 1-76.8 0V387.114667l-100.864 100.821333a38.4 38.4 0 1 1-54.272-54.272l166.4-166.4a38.4 38.4 0 0 1 54.272 0l166.4 166.4z" fill="currentColor"/>
|
|
3
|
+
</svg>
|
package/webServer/style.css
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
/* terminal.css - 模拟 CLI 终端风格 */
|
|
2
2
|
:root {
|
|
3
|
-
--bg-primary: #
|
|
4
|
-
--bg-secondary: #
|
|
5
|
-
--bg-hover: #
|
|
6
|
-
--text-primary: #
|
|
7
|
-
--text-secondary: #
|
|
3
|
+
--bg-primary: #0d0d0d;
|
|
4
|
+
--bg-secondary: #1a1a1a;
|
|
5
|
+
--bg-hover: #262626;
|
|
6
|
+
--text-primary: #e8e8e8;
|
|
7
|
+
--text-secondary: #a0a0a0;
|
|
8
8
|
--text-dimmed: #666;
|
|
9
|
-
--accent-blue: #
|
|
10
|
-
--accent-green: #
|
|
11
|
-
--accent-yellow: #
|
|
12
|
-
--accent-red: #
|
|
13
|
-
--accent-purple: #
|
|
14
|
-
--border-color: #
|
|
9
|
+
--accent-blue: #888;
|
|
10
|
+
--accent-green: #4caf50;
|
|
11
|
+
--accent-yellow: #ff9800;
|
|
12
|
+
--accent-red: #f44336;
|
|
13
|
+
--accent-purple: #9c27b0;
|
|
14
|
+
--border-color: #333;
|
|
15
15
|
--font-mono: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'SF Mono', 'Menlo', monospace;
|
|
16
16
|
}
|
|
17
17
|
|
|
@@ -41,6 +41,67 @@ html, body {
|
|
|
41
41
|
.app {
|
|
42
42
|
height: 100%;
|
|
43
43
|
display: flex;
|
|
44
|
+
flex-direction: row;
|
|
45
|
+
overflow: hidden;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
/* 左侧边栏 */
|
|
49
|
+
.left-sidebar {
|
|
50
|
+
width: 220px;
|
|
51
|
+
flex-shrink: 0;
|
|
52
|
+
display: flex;
|
|
53
|
+
flex-direction: column;
|
|
54
|
+
background: var(--bg-secondary);
|
|
55
|
+
border-right: 1px solid var(--border-color);
|
|
56
|
+
overflow: hidden;
|
|
57
|
+
transition: width 0.2s ease;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.left-sidebar.collapsed {
|
|
61
|
+
width: 42px;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.sidebar-header {
|
|
65
|
+
display: flex;
|
|
66
|
+
align-items: center;
|
|
67
|
+
gap: 8px;
|
|
68
|
+
height: 40px;
|
|
69
|
+
padding: 8px 16px;
|
|
70
|
+
border-bottom: 1px solid var(--border-color);
|
|
71
|
+
flex-shrink: 0;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
.left-sidebar.collapsed .sidebar-header {
|
|
75
|
+
justify-content: center;
|
|
76
|
+
padding: 8px 0;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.collapse-button {
|
|
80
|
+
background: transparent;
|
|
81
|
+
border: none;
|
|
82
|
+
color: var(--text-secondary);
|
|
83
|
+
font-size: 16px;
|
|
84
|
+
cursor: pointer;
|
|
85
|
+
padding: 4px;
|
|
86
|
+
line-height: 1;
|
|
87
|
+
transition: color 0.15s ease;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.collapse-button:hover {
|
|
91
|
+
color: var(--accent-blue);
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.sidebar-title {
|
|
95
|
+
font-size: 14px;
|
|
96
|
+
font-weight: 600;
|
|
97
|
+
color: var(--accent-blue);
|
|
98
|
+
white-space: nowrap;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
/* 右侧主内容区 */
|
|
102
|
+
.main-content {
|
|
103
|
+
flex: 1;
|
|
104
|
+
display: flex;
|
|
44
105
|
flex-direction: column;
|
|
45
106
|
overflow: hidden;
|
|
46
107
|
}
|
|
@@ -50,6 +111,7 @@ html, body {
|
|
|
50
111
|
display: flex;
|
|
51
112
|
align-items: center;
|
|
52
113
|
justify-content: space-between;
|
|
114
|
+
height: 40px;
|
|
53
115
|
padding: 8px 16px;
|
|
54
116
|
background: var(--bg-secondary);
|
|
55
117
|
border-bottom: 1px solid var(--border-color);
|
|
@@ -103,17 +165,19 @@ html, body {
|
|
|
103
165
|
|
|
104
166
|
/* Agent Tab 栏 */
|
|
105
167
|
.agent-tabs {
|
|
168
|
+
flex: 1;
|
|
106
169
|
display: flex;
|
|
170
|
+
flex-direction: column;
|
|
107
171
|
gap: 2px;
|
|
108
|
-
padding:
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
flex-shrink: 0;
|
|
112
|
-
overflow-x: auto;
|
|
172
|
+
padding: 8px;
|
|
173
|
+
overflow-y: auto;
|
|
174
|
+
overflow-x: hidden;
|
|
113
175
|
}
|
|
114
176
|
|
|
115
177
|
.agent-tab {
|
|
116
|
-
|
|
178
|
+
display: flex;
|
|
179
|
+
align-items: center;
|
|
180
|
+
padding: 8px 12px;
|
|
117
181
|
border-radius: 4px;
|
|
118
182
|
cursor: pointer;
|
|
119
183
|
font-size: 12px;
|
|
@@ -134,12 +198,22 @@ html, body {
|
|
|
134
198
|
font-weight: 600;
|
|
135
199
|
}
|
|
136
200
|
|
|
201
|
+
.agent-tab.collapsed {
|
|
202
|
+
justify-content: center;
|
|
203
|
+
padding: 8px 0;
|
|
204
|
+
}
|
|
205
|
+
|
|
137
206
|
.agent-tab .tab-status {
|
|
138
207
|
display: inline-block;
|
|
139
208
|
width: 6px;
|
|
140
209
|
height: 6px;
|
|
141
210
|
border-radius: 50%;
|
|
142
211
|
margin-right: 6px;
|
|
212
|
+
flex-shrink: 0;
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
.agent-tab.collapsed .tab-status {
|
|
216
|
+
margin-right: 0;
|
|
143
217
|
}
|
|
144
218
|
|
|
145
219
|
.agent-tab .tab-status.running {
|
|
@@ -154,6 +228,69 @@ html, body {
|
|
|
154
228
|
background: var(--text-dimmed);
|
|
155
229
|
}
|
|
156
230
|
|
|
231
|
+
/* 左侧底部 Settings 按钮 */
|
|
232
|
+
.sidebar-footer {
|
|
233
|
+
padding: 8px 16px;
|
|
234
|
+
flex-shrink: 0;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
.left-sidebar.collapsed .sidebar-footer {
|
|
238
|
+
padding: 8px 0;
|
|
239
|
+
display: flex;
|
|
240
|
+
justify-content: center;
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
.sidebar-stats {
|
|
244
|
+
font-size: 11px;
|
|
245
|
+
color: var(--text-dimmed);
|
|
246
|
+
margin-bottom: 6px;
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
.left-sidebar.collapsed .sidebar-stats {
|
|
250
|
+
display: none;
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
.sidebar-button {
|
|
254
|
+
width: 100%;
|
|
255
|
+
display: inline-flex;
|
|
256
|
+
align-items: center;
|
|
257
|
+
gap: 8px;
|
|
258
|
+
background: transparent;
|
|
259
|
+
border: 1px solid var(--border-color);
|
|
260
|
+
color: var(--text-secondary);
|
|
261
|
+
padding: 8px 12px;
|
|
262
|
+
border-radius: 4px;
|
|
263
|
+
cursor: pointer;
|
|
264
|
+
font-family: var(--font-mono);
|
|
265
|
+
font-size: 12px;
|
|
266
|
+
text-align: left;
|
|
267
|
+
transition: all 0.15s ease;
|
|
268
|
+
}
|
|
269
|
+
|
|
270
|
+
.left-sidebar.collapsed .sidebar-button {
|
|
271
|
+
width: auto;
|
|
272
|
+
padding: 6px 8px;
|
|
273
|
+
justify-content: center;
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
.sidebar-button-icon {
|
|
277
|
+
flex-shrink: 0;
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
.sidebar-button-text {
|
|
281
|
+
white-space: nowrap;
|
|
282
|
+
}
|
|
283
|
+
|
|
284
|
+
.sidebar-button:hover {
|
|
285
|
+
background: var(--bg-hover);
|
|
286
|
+
color: var(--text-primary);
|
|
287
|
+
}
|
|
288
|
+
|
|
289
|
+
.sidebar-button.active {
|
|
290
|
+
border-color: var(--accent-blue);
|
|
291
|
+
color: var(--accent-blue);
|
|
292
|
+
}
|
|
293
|
+
|
|
157
294
|
/* 消息列表 */
|
|
158
295
|
.message-list {
|
|
159
296
|
flex: 1;
|
|
@@ -1748,7 +1885,7 @@ html, body {
|
|
|
1748
1885
|
|
|
1749
1886
|
.prompt-input-inner {
|
|
1750
1887
|
display: flex;
|
|
1751
|
-
align-items:
|
|
1888
|
+
align-items: center;
|
|
1752
1889
|
gap: 8px;
|
|
1753
1890
|
}
|
|
1754
1891
|
|
|
@@ -1785,7 +1922,7 @@ html, body {
|
|
|
1785
1922
|
line-height: 1.5;
|
|
1786
1923
|
resize: none;
|
|
1787
1924
|
overflow: hidden;
|
|
1788
|
-
min-height:
|
|
1925
|
+
min-height: 72px;
|
|
1789
1926
|
max-height: 200px;
|
|
1790
1927
|
}
|
|
1791
1928
|
|
|
@@ -1806,44 +1943,78 @@ html, body {
|
|
|
1806
1943
|
|
|
1807
1944
|
.prompt-input-send {
|
|
1808
1945
|
flex-shrink: 0;
|
|
1946
|
+
display: inline-flex;
|
|
1947
|
+
align-items: center;
|
|
1948
|
+
justify-content: center;
|
|
1949
|
+
width: 32px;
|
|
1950
|
+
height: 32px;
|
|
1809
1951
|
background: transparent;
|
|
1810
|
-
border: 1px solid var(--
|
|
1811
|
-
|
|
1812
|
-
padding: 6px 14px;
|
|
1813
|
-
border-radius: 4px;
|
|
1952
|
+
border: 1px solid var(--accent-green);
|
|
1953
|
+
border-radius: 50%;
|
|
1814
1954
|
cursor: pointer;
|
|
1815
|
-
font-family: var(--font-mono);
|
|
1816
|
-
font-size: 12px;
|
|
1817
1955
|
transition: all 0.15s ease;
|
|
1818
1956
|
}
|
|
1819
1957
|
|
|
1820
1958
|
.prompt-input-send:hover:not(:disabled) {
|
|
1821
|
-
background:
|
|
1822
|
-
color: var(--text-primary);
|
|
1823
|
-
border-color: var(--accent-green);
|
|
1959
|
+
background: rgba(76, 175, 80, 0.15);
|
|
1824
1960
|
}
|
|
1825
1961
|
|
|
1826
1962
|
.prompt-input-send:disabled {
|
|
1827
1963
|
opacity: 0.5;
|
|
1828
1964
|
cursor: not-allowed;
|
|
1965
|
+
border-color: var(--border-color);
|
|
1966
|
+
}
|
|
1967
|
+
|
|
1968
|
+
.prompt-input-send:disabled .send-icon {
|
|
1969
|
+
background-color: var(--text-dimmed);
|
|
1970
|
+
}
|
|
1971
|
+
|
|
1972
|
+
.send-icon {
|
|
1973
|
+
display: inline-block;
|
|
1974
|
+
width: 18px;
|
|
1975
|
+
height: 18px;
|
|
1976
|
+
background-color: var(--accent-green);
|
|
1977
|
+
-webkit-mask-image: url('/send-icon.svg');
|
|
1978
|
+
mask-image: url('/send-icon.svg');
|
|
1979
|
+
-webkit-mask-size: contain;
|
|
1980
|
+
mask-size: contain;
|
|
1981
|
+
-webkit-mask-repeat: no-repeat;
|
|
1982
|
+
mask-repeat: no-repeat;
|
|
1983
|
+
-webkit-mask-position: center;
|
|
1984
|
+
mask-position: center;
|
|
1829
1985
|
}
|
|
1830
1986
|
|
|
1831
1987
|
.prompt-input-interrupt {
|
|
1832
1988
|
flex-shrink: 0;
|
|
1989
|
+
display: inline-flex;
|
|
1990
|
+
align-items: center;
|
|
1991
|
+
justify-content: center;
|
|
1992
|
+
width: 32px;
|
|
1993
|
+
height: 32px;
|
|
1833
1994
|
background: transparent;
|
|
1834
|
-
border: 1px solid var(--
|
|
1835
|
-
|
|
1836
|
-
padding: 6px 14px;
|
|
1837
|
-
border-radius: 4px;
|
|
1995
|
+
border: 1px solid var(--accent-red);
|
|
1996
|
+
border-radius: 50%;
|
|
1838
1997
|
cursor: pointer;
|
|
1839
|
-
font-family: var(--font-mono);
|
|
1840
|
-
font-size: 12px;
|
|
1841
1998
|
transition: all 0.15s ease;
|
|
1842
1999
|
}
|
|
1843
2000
|
|
|
1844
2001
|
.prompt-input-interrupt:hover {
|
|
1845
|
-
background: rgba(
|
|
1846
|
-
|
|
2002
|
+
background: rgba(244, 67, 54, 0.15);
|
|
2003
|
+
}
|
|
2004
|
+
|
|
2005
|
+
.interrupt-icon {
|
|
2006
|
+
display: inline-block;
|
|
2007
|
+
width: 18px;
|
|
2008
|
+
height: 18px;
|
|
2009
|
+
background-color: var(--accent-red);
|
|
2010
|
+
-webkit-mask-image: url('/interrupt-icon.svg');
|
|
2011
|
+
mask-image: url('/interrupt-icon.svg');
|
|
2012
|
+
-webkit-mask-size: contain;
|
|
2013
|
+
mask-size: contain;
|
|
2014
|
+
-webkit-mask-repeat: no-repeat;
|
|
2015
|
+
mask-repeat: no-repeat;
|
|
2016
|
+
-webkit-mask-position: center;
|
|
2017
|
+
mask-position: center;
|
|
1847
2018
|
}
|
|
1848
2019
|
|
|
1849
2020
|
.prompt-input-status {
|