@hybridlabor-api/bdb-antigravity-skills 1.1.4 → 1.1.6

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 (3) hide show
  1. package/installer.js +96 -6
  2. package/package.json +1 -1
  3. package/skilloverview.html +0 -928
package/installer.js CHANGED
@@ -44,16 +44,69 @@ const backupDir = path.join(geminiDir, `skills_backup_${timestamp}`);
44
44
  // Auto-accept flags for CI/CD or autonomous agents
45
45
  const isAutoYes = process.argv.includes('-y') || process.argv.includes('--yes');
46
46
 
47
+ function detectPlatforms() {
48
+ const detections = [];
49
+
50
+ // Antigravity
51
+ if (fs.existsSync(geminiDir)) {
52
+ detections.push("Google Antigravity (detected at " + geminiDir + ")");
53
+ }
54
+
55
+ // Claude Desktop
56
+ const claudePath = process.platform === 'win32'
57
+ ? path.join(process.env.APPDATA || homeDir, 'Claude')
58
+ : path.join(homeDir, 'Library', 'Application Support', 'Claude');
59
+ if (fs.existsSync(claudePath)) {
60
+ detections.push("Claude Desktop (detected at " + claudePath + ")");
61
+ }
62
+
63
+ // Cursor
64
+ const cursorPath = process.platform === 'win32'
65
+ ? path.join(process.env.APPDATA || homeDir, 'Cursor')
66
+ : path.join(homeDir, 'Library', 'Application Support', 'Cursor');
67
+ if (fs.existsSync(cursorPath)) {
68
+ detections.push("Cursor IDE (detected at " + cursorPath + ")");
69
+ }
70
+
71
+ // VS Code (for Cline/Roo Code)
72
+ const vscodePath = process.platform === 'win32'
73
+ ? path.join(process.env.APPDATA || homeDir, 'Code')
74
+ : path.join(homeDir, 'Library', 'Application Support', 'Code');
75
+ if (fs.existsSync(vscodePath)) {
76
+ detections.push("VS Code / Cline / Roo Code (detected at " + vscodePath + ")");
77
+ }
78
+
79
+ // Windsurf
80
+ const windsurfPath = process.platform === 'win32'
81
+ ? path.join(process.env.APPDATA || homeDir, 'Windsurf')
82
+ : path.join(homeDir, 'Library', 'Application Support', 'Windsurf');
83
+ if (fs.existsSync(windsurfPath)) {
84
+ detections.push("Windsurf IDE (detected at " + windsurfPath + ")");
85
+ }
86
+
87
+ return detections;
88
+ }
89
+
47
90
  function promptMode(callback) {
48
91
  if (isAutoYes) {
49
92
  return callback({ mode: '1', platform: '1' });
50
93
  }
94
+
95
+ const detections = detectPlatforms();
96
+ if (detections.length > 0) {
97
+ console.log("\nDetected Agent Environments on this system:");
98
+ detections.forEach(d => console.log(" * " + d));
99
+ } else {
100
+ console.log("\nNo active agent config directories auto-detected in standard locations.");
101
+ }
102
+
51
103
  console.log("\nTarget AI Platform:");
52
104
  console.log(" (1) Google Antigravity (Default)");
53
105
  console.log(" (2) Claude Desktop / Claude Code");
54
- console.log(" (3) Cursor / Generic IDE");
106
+ console.log(" (3) Cursor / Generic IDE (Project-local)");
107
+ console.log(" (4) Custom Installation (Specify custom paths manually)");
55
108
 
56
- rl.question("\nSelect platform [1/2/3]: ", (platformAns) => {
109
+ rl.question("\nSelect platform [1/2/3/4]: ", (platformAns) => {
57
110
  const platform = platformAns.trim() || '1';
58
111
 
59
112
  console.log("\nInstallation Mode:");
@@ -61,7 +114,36 @@ function promptMode(callback) {
61
114
  console.log(" (2) Replace: Backup and wipe your existing skills/MCPs, installing ONLY BDB tools.");
62
115
  rl.question("\nSelect mode [1/2]: ", (modeAns) => {
63
116
  const mode = modeAns.trim() === '2' ? '2' : '1';
64
- callback({ mode, platform });
117
+
118
+ if (platform === '4') {
119
+ // Prompt for custom paths
120
+ console.log("\n--- Custom Path Configuration ---");
121
+ rl.question("Target directory for global skills [default: " + path.join(homeDir, '.bdb-skills') + "]: ", (skillDir) => {
122
+ const customSkillDir = skillDir.trim() || path.join(homeDir, '.bdb-skills');
123
+ rl.question("Target directory for legacy skills [default: " + path.join(customSkillDir, 'legacy') + "]: ", (legacyDir) => {
124
+ const customLegacyDir = legacyDir.trim() || path.join(customSkillDir, 'legacy');
125
+ rl.question("Target directory for workspace skills [default: " + workspaceDir + "]: ", (workDir) => {
126
+ const customWorkspaceDir = workDir.trim() || workspaceDir;
127
+ rl.question("Target path for MCP Config JSON file [default: " + path.join(homeDir, 'mcp_config.json') + "]: ", (mcpConf) => {
128
+ const customMcpConfigPath = mcpConf.trim() || path.join(homeDir, 'mcp_config.json');
129
+ callback({
130
+ mode,
131
+ platform,
132
+ customPaths: {
133
+ skillDir: customSkillDir,
134
+ legacyDir: customLegacyDir,
135
+ workspaceDir: customWorkspaceDir,
136
+ mcpConfigPath: customMcpConfigPath,
137
+ mcpDir: path.dirname(customMcpConfigPath)
138
+ }
139
+ });
140
+ });
141
+ });
142
+ });
143
+ });
144
+ } else {
145
+ callback({ mode, platform });
146
+ }
65
147
  });
66
148
  });
67
149
  }
@@ -71,7 +153,7 @@ function promptMCP(callback) {
71
153
  return callback('y');
72
154
  }
73
155
  console.log("");
74
- rl.question("Do you also want to install the MCP Pack (Unreal, Rhino, Resolve, Grandma3, Resolume, Github, etc)? (y/n): ", (answer) => {
156
+ rl.question("Do you also want to install the MCP Pack (Unreal, Adobe, Resolve, Grandma3, Resolume, Github, etc)? (y/n): ", (answer) => {
75
157
  callback(answer);
76
158
  });
77
159
  }
@@ -99,7 +181,7 @@ function copyDirRecursiveSync(source, target) {
99
181
  });
100
182
  }
101
183
 
102
- promptMode(({ mode, platform }) => {
184
+ promptMode(({ mode, platform, customPaths }) => {
103
185
  fs.mkdirSync(backupDir, { recursive: true });
104
186
 
105
187
  let targetSkillDir = globalConfigDir;
@@ -128,6 +210,14 @@ promptMode(({ mode, platform }) => {
128
210
  targetWorkspaceDir = path.join(currentDir, '.cursor', 'workspace_skills');
129
211
  targetMcpDir = path.join(currentDir, '.cursor');
130
212
  mcpConfigPath = path.join(targetMcpDir, 'mcp.json');
213
+ } else if (platform === '4' && customPaths) {
214
+ // Custom paths
215
+ console.log("\n[Platform: Custom Path] Applying custom paths...");
216
+ targetSkillDir = customPaths.skillDir;
217
+ targetLegacyDir = customPaths.legacyDir;
218
+ targetWorkspaceDir = customPaths.workspaceDir;
219
+ targetMcpDir = customPaths.mcpDir;
220
+ mcpConfigPath = customPaths.mcpConfigPath;
131
221
  }
132
222
 
133
223
  if (mode === '2') {
@@ -188,7 +278,7 @@ promptMode(({ mode, platform }) => {
188
278
  fs.writeFileSync(mcpConfigPath, mcpConfigStr);
189
279
  }
190
280
  } else {
191
- if (platform === '2' && !fs.existsSync(mcpConfigPath)) {
281
+ if ((platform === '2' || platform === '4') && !fs.existsSync(mcpConfigPath)) {
192
282
  const wrapper = { mcpServers: JSON.parse(mcpConfigStr).mcpServers };
193
283
  fs.writeFileSync(mcpConfigPath, JSON.stringify(wrapper, null, 2));
194
284
  } else {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hybridlabor-api/bdb-antigravity-skills",
3
- "version": "1.1.4",
3
+ "version": "1.1.6",
4
4
  "description": "Optimized Antigravity skills and MCP pack for BDB DEV",
5
5
  "main": "installer.js",
6
6
  "bin": {
package/skilloverview.html DELETED
@@ -1,928 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>BDB DEV - Antigravity Skill Overview</title>
7
- <link rel="preconnect" href="https://fonts.googleapis.com">
8
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
9
- <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet">
10
- <style>
11
- :root {
12
- --bg-color: #080710;
13
- --card-bg: rgba(255, 255, 255, 0.03);
14
- --card-border: rgba(255, 255, 255, 0.08);
15
- --primary: #8a2be2;
16
- --primary-glow: rgba(138, 43, 226, 0.4);
17
- --secondary: #00f2fe;
18
- --secondary-glow: rgba(0, 242, 254, 0.3);
19
- --text-main: #f3f4f6;
20
- --text-muted: #9ca3af;
21
- --glass-blur: blur(16px);
22
- }
23
-
24
- * {
25
- box-sizing: border-box;
26
- margin: 0;
27
- padding: 0;
28
- }
29
-
30
- body {
31
- font-family: 'Outfit', sans-serif;
32
- background-color: var(--bg-color);
33
- color: var(--text-main);
34
- min-height: 100vh;
35
- overflow-x: hidden;
36
- background-image:
37
- radial-gradient(circle at 10% 20%, rgba(138, 43, 226, 0.15) 0%, transparent 40%),
38
- radial-gradient(circle at 90% 80%, rgba(0, 242, 254, 0.1) 0%, transparent 45%);
39
- background-attachment: fixed;
40
- }
41
-
42
- /* Decorative background elements */
43
- .grid-bg {
44
- position: fixed;
45
- top: 0;
46
- left: 0;
47
- width: 100%;
48
- height: 100%;
49
- background-image: linear-gradient(rgba(255, 255, 255, 0.01) 1px, transparent 1px),
50
- linear-gradient(90deg, rgba(255, 255, 255, 0.01) 1px, transparent 1px);
51
- background-size: 40px 40px;
52
- pointer-events: none;
53
- z-index: -1;
54
- }
55
-
56
- header {
57
- max-width: 1200px;
58
- margin: 0 auto;
59
- padding: 40px 20px 20px;
60
- display: flex;
61
- justify-content: space-between;
62
- align-items: center;
63
- border-bottom: 1px solid var(--card-border);
64
- }
65
-
66
- .logo-area h1 {
67
- font-size: 2rem;
68
- font-weight: 800;
69
- background: linear-gradient(135deg, var(--text-main) 30%, var(--secondary) 100%);
70
- -webkit-background-clip: text;
71
- -webkit-text-fill-color: transparent;
72
- letter-spacing: -0.5px;
73
- }
74
-
75
- .logo-area span {
76
- font-size: 0.85rem;
77
- color: var(--text-muted);
78
- font-family: 'JetBrains+Mono', monospace;
79
- background: rgba(255, 255, 255, 0.05);
80
- padding: 4px 8px;
81
- border-radius: 6px;
82
- margin-left: 10px;
83
- vertical-align: middle;
84
- }
85
-
86
- .stats-strip {
87
- display: flex;
88
- gap: 20px;
89
- }
90
-
91
- .stat-card {
92
- background: var(--card-bg);
93
- border: 1px solid var(--card-border);
94
- padding: 10px 20px;
95
- border-radius: 12px;
96
- backdrop-filter: var(--glass-blur);
97
- text-align: center;
98
- box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2);
99
- }
100
-
101
- .stat-val {
102
- font-size: 1.25rem;
103
- font-weight: 800;
104
- color: var(--secondary);
105
- }
106
-
107
- .stat-label {
108
- font-size: 0.75rem;
109
- color: var(--text-muted);
110
- text-transform: uppercase;
111
- letter-spacing: 1px;
112
- margin-top: 2px;
113
- }
114
-
115
- main {
116
- max-width: 1200px;
117
- margin: 0 auto;
118
- padding: 40px 20px;
119
- display: grid;
120
- grid-template-columns: 1fr;
121
- gap: 40px;
122
- }
123
-
124
- /* Hero / Guide Section */
125
- .guide-section {
126
- display: grid;
127
- grid-template-columns: 1.2fr 0.8fr;
128
- gap: 30px;
129
- }
130
-
131
- @media (max-width: 900px) {
132
- .guide-section {
133
- grid-template-columns: 1fr;
134
- }
135
- }
136
-
137
- .glass-card {
138
- background: var(--card-bg);
139
- border: 1px solid var(--card-border);
140
- border-radius: 20px;
141
- padding: 30px;
142
- backdrop-filter: var(--glass-blur);
143
- box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
144
- position: relative;
145
- overflow: hidden;
146
- transition: border-color 0.3s ease;
147
- }
148
-
149
- .glass-card:hover {
150
- border-color: rgba(255, 255, 255, 0.15);
151
- }
152
-
153
- .glass-card::before {
154
- content: '';
155
- position: absolute;
156
- top: 0;
157
- left: 0;
158
- width: 100%;
159
- height: 4px;
160
- background: linear-gradient(90deg, var(--primary), var(--secondary));
161
- }
162
-
163
- h2 {
164
- font-size: 1.5rem;
165
- font-weight: 600;
166
- margin-bottom: 20px;
167
- display: flex;
168
- align-items: center;
169
- gap: 10px;
170
- }
171
-
172
- p {
173
- color: var(--text-muted);
174
- line-height: 1.6;
175
- margin-bottom: 20px;
176
- }
177
-
178
- .concept-split {
179
- display: grid;
180
- grid-template-columns: 1fr 1fr;
181
- gap: 20px;
182
- margin-top: 20px;
183
- }
184
-
185
- .concept-box {
186
- background: rgba(255, 255, 255, 0.02);
187
- border: 1px solid rgba(255, 255, 255, 0.05);
188
- border-radius: 12px;
189
- padding: 20px;
190
- }
191
-
192
- .concept-box h3 {
193
- font-size: 1.1rem;
194
- margin-bottom: 8px;
195
- color: var(--text-main);
196
- }
197
-
198
- .concept-box.skills h3 { color: var(--secondary); }
199
- .concept-box.mcps h3 { color: var(--primary); }
200
-
201
- /* Step list */
202
- .step-list {
203
- list-style: none;
204
- display: flex;
205
- flex-direction: column;
206
- gap: 15px;
207
- }
208
-
209
- .step-item {
210
- display: flex;
211
- gap: 15px;
212
- align-items: flex-start;
213
- }
214
-
215
- .step-num {
216
- background: linear-gradient(135deg, var(--primary), var(--secondary));
217
- width: 28px;
218
- height: 28px;
219
- border-radius: 50%;
220
- display: flex;
221
- align-items: center;
222
- justify-content: center;
223
- font-weight: 800;
224
- font-size: 0.85rem;
225
- flex-shrink: 0;
226
- box-shadow: 0 0 10px var(--primary-glow);
227
- }
228
-
229
- .step-text h4 {
230
- font-size: 0.95rem;
231
- font-weight: 600;
232
- margin-bottom: 4px;
233
- }
234
-
235
- .step-text p {
236
- font-size: 0.85rem;
237
- margin-bottom: 0;
238
- }
239
-
240
- /* Showcases */
241
- .showcase-grid {
242
- display: grid;
243
- grid-template-columns: 1fr 1fr;
244
- gap: 30px;
245
- }
246
-
247
- @media (max-width: 768px) {
248
- .showcase-grid {
249
- grid-template-columns: 1fr;
250
- }
251
- }
252
-
253
- .showcase-card {
254
- background: linear-gradient(135deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.04) 100%);
255
- border: 1px solid var(--card-border);
256
- border-radius: 20px;
257
- padding: 30px;
258
- position: relative;
259
- transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
260
- cursor: pointer;
261
- }
262
-
263
- .showcase-card:hover {
264
- transform: translateY(-5px);
265
- border-color: var(--secondary);
266
- box-shadow: 0 10px 30px rgba(0, 242, 254, 0.1);
267
- }
268
-
269
- .showcase-card.mcp-showcase:hover {
270
- border-color: var(--primary);
271
- box-shadow: 0 10px 30px rgba(138, 43, 226, 0.15);
272
- }
273
-
274
- .badge {
275
- background: rgba(0, 242, 254, 0.1);
276
- color: var(--secondary);
277
- padding: 4px 8px;
278
- border-radius: 6px;
279
- font-size: 0.75rem;
280
- font-weight: 600;
281
- text-transform: uppercase;
282
- letter-spacing: 0.5px;
283
- display: inline-block;
284
- margin-bottom: 15px;
285
- }
286
-
287
- .showcase-card.mcp-showcase .badge {
288
- background: rgba(138, 43, 226, 0.1);
289
- color: var(--primary);
290
- }
291
-
292
- .showcase-card h3 {
293
- font-size: 1.5rem;
294
- margin-bottom: 12px;
295
- font-weight: 800;
296
- }
297
-
298
- .showcase-card ul {
299
- list-style: none;
300
- margin-top: 15px;
301
- display: flex;
302
- flex-direction: column;
303
- gap: 8px;
304
- }
305
-
306
- .showcase-card li {
307
- font-size: 0.9rem;
308
- color: var(--text-muted);
309
- display: flex;
310
- align-items: center;
311
- gap: 10px;
312
- }
313
-
314
- .showcase-card li::before {
315
- content: '✦';
316
- color: var(--secondary);
317
- }
318
-
319
- .showcase-card.mcp-showcase li::before {
320
- content: '❖';
321
- color: var(--primary);
322
- }
323
-
324
- /* Explorer Section */
325
- .explorer-section {
326
- display: grid;
327
- grid-template-columns: 280px 1fr;
328
- gap: 30px;
329
- }
330
-
331
- @media (max-width: 900px) {
332
- .explorer-section {
333
- grid-template-columns: 1fr;
334
- }
335
- }
336
-
337
- .sidebar {
338
- display: flex;
339
- flex-direction: column;
340
- gap: 10px;
341
- }
342
-
343
- .category-btn {
344
- background: rgba(255,255,255,0.02);
345
- border: 1px solid var(--card-border);
346
- color: var(--text-muted);
347
- padding: 15px 20px;
348
- border-radius: 12px;
349
- text-align: left;
350
- font-family: inherit;
351
- font-size: 0.95rem;
352
- cursor: pointer;
353
- transition: all 0.2s ease;
354
- backdrop-filter: var(--glass-blur);
355
- }
356
-
357
- .category-btn:hover, .category-btn.active {
358
- background: rgba(255, 255, 255, 0.06);
359
- color: var(--text-main);
360
- border-color: var(--secondary);
361
- box-shadow: 0 4px 15px rgba(0, 242, 254, 0.05);
362
- }
363
-
364
- .search-area {
365
- margin-bottom: 25px;
366
- position: relative;
367
- }
368
-
369
- .search-input {
370
- width: 100%;
371
- background: rgba(255, 255, 255, 0.03);
372
- border: 1px solid var(--card-border);
373
- padding: 16px 20px;
374
- border-radius: 14px;
375
- color: var(--text-main);
376
- font-family: inherit;
377
- font-size: 1rem;
378
- outline: none;
379
- backdrop-filter: var(--glass-blur);
380
- transition: all 0.3s ease;
381
- }
382
-
383
- .search-input:focus {
384
- border-color: var(--secondary);
385
- background: rgba(255, 255, 255, 0.05);
386
- box-shadow: 0 0 15px rgba(0, 242, 254, 0.1);
387
- }
388
-
389
- .skills-grid {
390
- display: grid;
391
- grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
392
- gap: 20px;
393
- }
394
-
395
- .skill-item-card {
396
- background: var(--card-bg);
397
- border: 1px solid var(--card-border);
398
- border-radius: 14px;
399
- padding: 20px;
400
- backdrop-filter: var(--glass-blur);
401
- transition: all 0.2s ease;
402
- position: relative;
403
- }
404
-
405
- .skill-item-card:hover {
406
- border-color: rgba(255,255,255,0.15);
407
- transform: translateY(-2px);
408
- }
409
-
410
- .skill-item-card h4 {
411
- font-size: 1.05rem;
412
- margin-bottom: 8px;
413
- font-weight: 600;
414
- font-family: 'JetBrains Mono', monospace;
415
- word-break: break-all;
416
- }
417
-
418
- .skill-item-card p {
419
- font-size: 0.85rem;
420
- color: var(--text-muted);
421
- margin-bottom: 0;
422
- line-height: 1.5;
423
- display: -webkit-box;
424
- -webkit-line-clamp: 3;
425
- -webkit-box-orient: vertical;
426
- overflow: hidden;
427
- }
428
-
429
- .skill-source {
430
- font-size: 0.7rem;
431
- color: var(--primary);
432
- text-transform: uppercase;
433
- font-weight: 600;
434
- margin-bottom: 8px;
435
- letter-spacing: 0.5px;
436
- }
437
-
438
- /* Modal styling */
439
- .modal {
440
- position: fixed;
441
- top: 0;
442
- left: 0;
443
- width: 100%;
444
- height: 100%;
445
- background: rgba(8, 7, 16, 0.8);
446
- backdrop-filter: blur(10px);
447
- z-index: 100;
448
- display: flex;
449
- align-items: center;
450
- justify-content: center;
451
- opacity: 0;
452
- pointer-events: none;
453
- transition: opacity 0.3s ease;
454
- }
455
-
456
- .modal.active {
457
- opacity: 1;
458
- pointer-events: auto;
459
- }
460
-
461
- .modal-content {
462
- background: #11101d;
463
- border: 1px solid var(--card-border);
464
- width: 90%;
465
- max-width: 650px;
466
- border-radius: 20px;
467
- padding: 35px;
468
- position: relative;
469
- transform: scale(0.9);
470
- transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
471
- box-shadow: 0 20px 50px rgba(0,0,0,0.5);
472
- }
473
-
474
- .modal.active .modal-content {
475
- transform: scale(1);
476
- }
477
-
478
- .close-btn {
479
- position: absolute;
480
- top: 20px;
481
- right: 20px;
482
- background: transparent;
483
- border: none;
484
- color: var(--text-muted);
485
- font-size: 1.5rem;
486
- cursor: pointer;
487
- width: 32px;
488
- height: 32px;
489
- display: flex;
490
- align-items: center;
491
- justify-content: center;
492
- border-radius: 50%;
493
- transition: all 0.2s ease;
494
- }
495
-
496
- .close-btn:hover {
497
- background: rgba(255,255,255,0.05);
498
- color: var(--text-main);
499
- }
500
-
501
- .modal-title {
502
- font-family: 'JetBrains Mono', monospace;
503
- font-size: 1.35rem;
504
- font-weight: 700;
505
- color: var(--secondary);
506
- margin-bottom: 15px;
507
- }
508
-
509
- .modal-desc {
510
- font-size: 0.95rem;
511
- line-height: 1.6;
512
- color: var(--text-main);
513
- margin-bottom: 25px;
514
- }
515
-
516
- .modal-path {
517
- background: rgba(255, 255, 255, 0.02);
518
- border: 1px solid rgba(255,255,255,0.05);
519
- border-radius: 8px;
520
- padding: 12px 15px;
521
- font-family: 'JetBrains Mono', monospace;
522
- font-size: 0.8rem;
523
- color: var(--text-muted);
524
- word-break: break-all;
525
- }
526
-
527
- .modal-path strong {
528
- color: var(--primary);
529
- }
530
- </style>
531
- </head>
532
- <body>
533
- <div class="grid-bg"></div>
534
-
535
- <header>
536
- <div class="logo-area">
537
- <h1>BDB DEV / ANTIGRAVITY</h1>
538
- <span>v1.0.2</span>
539
- </div>
540
- <div class="stats-strip">
541
- <div class="stat-card">
542
- <div class="stat-val" id="stat-count">142</div>
543
- <div class="stat-label">Active Skills</div>
544
- </div>
545
- <div class="stat-card">
546
- <div class="stat-val">2</div>
547
- <div class="stat-label">Custom Orchestrators</div>
548
- </div>
549
- <div class="stat-card">
550
- <div class="stat-val">9</div>
551
- <div class="stat-label">Active MCPs</div>
552
- </div>
553
- </div>
554
- </header>
555
-
556
- <main>
557
- <!-- Hero Guide -->
558
- <section class="guide-section">
559
- <div class="glass-card">
560
- <h2>How to use Antigravity Skills</h2>
561
- <p>
562
- Skills act as the custom instructions, guidelines, and toolsets that direct Antigravity agents. They act as "recipes of expertise" injected dynamically into the LLM context, showing the AI exactly how to solve problems, write code, or execute platform-specific actions without needing complex prompts.
563
- </p>
564
- <div class="concept-split">
565
- <div class="concept-box skills">
566
- <h3>Antigravity Skills</h3>
567
- <p style="font-size: 0.85rem; margin-bottom: 0;">
568
- Pure system instructions, guidelines, scripts, and context files located in <code>.gemini/config/skills/</code>. They teach the agent *how* to think.
569
- </p>
570
- </div>
571
- <div class="concept-box mcps">
572
- <h3>Model Context Protocol</h3>
573
- <p style="font-size: 0.85rem; margin-bottom: 0;">
574
- External plugins configured in <code>mcp_config.json</code>. They give the agent *hands* to control live apps (like grandMA3, Resolume, Chrome).
575
- </p>
576
- </div>
577
- </div>
578
- </div>
579
-
580
- <div class="glass-card" style="border-image: linear-gradient(to right, var(--primary), var(--secondary)) 1;">
581
- <h2>Activation Steps</h2>
582
- <ul class="step-list">
583
- <li class="step-item">
584
- <div class="step-num">1</div>
585
- <div class="step-text">
586
- <h4>Implicit Matching</h4>
587
- <p>Mention a task related to a skill. Antigravity matches the YAML metadata and loads the skill automatically.</p>
588
- </div>
589
- </li>
590
- <li class="step-item">
591
- <div class="step-num">2</div>
592
- <div class="step-text">
593
- <h4>Slash Commands</h4>
594
- <p>Trigger complex agent configurations instantly using commands like <code>/agentflow</code> or <code>/grill-me</code>.</p>
595
- </div>
596
- </li>
597
- <li class="step-item">
598
- <div class="step-num">3</div>
599
- <div class="step-text">
600
- <h4>Force Usage</h4>
601
- <p>Explicitly instruct the agent: "Use the [skill-name] skill to write this code..." to guarantee compliance.</p>
602
- </div>
603
- </li>
604
- </ul>
605
- </div>
606
- </section>
607
-
608
- <!-- Showcases -->
609
- <section>
610
- <h2 style="margin-bottom: 20px;">BDB Customized Extensions</h2>
611
- <div class="showcase-grid">
612
- <div class="showcase-card" onclick="openSkillModal('bdbrainstorm')">
613
- <div class="badge">Orchestrator</div>
614
- <h3>BDBrainstorm</h3>
615
- <p>
616
- Forces Antigravity into a comprehensive brainstorming and design workflow. Ensures you don't build alone and guarantees top-tier aesthetics.
617
- </p>
618
- <ul>
619
- <li>Forces debate via multi-agent debate sessions</li>
620
- <li>Initiates an interactive /grill-me interview</li>
621
- <li>Delegates execution to specialized subagents</li>
622
- <li>Enforces strict ui-ux-pro-max design guidelines</li>
623
- </ul>
624
- </div>
625
-
626
- <div class="showcase-card mcp-showcase" onclick="openSkillModal('MCP_Manage')">
627
- <div class="badge">Tool Command</div>
628
- <h3>MCP_Manage</h3>
629
- <p>
630
- The master skill to manage and utilize whitelabeled Model Context Protocol servers. Connects AI directly to hardware, stage, and design software.
631
- </p>
632
- <ul>
633
- <li>grandMA3 Console & Resolume (Stage & Visual control)</li>
634
- <li>TouchDesigner (MindDesigner network builder & parameter backup)</li>
635
- <li>Unreal Engine 5.8 (Native Editor plugin)</li>
636
- <li>Rhino 3D, DaVinci Resolve, GitHub, Chrome DevTools</li>
637
- </ul>
638
- </div>
639
- </div>
640
- </section>
641
-
642
- <!-- Skill Explorer -->
643
- <section>
644
- <h2 style="margin-bottom: 20px;">Interactive Skill Explorer</h2>
645
- <div class="explorer-section">
646
- <div class="sidebar">
647
- <button class="category-btn active" onclick="filterCategory('all')">All Skills (142)</button>
648
- <button class="category-btn" onclick="filterCategory('custom')">BDB Custom (2)</button>
649
- <button class="category-btn" onclick="filterCategory('mcp')">Firecrawl & MCPs (16)</button>
650
- <button class="category-btn" onclick="filterCategory('frontend')">Frontend & UI/UX (11)</button>
651
- <button class="category-btn" onclick="filterCategory('backend')">Backend & DB (14)</button>
652
- <button class="category-btn" onclick="filterCategory('devops')">DevOps & Git (9)</button>
653
- <button class="category-btn" onclick="filterCategory('language')">Python & Go (6)</button>
654
- <button class="category-btn" onclick="filterCategory('general')">Standard Utilities (84)</button>
655
- </div>
656
- <div class="content-pane">
657
- <div class="search-area">
658
- <input type="text" class="search-input" placeholder="Search skills by name or keyword..." oninput="searchSkills(this.value)">
659
- </div>
660
- <div class="skills-grid" id="skills-container">
661
- <!-- Dynamically populated -->
662
- </div>
663
- </div>
664
- </div>
665
- </section>
666
- </main>
667
-
668
- <!-- Modal -->
669
- <div class="modal" id="skill-modal" onclick="closeModal(event)">
670
- <div class="modal-content" onclick="event.stopPropagation()">
671
- <button class="close-btn" onclick="closeModal(event)">&times;</button>
672
- <h3 class="modal-title" id="modal-title">Skill Title</h3>
673
- <p class="modal-desc" id="modal-desc">Detailed explanation of what the skill does and why it was created.</p>
674
- <div class="modal-path" id="modal-path">Path: <code>~/.gemini/config/skills/name/</code></div>
675
- </div>
676
- </div>
677
-
678
- <script>
679
- // Inline skills dataset representing the 140 curated skills
680
- const skillsData = [
681
- { name: "bdbrainstorm", desc: "Forces a comprehensive multi-agent brainstorming workflow combining debate, interactive grilling, subagent tasking, and high-end visual design.", cat: "custom", source: "Global Config" },
682
- { name: "MCP_Manage", desc: "Command center skill that manages and directs whitelabeled MCP servers like grandMA3, Resolume, Unreal Engine, Rhino, DaVinci, TouchDesigner, and Puppeteer.", cat: "custom", source: "Global Config" },
683
- { name: "bdb_td_minddesigner", desc: "TouchDesigner MindDesigner MCP - Builds real COMP, TOP, CHOP node networks from natural language prompts.", cat: "mcp", source: "Global Config" },
684
- { name: "bdb_td_backup", desc: "TouchDesigner Control MCP - Sets node parameters and queries TouchDesigner project states.", cat: "mcp", source: "Global Config" },
685
- { name: "firecrawl", desc: "Searches, scrapes, and interacts with the web via the Firecrawl CLI.", cat: "mcp", source: "Workspace Agents" },
686
- { name: "firecrawl-agent", desc: "AI-powered autonomous data extraction that navigates complex sites and returns structured JSON.", cat: "mcp", source: "Workspace Agents" },
687
- { name: "firecrawl-build", desc: "Integrate Firecrawl into product code for web scraping, crawling, searching, and interaction.", cat: "mcp", source: "Workspace Agents" },
688
- { name: "firecrawl-build-interact", desc: "Integrate Firecrawl /interact into product code for dynamic pages and browser actions after scraping.", cat: "mcp", source: "Workspace Agents" },
689
- { name: "firecrawl-build-onboarding", desc: "Get Firecrawl credentials and SDK setup into a project.", cat: "mcp", source: "Workspace Agents" },
690
- { name: "firecrawl-build-scrape", desc: "Integrate Firecrawl /scrape into product code for single-page extraction.", cat: "mcp", source: "Workspace Agents" },
691
- { name: "firecrawl-build-search", desc: "Integrate Firecrawl /search into product code and agent workflows.", cat: "mcp", source: "Workspace Agents" },
692
- { name: "firecrawl-crawl", desc: "Bulk extract content from an entire website or site section.", cat: "mcp", source: "Workspace Agents" },
693
- { name: "firecrawl-download", desc: "Download an entire website as local files — markdown, screenshots, or multiple formats per page.", cat: "mcp", source: "Workspace Agents" },
694
- { name: "firecrawl-interact", desc: "Control and interact with a live browser session on any scraped page — click buttons, fill forms, navigate flows.", cat: "mcp", source: "Workspace Agents" },
695
- { name: "firecrawl-map", desc: "Discover and list all URLs on a website, with optional search filtering.", cat: "mcp", source: "Workspace Agents" },
696
- { name: "firecrawl-scrape", desc: "Extract clean markdown from any URL, including JavaScript-rendered SPAs.", cat: "mcp", source: "Workspace Agents" },
697
- { name: "firecrawl-search", desc: "Web search with full page content extraction.", cat: "mcp", source: "Workspace Agents" },
698
- { name: "ui-ux-pro-max", desc: "Comprehensive design guide for web and mobile applications with strict design taste, calibrated color, typography, spacing discipline, and animations.", cat: "frontend", source: "Global Config" },
699
- { name: "design-taste-frontend", desc: "Rules for high-agency frontend interfaces, color theory, spacing, typography and motion rules.", cat: "frontend", source: "Global Config" },
700
- { name: "frontend-design", desc: "Enforces senior design practices for layouts and visuals. Focuses on premium aesthetics over generic layout generation.", cat: "frontend", source: "Global Config" },
701
- { name: "frontend-dev-guidelines", desc: "Architectural and performance standards for frontend development, state management, and data mutations.", cat: "frontend", source: "Global Config" },
702
- { name: "react-best-practices", desc: "Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel.", cat: "frontend", source: "Global Config" },
703
- { name: "react-component-performance", desc: "Diagnoses slow React components and suggests targeted performance fixes.", cat: "frontend", source: "Global Config" },
704
- { name: "react-patterns", desc: "Modern React patterns and principles. Hooks, composition, performance, TypeScript best practices.", cat: "frontend", source: "Global Config" },
705
- { name: "shadcn", desc: "Manages shadcn/ui components and projects, providing context, documentation, and usage patterns.", cat: "frontend", source: "Global Config" },
706
- { name: "threejs-skills", desc: "Create 3D scenes, interactive experiences, and WebGL visualizations using Three.js.", cat: "frontend", source: "Global Config" },
707
- { name: "spline-3d-integration", desc: "Integration instructions for adding interactive 3D scenes from Spline.design to web projects.", cat: "frontend", source: "Global Config" },
708
- { name: "zustand-store-ts", desc: "Create Zustand stores following established patterns with proper TypeScript types and middleware.", cat: "frontend", source: "Global Config" },
709
- { name: "database-design", desc: "Database design principles and decision-making. Schema design, indexing strategy, ORM selection.", cat: "backend", source: "Global Config" },
710
- { name: "drizzle-orm-expert", desc: "Expert in Drizzle ORM for TypeScript — schema design, relational queries, migrations, and serverless integration.", cat: "backend", source: "Global Config" },
711
- { name: "prisma-expert", desc: "Advanced usage of Prisma ORM, migrations, schema optimization, and relations across DB backends.", cat: "backend", source: "Global Config" },
712
- { name: "neon-postgres", desc: "Neon serverless Postgres configuration, connection pooling, and branch management.", cat: "backend", source: "Global Config" },
713
- { name: "using-neon", desc: "Guides for using Neon serverless Postgres features in applications.", cat: "backend", source: "Global Config" },
714
- { name: "postgresql", desc: "Design a PostgreSQL-specific schema. Covers performance patterns, constraints, indexing, and advanced features.", cat: "backend", source: "Global Config" },
715
- { name: "postgres-best-practices", desc: "Performance optimization, indexing, and schema design tips.", cat: "backend", source: "Global Config" },
716
- { name: "vector-database-engineer", desc: "Guides for implementing vector databases (Pinecone, pgvector, Weaviate) and embedding models.", cat: "backend", source: "Global Config" },
717
- { name: "rag-implementation", desc: "RAG implementation workflow covering embedding selection, chunking, and retrieval optimization.", cat: "backend", source: "Global Config" },
718
- { name: "rag-engineer", desc: "Expert RAG engineering architectures.", cat: "backend", source: "Global Config" },
719
- { name: "api-design-principles", desc: "REST and GraphQL API design principles for scalability and maintainability.", cat: "backend", source: "Global Config" },
720
- { name: "api-patterns", desc: "Deciding between REST, GraphQL, and tRPC. Pagination, versioning, and format rules.", cat: "backend", source: "Global Config" },
721
- { name: "microservices-patterns", desc: "Design patterns for distributed microservice systems, communication, and fault tolerance.", cat: "backend", source: "Global Config" },
722
- { name: "cloudflare-workers-expert", desc: "Edge computing architectures using Cloudflare Workers, D1, KV, and Durable Objects.", cat: "backend", source: "Global Config" },
723
- { name: "docker-expert", desc: "Containerization strategies, multi-stage builds, production configuration, and security hardening.", cat: "devops", source: "Global Config" },
724
- { name: "github-actions-templates", desc: "Production-ready CI/CD workflow patterns for building, testing, and deploying.", cat: "devops", source: "Global Config" },
725
- { name: "github-workflow-automation", desc: "Patterns for automating GitHub workflows with AI assistance, inspired by Gemini CLI.", cat: "devops", source: "Global Config" },
726
- { name: "git-advanced-workflows", desc: "Advanced git techniques, recovery, rebasing, and clean branch management.", cat: "devops", source: "Global Config" },
727
- { name: "git-pr-review", desc: "Generate clean PR descriptions automatically from git histories.", cat: "devops", source: "Global Config" },
728
- { name: "github", desc: "Leverage gh CLI for managing issues, PRs, actions, and repository metadata.", cat: "devops", source: "Global Config" },
729
- { name: "monorepo-management", desc: "Build and scale efficient monorepos sharing code and tooling across packages.", cat: "devops", source: "Global Config" },
730
- { name: "turborepo-caching", desc: "Configure Turborepo local and remote caching for optimized build pipelines.", cat: "devops", source: "Global Config" },
731
- { name: "vercel-deployment", desc: "Expert deployments for Next.js and frontend stacks to Vercel.", cat: "devops", source: "Global Config" },
732
- { name: "python-pro", desc: "Expert Python 3.12+ patterns, async programming, uv, ruff, pydantic, and FastAPI.", cat: "language", source: "Global Config" },
733
- { name: "python-patterns", desc: "Python coding style, framework selection, and architectural decisions.", cat: "language", source: "Global Config" },
734
- { name: "python-performance-optimization", desc: "Profiling and optimizing bottlenecks using cProfile and memory diagnostics.", cat: "language", source: "Global Config" },
735
- { name: "golang-pro", desc: "Modern Go patterns, interface design, testing, and performance optimization.", cat: "language", source: "Global Config" },
736
- { name: "go-concurrency-patterns", desc: "Goroutines, channels, sync primitives, context, and worker pool patterns.", cat: "language", source: "Global Config" },
737
- { name: "go-playwright", desc: "Browser automation using Playwright in Go environments.", cat: "language", source: "Global Config" },
738
- // Populate remaining 84 general utility skills as compact references to reach 140
739
- { name: "agent-manager-skill", desc: "Manage multiple local CLI agents via tmux sessions with cron-friendly scheduling.", cat: "general", source: "Global Config" },
740
- { name: "agent-memory-mcp", desc: "Persistent, searchable knowledge management for AI agents.", cat: "general", source: "Global Config" },
741
- { name: "agent-orchestrator", desc: "Meta-skill coordinating skills, capability scanning, and multi-skill workflows.", cat: "general", source: "Global Config" },
742
- { name: "agent-tool-builder", desc: "Guidelines for creating resilient, token-efficient MCP tool schemas.", cat: "general", source: "Global Config" },
743
- { name: "ai-agent-development", desc: "Multi-agent orchestration workflow with CrewAI and LangGraph.", cat: "general", source: "Global Config" },
744
- { name: "ai-product", desc: "Designing production-ready AI products with guardrails and evaluation metrics.", cat: "general", source: "Global Config" },
745
- { name: "antigravity-guide", desc: "Comprehensive guide for Antigravity CLI, IDE, and configurations.", cat: "general", source: "Global Legacy" },
746
- { name: "apify-lead-generation", desc: "Scrape leads from multiple social/business directories using Apify Actors.", cat: "general", source: "Global Config" },
747
- { name: "apify-ultimate-scraper", desc: "AI-driven extraction using 55+ Apify Actors automatically selected.", cat: "general", source: "Global Config" },
748
- { name: "architect-review", desc: "Software architect reviews for scalability, clean code, and design patterns.", cat: "general", source: "Global Config" },
749
- { name: "bash-linux", desc: "Terminal patterns, pipe operations, scripting conventions, and safety flags.", cat: "general", source: "Global Config" },
750
- { name: "brainstorming", desc: "Disciplined brainstorming rules to validate and refine vague requirements.", cat: "general", source: "Global Legacy" },
751
- { name: "browser-automation", desc: "Web automation patterns using Playwright, anti-detection, and wait selectors.", cat: "general", source: "Global Config" },
752
- { name: "clean-code", desc: " Robert C. Martin's Clean Code principles implemented for modern coding standard.", cat: "general", source: "Global Config" },
753
- { name: "concise-planning", desc: "Generate brief, atomic implementation plans and checklist artifacts.", cat: "general", source: "Global Config" },
754
- { name: "copywriting", desc: "High-conversion marketing copy and email frameworks without fabrication.", cat: "general", source: "Global Config" },
755
- { name: "crewai", desc: "Role-based multi-agent development with the CrewAI framework.", cat: "general", source: "Global Config" },
756
- { name: "debugger", desc: "Specialist debugging guidelines for fixing failures and runtime crashes.", cat: "general", source: "Global Config" },
757
- { name: "deep-research", desc: "Recursive web searching and reporting agent strategy.", cat: "general", source: "Global Config" },
758
- { name: "design-spells", desc: "UI design micro-interactions, gradients, animations, and typography spells.", cat: "general", source: "Global Config" },
759
- { name: "documentation", desc: "Generate clean API documentations, architecture summaries, and docstrings.", cat: "general", source: "Global Config" },
760
- { name: "executing-plans", desc: "Executing step-by-step plans with user checkpoints.", cat: "general", source: "Global Config" },
761
- { name: "gemini-api-dev", desc: "Gemini API capabilities, prompt tokens, and multi-modal handling.", cat: "general", source: "Global Config" },
762
- { name: "gemini-api-integration", desc: "Integrating Gemini SDK, function calling, structured JSON output, and streaming.", cat: "general", source: "Global Config" },
763
- { name: "geo-fundamentals", desc: "Optimization for AI search engines (Generative Engine Optimization).", cat: "general", source: "Global Config" },
764
- { name: "google-sheets-automation", desc: "Interact with Google Sheets API directly with OAuth credentials.", cat: "general", source: "Global Config" },
765
- { name: "landing-page-generator", desc: "Generates high-converting Next.js layouts using conversion copy frameworks.", cat: "general", source: "Global Config" },
766
- { name: "linear-claude-skill", desc: "Manage Linear project spaces, issues, tasks, and teams.", cat: "general", source: "Global Config" },
767
- { name: "llm-app-patterns", desc: "Production patterns for LLM chains, evaluation, and prompt templates.", cat: "general", source: "Global Config" },
768
- { name: "llm-application-dev-ai-assistant", desc: "Building intelligent chatbots and conversational interfaces.", cat: "general", source: "Global Config" },
769
- { name: "llm-prompt-optimizer", desc: "Optimizing prompts to save tokens and improve deterministic results.", cat: "general", source: "Global Config" },
770
- { name: "llm-structured-output", desc: "Enforce JSON output schemas on Anthropic, OpenAI, and Gemini models.", cat: "general", source: "Global Config" },
771
- { name: "local-llm-expert", desc: "Running local models with Ollama, llama.cpp, and memory optimizations.", cat: "general", source: "Global Config" },
772
- { name: "modern-javascript-patterns", desc: "ES6+, functional JS, memory optimization, and modern runtime architecture.", cat: "general", source: "Global Config" },
773
- { name: "n8n-code-javascript", desc: "Write Javascript scripts inside n8n Code nodes using $json context.", cat: "general", source: "Global Config" },
774
- { name: "n8n-code-python", desc: "Write Python scripts inside n8n Code nodes.", cat: "general", source: "Global Config" },
775
- { name: "n8n-expression-syntax", desc: "Validate and troubleshoot double-curly syntax expressions in n8n.", cat: "general", source: "Global Config" },
776
- { name: "n8n-mcp-tools-expert", desc: "Accessing and configuring n8n-mcp server tools.", cat: "general", source: "Global Config" },
777
- { name: "n8n-workflow-patterns", desc: "Workflow architectures, loops, errors, and conditional branches in n8n.", cat: "general", source: "Global Config" },
778
- { name: "nextjs-app-router-patterns", desc: "App router structure, Server Components, and Server Actions guidelines.", cat: "general", source: "Global Config" },
779
- { name: "nextjs-best-practices", desc: "Vercel-aligned Next.js performance and routing guidelines.", cat: "general", source: "Global Config" },
780
- { name: "notion-automation", desc: "Interact with Notion databases, blocks, and pages via MCP.", cat: "general", source: "Global Config" },
781
- { name: "obsidian-markdown", desc: "Writing and manipulating Obsidian-flavored MD (wikilinks, properties).", cat: "general", source: "Global Config" },
782
- { name: "openapi-spec-generation", desc: "Maintaining API OpenAPI/Swagger specifications.", cat: "general", source: "Global Config" },
783
- { name: "os-scripting", desc: "Writing and debugging Shell scripts, PowerShell, and AppleScript.", cat: "general", source: "Global Config" },
784
- { name: "planning-with-files", desc: "Working with persistent markdown plan files in the workspace (Manus-style).", cat: "general", source: "Global Config" },
785
- { name: "playwright-skill", desc: "Configuration for browser testing with Playwright.", cat: "general", source: "Global Config" },
786
- { name: "posix-shell-pro", desc: "Writing ultra-portable POSIX sh scripts without bashisms.", cat: "general", source: "Global Config" },
787
- { name: "product-manager-toolkit", desc: "PRDs, roadmap templates, product discovery, and scoping methods.", cat: "general", source: "Global Config" },
788
- { name: "programmatic-seo", desc: "Generating landing pages dynamically based on templates and CSV data.", cat: "general", source: "Global Config" },
789
- { name: "prompt-engineer", desc: "Frameworks for prompt design (Chain of Thought, RODES, clear).", cat: "general", source: "Global Config" },
790
- { name: "prompt-engineering-patterns", desc: "Advanced prompting tactics for complex multi-turn reasoning.", cat: "general", source: "Global Config" },
791
- { name: "readme", desc: "Absurdly thorough project README generation template.", cat: "general", source: "Global Config" },
792
- { name: "remotion", desc: "Generate programmatic video renderings in code using Remotion.js.", cat: "general", source: "Global Config" },
793
- { name: "schema-markup", desc: "Implement schema.org JSON-LD microdata for rich search results.", cat: "general", source: "Global Config" },
794
- { name: "senior-frontend", desc: "General frontend guidelines, bundle sizes, accessibility, and quality.", cat: "general", source: "Global Config" },
795
- { name: "senior-fullstack", desc: "Architectural guidelines for full-stack applications.", cat: "general", source: "Global Config" },
796
- { name: "seo", desc: "Technical, content, and search ranking audit workflows.", cat: "general", source: "Global Config" },
797
- { name: "seo-audit", desc: "Diagnosing SEO crawlability and indexation issues.", cat: "general", source: "Global Config" },
798
- { name: "seo-technical", desc: "Robots.txt, structured data, Core Web Vitals, and mobile SEO audits.", cat: "general", source: "Global Config" },
799
- { name: "simplify-code", desc: "Safe simplification and refactoring of complex code structures.", cat: "general", source: "Global Config" },
800
- { name: "slack-automation", desc: "Slack workspace interactions via API (messaging, search).", cat: "general", source: "Global Config" },
801
- { name: "software-architecture", desc: "General architectural patterns, decoupling, and domain logic.", cat: "general", source: "Global Config" },
802
- { name: "subagent-driven-development", desc: "Running complex coding implementations using independent subagents.", cat: "general", source: "Global Config" },
803
- { name: "systematic-debugging", desc: "Root-cause tracing, test pressure, and logic debugging rules.", cat: "general", source: "Global Config" },
804
- { name: "tailwind-patterns", desc: "Tailwind CSS v4 guidelines, CSS configuration, and design tokens.", cat: "general", source: "Global Config" },
805
- { name: "tanstack-query-expert", desc: "Server-state management using TanStack Query.", cat: "general", source: "Global Config" },
806
- { name: "tdd-workflow", desc: "Red-Green-Refactor test cycle principles.", cat: "general", source: "Global Config" },
807
- { name: "test-driven-development", desc: "Write failing tests first before writing implementation code.", cat: "general", source: "Global Config" },
808
- { name: "tmux", desc: "Manage windows and sessions in tmux for persistent background tasks.", cat: "general", source: "Global Config" },
809
- { name: "typescript-pro", desc: "Strict type safety, generics, decorator patterns, and compiler rules.", cat: "general", source: "Global Config" },
810
- { name: "ui-component", desc: "Generate modular visual components matching visual system tokens.", cat: "general", source: "Global Config" },
811
- { name: "ui-page", desc: "Layout guidelines for scaffolding mobile-first view pages.", cat: "general", source: "Global Config" },
812
- { name: "ui-pattern", desc: "Design systems reusable layouts (grids, list cards, shell components).", cat: "general", source: "Global Config" },
813
- { name: "ui-review", desc: "Reviewing code for UI design system adherence and visual alignment.", cat: "general", source: "Global Config" },
814
- { name: "ui-tokens", desc: "Configuring typography, color variables, spacing, and dark mode tokens.", cat: "general", source: "Global Config" },
815
- { name: "ux-audit", desc: "Nielsen's usability heuristic reviews for mobile and desktop screens.", cat: "general", source: "Global Config" },
816
- { name: "ux-feedback", desc: "Add loading indicators, empty states, and feedback messages to pages.", cat: "general", source: "Global Config" },
817
- { name: "ux-flow", desc: "Designing visual layouts and progression paths (hub-and-spoke).", cat: "general", source: "Global Config" },
818
- { name: "ux-persuasion-engineer", desc: "Engineering UX features for user engagement and retention.", cat: "general", source: "Global Config" },
819
- { name: "vercel-ai-sdk-expert", desc: "Streaming UIs and function calling using Vercel AI SDK.", cat: "general", source: "Global Config" },
820
- { name: "wcag-audit-patterns", desc: "Accessibility audits complying with WCAG 2.2 guidelines.", cat: "general", source: "Global Config" },
821
- { name: "web-artifacts-builder", desc: "Building powerful HTML previews, bundled widgets, and interactive apps.", cat: "general", source: "Global Config" },
822
- { name: "web-performance-optimization", desc: "Core Web Vitals, speed indexing, caching, and compression optimization.", cat: "general", source: "Global Config" },
823
- { name: "web-scraper", desc: "Multi-strategy web scraping, tables, CSV export, and pagination handling.", cat: "general", source: "Global Config" },
824
- { name: "webapp-testing", desc: "Write Playwright tests in Python to test web applications.", cat: "general", source: "Global Config" },
825
- { name: "writing-plans", desc: "Requirements scoping and building structured plan.md checksheets.", cat: "general", source: "Global Config" }
826
- ];
827
-
828
- // Populate skills on load
829
- const container = document.getElementById('skills-container');
830
- let activeCategory = 'all';
831
- let searchQuery = '';
832
-
833
- function renderSkills() {
834
- container.innerHTML = '';
835
-
836
- const filtered = skillsData.filter(skill => {
837
- const matchesCat = activeCategory === 'all' ||
838
- (activeCategory === 'custom' && skill.cat === 'custom') ||
839
- (activeCategory === 'mcp' && skill.cat === 'mcp') ||
840
- (activeCategory === 'frontend' && skill.cat === 'frontend') ||
841
- (activeCategory === 'backend' && skill.cat === 'backend') ||
842
- (activeCategory === 'devops' && skill.cat === 'devops') ||
843
- (activeCategory === 'language' && skill.cat === 'language') ||
844
- (activeCategory === 'general' && skill.cat === 'general');
845
-
846
- const matchesSearch = skill.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
847
- skill.desc.toLowerCase().includes(searchQuery.toLowerCase());
848
-
849
- return matchesCat && matchesSearch;
850
- });
851
-
852
- if (filtered.length === 0) {
853
- container.innerHTML = `
854
- <div style="grid-column: 1/-1; text-align: center; padding: 40px; color: var(--text-muted);">
855
- No skills found matching your search.
856
- </div>
857
- `;
858
- return;
859
- }
860
-
861
- filtered.forEach(skill => {
862
- const card = document.createElement('div');
863
- card.className = 'skill-item-card';
864
- card.onclick = () => openSkillModal(skill.name);
865
-
866
- let sourceBadgeColor = 'var(--secondary)';
867
- if (skill.cat === 'custom') sourceBadgeColor = 'var(--secondary)';
868
- else if (skill.cat === 'mcp') sourceBadgeColor = 'var(--primary)';
869
-
870
- card.innerHTML = `
871
- <div class="skill-source" style="color: ${sourceBadgeColor}">${skill.source}</div>
872
- <h4>${skill.name}</h4>
873
- <p>${skill.desc}</p>
874
- `;
875
- container.appendChild(card);
876
- });
877
- }
878
-
879
- function filterCategory(cat) {
880
- activeCategory = cat;
881
-
882
- // Update active state in buttons
883
- const buttons = document.querySelectorAll('.category-btn');
884
- buttons.forEach(btn => {
885
- if (btn.getAttribute('onclick').includes(`'${cat}'`)) {
886
- btn.classList.add('active');
887
- } else {
888
- btn.classList.remove('active');
889
- }
890
- });
891
-
892
- renderSkills();
893
- }
894
-
895
- function searchSkills(query) {
896
- searchQuery = query;
897
- renderSkills();
898
- }
899
-
900
- // Modal Functions
901
- function openSkillModal(name) {
902
- const skill = skillsData.find(s => s.name === name);
903
- if (!skill) return;
904
-
905
- document.getElementById('modal-title').innerText = skill.name;
906
- document.getElementById('modal-desc').innerText = skill.desc;
907
-
908
- let pathPrefix = '~/.gemini/config/skills/';
909
- if (skill.source === 'Workspace Agents') {
910
- pathPrefix = '.agents/skills/';
911
- } else if (skill.source === 'Global Legacy') {
912
- pathPrefix = '~/.gemini/skills/';
913
- }
914
-
915
- document.getElementById('modal-path').innerHTML = `Location: <strong>${pathPrefix}${skill.name}/</strong>`;
916
-
917
- document.getElementById('skill-modal').classList.add('active');
918
- }
919
-
920
- function closeModal(event) {
921
- document.getElementById('skill-modal').classList.remove('active');
922
- }
923
-
924
- // Initialize
925
- renderSkills();
926
- </script>
927
- </body>
928
- </html>