@volter-ai-dev/supercode-ui 0.1.5 → 0.1.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 (10) hide show
  1. package/components.mjs +11 -1
  2. package/conversation.d.ts +1 -0
  3. package/conversation.mjs +2 -1
  4. package/embed.mjs +11 -1
  5. package/index.d.ts +9 -1
  6. package/logo.mjs +9 -0
  7. package/messenger.mjs +11 -1
  8. package/package.json +1 -1
  9. package/sessions.mjs +9 -0
  10. package/styles.css +1 -0
package/components.mjs CHANGED
@@ -647,6 +647,7 @@ function Conversation({ state, adapter, components = {}, slots = {}, memoryKey =
647
647
  const blocks = groupConversation(state.transcript);
648
648
  const Entry = components.TranscriptEntry ?? TranscriptEntry;
649
649
  const Group = components.ActivityGroup ?? ActivityGroup;
650
+ const Plan = components.TaskPlan ?? TaskPlan;
650
651
  const Before = slots.beforeConversation;
651
652
  const After = slots.afterConversation;
652
653
  const Empty = slots.emptyConversation;
@@ -681,7 +682,7 @@ function Conversation({ state, adapter, components = {}, slots = {}, memoryKey =
681
682
  remember({ top: element.scrollTop, atBottom: bottom });
682
683
  }, children: /* @__PURE__ */ jsxs2("div", { children: [
683
684
  Before ? /* @__PURE__ */ jsx3(Before, { state, adapter, value: null }) : null,
684
- /* @__PURE__ */ jsx3(TaskPlan, { plan: state.taskPlan }),
685
+ /* @__PURE__ */ jsx3(Plan, { plan: state.taskPlan, value: state.taskPlan, state, adapter }),
685
686
  /* @__PURE__ */ jsx3(SessionDetails, { semantics: state.semantics }),
686
687
  state.history.hasEarlier ? /* @__PURE__ */ jsx3("button", { class: "scui-load", type: "button", disabled: Boolean(state.operation), onClick: () => {
687
688
  const element = scroller.current;
@@ -748,6 +749,15 @@ var LOGOS = {
748
749
  ["path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M1 1h16.5v11H12v5.5H6.5V23H1V1zm5.5 5.5V12H12V6.5H6.5z" }],
749
750
  ["path", { d: "M17.5 12H23v11h-5.5V12z" }]
750
751
  ]
752
+ },
753
+ // Product mark shared with the first-party browser frontend favicon.
754
+ supercode: {
755
+ viewBox: "0 0 64 64",
756
+ paths: [
757
+ ["rect", { width: "64", height: "64", rx: "14", fill: "#111923" }],
758
+ ["path", { d: "M18 21h28v6H18zm0 13h18v6H18z", fill: "#5f8fff" }],
759
+ ["circle", { cx: "46", cy: "37", r: "7", fill: "none", stroke: "#8ce0aa", "stroke-width": "4" }]
760
+ ]
751
761
  }
752
762
  };
753
763
  function hasHarnessLogo(id) {
package/conversation.d.ts CHANGED
@@ -4,6 +4,7 @@ export type {
4
4
  MessengerSlots,
5
5
  SessionSemanticsModel,
6
6
  SupercodeUiState,
7
+ TaskPlanProps,
7
8
  TaskPlanModel,
8
9
  TranscriptEntryModel,
9
10
  TranscriptEntryProps,
package/conversation.mjs CHANGED
@@ -315,6 +315,7 @@ function Conversation({ state, adapter, components = {}, slots = {}, memoryKey =
315
315
  const blocks = groupConversation(state.transcript);
316
316
  const Entry = components.TranscriptEntry ?? TranscriptEntry;
317
317
  const Group = components.ActivityGroup ?? ActivityGroup;
318
+ const Plan = components.TaskPlan ?? TaskPlan;
318
319
  const Before = slots.beforeConversation;
319
320
  const After = slots.afterConversation;
320
321
  const Empty = slots.emptyConversation;
@@ -349,7 +350,7 @@ function Conversation({ state, adapter, components = {}, slots = {}, memoryKey =
349
350
  remember({ top: element.scrollTop, atBottom: bottom });
350
351
  }, children: /* @__PURE__ */ jsxs("div", { children: [
351
352
  Before ? /* @__PURE__ */ jsx2(Before, { state, adapter, value: null }) : null,
352
- /* @__PURE__ */ jsx2(TaskPlan, { plan: state.taskPlan }),
353
+ /* @__PURE__ */ jsx2(Plan, { plan: state.taskPlan, value: state.taskPlan, state, adapter }),
353
354
  /* @__PURE__ */ jsx2(SessionDetails, { semantics: state.semantics }),
354
355
  state.history.hasEarlier ? /* @__PURE__ */ jsx2("button", { class: "scui-load", type: "button", disabled: Boolean(state.operation), onClick: () => {
355
356
  const element = scroller.current;
package/embed.mjs CHANGED
@@ -653,6 +653,7 @@ function Conversation({ state, adapter, components = {}, slots = {}, memoryKey =
653
653
  const blocks = groupConversation(state.transcript);
654
654
  const Entry = components.TranscriptEntry ?? TranscriptEntry;
655
655
  const Group = components.ActivityGroup ?? ActivityGroup;
656
+ const Plan = components.TaskPlan ?? TaskPlan;
656
657
  const Before = slots.beforeConversation;
657
658
  const After = slots.afterConversation;
658
659
  const Empty = slots.emptyConversation;
@@ -687,7 +688,7 @@ function Conversation({ state, adapter, components = {}, slots = {}, memoryKey =
687
688
  remember({ top: element.scrollTop, atBottom: bottom });
688
689
  }, children: /* @__PURE__ */ jsxs2("div", { children: [
689
690
  Before ? /* @__PURE__ */ jsx3(Before, { state, adapter, value: null }) : null,
690
- /* @__PURE__ */ jsx3(TaskPlan, { plan: state.taskPlan }),
691
+ /* @__PURE__ */ jsx3(Plan, { plan: state.taskPlan, value: state.taskPlan, state, adapter }),
691
692
  /* @__PURE__ */ jsx3(SessionDetails, { semantics: state.semantics }),
692
693
  state.history.hasEarlier ? /* @__PURE__ */ jsx3("button", { class: "scui-load", type: "button", disabled: Boolean(state.operation), onClick: () => {
693
694
  const element = scroller.current;
@@ -754,6 +755,15 @@ var LOGOS = {
754
755
  ["path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M1 1h16.5v11H12v5.5H6.5V23H1V1zm5.5 5.5V12H12V6.5H6.5z" }],
755
756
  ["path", { d: "M17.5 12H23v11h-5.5V12z" }]
756
757
  ]
758
+ },
759
+ // Product mark shared with the first-party browser frontend favicon.
760
+ supercode: {
761
+ viewBox: "0 0 64 64",
762
+ paths: [
763
+ ["rect", { width: "64", height: "64", rx: "14", fill: "#111923" }],
764
+ ["path", { d: "M18 21h28v6H18zm0 13h18v6H18z", fill: "#5f8fff" }],
765
+ ["circle", { cx: "46", cy: "37", r: "7", fill: "none", stroke: "#8ce0aa", "stroke-width": "4" }]
766
+ ]
757
767
  }
758
768
  };
759
769
  function HarnessLogo({ id, activity, size = 28, onMissingLogo }) {
package/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { ComponentChildren, ComponentType, VNode } from 'preact';
2
2
 
3
- export type HarnessId = 'claude-code' | 'codex' | 'opencode' | 'pi' | 'grok' | (string & {});
3
+ export type HarnessId = 'claude-code' | 'codex' | 'gemini' | 'goose' | 'grok' | 'opencode' | 'pi' | 'supercode' | (string & {});
4
4
  export type UiTone = 'live' | 'warn' | 'dead' | 'off';
5
5
  export type StartupPhase = 'connecting' | 'starting' | 'discovering' | 'ready';
6
6
  export type SessionMode = 'none' | 'control' | 'mirror';
@@ -240,10 +240,18 @@ export interface ActivityGroupProps {
240
240
  adapter: UiAdapter;
241
241
  }
242
242
 
243
+ export interface TaskPlanProps {
244
+ plan: TaskPlanModel;
245
+ value?: TaskPlanModel;
246
+ state: SupercodeUiState;
247
+ adapter: UiAdapter;
248
+ }
249
+
243
250
  export interface MessengerComponents {
244
251
  SessionRow?: ComponentType<SessionRowProps>;
245
252
  TranscriptEntry?: ComponentType<TranscriptEntryProps>;
246
253
  ActivityGroup?: ComponentType<ActivityGroupProps>;
254
+ TaskPlan?: ComponentType<TaskPlanProps>;
247
255
  HarnessLogo?: ComponentType<{ id: HarnessId; activity?: SessionActivity; size?: number }>;
248
256
  }
249
257
 
package/logo.mjs CHANGED
@@ -34,6 +34,15 @@ var LOGOS = {
34
34
  ["path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M1 1h16.5v11H12v5.5H6.5V23H1V1zm5.5 5.5V12H12V6.5H6.5z" }],
35
35
  ["path", { d: "M17.5 12H23v11h-5.5V12z" }]
36
36
  ]
37
+ },
38
+ // Product mark shared with the first-party browser frontend favicon.
39
+ supercode: {
40
+ viewBox: "0 0 64 64",
41
+ paths: [
42
+ ["rect", { width: "64", height: "64", rx: "14", fill: "#111923" }],
43
+ ["path", { d: "M18 21h28v6H18zm0 13h18v6H18z", fill: "#5f8fff" }],
44
+ ["circle", { cx: "46", cy: "37", r: "7", fill: "none", stroke: "#8ce0aa", "stroke-width": "4" }]
45
+ ]
37
46
  }
38
47
  };
39
48
  function hasHarnessLogo(id) {
package/messenger.mjs CHANGED
@@ -650,6 +650,7 @@ function Conversation({ state, adapter, components = {}, slots = {}, memoryKey =
650
650
  const blocks = groupConversation(state.transcript);
651
651
  const Entry = components.TranscriptEntry ?? TranscriptEntry;
652
652
  const Group = components.ActivityGroup ?? ActivityGroup;
653
+ const Plan = components.TaskPlan ?? TaskPlan;
653
654
  const Before = slots.beforeConversation;
654
655
  const After = slots.afterConversation;
655
656
  const Empty = slots.emptyConversation;
@@ -684,7 +685,7 @@ function Conversation({ state, adapter, components = {}, slots = {}, memoryKey =
684
685
  remember({ top: element.scrollTop, atBottom: bottom });
685
686
  }, children: /* @__PURE__ */ jsxs2("div", { children: [
686
687
  Before ? /* @__PURE__ */ jsx3(Before, { state, adapter, value: null }) : null,
687
- /* @__PURE__ */ jsx3(TaskPlan, { plan: state.taskPlan }),
688
+ /* @__PURE__ */ jsx3(Plan, { plan: state.taskPlan, value: state.taskPlan, state, adapter }),
688
689
  /* @__PURE__ */ jsx3(SessionDetails, { semantics: state.semantics }),
689
690
  state.history.hasEarlier ? /* @__PURE__ */ jsx3("button", { class: "scui-load", type: "button", disabled: Boolean(state.operation), onClick: () => {
690
691
  const element = scroller.current;
@@ -751,6 +752,15 @@ var LOGOS = {
751
752
  ["path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M1 1h16.5v11H12v5.5H6.5V23H1V1zm5.5 5.5V12H12V6.5H6.5z" }],
752
753
  ["path", { d: "M17.5 12H23v11h-5.5V12z" }]
753
754
  ]
755
+ },
756
+ // Product mark shared with the first-party browser frontend favicon.
757
+ supercode: {
758
+ viewBox: "0 0 64 64",
759
+ paths: [
760
+ ["rect", { width: "64", height: "64", rx: "14", fill: "#111923" }],
761
+ ["path", { d: "M18 21h28v6H18zm0 13h18v6H18z", fill: "#5f8fff" }],
762
+ ["circle", { cx: "46", cy: "37", r: "7", fill: "none", stroke: "#8ce0aa", "stroke-width": "4" }]
763
+ ]
754
764
  }
755
765
  };
756
766
  function HarnessLogo({ id, activity, size = 28, onMissingLogo }) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@volter-ai-dev/supercode-ui",
3
- "version": "0.1.5",
3
+ "version": "0.1.7",
4
4
  "type": "module",
5
5
  "description": "Composable default UI kit for Supercode-powered coding-agent experiences",
6
6
  "exports": {
package/sessions.mjs CHANGED
@@ -151,6 +151,15 @@ var LOGOS = {
151
151
  ["path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M1 1h16.5v11H12v5.5H6.5V23H1V1zm5.5 5.5V12H12V6.5H6.5z" }],
152
152
  ["path", { d: "M17.5 12H23v11h-5.5V12z" }]
153
153
  ]
154
+ },
155
+ // Product mark shared with the first-party browser frontend favicon.
156
+ supercode: {
157
+ viewBox: "0 0 64 64",
158
+ paths: [
159
+ ["rect", { width: "64", height: "64", rx: "14", fill: "#111923" }],
160
+ ["path", { d: "M18 21h28v6H18zm0 13h18v6H18z", fill: "#5f8fff" }],
161
+ ["circle", { cx: "46", cy: "37", r: "7", fill: "none", stroke: "#8ce0aa", "stroke-width": "4" }]
162
+ ]
154
163
  }
155
164
  };
156
165
  function HarnessLogo({ id, activity, size = 28, onMissingLogo }) {
package/styles.css CHANGED
@@ -70,6 +70,7 @@
70
70
  .scui-logo[data-harness="gemini"] { color:#6e79dc; background:#f7f7f5 }
71
71
  .scui-logo[data-harness="goose"] { color:#101010; background:#f7f7f5 }
72
72
  .scui-logo[data-harness="pi"] { color:#111; background:#efefeb }
73
+ .scui-logo[data-harness="supercode"] { background:#111923 }
73
74
  .scui-logo > i { position:absolute; right:-5%; bottom:-5%; width:32%; height:32%; border:2px solid var(--scui-bg); border-radius:50%; background:var(--scui-muted) }
74
75
  .scui-logo[data-activity="working"] > i { background:var(--scui-accent); animation:scui-breathe 1.4s ease-in-out infinite }
75
76
  .scui-logo[data-activity="needs-input"] > i { background:var(--scui-warning) }