freddie 0.0.62 → 0.0.64

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.
Files changed (6) hide show
  1. package/package.json +1 -1
  2. package/src/web/app.js +4 -15
  3. package/src/web/index.html +4 -158
  4. package/src/web/vendor/anentrypoint-design/dist/247420.app.js +2 -2
  5. package/src/web/vendor/anentrypoint-design/dist/247420.css +134 -0
  6. package/src/web/vendor/anentrypoint-design/dist/247420.js +64 -6
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "freddie",
3
- "version": "0.0.62",
3
+ "version": "0.0.64",
4
4
  "type": "module",
5
5
  "description": "Open JS agent harness built on pi-mono, floosie, xstate, and anentrypoint-design",
6
6
  "bin": {
package/src/web/app.js CHANGED
@@ -1,6 +1,8 @@
1
1
  import ds, { mount, installStyles, h, components, renderMarkdown, motion } from 'anentrypoint-design'
2
2
  const { AppShell, Topbar, Crumb, Side, Status, Panel, Row, Btn, Chip, Chat, ChatComposer, ChatMessage, AICat,
3
- Brand, EmptyState, RowLink, Receipt, Changelog, Hero, ConfirmDialog, Section, Install } = components
3
+ Brand, EmptyState, RowLink, Receipt, Changelog, Hero, ConfirmDialog, Section, Install, Kpi, Table } = components
4
+ const kpi = (items) => Kpi({ items })
5
+ const table = (headers, rows, opts = {}) => Table({ headers, rows, onRowClick: opts.onRowClick })
4
6
 
5
7
  await installStyles()
6
8
 
@@ -39,23 +41,10 @@ const AppState = {
39
41
  batch: { results: null, running: false },
40
42
  agents: { count: 0, active: null },
41
43
  }
42
- function applyTheme() { document.documentElement.setAttribute('data-theme', AppState.theme) }
44
+ function applyTheme() { document.body.setAttribute('data-theme', AppState.theme) }
43
45
  applyTheme()
44
46
  window.__debug.state = () => AppState
45
47
 
46
- function table(headers, rows, opts = {}) {
47
- if (!rows || rows.length === 0) return EmptyState({ text: 'no rows' })
48
- return h('table', {},
49
- h('thead', {}, h('tr', {}, ...headers.map(hd => h('th', {}, hd)))),
50
- h('tbody', {}, ...rows.map((row, i) => h('tr', {
51
- class: opts.onRowClick ? 'clickable' : '',
52
- onclick: opts.onRowClick ? () => opts.onRowClick(i) : null
53
- }, ...row.map(c => h('td', {}, c == null ? '' : String(c)))))))
54
- }
55
- function kpi(items) {
56
- return h('div', { class: 'kpi' }, ...items.map(([n, l]) =>
57
- h('div', { class: 'kpi-card' }, h('div', { class: 'num' }, String(n)), h('div', { class: 'lbl' }, l))))
58
- }
59
48
  function pre(obj) { return h('pre', {}, typeof obj === 'string' ? obj : JSON.stringify(obj, null, 2)) }
60
49
 
