@bakapiano/ccsm 0.22.6 → 0.22.7

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 (58) hide show
  1. package/CLAUDE.md +538 -538
  2. package/README.md +189 -189
  3. package/bin/ccsm.js +235 -235
  4. package/lib/cliActivity.js +139 -139
  5. package/lib/codexSeed.js +183 -183
  6. package/lib/config.js +279 -274
  7. package/lib/devices.js +229 -229
  8. package/lib/folders.js +124 -124
  9. package/lib/localCliSessions.js +519 -519
  10. package/lib/persistedSessions.js +129 -129
  11. package/lib/tunnel.js +621 -621
  12. package/lib/webTerminal.js +225 -225
  13. package/lib/workspace.js +233 -233
  14. package/package.json +57 -57
  15. package/public/css/base.css +99 -99
  16. package/public/css/cards.css +183 -183
  17. package/public/css/feedback.css +504 -504
  18. package/public/css/forms.css +453 -453
  19. package/public/css/layout.css +154 -154
  20. package/public/css/modal.css +190 -190
  21. package/public/css/responsive.css +176 -176
  22. package/public/css/sidebar.css +707 -707
  23. package/public/css/terminals.css +546 -546
  24. package/public/css/tokens.css +81 -81
  25. package/public/css/wco.css +196 -196
  26. package/public/css/widgets.css +2725 -2725
  27. package/public/index.html +152 -152
  28. package/public/js/api.js +371 -371
  29. package/public/js/backend.js +149 -149
  30. package/public/js/components/App.js +73 -73
  31. package/public/js/components/DirectoryPicker.js +203 -203
  32. package/public/js/components/EntityFormModal.js +153 -153
  33. package/public/js/components/Modal.js +57 -57
  34. package/public/js/components/OfflineBanner.js +67 -67
  35. package/public/js/components/PageTitleBar.js +13 -13
  36. package/public/js/components/PendingApprovalOverlay.js +128 -128
  37. package/public/js/components/Picker.js +179 -179
  38. package/public/js/components/Popover.js +55 -55
  39. package/public/js/components/RestartOverlay.js +36 -36
  40. package/public/js/components/Sidebar.js +380 -380
  41. package/public/js/components/TerminalInstance.js +28 -0
  42. package/public/js/components/useDragSort.js +67 -67
  43. package/public/js/dialog.js +67 -67
  44. package/public/js/icons.js +212 -212
  45. package/public/js/main.js +296 -296
  46. package/public/js/pages/AboutPage.js +90 -90
  47. package/public/js/pages/ConfigurePage.js +728 -713
  48. package/public/js/pages/LaunchPage.js +421 -421
  49. package/public/js/pages/RemotePage.js +743 -743
  50. package/public/js/pages/SessionsPage.js +53 -53
  51. package/public/js/state.js +335 -335
  52. package/scripts/dev.js +149 -149
  53. package/scripts/install.js +153 -153
  54. package/scripts/restart-helper.js +96 -96
  55. package/scripts/upgrade-helper.js +687 -687
  56. package/server.js +1820 -1807
  57. package/public/manifest.webmanifest +0 -25
  58. package/public/setup/index.html +0 -567
