@vitronai/alethia 0.8.1 → 0.8.2
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/README.md +4 -3
- package/demo/admin-panel.html +326 -36
- package/demo/agent-oversight.html +354 -49
- package/demo/claude-code-app.html +688 -94
- package/demo/crypto-readiness.html +611 -177
- package/demo/ea1-stress-test.html +262 -34
- package/demo/ecommerce.html +1116 -0
- package/demo/financial-dashboard.html +298 -34
- package/demo/incident-response.html +636 -196
- package/demo/intentional-failures.html +157 -0
- package/demo/nist-compliance.html +458 -102
- package/demo/threat-intel.html +310 -51
- package/demo/wcag-audit.html +495 -84
- package/dist/index.js +27 -0
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/demo/threat-intel.html
CHANGED
|
@@ -5,63 +5,322 @@
|
|
|
5
5
|
<title>Threat Intelligence Platform</title>
|
|
6
6
|
<style>
|
|
7
7
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
8
|
+
:root {
|
|
9
|
+
--bg: #08070a;
|
|
10
|
+
--bg-1: #14110a;
|
|
11
|
+
--bg-2: #1c1810;
|
|
12
|
+
--edge: rgba(255,255,255,.07);
|
|
13
|
+
--edge-strong: rgba(255,255,255,.12);
|
|
14
|
+
--ink: #f5f1e8;
|
|
15
|
+
--ink-2: #d6d3d1;
|
|
16
|
+
--ink-muted: #a8a29e;
|
|
17
|
+
--ink-faint: #78716c;
|
|
18
|
+
--amber: #f59e0b;
|
|
19
|
+
--amber-bright: #fbbf24;
|
|
20
|
+
--orange: #fb923c;
|
|
21
|
+
--red: #ef4444;
|
|
22
|
+
--red-bright: #f87171;
|
|
23
|
+
--yellow: #eab308;
|
|
24
|
+
--teal: #14b8a6;
|
|
25
|
+
--teal-bright: #5eead4;
|
|
26
|
+
--emerald: #10b981;
|
|
27
|
+
--emerald-bright: #34d399;
|
|
28
|
+
}
|
|
29
|
+
html { color-scheme: dark; }
|
|
30
|
+
body {
|
|
31
|
+
font-family: "SF Pro Display", -apple-system, system-ui, sans-serif;
|
|
32
|
+
background:
|
|
33
|
+
radial-gradient(ellipse 70% 40% at 12% -10%, rgba(245,158,11,.07), transparent 70%),
|
|
34
|
+
radial-gradient(ellipse 60% 40% at 88% 110%, rgba(239,68,68,.06), transparent 70%),
|
|
35
|
+
var(--bg);
|
|
36
|
+
color: var(--ink-2);
|
|
37
|
+
min-height: 100vh;
|
|
38
|
+
padding: 1.4rem 1.6rem 2rem;
|
|
39
|
+
font-size: 13.5px;
|
|
40
|
+
line-height: 1.5;
|
|
41
|
+
-webkit-font-smoothing: antialiased;
|
|
42
|
+
}
|
|
43
|
+
code, .mono, .ioc-value, .feed-ts, .actor-alias, .ttp-tag {
|
|
44
|
+
font-family: ui-monospace, "SF Mono", "Fira Code", monospace;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
/* Header */
|
|
48
|
+
.header {
|
|
49
|
+
display: flex; justify-content: space-between; align-items: center;
|
|
50
|
+
padding-bottom: 14px; margin-bottom: 18px;
|
|
51
|
+
border-bottom: 1px solid var(--edge);
|
|
52
|
+
}
|
|
53
|
+
.header-left { display: flex; flex-direction: column; gap: 4px; }
|
|
54
|
+
h1 {
|
|
55
|
+
font-size: 17px; font-weight: 700; color: var(--ink);
|
|
56
|
+
letter-spacing: -.012em;
|
|
57
|
+
display: inline-flex; align-items: center; gap: 8px;
|
|
58
|
+
}
|
|
59
|
+
h1::before {
|
|
60
|
+
content: ""; display: inline-block;
|
|
61
|
+
width: 8px; height: 8px; border-radius: 999px;
|
|
62
|
+
background: var(--amber);
|
|
63
|
+
box-shadow: 0 0 10px rgba(245,158,11,.65);
|
|
64
|
+
}
|
|
65
|
+
.header-meta { color: var(--ink-faint); font-size: 12px; font-family: ui-monospace, "SF Mono", monospace; }
|
|
66
|
+
.header-meta strong { color: var(--ink-muted); }
|
|
67
|
+
.classification {
|
|
68
|
+
font-family: ui-monospace, "SF Mono", monospace;
|
|
69
|
+
background: linear-gradient(135deg, rgba(127,29,29,.85), rgba(127,29,29,.6));
|
|
70
|
+
color: #fecaca;
|
|
71
|
+
padding: 4px 10px;
|
|
72
|
+
border-radius: 4px;
|
|
73
|
+
font-size: 10.5px;
|
|
74
|
+
font-weight: 800;
|
|
75
|
+
letter-spacing: .1em;
|
|
76
|
+
border: 1px solid rgba(252,165,165,.3);
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
/* Threat-level alert */
|
|
80
|
+
.threat-level {
|
|
81
|
+
display: flex; gap: 14px; align-items: center;
|
|
82
|
+
margin-bottom: 18px;
|
|
83
|
+
padding: 12px 18px;
|
|
84
|
+
border-radius: 10px;
|
|
85
|
+
background:
|
|
86
|
+
linear-gradient(135deg, rgba(239,68,68,.14), rgba(239,68,68,.04)),
|
|
87
|
+
linear-gradient(180deg, rgba(0,0,0,.3), rgba(0,0,0,.1));
|
|
88
|
+
border: 1px solid rgba(239,68,68,.35);
|
|
89
|
+
box-shadow: inset 0 0 24px rgba(239,68,68,.08);
|
|
90
|
+
position: relative;
|
|
91
|
+
overflow: hidden;
|
|
92
|
+
}
|
|
93
|
+
.threat-level::before {
|
|
94
|
+
content: ""; position: absolute; left: 0; top: 0; bottom: 0;
|
|
95
|
+
width: 3px; background: var(--red);
|
|
96
|
+
box-shadow: 0 0 12px rgba(239,68,68,.6);
|
|
97
|
+
}
|
|
98
|
+
.threat-level-label {
|
|
99
|
+
color: var(--red-bright); font-weight: 700;
|
|
100
|
+
font-size: 13px; letter-spacing: .04em;
|
|
101
|
+
animation: pulse 1.6s ease-in-out infinite;
|
|
102
|
+
font-family: ui-monospace, "SF Mono", monospace;
|
|
103
|
+
}
|
|
14
104
|
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
|
|
15
|
-
.threat-level-detail { color:
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
.
|
|
105
|
+
.threat-level-detail { color: var(--ink-2); font-size: 12.5px; }
|
|
106
|
+
|
|
107
|
+
/* Layout */
|
|
108
|
+
.grid {
|
|
109
|
+
display: grid;
|
|
110
|
+
grid-template-columns: 1fr 1fr;
|
|
111
|
+
gap: 14px;
|
|
112
|
+
}
|
|
19
113
|
.full-width { grid-column: 1 / -1; }
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
.
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
.
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
114
|
+
|
|
115
|
+
/* Panel */
|
|
116
|
+
.panel {
|
|
117
|
+
background: linear-gradient(180deg, var(--bg-1) 0%, rgba(20,17,10,.5) 100%);
|
|
118
|
+
border: 1px solid var(--edge);
|
|
119
|
+
border-radius: 12px;
|
|
120
|
+
padding: 16px 18px;
|
|
121
|
+
box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
|
|
122
|
+
}
|
|
123
|
+
.panel h2 {
|
|
124
|
+
font-size: 11px; font-weight: 700;
|
|
125
|
+
color: var(--amber);
|
|
126
|
+
margin-bottom: 14px;
|
|
127
|
+
text-transform: uppercase; letter-spacing: .12em;
|
|
128
|
+
display: inline-flex; align-items: center; gap: 6px;
|
|
129
|
+
}
|
|
130
|
+
.panel h2::before {
|
|
131
|
+
content: ""; width: 4px; height: 4px; border-radius: 999px;
|
|
132
|
+
background: var(--amber); box-shadow: 0 0 6px var(--amber);
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
/* Table */
|
|
136
|
+
table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
|
|
137
|
+
th {
|
|
138
|
+
text-align: left;
|
|
139
|
+
padding: 8px 10px;
|
|
140
|
+
color: var(--ink-faint);
|
|
141
|
+
border-bottom: 1px solid var(--edge);
|
|
142
|
+
font-weight: 600; font-size: 10px;
|
|
143
|
+
text-transform: uppercase; letter-spacing: .08em;
|
|
144
|
+
}
|
|
145
|
+
td { padding: 9px 10px; border-bottom: 1px solid rgba(255,255,255,.035); vertical-align: middle; }
|
|
146
|
+
tbody tr { transition: background .12s; }
|
|
147
|
+
tbody tr:hover { background: rgba(245,158,11,.04); }
|
|
148
|
+
tbody tr:last-child td { border-bottom: none; }
|
|
149
|
+
|
|
150
|
+
/* Severity / confidence pills */
|
|
151
|
+
.severity-critical, .severity-high, .severity-medium, .severity-low,
|
|
152
|
+
.confidence-high, .confidence-med, .confidence-low {
|
|
153
|
+
display: inline-block;
|
|
154
|
+
padding: 2px 8px;
|
|
155
|
+
border-radius: 4px;
|
|
156
|
+
font-weight: 600; font-size: 11px;
|
|
157
|
+
font-family: ui-monospace, "SF Mono", monospace;
|
|
158
|
+
letter-spacing: .02em;
|
|
159
|
+
}
|
|
160
|
+
.severity-critical {
|
|
161
|
+
color: var(--red-bright);
|
|
162
|
+
background: rgba(239,68,68,.12);
|
|
163
|
+
border: 1px solid rgba(239,68,68,.3);
|
|
164
|
+
font-weight: 700;
|
|
165
|
+
}
|
|
166
|
+
.severity-high {
|
|
167
|
+
color: var(--orange);
|
|
168
|
+
background: rgba(251,146,60,.10);
|
|
169
|
+
border: 1px solid rgba(251,146,60,.3);
|
|
170
|
+
}
|
|
171
|
+
.severity-medium {
|
|
172
|
+
color: var(--yellow);
|
|
173
|
+
background: rgba(234,179,8,.10);
|
|
174
|
+
border: 1px solid rgba(234,179,8,.3);
|
|
175
|
+
}
|
|
176
|
+
.severity-low {
|
|
177
|
+
color: var(--teal);
|
|
178
|
+
background: rgba(20,184,166,.10);
|
|
179
|
+
border: 1px solid rgba(20,184,166,.3);
|
|
180
|
+
}
|
|
181
|
+
.confidence-high { color: var(--emerald-bright); background: rgba(16,185,129,.10); border: 1px solid rgba(16,185,129,.3); }
|
|
182
|
+
.confidence-med { color: var(--yellow); background: rgba(234,179,8,.10); border: 1px solid rgba(234,179,8,.3); }
|
|
183
|
+
.confidence-low { color: var(--orange); background: rgba(251,146,60,.10); border: 1px solid rgba(251,146,60,.3); }
|
|
184
|
+
|
|
185
|
+
/* Buttons */
|
|
186
|
+
button {
|
|
187
|
+
padding: 5px 10px;
|
|
188
|
+
border-radius: 6px;
|
|
189
|
+
border: 1px solid var(--edge);
|
|
190
|
+
background: rgba(255,255,255,.02);
|
|
191
|
+
color: var(--amber);
|
|
192
|
+
cursor: pointer;
|
|
193
|
+
font: inherit;
|
|
194
|
+
font-size: 11px;
|
|
195
|
+
font-weight: 600;
|
|
196
|
+
transition: background .12s, border-color .12s, color .12s, transform .08s;
|
|
197
|
+
}
|
|
198
|
+
button:hover { background: rgba(255,255,255,.05); border-color: var(--edge-strong); }
|
|
199
|
+
button:active { transform: translateY(1px); }
|
|
200
|
+
button:disabled { opacity: .6; cursor: not-allowed; }
|
|
201
|
+
.btn-block { border-color: rgba(239,68,68,.45); color: var(--red-bright); }
|
|
202
|
+
.btn-block:hover { background: rgba(239,68,68,.10); border-color: var(--red); }
|
|
203
|
+
.btn-investigate { border-color: rgba(20,184,166,.45); color: var(--teal-bright); }
|
|
204
|
+
.btn-investigate:hover { background: rgba(20,184,166,.10); border-color: var(--teal); }
|
|
205
|
+
.btn-share { border-color: rgba(16,185,129,.45); color: var(--emerald-bright); }
|
|
206
|
+
.btn-share:hover { background: rgba(16,185,129,.10); border-color: var(--emerald); }
|
|
207
|
+
.btn-classify { border-color: rgba(234,179,8,.45); color: var(--yellow); }
|
|
208
|
+
.btn-classify:hover { background: rgba(234,179,8,.10); border-color: var(--yellow); }
|
|
209
|
+
.actions { display: flex; gap: 6px; }
|
|
210
|
+
|
|
211
|
+
/* Actor card */
|
|
212
|
+
.actor-card {
|
|
213
|
+
position: relative;
|
|
214
|
+
background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
|
|
215
|
+
border: 1px solid var(--edge);
|
|
216
|
+
border-radius: 10px;
|
|
217
|
+
padding: 12px 14px 12px 18px;
|
|
218
|
+
margin-bottom: 10px;
|
|
219
|
+
transition: border-color .15s, transform .15s;
|
|
220
|
+
}
|
|
221
|
+
.actor-card::before {
|
|
222
|
+
content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 2px;
|
|
223
|
+
border-radius: 0 2px 2px 0;
|
|
224
|
+
background: var(--orange);
|
|
225
|
+
opacity: .9;
|
|
226
|
+
}
|
|
227
|
+
.actor-card:last-child { margin-bottom: 0; }
|
|
228
|
+
.actor-card:hover { border-color: var(--edge-strong); }
|
|
229
|
+
.actor-card.critical::before { background: var(--red); box-shadow: 0 0 10px rgba(239,68,68,.5); }
|
|
230
|
+
.actor-card.monitoring::before { background: var(--orange); }
|
|
231
|
+
.actor-name { color: var(--ink); font-weight: 700; font-size: 13px; letter-spacing: .02em; }
|
|
232
|
+
.actor-alias { color: var(--ink-faint); font-size: 11px; margin-left: 6px; }
|
|
233
|
+
.actor-detail { color: var(--ink-2); font-size: 12px; margin-top: 6px; line-height: 1.55; }
|
|
234
|
+
.ttps { list-style: none; display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
|
|
235
|
+
.ttp-tag {
|
|
236
|
+
padding: 2px 7px;
|
|
237
|
+
border-radius: 4px;
|
|
238
|
+
background: rgba(234,179,8,.08);
|
|
239
|
+
border: 1px solid rgba(234,179,8,.3);
|
|
240
|
+
color: var(--yellow);
|
|
241
|
+
font-size: 10.5px;
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
/* Feed */
|
|
245
|
+
.feed-item {
|
|
246
|
+
padding: 8px 0;
|
|
247
|
+
border-bottom: 1px solid rgba(255,255,255,.04);
|
|
248
|
+
font-size: 12.5px;
|
|
249
|
+
display: flex; gap: 12px;
|
|
250
|
+
align-items: baseline;
|
|
251
|
+
}
|
|
252
|
+
.feed-item:last-child { border-bottom: none; }
|
|
253
|
+
.feed-ts { color: var(--ink-faint); min-width: 78px; font-size: 11.5px; }
|
|
254
|
+
.feed-source {
|
|
255
|
+
min-width: 64px;
|
|
256
|
+
color: var(--amber);
|
|
257
|
+
font-weight: 700;
|
|
258
|
+
font-size: 11px;
|
|
259
|
+
letter-spacing: .03em;
|
|
260
|
+
}
|
|
261
|
+
|
|
262
|
+
/* IOC grid */
|
|
263
|
+
.ioc-grid {
|
|
264
|
+
display: grid;
|
|
265
|
+
grid-template-columns: repeat(2, 1fr);
|
|
266
|
+
gap: 8px;
|
|
267
|
+
}
|
|
268
|
+
.ioc-card {
|
|
269
|
+
background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
|
|
270
|
+
border: 1px solid var(--edge);
|
|
271
|
+
border-radius: 8px;
|
|
272
|
+
padding: 10px 12px;
|
|
273
|
+
transition: border-color .15s, transform .15s;
|
|
274
|
+
}
|
|
275
|
+
.ioc-card:hover { border-color: rgba(245,158,11,.4); }
|
|
276
|
+
.ioc-type {
|
|
277
|
+
color: var(--ink-faint);
|
|
278
|
+
font-size: 9.5px;
|
|
279
|
+
text-transform: uppercase; letter-spacing: .12em;
|
|
280
|
+
font-weight: 700;
|
|
281
|
+
}
|
|
282
|
+
.ioc-value { color: var(--orange); font-size: 12.5px; margin-top: 4px; word-break: break-all; }
|
|
283
|
+
.ioc-context { color: var(--ink-muted); font-size: 11px; margin-top: 4px; }
|
|
284
|
+
|
|
285
|
+
/* Modal */
|
|
286
|
+
.modal {
|
|
287
|
+
display: none; position: fixed; inset: 0;
|
|
288
|
+
background: rgba(8,7,10,.85);
|
|
289
|
+
backdrop-filter: blur(8px);
|
|
290
|
+
z-index: 100;
|
|
291
|
+
align-items: center; justify-content: center;
|
|
292
|
+
}
|
|
51
293
|
.modal.visible { display: flex; }
|
|
52
|
-
.modal-content {
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
294
|
+
.modal-content {
|
|
295
|
+
background: linear-gradient(180deg, var(--bg-2), var(--bg-1));
|
|
296
|
+
border: 1px solid rgba(239,68,68,.45);
|
|
297
|
+
border-radius: 12px;
|
|
298
|
+
padding: 22px 24px;
|
|
299
|
+
max-width: 480px;
|
|
300
|
+
box-shadow: 0 20px 60px rgba(0,0,0,.5);
|
|
301
|
+
}
|
|
302
|
+
.modal-content h3 { color: var(--red-bright); margin-bottom: 8px; font-size: 15px; }
|
|
303
|
+
.modal-content p { color: var(--ink-2); margin-bottom: 16px; line-height: 1.6; font-size: 13px; }
|
|
304
|
+
.modal-actions { display: flex; gap: 8px; justify-content: flex-end; }
|
|
305
|
+
|
|
306
|
+
/* Response banner */
|
|
307
|
+
.response-banner {
|
|
308
|
+
display: none;
|
|
309
|
+
padding: 10px 16px;
|
|
310
|
+
border-radius: 8px;
|
|
311
|
+
margin-bottom: 14px;
|
|
312
|
+
font-weight: 600;
|
|
313
|
+
font-size: 12.5px;
|
|
314
|
+
border: 1px solid transparent;
|
|
315
|
+
}
|
|
57
316
|
.response-banner.visible { display: block; }
|
|
58
317
|
</style>
|
|
59
318
|
</head>
|
|
60
319
|
<body>
|
|
61
320
|
<div class="header">
|
|
62
|
-
<div>
|
|
321
|
+
<div class="header-left">
|
|
63
322
|
<h1>Threat Intelligence Platform</h1>
|
|
64
|
-
<span
|
|
323
|
+
<span class="header-meta">Analyst: <strong>intel-analyst-2</strong> · Feed sources: <strong>14 active</strong> · Last sync: <strong>32s ago</strong></span>
|
|
65
324
|
</div>
|
|
66
325
|
<span class="classification">SECRET // NOFORN</span>
|
|
67
326
|
</div>
|
|
@@ -76,7 +335,7 @@
|
|
|
76
335
|
<div class="grid">
|
|
77
336
|
<div class="panel">
|
|
78
337
|
<h2>Active Threat Actors</h2>
|
|
79
|
-
<div class="actor-card">
|
|
338
|
+
<div class="actor-card critical">
|
|
80
339
|
<div style="display:flex;justify-content:space-between;align-items:center">
|
|
81
340
|
<div>
|
|
82
341
|
<span class="actor-name">VOLT TYPHOON</span>
|
|
@@ -96,7 +355,7 @@
|
|
|
96
355
|
<li class="ttp-tag">T1071.001 Web Protocols</li>
|
|
97
356
|
</ul>
|
|
98
357
|
</div>
|
|
99
|
-
<div class="actor-card">
|
|
358
|
+
<div class="actor-card monitoring">
|
|
100
359
|
<div style="display:flex;justify-content:space-between;align-items:center">
|
|
101
360
|
<div>
|
|
102
361
|
<span class="actor-name">SANDWORM</span>
|
|
@@ -230,7 +489,7 @@
|
|
|
230
489
|
<h3>Confirm IOC Blocking</h3>
|
|
231
490
|
<p id="block-modal-text">This will push blocking rules to all perimeter firewalls, DNS resolvers, and email gateways. Affected systems: 847 endpoints across 12 sites. This action requires CISO approval and is logged in the compliance audit trail.</p>
|
|
232
491
|
<div class="modal-actions">
|
|
233
|
-
<button id="cancel-block" style="background:#111d30;color:#7eb8da;border-color:#
|
|
492
|
+
<button id="cancel-block" style="background:#111d30;color:#7eb8da;border-color:#3a2814">Cancel</button>
|
|
234
493
|
<button class="btn-block" id="confirm-block" style="font-weight:700">Block at Perimeter</button>
|
|
235
494
|
</div>
|
|
236
495
|
</div>
|