61
50
  function timeNow() {
package/src/web/index.html CHANGED
@@ -1,173 +1,19 @@
1
1
  <!doctype html>
2
- <html lang="en" class="ds-247420" data-theme="dark">
2
+ <html lang="en" class="ds-247420">
3
3
  <head>
4
4
  <meta charset="utf-8">
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1">
6
6
  <title>Freddie Dashboard</title>
7
- <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
8
- <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600&family=Archivo+Black&family=JetBrains+Mono:wght@400;500&display=swap">
9
7
  <script type="importmap">
10
8
  { "imports": { "anentrypoint-design": "/vendor/anentrypoint-design/247420.js" } }
11
9
  </script>
12
10
  <style>
13
- html, body {
14
- margin: 0; padding: 0; min-height: 100vh;
15
- }
16
-
17
- html[data-theme="light"] body { background: var(--paper, #F5F0E4); color: var(--ink, #1F1B16); }
18
- html[data-theme="dark"] body { background: var(--panel-0, #1A1B1E); color: var(--panel-text, #E8EAED); }
19
-
20
- html[data-theme="light"] .ds-247420 {
21
- --paper: #F5F0E4;
22
- --ink: #1F1B16;
23
- --panel-0: #F5F0E4;
24
- --panel-1: #FBF6EB;
25
- --panel-2: #F0E9DA;
26
- --panel-3: #E3DAC7;
27
- --panel-hover: #EBE1CD;
28
- --panel-select: #D8ECCB;
29
- --panel-text: #1F1B16;
30
- --panel-text-2: #6B6B6B;
31
- --panel-text-3: #8A8A8A;
32
- --panel-accent: #3A66FF;
33
- --panel-accent-2: #3A66FF;
34
- --panel-accent-fg: #FFFFFF;
35
- --green: #3F8A4A;
36
- --purple: #6B3A78;
37
- --mascot: #F07AA8;
38
- --sun: #FFD86B;
39
- --flame: #FF8454;
40
- --sky: #6FA9FF;
41
- --live: #2BB07F;
42
- --warn: #FF6B4A;
43
- --link: #3A66FF;
44
- }
45
-
46
- html[data-theme="dark"] .ds-247420 {
47
- --paper: #2D2E30;
48
- --ink: #E8EAED;
49
- --panel-0: #1A1B1E;
50
- --panel-1: #24252A;
51
- --panel-2: #2D2E30;
52
- --panel-3: #36383E;
53
- --panel-hover: #3D3F45;
54
- --panel-select: #1F3A2F;
55
- --panel-text: #E8EAED;
56
- --panel-text-2: #A0A0A0;
57
- --panel-text-3: #7D7D7D;
58
- --panel-accent: #8AB4F8;
59
- --panel-accent-2: #8AB4F8;
60
- --panel-accent-fg: #1A1B1E;
61
- --green: #5CB85C;
62
- --purple: #BA68C8;
63
- --mascot: #F48FB1;
64
- --sun: #FFD68A;
65
- --flame: #FF9B6B;
66
- --sky: #90CAF9;
67
- --live: #4CAF50;
68
- --warn: #FF7043;
69
- --link: #90CAF9;
70
- }
71
-
72
- .ds-247420, .ds-247420 * {
73
- font-family: Nunito, -apple-system, system-ui, sans-serif;
74
- box-sizing: border-box;
75
- }
76
- .ds-247420 h1, .ds-247420 h2, .ds-247420 h3, .ds-247420 h4, .ds-247420 h5, .ds-247420 h6 {
77
- font-family: 'Archivo Black', sans-serif;
78
- }
79
- .ds-247420 code, .ds-247420 pre, .ds-247420 .code, .ds-247420 .meta, .ds-247420 .cli,
80
- .ds-247420 [class*="mono"], .ds-247420 kbd {
81
- font-family: 'JetBrains Mono', ui-monospace, monospace;
82
- }
83
-
84
- .ds-247420 .panel { border-radius: 20px; }
85
- .ds-247420 .app-side a.active {
86
- background: var(--panel-select);
87
- color: var(--panel-text);
88
- font-weight: 600;
89
- }
90
-
91
- .ds-247420 .app-status {
92
- background: var(--panel-0);
93
- color: var(--panel-text-2);
94
- padding: 6px 16px;
95
- border-top: none;
96
- height: auto;
97
- }
98
-
99
- .ds-247420 input, .ds-247420 textarea, .ds-247420 select {
100
- background: var(--panel-1);
101
- color: var(--panel-text);
102
- border: none;
103
- border-radius: 10px;
104
- padding: 8px 12px;
105
- font-size: 14px;
106
- outline: none;
107
- font-family: inherit;
108
- }
109
- .ds-247420 input:focus, .ds-247420 textarea:focus {
110
- background: var(--panel-2);
111
- box-shadow: inset 0 0 0 2px var(--panel-accent-2);
112
- }
113
-
114
- .ds-247420 button {
115
- font-family: inherit;
116
- cursor: pointer;
117
- border-radius: 10px;
118
- font-weight: 600;
119
- border: none;
120
- padding: 8px 16px;
121
- }
122
- .ds-247420 button.primary {
123
- background: var(--panel-accent-2);
124
- color: var(--panel-accent-fg);
125
- }
126
- .ds-247420 button.danger {
127
- background: var(--warn);
128
- color: white;
129
- }
130
- .ds-247420 button.ghost {
131
- background: transparent;
132
- color: var(--panel-text);
133
- border: 1px solid var(--panel-2);
134
- }
135
- .ds-247420 button:hover {
136
- background: var(--panel-hover);
137
- }
138
-
139
- .ds-247420 table { width: 100%; border-collapse: collapse; }
140
- .ds-247420 th, .ds-247420 td { text-align: left; padding: 8px 14px; border-bottom: 1px solid var(--panel-2); font-size: 13px; }
141
- .ds-247420 th { color: var(--panel-text-2); font-weight: 600; background: var(--panel-1); }
142
- .ds-247420 tr.clickable { cursor: pointer; }
143
- .ds-247420 tr.clickable:hover td { background: var(--panel-hover); }
144
-
145
- .ds-247420 .kpi { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1px; background: var(--panel-2); padding: 1px; border-radius: 20px; overflow: hidden; }
146
- .ds-247420 .kpi-card { background: var(--panel-1); padding: 14px 18px; }
147
- .ds-247420 .kpi-card .num { font-size: 1.75rem; color: var(--panel-text); font-weight: 400; font-family: 'JetBrains Mono', monospace; }
148
- .ds-247420 .kpi-card .lbl { font-size: 0.75rem; color: var(--panel-text-2); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; margin-top: 2px; }
149
-
150
- .ds-247420 .row-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
151
- .ds-247420 .row-form input { flex: 1; min-width: 140px; padding: 10px 12px !important; }
152
-
153
- .ds-247420 .chat { display: flex; flex-direction: column; height: 100%; min-height: 0; box-sizing: border-box; }
154
- .ds-247420 .chat .chat-thread { flex: 1 1 0; min-height: 0; overflow-y: auto; }
155
- .ds-247420 .chat .chat-composer { flex: 0 0 auto; padding-top: 12px; border-top: 1px solid var(--panel-2); box-sizing: border-box; }
156
- .ds-247420 .chat .chat-composer textarea,
157
- .ds-247420 .chat .chat-composer input { box-sizing: border-box; width: 100%; max-width: 100%; }
158
-
159
- .ds-247420 .chip { border-radius: 6px; padding: 4px 10px; font-size: 12px; font-weight: 600; display: inline-block; }
160
- .ds-247420 .chip.ok { background: var(--green); color: white; }
161
- .ds-247420 .chip.miss { background: var(--warn); color: white; }
162
-
163
- .ds-247420 .empty { color: var(--panel-text-3); padding: 12px 0; }
164
- .ds-247420 a { color: var(--link); text-decoration: none; }
165
- .ds-247420 a:hover { text-decoration: underline; }
166
-
11
+ /* Freddie-only overrides — all generic primitives ship via SDK installStyles() */
12
+ html, body { margin: 0; padding: 0; min-height: 100vh; }
167
13
  #app { padding: 16px 20px; box-sizing: border-box; }
168
14
  </style>
169
15
  </head>
170
- <body>
16
+ <body data-theme="dark">
171
17
  <div id="app"></div>
172
18
  <script type="module" src="./app.js"></script>
173
19
  </body>