package/public/css/layout.css CHANGED
@@ -1,157 +1,157 @@
1
- /* App grid · main column · page header · tab panels · footer status line */
2
-
3
- .app {
4
- display: grid;
5
- grid-template-columns: var(--sidebar-w) 1fr;
6
- height: 100vh;
7
- /* Pin to viewport height (not min-height) — child flex columns set
8
- min-height:0 and rely on a bounded parent height to compute their own
9
- space. With min-height:100vh, a transient xterm resize that briefly
10
- reports a too-large cell count makes the WebGL canvas grow, .session-pane
11
- grows to fit, .main grows, .app grows... cascading into a multi-hundred-
12
- thousand-pixel tall page. height:100vh caps the cascade. */
13
- transition: grid-template-columns .25s cubic-bezier(.4, 0, .2, 1);
14
- }
15
- .app:has(.sidebar[data-collapsed="true"]) {
16
- grid-template-columns: var(--sidebar-w-collapsed) 1fr;
17
- }
18
- /* While dragging the sidebar resize handle, kill the transition so the
19
- grid tracks pointermove pixel-for-pixel instead of lagging behind. */
20
- body.is-resizing-sidebar .app {
21
- transition: none;
22
- }
23
-
24
- .main {
25
- display: flex;
26
- flex-direction: column;
27
- min-width: 0;
28
- /* grid items default to min-height:auto which lets internal content
29
- (eg a misbehaving xterm canvas that briefly reports an absurd height)
30
- overflow the grid track and balloon the whole page. min-height:0
31
- restores the expected "fit my grid cell" behaviour. */
32
- min-height: 0;
33
- padding: 0 var(--s-4);
34
- gap: var(--s-2);
35
- /* .settings-scroll inside uses `margin-right: -var(--s-4)` to bleed
36
- past .main's padding so its scrollbar sits flush with the window
37
- edge. Without this clip that 16-px bleed propagates up to <body>
38
- and shows a permanent horizontal scrollbar on every page. Vertical
39
- scrolling stays inside .settings-scroll itself (overflow-y:auto)
40
- so this clip doesn't suppress anything legitimate. */
41
- overflow-x: hidden;
42
- }
43
-
44
- .page-head {
45
- display: flex;
46
- align-items: flex-start;
47
- justify-content: space-between;
48
- gap: var(--s-8);
49
- padding-bottom: var(--s-5);
50
- border-bottom: 1px solid var(--border);
51
- }
52
- .page-head-inner { min-width: 0; }
53
-
54
- .page-title {
55
- font-family: var(--display);
56
- font-size: 26px;
57
- font-weight: 600;
58
- letter-spacing: -0.024em;
59
- color: var(--ink);
60
- line-height: 1.1;
61
- }
62
- .page-subtitle {
63
- margin-top: 4px;
64
- font-size: 13.5px;
65
- color: var(--ink-mid);
66
- }
67
-
68
- .page-head-meta {
69
- display: flex;
70
- align-items: baseline;
71
- gap: var(--s-3);
72
- flex-shrink: 0;
73
- white-space: nowrap;
74
- font-family: var(--mono);
75
- font-size: 11px;
76
- color: var(--ink-muted);
77
- }
78
- .ph-stat { display: inline-flex; gap: 6px; align-items: baseline; }
79
- .ph-key {
80
- font-family: var(--body);
81
- font-size: 10.5px;
82
- letter-spacing: 0.06em;
83
- text-transform: uppercase;
84
- color: var(--ink-faint);
85
- }
86
- .ph-val { color: var(--ink-mid); }
87
- .ph-divider { color: var(--ink-faint); }
88
-
89
- .content {
90
- flex: 1;
91
- display: flex;
92
- flex-direction: column;
93
- min-height: 0;
94
- }
95
-
96
- .tab-panel {
97
- display: none;
98
- flex-direction: column;
99
- gap: var(--s-4);
100
- min-height: 0;
101
- }
102
- .tab-panel[data-active] {
103
- display: flex;
104
- flex: 1;
105
- }
106
-
107
- /* Per-page title strip — height matches the sidebar collapse-toggle
108
- (28px) so the topmost row of the window reads as one unified band.
109
- Title on the left, actions slot on the right. The WCO padding-right
110
- reservation (wco.css) shifts actions inward so they clear the OS
111
- window controls overlay. */
112
- .page-title-bar {
113
- display: flex;
114
- flex-direction: row;
115
- align-items: center;
116
- justify-content: space-between;
117
- gap: var(--s-3);
118
- /* `max(36px, …)` floors the anti-zoom shrink — at heavy page zoom the
119
- counter-scale would otherwise collapse the strip past readable
120
- (e.g. 250% zoom → ~16px, title text overlaps the action row). */
121
- height: max(36px, calc(40px * var(--anti-zoom, 1)));
122
- min-height: max(36px, calc(40px * var(--anti-zoom, 1)));
123
- max-height: max(36px, calc(40px * var(--anti-zoom, 1)));
124
- flex-shrink: 0;
125
- box-sizing: border-box;
126
- margin: 0 calc(-1 * var(--s-4)) 0;
127
- padding: 0 var(--s-5);
128
- /* Bottom divider matches the sidebar's right border exactly — same
129
- 1px solid var(--ui-border) — so the header underline and the
130
- sidebar/main divider read as one continuous frame. */
131
- border-bottom: 1px solid var(--ui-border);
132
- color: var(--ink);
133
- font-size: 13px;
134
- font-weight: 400;
135
- line-height: 1.4;
136
- }
137
- .page-title-bar-title {
138
- margin: 0;
139
- font-size: 13px;
140
- font-weight: 400;
141
- display: flex;
142
- align-items: center;
143
- gap: var(--s-2);
144
- min-width: 0;
145
- flex: 1;
146
- overflow: hidden;
147
- line-height: 1.4;
148
- }
149
- .page-title-bar-actions {
150
- display: flex;
151
- align-items: center;
152
- gap: var(--s-2);
153
- flex-shrink: 0;
154
- }
1
+ /* App grid · main column · page header · tab panels · footer status line */
2
+
3
+ .app {
4
+ display: grid;
5
+ grid-template-columns: var(--sidebar-w) 1fr;
6
+ height: 100vh;
7
+ /* Pin to viewport height (not min-height) — child flex columns set
8
+ min-height:0 and rely on a bounded parent height to compute their own
9
+ space. With min-height:100vh, a transient xterm resize that briefly
10
+ reports a too-large cell count makes the WebGL canvas grow, .session-pane
11
+ grows to fit, .main grows, .app grows... cascading into a multi-hundred-
12
+ thousand-pixel tall page. height:100vh caps the cascade. */
13
+ transition: grid-template-columns .25s cubic-bezier(.4, 0, .2, 1);
14
+ }
15
+ .app:has(.sidebar[data-collapsed="true"]) {
16
+ grid-template-columns: var(--sidebar-w-collapsed) 1fr;
17
+ }
18
+ /* While dragging the sidebar resize handle, kill the transition so the
19
+ grid tracks pointermove pixel-for-pixel instead of lagging behind. */
20
+ body.is-resizing-sidebar .app {
21
+ transition: none;
22
+ }
23
+
24
+ .main {
25
+ display: flex;
26
+ flex-direction: column;
27
+ min-width: 0;
28
+ /* grid items default to min-height:auto which lets internal content
29
+ (eg a misbehaving xterm canvas that briefly reports an absurd height)
30
+ overflow the grid track and balloon the whole page. min-height:0
31
+ restores the expected "fit my grid cell" behaviour. */
32
+ min-height: 0;
33
+ padding: 0 var(--s-4);
34
+ gap: var(--s-2);
35
+ /* .settings-scroll inside uses `margin-right: -var(--s-4)` to bleed
36
+ past .main's padding so its scrollbar sits flush with the window
37
+ edge. Without this clip that 16-px bleed propagates up to <body>
38
+ and shows a permanent horizontal scrollbar on every page. Vertical
39
+ scrolling stays inside .settings-scroll itself (overflow-y:auto)
40
+ so this clip doesn't suppress anything legitimate. */
41
+ overflow-x: hidden;
42
+ }
43
+
44
+ .page-head {
45
+ display: flex;
46
+ align-items: flex-start;
47
+ justify-content: space-between;
48
+ gap: var(--s-8);
49
+ padding-bottom: var(--s-5);
50
+ border-bottom: 1px solid var(--border);
51
+ }
52
+ .page-head-inner { min-width: 0; }
53
+
54
+ .page-title {
55
+ font-family: var(--display);
56
+ font-size: 26px;
57
+ font-weight: 600;
58
+ letter-spacing: -0.024em;
59
+ color: var(--ink);
60
+ line-height: 1.1;
61
+ }
62
+ .page-subtitle {
63
+ margin-top: 4px;
64
+ font-size: 13.5px;
65
+ color: var(--ink-mid);
66
+ }
67
+
68
+ .page-head-meta {
69
+ display: flex;
70
+ align-items: baseline;
71
+ gap: var(--s-3);
72
+ flex-shrink: 0;
73
+ white-space: nowrap;
74
+ font-family: var(--mono);
75
+ font-size: 11px;
76
+ color: var(--ink-muted);
77
+ }
78
+ .ph-stat { display: inline-flex; gap: 6px; align-items: baseline; }
79
+ .ph-key {
80
+ font-family: var(--body);
81
+ font-size: 10.5px;
82
+ letter-spacing: 0.06em;
83
+ text-transform: uppercase;
84
+ color: var(--ink-faint);
85
+ }
86
+ .ph-val { color: var(--ink-mid); }
87
+ .ph-divider { color: var(--ink-faint); }
88
+
89
+ .content {
90
+ flex: 1;
91
+ display: flex;
92
+ flex-direction: column;
93
+ min-height: 0;
94
+ }
95
+
96
+ .tab-panel {
97
+ display: none;
98
+ flex-direction: column;
99
+ gap: var(--s-4);
100
+ min-height: 0;
101
+ }
102
+ .tab-panel[data-active] {
103
+ display: flex;
104
+ flex: 1;
105
+ }
106
+
107
+ /* Per-page title strip — height matches the sidebar collapse-toggle
108
+ (28px) so the topmost row of the window reads as one unified band.
109
+ Title on the left, actions slot on the right. The WCO padding-right
110
+ reservation (wco.css) shifts actions inward so they clear the OS
111
+ window controls overlay. */
112
+ .page-title-bar {
113
+ display: flex;
114
+ flex-direction: row;
115
+ align-items: center;
116
+ justify-content: space-between;
117
+ gap: var(--s-3);
118
+ /* `max(36px, …)` floors the anti-zoom shrink — at heavy page zoom the
119
+ counter-scale would otherwise collapse the strip past readable
120
+ (e.g. 250% zoom → ~16px, title text overlaps the action row). */
121
+ height: max(36px, calc(40px * var(--anti-zoom, 1)));
122
+ min-height: max(36px, calc(40px * var(--anti-zoom, 1)));
123
+ max-height: max(36px, calc(40px * var(--anti-zoom, 1)));
124
+ flex-shrink: 0;
125
+ box-sizing: border-box;
126
+ margin: 0 calc(-1 * var(--s-4)) 0;
127
+ padding: 0 var(--s-5);
128
+ /* Bottom divider matches the sidebar's right border exactly — same
129
+ 1px solid var(--ui-border) — so the header underline and the
130
+ sidebar/main divider read as one continuous frame. */
131
+ border-bottom: 1px solid var(--ui-border);
132
+ color: var(--ink);
133
+ font-size: 13px;
134
+ font-weight: 400;
135
+ line-height: 1.4;
136
+ }
137
+ .page-title-bar-title {
138
+ margin: 0;
139
+ font-size: 13px;
140
+ font-weight: 400;
141
+ display: flex;
142
+ align-items: center;
143
+ gap: var(--s-2);
144
+ min-width: 0;
145
+ flex: 1;
146
+ overflow: hidden;
147
+ line-height: 1.4;
148
+ }
149
+ .page-title-bar-actions {
150
+ display: flex;
151
+ align-items: center;
152
+ gap: var(--s-2);
153
+ flex-shrink: 0;
154
+ }
155
155
  .session-title-text {
156
156
  font-weight: 500;
157
157
  font-size: 13px;