@theoremjs/react 0.3.4-next.671.gfa09ab2 → 0.3.4-next.673.ga492632

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@theoremjs/react",
-  "version": "0.3.4-next.671.gfa09ab2",
+  "version": "0.3.4-next.673.ga492632",
   "description": "React bindings for Theorem: headless hooks + transport, an Astryx chat UI, and a Web-standard server handler.",
   "license": "MIT",
   "type": "module",
@@ -60,8 +60,8 @@
     "@stylexjs/stylex": "0.19.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "@theoremjs/agents": "^0.3.4-next.671.gfa09ab2",
-    "@theoremjs/web": "^0.3.4-next.671.gfa09ab2"
+    "@theoremjs/agents": "^0.3.4-next.673.ga492632",
+    "@theoremjs/web": "^0.3.4-next.673.ga492632"
   },
   "peerDependenciesMeta": {
     "@astryxdesign/core": {

package/ui/ChatComposerBar.d.ts

@@ -1,6 +1,7 @@
 import { type ChatComposerInputHandle } from '@astryxdesign/core/Chat';
 import { type AttachmentValidationIssue, type ComposerMenuAction, type ComposerPendingMessage, type ComposerProfileInterface, type ComposerRunPhase, type LiveProfileInterface } from '@theoremjs/agents/interface';
 import type { ClientFailure } from '@theoremjs/web/client';
+import { type ReactNode } from 'react';
 /** A slot the profile declares: its allowed values, the one chosen, and how to choose another. */
 /** The effort selector's icon. The studio's Agents list shows the same one. */
 export declare const EFFORT_ICON: import("react").ForwardRefExoticComponent<import("@tabler/icons-react").IconProps & import("react").RefAttributes<SVGSVGElement>>;
@@ -40,10 +41,12 @@ export type ChatComposerBarProps = {
     onSubmit: () => void;
     onStop: () => void;
     onMenuAction: (action: ComposerMenuAction) => void;
-    onGenerationChange: (next: {
+    onGenerationChange?: (next: {
         modelId: string;
         effort?: string;
     }) => void;
+    /** Stands in for the model and effort selectors, for a bar whose choices are not one chat's. */
+    generationSelect?: ReactNode;
     /** The profile's `inputs.slots` with the value chosen for each; one selector per slot, beside the model's. */
     slotChoices?: SlotChoices;
     onPendingMove: (id: string, direction: 'up' | 'down') => void;
@@ -63,6 +66,11 @@ export type LiveComposerBarProps = Omit<Pick<ChatComposerBarProps, 'draftText' |
     /** Off while no call is connected. */
     isDisabled: boolean;
 };
+/** The model and effort choices this profile offers; efforts only for a chosen model. */
+export declare function generationOptions(iface: ComposerProfileInterface, selectedModel?: string): {
+    models: import("@theoremjs/agents/interface").InterfaceModelOption[];
+    efforts: import("@theoremjs/agents/interface").InterfaceEffortOption[];
+};
 /**
  * Astryx composer wired to Theorem's send / stop / queue / steer / stash matrix.
  * For a Live profile it is the text field and send button alone.

package/ui/ChatComposerBar.js

@@ -68,7 +68,7 @@ function PendingRow(props) {
     return (_jsxs(HStack, { gap: 1, align: "center", width: "100%", children: [_jsx(HoverTip, { content: t(`@theorem.composer.pending.${message.kind}.description`), children: _jsx(Token, { label: t(`@theorem.composer.pending.${message.kind}`), isLabelHidden: true, color: message.kind === 'steer' ? 'blue' : 'default', icon: _jsx(Kind, { size: 14 }) }) }), _jsx(StackItem, { size: "fill", style: { width: 0 }, children: _jsx(Text, { size: "sm", maxLines: 1, hasTruncateTooltip: true, children: composerPendingPreview(message) }) }), _jsxs(HStack, { gap: 0.5, children: [_jsx(IconButton, { label: edit, tooltip: edit, size: "sm", variant: "ghost", icon: icon(IconPencil), onClick: () => props.onRestore(message.id) }), message.kind === 'stash' ? (_jsx(IconButton, { label: queue, tooltip: queue, size: "sm", variant: "ghost", icon: icon(IconCornerDownLeft), onClick: () => props.onQueue(message.id) })) : null, _jsx(IconButton, { label: sendNow, tooltip: sendNow, size: "sm", variant: "ghost", icon: icon(IconSend), onClick: () => props.onSendNow(message.id) }), props.moves.up ? (_jsx(IconButton, { label: moveUp, tooltip: moveUp, size: "sm", variant: "ghost", icon: icon(IconArrowUp), onClick: () => props.onMove(message.id, 'up') })) : null, props.moves.down ? (_jsx(IconButton, { label: moveDown, tooltip: moveDown, size: "sm", variant: "ghost", icon: icon(IconArrowDown), onClick: () => props.onMove(message.id, 'down') })) : null, _jsx(IconButton, { label: remove, tooltip: remove, size: "sm", variant: "ghost", icon: icon(IconX), onClick: () => props.onRemove(message.id) })] })] }));
 }
 /** The model and effort choices this profile offers; efforts only for a chosen model. */
-function generationOptions(iface, selectedModel) {
+export function generationOptions(iface, selectedModel) {
     const models = modelSelectEnabled(iface) ? interfaceModelOptions(iface) : [];
     const efforts = selectedModel && effortSelectEnabled(iface, selectedModel)
         ? interfaceEffortOptions(iface, selectedModel)
@@ -109,11 +109,13 @@ function SlotSelectors(props) {
 function GenerationSelect(props) {
     const { models, efforts } = generationOptions(props.iface, props.selectedModel);
     const slotCount = Object.keys(props.slotChoices?.declared ?? {}).length;
+    if (props.control)
+        return (_jsxs(HStack, { gap: 1, children: [props.control, _jsx(SlotSelectors, { choices: props.slotChoices, isDisabled: props.isDisabled })] }));
     if (models.length + efforts.length + slotCount === 0)
         return null;
-    return (_jsxs(HStack, { gap: 1, children: [_jsx(ModelSelector, { label: labelText('composer.model', {}, props.iface.labels), models: models, value: props.selectedModel, isDisabled: props.isDisabled, onChange: (modelId) => props.onChange({ modelId }) }), _jsx(EffortSelector, { label: labelText('composer.effort', {}, props.iface.labels), efforts: efforts, value: props.selectedEffort, isDisabled: props.isDisabled, onChange: (effort) => {
+    return (_jsxs(HStack, { gap: 1, children: [_jsx(ModelSelector, { label: labelText('composer.model', {}, props.iface.labels), models: models, value: props.selectedModel, isDisabled: props.isDisabled, onChange: (modelId) => props.onChange?.({ modelId }) }), _jsx(EffortSelector, { label: labelText('composer.effort', {}, props.iface.labels), efforts: efforts, value: props.selectedEffort, isDisabled: props.isDisabled, onChange: (effort) => {
                     if (props.selectedModel)
-                        props.onChange({ modelId: props.selectedModel, effort });
+                        props.onChange?.({ modelId: props.selectedModel, effort });
                 } }), _jsx(SlotSelectors, { choices: props.slotChoices, isDisabled: props.isDisabled })] }));
 }
 function composerStatus(args) {
@@ -328,7 +330,7 @@ function ChatComposerBarBody(props) {
             : (props.placeholder ??
                 t('@theorem.composer.placeholder', { handle: iface.identity.handle })), 
         // why: A profile that takes no text has no text field (false, not null: null gets Astryx's default one).
-        input: inputs.text && (_jsx(ComposerTextInput, { editorRef: editorRef, handleRef: props.inputRef, onStash: canStash ? () => props.onMenuAction('stash') : undefined })), drawer: composerDrawer(props, stagedFiles, () => voice.discardRecordingOrVoice()), headerActions: inputs.attachments ? (_jsx(AttachFilesButton, { accept: inputs.attachments.acceptAttr, onFiles: stageFiles })) : undefined, headerContext: hint ? _jsx(ComposerHint, { hint: hint, onAction: () => props.onMenuAction('stash') }) : undefined, footerActions: _jsx(GenerationSelect, { iface: iface, slotChoices: props.slotChoices, selectedModel: props.selectedModel, selectedEffort: props.selectedEffort, isDisabled: phase === 'streaming', onChange: props.onGenerationChange }), 
+        input: inputs.text && (_jsx(ComposerTextInput, { editorRef: editorRef, handleRef: props.inputRef, onStash: canStash ? () => props.onMenuAction('stash') : undefined })), drawer: composerDrawer(props, stagedFiles, () => voice.discardRecordingOrVoice()), headerActions: inputs.attachments ? (_jsx(AttachFilesButton, { accept: inputs.attachments.acceptAttr, onFiles: stageFiles })) : undefined, headerContext: hint ? _jsx(ComposerHint, { hint: hint, onAction: () => props.onMenuAction('stash') }) : undefined, footerActions: _jsx(GenerationSelect, { iface: iface, slotChoices: props.slotChoices, selectedModel: props.selectedModel, selectedEffort: props.selectedEffort, isDisabled: phase === 'streaming', onChange: props.onGenerationChange, control: props.generationSelect }), 
         // why: Astryx: sendActions render to the left of the send button, at size="md".
         sendActions: _jsxs(_Fragment, { children: [_jsx(SendMenu, { actions: menuActions, onAction: props.onMenuAction }), _jsx(ComposerRecordButton, { hasVoice: Boolean(inputs.voice), voice: voice })] }), sendButton: _jsx(ChatSendButton, { isStopShown: primary === 'stop', isDisabled: primaryDisabled, onSend: runPrimary, onStop: props.onStop }), status: composerStatus({
             failure: props.failure,

package/ui/index.d.ts

@@ -14,7 +14,7 @@ export { useLiveCaptionLog } from '../client/live/use-live-caption-log.ts';
 export { InkWaveform, type InkWaveformProps, type InkWaveLevels, } from '../components/InkWaveform.tsx';
 export { useLiveRunnerModel } from '../components/live/use-live-runner-model.ts';
 export { theoremTheme } from './built/theorem.js';
-export { ChatComposerBar, type ChatComposerBarProps, EFFORT_ICON, type LiveComposerBarProps, } from './ChatComposerBar.tsx';
+export { ChatComposerBar, type ChatComposerBarProps, EFFORT_ICON, generationOptions, type LiveComposerBarProps, } from './ChatComposerBar.tsx';
 export { ChatTranscript, type ChatTranscriptProps } from './ChatTranscript.tsx';
 export { ConsoleFrame, type ConsoleFrameProps, type ConsolePageProps, RequestCard, ResponseColumn, RunBar, useBytes, } from './ConsoleFrame.tsx';
 export { TheoremDecisionAnswers, type TheoremDecisionAnswersProps } from './DecisionAnswers.tsx';

package/ui/index.js

@@ -17,7 +17,7 @@ export { useLiveCaptionLog } from "../client/live/use-live-caption-log.js";
 export { InkWaveform, } from "../components/InkWaveform.js";
 export { useLiveRunnerModel } from "../components/live/use-live-runner-model.js";
 export { theoremTheme } from './built/theorem.js';
-export { ChatComposerBar, EFFORT_ICON, } from "./ChatComposerBar.js";
+export { ChatComposerBar, EFFORT_ICON, generationOptions, } from "./ChatComposerBar.js";
 export { ChatTranscript } from "./ChatTranscript.js";
 export { ConsoleFrame, RequestCard, ResponseColumn, RunBar, useBytes, } from "./ConsoleFrame.js";
 export { TheoremDecisionAnswers } from "./DecisionAnswers.js";