lobsterboard 0.3.3 → 0.4.1
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 +24 -9
- package/app.html +53 -2
- package/css/themes.css +64 -0
- package/dist/lobsterboard.css +1 -1
- package/dist/lobsterboard.esm.js +1 -1
- package/dist/lobsterboard.esm.min.js +1 -1
- package/dist/lobsterboard.umd.js +1 -1
- package/dist/lobsterboard.umd.min.js +1 -1
- package/js/widgets.js +539 -6
- package/package.json +1 -1
- package/server.cjs +1248 -28
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# 🦞 LobsterBoard
|
|
2
2
|
|
|
3
|
-
A self-hosted, drag-and-drop dashboard builder with
|
|
3
|
+
A self-hosted, drag-and-drop dashboard builder with 60+ widgets, a template gallery, custom pages, and zero cloud dependencies. One Node.js server, no frameworks, no build step needed.
|
|
4
4
|
|
|
5
5
|
**Works standalone or with [OpenClaw](https://github.com/openclaw/openclaw).** LobsterBoard is a general-purpose dashboard — use it to monitor your homelab, track stocks, display weather, manage todos, or anything else. OpenClaw users get bonus widgets (auth status, cron jobs, activity logs), but they're completely optional.
|
|
6
6
|
|
|
@@ -32,7 +32,7 @@ Open **http://localhost:8080** → press **Ctrl+E** to enter edit mode → drag
|
|
|
32
32
|
## Features
|
|
33
33
|
|
|
34
34
|
- **Drag-and-drop editor** — visual layout with 20px snap grid, resize handles, property panel
|
|
35
|
-
- **
|
|
35
|
+
- **60+ widgets** — system monitoring, weather, calendars, RSS, smart home, finance, AI/LLM tracking, notes, and more
|
|
36
36
|
- **Template Gallery** — export, import, and share dashboard layouts with auto-screenshot previews; import as merge or full replace
|
|
37
37
|
- **Custom pages** — extend your dashboard with full custom pages (notes, kanban boards, anything)
|
|
38
38
|
- **Canvas sizes** — preset resolutions (1920×1080, 2560×1440, etc.) or custom sizes
|
|
@@ -121,13 +121,28 @@ LobsterBoard includes a built-in template system for sharing and reusing dashboa
|
|
|
121
121
|
| Quick Links | Bookmark grid |
|
|
122
122
|
|
|
123
123
|
### 🤖 AI / LLM Monitoring
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
|
128
|
-
|
|
129
|
-
|
|
|
130
|
-
|
|
|
124
|
+
|
|
125
|
+
Track your AI coding subscriptions in real-time. Inspired by [OpenUsage](https://github.com/robinebers/openusage) by Robin Ebers.
|
|
126
|
+
|
|
127
|
+
| Widget | Description | Setup |
|
|
128
|
+
|--------|-------------|-------|
|
|
129
|
+
| AI Usage | Combined view of all providers | — |
|
|
130
|
+
| Claude Code | Session, weekly, Opus limits | Run `claude` once |
|
|
131
|
+
| Codex CLI | Session, weekly, code reviews | Run `codex` once |
|
|
132
|
+
| GitHub Copilot | Premium, chat, completions | Run `gh auth login` |
|
|
133
|
+
| Cursor | Credits, usage breakdown | Just use Cursor IDE |
|
|
134
|
+
| Gemini CLI | Pro, flash models | Run `gemini` once |
|
|
135
|
+
| Amp | Free tier, credits | Run `amp` once |
|
|
136
|
+
| Factory / Droid | Standard, premium tokens | Run `factory` once |
|
|
137
|
+
| Kimi Code | Session, weekly | Run `kimi` once |
|
|
138
|
+
| JetBrains AI | Quota tracking | Sign in via IDE |
|
|
139
|
+
| Antigravity | Gemini 3, Claude via Google | Run `antigravity-usage login` |
|
|
140
|
+
| MiniMax | Coding plan session | Set `MINIMAX_API_KEY` |
|
|
141
|
+
| Z.ai | Session, weekly | Set `ZAI_API_KEY` |
|
|
142
|
+
| AI Cost Tracker | Monthly cost breakdown | — |
|
|
143
|
+
| API Status | Provider availability | — |
|
|
144
|
+
| Active Sessions | OpenClaw session monitor | — |
|
|
145
|
+
| Token Gauge | Context window usage | — |
|
|
131
146
|
|
|
132
147
|
### 💰 Finance
|
|
133
148
|
| Widget | Description |
|
package/app.html
CHANGED
|
@@ -223,9 +223,60 @@
|
|
|
223
223
|
<div class="widget-section">
|
|
224
224
|
<h4>🤖 AI / LLM</h4>
|
|
225
225
|
<div class="widget-list">
|
|
226
|
-
<div class="widget-item" draggable="true" data-widget="ai-usage
|
|
226
|
+
<div class="widget-item" draggable="true" data-widget="ai-usage">
|
|
227
|
+
<span class="widget-icon">🤖</span>
|
|
228
|
+
<span class="widget-name">AI Usage</span>
|
|
229
|
+
<span class="widget-verified" title="Tested & Verified">✓</span>
|
|
230
|
+
</div>
|
|
231
|
+
<div class="widget-item" draggable="true" data-widget="claude-code">
|
|
227
232
|
<span class="widget-icon">🟣</span>
|
|
228
|
-
<span class="widget-name">Claude
|
|
233
|
+
<span class="widget-name">Claude Code</span>
|
|
234
|
+
<span class="widget-verified" title="Tested & Verified">✓</span>
|
|
235
|
+
</div>
|
|
236
|
+
<div class="widget-item" draggable="true" data-widget="codex-cli">
|
|
237
|
+
<span class="widget-icon">🟢</span>
|
|
238
|
+
<span class="widget-name">Codex CLI</span>
|
|
239
|
+
<span class="widget-verified" title="Tested & Verified">✓</span>
|
|
240
|
+
</div>
|
|
241
|
+
<div class="widget-item" draggable="true" data-widget="github-copilot">
|
|
242
|
+
<span class="widget-icon">⚫</span>
|
|
243
|
+
<span class="widget-name">GitHub Copilot</span>
|
|
244
|
+
</div>
|
|
245
|
+
<div class="widget-item" draggable="true" data-widget="cursor">
|
|
246
|
+
<span class="widget-icon">🔵</span>
|
|
247
|
+
<span class="widget-name">Cursor</span>
|
|
248
|
+
</div>
|
|
249
|
+
<div class="widget-item" draggable="true" data-widget="gemini-cli">
|
|
250
|
+
<span class="widget-icon">🔷</span>
|
|
251
|
+
<span class="widget-name">Gemini CLI</span>
|
|
252
|
+
</div>
|
|
253
|
+
<div class="widget-item" draggable="true" data-widget="amp-code">
|
|
254
|
+
<span class="widget-icon">⚡</span>
|
|
255
|
+
<span class="widget-name">Amp Code</span>
|
|
256
|
+
</div>
|
|
257
|
+
<div class="widget-item" draggable="true" data-widget="factory">
|
|
258
|
+
<span class="widget-icon">🏭</span>
|
|
259
|
+
<span class="widget-name">Factory</span>
|
|
260
|
+
</div>
|
|
261
|
+
<div class="widget-item" draggable="true" data-widget="kimi-code">
|
|
262
|
+
<span class="widget-icon">🌙</span>
|
|
263
|
+
<span class="widget-name">Kimi Code</span>
|
|
264
|
+
</div>
|
|
265
|
+
<div class="widget-item" draggable="true" data-widget="jetbrains-ai">
|
|
266
|
+
<span class="widget-icon">🧠</span>
|
|
267
|
+
<span class="widget-name">JetBrains AI</span>
|
|
268
|
+
</div>
|
|
269
|
+
<div class="widget-item" draggable="true" data-widget="minimax">
|
|
270
|
+
<span class="widget-icon">🔶</span>
|
|
271
|
+
<span class="widget-name">MiniMax</span>
|
|
272
|
+
</div>
|
|
273
|
+
<div class="widget-item" draggable="true" data-widget="zai">
|
|
274
|
+
<span class="widget-icon">🇿</span>
|
|
275
|
+
<span class="widget-name">Z.ai</span>
|
|
276
|
+
</div>
|
|
277
|
+
<div class="widget-item" draggable="true" data-widget="antigravity-local">
|
|
278
|
+
<span class="widget-icon">🪐</span>
|
|
279
|
+
<span class="widget-name">Antigravity</span>
|
|
229
280
|
</div>
|
|
230
281
|
<div class="widget-item" draggable="true" data-widget="ai-cost-tracker">
|
|
231
282
|
<span class="widget-icon">💰</span>
|
package/css/themes.css
CHANGED
|
@@ -740,12 +740,27 @@ body.theme-paper {
|
|
|
740
740
|
.theme-terminal .lb-icon[data-icon="pages"]::after { content: "\eb03"; } /* files */
|
|
741
741
|
|
|
742
742
|
/* AI / Monitoring icons */
|
|
743
|
+
.theme-terminal .lb-icon[data-icon="ai-usage"]::after { content: "\ecc6"; } /* robot */
|
|
743
744
|
.theme-terminal .lb-icon[data-icon="ai-claude"]::after { content: "\ea38"; } /* circle */
|
|
744
745
|
.theme-terminal .lb-icon[data-icon="ai-cost"]::after { content: "\ea81"; } /* currency-dollar */
|
|
745
746
|
.theme-terminal .lb-icon[data-icon="api-status"]::after { content: "\e96f"; } /* arrows-clockwise */
|
|
746
747
|
.theme-terminal .lb-icon[data-icon="sessions"]::after { content: "\ea25"; } /* chat-dots */
|
|
747
748
|
.theme-terminal .lb-icon[data-icon="tokens"]::after { content: "\ea18"; } /* chart-bar */
|
|
748
749
|
|
|
750
|
+
/* AI Provider icons */
|
|
751
|
+
.theme-terminal .lb-icon[data-icon="claude-code"]::after { content: "\ea38"; } /* circle */
|
|
752
|
+
.theme-terminal .lb-icon[data-icon="codex-cli"]::after { content: "\ea38"; } /* circle */
|
|
753
|
+
.theme-terminal .lb-icon[data-icon="github-copilot"]::after { content: "\ea38"; } /* circle */
|
|
754
|
+
.theme-terminal .lb-icon[data-icon="cursor"]::after { content: "\ea38"; } /* circle */
|
|
755
|
+
.theme-terminal .lb-icon[data-icon="gemini-cli"]::after { content: "\eaa9"; } /* diamond */
|
|
756
|
+
.theme-terminal .lb-icon[data-icon="amp-code"]::after { content: "\ebb3"; } /* lightning */
|
|
757
|
+
.theme-terminal .lb-icon[data-icon="factory"]::after { content: "\eaf4"; } /* factory */
|
|
758
|
+
.theme-terminal .lb-icon[data-icon="kimi-code"]::after { content: "\ec10"; } /* moon */
|
|
759
|
+
.theme-terminal .lb-icon[data-icon="jetbrains-ai"]::after { content: "\e9d1"; } /* brain */
|
|
760
|
+
.theme-terminal .lb-icon[data-icon="minimax"]::after { content: "\eaa9"; } /* diamond */
|
|
761
|
+
.theme-terminal .lb-icon[data-icon="zai"]::after { content: "\ecd9"; } /* sparkle */
|
|
762
|
+
.theme-terminal .lb-icon[data-icon="antigravity"]::after { content: "\ec42"; } /* planet */
|
|
763
|
+
|
|
749
764
|
/* Finance icons */
|
|
750
765
|
.theme-terminal .lb-icon[data-icon="stock"]::after { content: "\ea1c"; } /* chart-line-up */
|
|
751
766
|
.theme-terminal .lb-icon[data-icon="crypto"]::after { content: "\ea7d"; } /* currency-btc */
|
|
@@ -1122,6 +1137,55 @@ body.theme-paper {
|
|
|
1122
1137
|
.theme-feminine .lb-icon[data-icon="memory"]::after { content: "\e9d1"; } /* brain */
|
|
1123
1138
|
.theme-paper .lb-icon[data-icon="memory"]::after { content: "\e9d1"; } /* brain */
|
|
1124
1139
|
|
|
1140
|
+
/* AI Provider icons for all icon-mapped themes */
|
|
1141
|
+
.theme-paper .lb-icon[data-icon="ai-usage"]::after,
|
|
1142
|
+
.theme-feminine .lb-icon[data-icon="ai-usage"]::after,
|
|
1143
|
+
.theme-feminine-dark .lb-icon[data-icon="ai-usage"]::after { content: "\ecc6"; } /* robot */
|
|
1144
|
+
|
|
1145
|
+
.theme-paper .lb-icon[data-icon="claude-code"]::after,
|
|
1146
|
+
.theme-paper .lb-icon[data-icon="codex-cli"]::after,
|
|
1147
|
+
.theme-paper .lb-icon[data-icon="github-copilot"]::after,
|
|
1148
|
+
.theme-paper .lb-icon[data-icon="cursor"]::after,
|
|
1149
|
+
.theme-feminine .lb-icon[data-icon="claude-code"]::after,
|
|
1150
|
+
.theme-feminine .lb-icon[data-icon="codex-cli"]::after,
|
|
1151
|
+
.theme-feminine .lb-icon[data-icon="github-copilot"]::after,
|
|
1152
|
+
.theme-feminine .lb-icon[data-icon="cursor"]::after,
|
|
1153
|
+
.theme-feminine-dark .lb-icon[data-icon="claude-code"]::after,
|
|
1154
|
+
.theme-feminine-dark .lb-icon[data-icon="codex-cli"]::after,
|
|
1155
|
+
.theme-feminine-dark .lb-icon[data-icon="github-copilot"]::after,
|
|
1156
|
+
.theme-feminine-dark .lb-icon[data-icon="cursor"]::after { content: "\ea38"; } /* circle */
|
|
1157
|
+
|
|
1158
|
+
.theme-paper .lb-icon[data-icon="gemini-cli"]::after,
|
|
1159
|
+
.theme-paper .lb-icon[data-icon="minimax"]::after,
|
|
1160
|
+
.theme-feminine .lb-icon[data-icon="gemini-cli"]::after,
|
|
1161
|
+
.theme-feminine .lb-icon[data-icon="minimax"]::after,
|
|
1162
|
+
.theme-feminine-dark .lb-icon[data-icon="gemini-cli"]::after,
|
|
1163
|
+
.theme-feminine-dark .lb-icon[data-icon="minimax"]::after { content: "\eaa9"; } /* diamond */
|
|
1164
|
+
|
|
1165
|
+
.theme-paper .lb-icon[data-icon="amp-code"]::after,
|
|
1166
|
+
.theme-feminine .lb-icon[data-icon="amp-code"]::after,
|
|
1167
|
+
.theme-feminine-dark .lb-icon[data-icon="amp-code"]::after { content: "\ebb3"; } /* lightning */
|
|
1168
|
+
|
|
1169
|
+
.theme-paper .lb-icon[data-icon="factory"]::after,
|
|
1170
|
+
.theme-feminine .lb-icon[data-icon="factory"]::after,
|
|
1171
|
+
.theme-feminine-dark .lb-icon[data-icon="factory"]::after { content: "\eaf4"; } /* factory */
|
|
1172
|
+
|
|
1173
|
+
.theme-paper .lb-icon[data-icon="kimi-code"]::after,
|
|
1174
|
+
.theme-feminine .lb-icon[data-icon="kimi-code"]::after,
|
|
1175
|
+
.theme-feminine-dark .lb-icon[data-icon="kimi-code"]::after { content: "\ec10"; } /* moon */
|
|
1176
|
+
|
|
1177
|
+
.theme-paper .lb-icon[data-icon="jetbrains-ai"]::after,
|
|
1178
|
+
.theme-feminine .lb-icon[data-icon="jetbrains-ai"]::after,
|
|
1179
|
+
.theme-feminine-dark .lb-icon[data-icon="jetbrains-ai"]::after { content: "\e9d1"; } /* brain */
|
|
1180
|
+
|
|
1181
|
+
.theme-paper .lb-icon[data-icon="zai"]::after,
|
|
1182
|
+
.theme-feminine .lb-icon[data-icon="zai"]::after,
|
|
1183
|
+
.theme-feminine-dark .lb-icon[data-icon="zai"]::after { content: "\ecd9"; } /* sparkle */
|
|
1184
|
+
|
|
1185
|
+
.theme-paper .lb-icon[data-icon="antigravity"]::after,
|
|
1186
|
+
.theme-feminine .lb-icon[data-icon="antigravity"]::after,
|
|
1187
|
+
.theme-feminine-dark .lb-icon[data-icon="antigravity"]::after { content: "\ec42"; } /* planet */
|
|
1188
|
+
|
|
1125
1189
|
/* RSS Ticker overrides for light themes */
|
|
1126
1190
|
.theme-paper .news-ticker-wrap {
|
|
1127
1191
|
background: var(--bg-tertiary);
|
package/dist/lobsterboard.css
CHANGED
package/dist/lobsterboard.esm.js
CHANGED
package/dist/lobsterboard.umd.js
CHANGED