@bakapiano/ccsm 0.10.3 → 0.12.0

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 (51) hide show
  1. package/CLAUDE.md +475 -475
  2. package/README.md +190 -190
  3. package/bin/ccsm.js +194 -194
  4. package/lib/atomicJson.js +48 -0
  5. package/lib/cliSessionWatcher.js +249 -249
  6. package/lib/config.js +188 -185
  7. package/lib/folders.js +105 -96
  8. package/lib/jsonStore.js +15 -10
  9. package/lib/localCliSessions.js +489 -177
  10. package/lib/persistedSessions.js +142 -134
  11. package/lib/webTerminal.js +208 -208
  12. package/lib/workspace.js +230 -255
  13. package/package.json +57 -57
  14. package/public/css/base.css +99 -99
  15. package/public/css/cards.css +183 -183
  16. package/public/css/feedback.css +303 -303
  17. package/public/css/forms.css +405 -405
  18. package/public/css/layout.css +160 -160
  19. package/public/css/modal.css +190 -183
  20. package/public/css/responsive.css +10 -10
  21. package/public/css/sidebar.css +608 -601
  22. package/public/css/terminals.css +294 -294
  23. package/public/css/tokens.css +81 -79
  24. package/public/css/wco.css +98 -98
  25. package/public/css/widgets.css +1596 -1375
  26. package/public/index.html +105 -103
  27. package/public/js/api.js +272 -260
  28. package/public/js/components/AdoptModal.js +343 -171
  29. package/public/js/components/App.js +35 -35
  30. package/public/js/components/DirectoryPicker.js +203 -203
  31. package/public/js/components/EntityFormModal.js +105 -105
  32. package/public/js/components/Modal.js +51 -51
  33. package/public/js/components/OfflineBanner.js +93 -93
  34. package/public/js/components/PageTitleBar.js +13 -13
  35. package/public/js/components/Picker.js +179 -179
  36. package/public/js/components/Popover.js +55 -55
  37. package/public/js/components/Sidebar.js +341 -270
  38. package/public/js/components/TerminalView.js +298 -298
  39. package/public/js/components/useDragSort.js +67 -67
  40. package/public/js/dialog.js +67 -67
  41. package/public/js/icons.js +177 -177
  42. package/public/js/main.js +132 -140
  43. package/public/js/pages/AboutPage.js +165 -165
  44. package/public/js/pages/ConfigurePage.js +475 -487
  45. package/public/js/pages/LaunchPage.js +369 -369
  46. package/public/js/pages/SessionsPage.js +97 -97
  47. package/public/js/state.js +231 -231
  48. package/public/manifest.webmanifest +15 -15
  49. package/scripts/dev.js +59 -0
  50. package/scripts/install.js +137 -137
  51. package/server.js +1147 -1117
package/public/index.html CHANGED
@@ -1,103 +1,105 @@
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" />
6
- <!-- Bleeds the cream surface into the Edge/Chrome --app= title bar
7
- so it visually disappears against the body. The browser does
8
- honor this in standalone app windows. -->
9
- <meta name="theme-color" content="#faf9f5" />
10
- <meta name="color-scheme" content="light" />
11
- <title>CCSM</title>
12
- <!-- All asset paths are RELATIVE so the same index.html works when
13
- served from localhost:7777/ (backend bundle) AND from
14
- https://bakapiano.github.io/ccsm/v1/ (GH Pages hosted). -->
15
- <link rel="icon" type="image/svg+xml" href="./favicon.svg" />
16
- <link rel="manifest" href="./manifest.webmanifest" />
17
- <!-- Apply saved accent color BEFORE stylesheets/paint to avoid a
18
- flash of the default theme. Mirrors applyAccentCssVars() in
19
- state.js (only the bg-tinted vars that affect first paint). -->
20
- <script>
21
- (function () {
22
- try {
23
- var hex = localStorage.getItem('ccsm.accent');
24
- if (!/^#[0-9a-fA-F]{6}$/.test(hex || '')) return;
25
- var n = parseInt(hex.slice(1), 16);
26
- var r = (n >> 16) & 255, g = (n >> 8) & 255, b = n & 255;
27
- var toHex = function (v) { v = Math.max(0, Math.min(255, Math.round(v))); var s = v.toString(16); return s.length < 2 ? '0' + s : s; };
28
- var mix = function (t) { return '#' + toHex(r * t + 255 * (1 - t)) + toHex(g * t + 255 * (1 - t)) + toHex(b * t + 255 * (1 - t)); };
29
- var darken = function (a) { return '#' + toHex(r * (1 - a)) + toHex(g * (1 - a)) + toHex(b * (1 - a)); };
30
- var bg = mix(0.04);
31
- var root = document.documentElement.style;
32
- root.setProperty('--accent', hex);
33
- root.setProperty('--accent-deep', darken(0.2));
34
- root.setProperty('--accent-soft', 'rgba(' + r + ',' + g + ',' + b + ',0.10)');
35
- root.setProperty('--accent-softer', 'rgba(' + r + ',' + g + ',' + b + ',0.04)');
36
- root.setProperty('--bg', bg);
37
- root.setProperty('--sidebar-bg', bg);
38
- root.setProperty('--sidebar-hover', mix(0.10));
39
- root.setProperty('--sidebar-active', mix(0.15));
40
- root.setProperty('--border', mix(0.15));
41
- root.setProperty('--border-soft', mix(0.12));
42
- root.setProperty('--border-strong', mix(0.25));
43
- root.setProperty('--ui-bg', mix(0.10));
44
- var meta = document.querySelector('meta[name="theme-color"]');
45
- if (meta) meta.setAttribute('content', bg);
46
- } catch (_) {}
47
- })();
48
- </script>
49
- <link rel="preconnect" href="https://fonts.googleapis.com" />
50
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
51
- <link
52
- rel="stylesheet"
53
- href="https://fonts.googleapis.com/css2?family=Geist:wght@300..700&family=Geist+Mono:wght@400..600&family=JetBrains+Mono:wght@400..600&display=swap"
54
- />
55
- <link rel="stylesheet" href="./css/tokens.css" />
56
- <link rel="stylesheet" href="./css/base.css" />
57
- <link rel="stylesheet" href="./css/layout.css" />
58
- <link rel="stylesheet" href="./css/sidebar.css" />
59
- <link rel="stylesheet" href="./css/cards.css" />
60
- <link rel="stylesheet" href="./css/tables.css" />
61
- <link rel="stylesheet" href="./css/forms.css" />
62
- <link rel="stylesheet" href="./css/widgets.css" />
63
- <link rel="stylesheet" href="./css/feedback.css" />
64
- <link rel="stylesheet" href="./css/modal.css" />
65
- <link rel="stylesheet" href="./css/terminals.css" />
66
- <link rel="stylesheet" href="./css/wco.css" />
67
- <link rel="stylesheet" href="./css/responsive.css" />
68
-
69
- <script type="importmap">
70
- {
71
- "imports": {
72
- "preact": "https://esm.sh/preact@10.27.0",
73
- "preact/hooks": "https://esm.sh/preact@10.27.0/hooks",
74
- "preact/compat": "https://esm.sh/preact@10.27.0/compat",
75
- "@preact/signals": "https://esm.sh/@preact/signals@1.3.2?deps=preact@10.27.0",
76
- "htm": "https://esm.sh/htm@3.1.1",
77
- "@xterm/xterm": "https://esm.sh/@xterm/xterm@5.5.0",
78
- "@xterm/addon-fit": "https://esm.sh/@xterm/addon-fit@0.10.0?deps=@xterm/xterm@5.5.0",
79
- "@xterm/addon-web-links": "https://esm.sh/@xterm/addon-web-links@0.11.0?deps=@xterm/xterm@5.5.0",
80
- "@xterm/addon-clipboard": "https://esm.sh/@xterm/addon-clipboard@0.1.0?deps=@xterm/xterm@5.5.0",
81
- "@xterm/addon-webgl": "https://esm.sh/@xterm/addon-webgl@0.18.0?deps=@xterm/xterm@5.5.0"
82
- }
83
- }
84
- </script>
85
- <link rel="stylesheet" href="https://esm.sh/@xterm/xterm@5.5.0/css/xterm.css" />
86
- </head>
87
- <body>
88
- <div id="app"></div>
89
- <script type="module" src="./js/main.js"></script>
90
- <script>
91
- // Dev hot-reload — only active when the page itself loads from a
92
- // local backend (the /api/dev/ping endpoint exists only on a dev
93
- // checkout). On the GH Pages copy this skips entirely.
94
- if (location.hostname === 'localhost' || location.hostname === '127.0.0.1') {
95
- fetch('/api/dev/ping', { cache: 'no-store' }).then((r) => {
96
- if (!r.ok) return;
97
- const es = new EventSource('/api/dev/reload');
98
- es.addEventListener('reload', () => location.reload());
99
- }).catch(() => {});
100
- }
101
- </script>
102
- </body>
103
- </html>
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" />
6
+ <!-- Bleeds the cream surface into the Edge/Chrome --app= title bar
7
+ so it visually disappears against the body. The browser does
8
+ honor this in standalone app windows. -->
9
+ <meta name="theme-color" content="#f6f8fa" />
10
+ <meta name="color-scheme" content="light" />
11
+ <title>CCSM</title>
12
+ <!-- All asset paths are RELATIVE so the same index.html works when
13
+ served from localhost:7777/ (backend bundle) AND from
14
+ https://bakapiano.github.io/ccsm/v1/ (GH Pages hosted). -->
15
+ <link rel="icon" type="image/svg+xml" href="./favicon.svg" />
16
+ <link rel="manifest" href="./manifest.webmanifest" />
17
+ <!-- Apply accent color BEFORE stylesheets/paint to avoid a flash
18
+ of the default warm-cream tokens.css bg. Mirrors
19
+ applyAccentCssVars() in state.js. Falls back to the Ocean
20
+ default (#2f6fa3) when no accent is saved so first-time
21
+ visitors also see the correct bg from the first frame. -->
22
+ <script>
23
+ (function () {
24
+ try {
25
+ var hex = localStorage.getItem('ccsm.accent');
26
+ if (!/^#[0-9a-fA-F]{6}$/.test(hex || '')) hex = '#2f6fa3';
27
+ var n = parseInt(hex.slice(1), 16);
28
+ var r = (n >> 16) & 255, g = (n >> 8) & 255, b = n & 255;
29
+ var toHex = function (v) { v = Math.max(0, Math.min(255, Math.round(v))); var s = v.toString(16); return s.length < 2 ? '0' + s : s; };
30
+ var mix = function (t) { return '#' + toHex(r * t + 255 * (1 - t)) + toHex(g * t + 255 * (1 - t)) + toHex(b * t + 255 * (1 - t)); };
31
+ var darken = function (a) { return '#' + toHex(r * (1 - a)) + toHex(g * (1 - a)) + toHex(b * (1 - a)); };
32
+ var bg = mix(0.04);
33
+ var root = document.documentElement.style;
34
+ root.setProperty('--accent', hex);
35
+ root.setProperty('--accent-deep', darken(0.2));
36
+ root.setProperty('--accent-soft', 'rgba(' + r + ',' + g + ',' + b + ',0.10)');
37
+ root.setProperty('--accent-softer', 'rgba(' + r + ',' + g + ',' + b + ',0.04)');
38
+ root.setProperty('--bg', bg);
39
+ root.setProperty('--sidebar-bg', bg);
40
+ root.setProperty('--sidebar-hover', mix(0.10));
41
+ root.setProperty('--sidebar-active', mix(0.15));
42
+ root.setProperty('--border', mix(0.15));
43
+ root.setProperty('--border-soft', mix(0.12));
44
+ root.setProperty('--border-strong', mix(0.25));
45
+ root.setProperty('--ui-bg', mix(0.10));
46
+ var meta = document.querySelector('meta[name="theme-color"]');
47
+ if (meta) meta.setAttribute('content', bg);
48
+ } catch (_) {}
49
+ })();
50
+ </script>
51
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
52
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
53
+ <link
54
+ rel="stylesheet"
55
+ href="https://fonts.googleapis.com/css2?family=Geist:wght@300..700&family=Geist+Mono:wght@400..600&family=JetBrains+Mono:wght@400..600&display=swap"
56
+ />
57
+ <link rel="stylesheet" href="./css/tokens.css" />
58
+ <link rel="stylesheet" href="./css/base.css" />
59
+ <link rel="stylesheet" href="./css/layout.css" />
60
+ <link rel="stylesheet" href="./css/sidebar.css" />
61
+ <link rel="stylesheet" href="./css/cards.css" />
62
+ <link rel="stylesheet" href="./css/tables.css" />
63
+ <link rel="stylesheet" href="./css/forms.css" />
64
+ <link rel="stylesheet" href="./css/widgets.css" />
65
+ <link rel="stylesheet" href="./css/feedback.css" />
66
+ <link rel="stylesheet" href="./css/modal.css" />
67
+ <link rel="stylesheet" href="./css/terminals.css" />
68
+ <link rel="stylesheet" href="./css/wco.css" />
69
+ <link rel="stylesheet" href="./css/responsive.css" />
70
+
71
+ <script type="importmap">
72
+ {
73
+ "imports": {
74
+ "preact": "https://esm.sh/preact@10.27.0",
75
+ "preact/hooks": "https://esm.sh/preact@10.27.0/hooks",
76
+ "preact/compat": "https://esm.sh/preact@10.27.0/compat",
77
+ "@preact/signals": "https://esm.sh/@preact/signals@1.3.2?deps=preact@10.27.0",
78
+ "htm": "https://esm.sh/htm@3.1.1",
79
+ "@xterm/xterm": "https://esm.sh/@xterm/xterm@5.5.0",
80
+ "@xterm/addon-fit": "https://esm.sh/@xterm/addon-fit@0.10.0?deps=@xterm/xterm@5.5.0",
81
+ "@xterm/addon-web-links": "https://esm.sh/@xterm/addon-web-links@0.11.0?deps=@xterm/xterm@5.5.0",
82
+ "@xterm/addon-clipboard": "https://esm.sh/@xterm/addon-clipboard@0.1.0?deps=@xterm/xterm@5.5.0",
83
+ "@xterm/addon-webgl": "https://esm.sh/@xterm/addon-webgl@0.18.0?deps=@xterm/xterm@5.5.0"
84
+ }
85
+ }
86
+ </script>
87
+ <link rel="stylesheet" href="https://esm.sh/@xterm/xterm@5.5.0/css/xterm.css" />
88
+ </head>
89
+ <body>
90
+ <div id="app"></div>
91
+ <script type="module" src="./js/main.js"></script>
92
+ <script>
93
+ // Dev hot-reload — only active when the page itself loads from a
94
+ // local backend (the /api/dev/ping endpoint exists only on a dev
95
+ // checkout). On the GH Pages copy this skips entirely.
96
+ if (location.hostname === 'localhost' || location.hostname === '127.0.0.1') {
97
+ fetch('/api/dev/ping', { cache: 'no-store' }).then((r) => {
98
+ if (!r.ok) return;
99
+ const es = new EventSource('/api/dev/reload');
100
+ es.addEventListener('reload', () => location.reload());
101
+ }).catch(() => {});
102
+ }
103
+ </script>
104
+ </body>
105
+ </html>