fireworks-ai 0.4.3 → 0.4.5
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.
Potentially problematic release.
This version of fireworks-ai might be problematic. Click here for more details.
package/dist/react/StatusDot.js
CHANGED
|
@@ -2,14 +2,14 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { cn } from "./cn.js";
|
|
3
3
|
const phaseClasses = {
|
|
4
4
|
pending: "bg-muted-foreground/40",
|
|
5
|
-
streaming_input: "bg-
|
|
6
|
-
running: "bg-
|
|
7
|
-
complete: "bg-
|
|
5
|
+
streaming_input: "bg-amber-500 animate-pulse",
|
|
6
|
+
running: "bg-amber-500 animate-pulse",
|
|
7
|
+
complete: "bg-emerald-500",
|
|
8
8
|
error: "bg-destructive",
|
|
9
9
|
};
|
|
10
10
|
export function StatusDot({ status, className }) {
|
|
11
11
|
return _jsx("span", { className: cn("h-2 w-2 shrink-0 rounded-full", phaseClasses[status], className) });
|
|
12
12
|
}
|
|
13
13
|
export function PulsingDot({ className }) {
|
|
14
|
-
return (_jsx("span", { className: cn("inline-block h-2 w-2 shrink-0 rounded-full bg-
|
|
14
|
+
return (_jsx("span", { className: cn("inline-block h-2 w-2 shrink-0 rounded-full bg-amber-500 animate-pulse", className) }));
|
|
15
15
|
}
|
|
@@ -7,5 +7,5 @@ export function ToolApprovalCard({ request, onApprove, onDeny, className, }) {
|
|
|
7
7
|
const reg = getWidget(stripMcpPrefix(request.toolName));
|
|
8
8
|
const label = reg?.label ?? request.toolName;
|
|
9
9
|
const InputRenderer = reg?.inputRenderer;
|
|
10
|
-
return (_jsxs("div", { className: cn("rounded-md border border-
|
|
10
|
+
return (_jsxs("div", { className: cn("rounded-md border border-amber-500/40 bg-amber-500/5 px-3 py-2.5 text-xs", className), children: [_jsxs("div", { className: "flex items-center gap-2 text-muted-foreground", children: [_jsx(PulsingDot, {}), _jsx("span", { className: "font-medium", children: label }), request.description && (_jsxs("span", { className: "ml-1 opacity-70", children: ["\u2014 ", request.description] }))] }), InputRenderer ? (_jsx(InputRenderer, { input: request.input })) : (Object.keys(request.input).length > 0 && (_jsx("pre", { className: "mt-1.5 max-h-32 overflow-auto rounded bg-background/60 px-2 py-1 font-mono text-[10px] text-muted-foreground", children: JSON.stringify(request.input, null, 2) }))), _jsx(ApprovalButtons, { onApprove: onApprove, onDeny: () => onDeny() })] }));
|
|
11
11
|
}
|
|
@@ -41,7 +41,7 @@ export function ToolCallCard({ toolCall, className, }) {
|
|
|
41
41
|
}
|
|
42
42
|
if (matchingApproval) {
|
|
43
43
|
const InputRenderer = reg?.inputRenderer;
|
|
44
|
-
return (_jsxs("div", { className: cn("rounded-md border border-
|
|
44
|
+
return (_jsxs("div", { className: cn("rounded-md border border-amber-500/40 bg-amber-500/5 px-3 py-2.5 text-xs", className), children: [_jsxs("div", { className: "flex items-center gap-2 text-muted-foreground", children: [_jsx(PulsingDot, {}), _jsx("span", { className: "font-medium", children: label }), matchingApproval.description && (_jsxs("span", { className: "ml-1 opacity-70", children: ["\u2014 ", matchingApproval.description] }))] }), InputRenderer ? (_jsx(InputRenderer, { input: matchingApproval.input })) : (Object.keys(matchingApproval.input).length > 0 && (_jsx("pre", { className: "mt-1.5 max-h-32 overflow-auto rounded bg-background/60 px-2 py-1 font-mono text-[10px] text-muted-foreground", children: JSON.stringify(matchingApproval.input, null, 2) }))), _jsx(ApprovalButtons, { onApprove: () => respondToPermission({
|
|
45
45
|
kind: "tool_approval",
|
|
46
46
|
requestId: matchingApproval.requestId,
|
|
47
47
|
behavior: "allow",
|
|
@@ -12,29 +12,31 @@ export function UserQuestionCard({ request, onSubmit, className, }) {
|
|
|
12
12
|
wrapperRef.current?.focus();
|
|
13
13
|
}, []);
|
|
14
14
|
const allAnswered = request.questions.every((q) => {
|
|
15
|
-
const
|
|
16
|
-
if (!
|
|
15
|
+
const vals = answers[q.question];
|
|
16
|
+
if (!vals || vals.length === 0)
|
|
17
17
|
return false;
|
|
18
|
-
if (
|
|
18
|
+
if (vals.includes(OTHER_LABEL))
|
|
19
19
|
return !!otherText[q.question]?.trim();
|
|
20
20
|
return true;
|
|
21
21
|
});
|
|
22
22
|
function resolvedAnswers() {
|
|
23
23
|
const resolved = {};
|
|
24
24
|
for (const q of request.questions) {
|
|
25
|
-
const
|
|
26
|
-
|
|
25
|
+
const vals = answers[q.question] ?? [];
|
|
26
|
+
const mapped = vals.map((v) => (v === OTHER_LABEL ? (otherText[q.question] ?? "") : v));
|
|
27
|
+
resolved[q.question] = mapped.join(", ");
|
|
27
28
|
}
|
|
28
29
|
return resolved;
|
|
29
30
|
}
|
|
30
31
|
function selectOption(question, label, multiSelect) {
|
|
31
32
|
setAnswers((prev) => {
|
|
32
33
|
if (!multiSelect)
|
|
33
|
-
return { ...prev, [question]: label };
|
|
34
|
-
const current = prev[question] ??
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
34
|
+
return { ...prev, [question]: [label] };
|
|
35
|
+
const current = prev[question] ?? [];
|
|
36
|
+
return {
|
|
37
|
+
...prev,
|
|
38
|
+
[question]: current.includes(label) ? current.filter((l) => l !== label) : [...current, label],
|
|
39
|
+
};
|
|
38
40
|
});
|
|
39
41
|
if (label === OTHER_LABEL) {
|
|
40
42
|
setTimeout(() => otherInputRefs.current[question]?.focus(), 0);
|
|
@@ -78,11 +80,11 @@ export function UserQuestionCard({ request, onSubmit, className, }) {
|
|
|
78
80
|
document.addEventListener("keydown", handleKeyDown);
|
|
79
81
|
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
80
82
|
});
|
|
81
|
-
return (_jsxs("div", { ref: wrapperRef, tabIndex: -1, className: cn("rounded-md border border-
|
|
83
|
+
return (_jsxs("div", { ref: wrapperRef, tabIndex: -1, className: cn("rounded-md border border-blue-500/40 bg-blue-500/5 px-3 py-2.5 text-xs focus:outline-none", className), children: [request.questions.map((q) => {
|
|
82
84
|
const hasOptions = q.options && q.options.length > 0;
|
|
83
85
|
const isSingleQuestion = request.questions.length === 1;
|
|
84
86
|
return (_jsxs("div", { className: "mb-3 last:mb-0", children: [q.header && (_jsx("span", { className: "text-[10px] uppercase tracking-wider text-muted-foreground/70", children: q.header })), _jsx("p", { className: "mt-0.5 text-foreground", children: q.question }), hasOptions && (_jsxs("div", { className: "mt-1.5 flex flex-col gap-1", children: [q.options?.map((opt, idx) => {
|
|
85
|
-
const selected = (answers[q.question] ??
|
|
87
|
+
const selected = (answers[q.question] ?? []).includes(opt.label);
|
|
86
88
|
return (_jsxs("button", { type: "button", onClick: () => {
|
|
87
89
|
if (!q.multiSelect && isSingleQuestion) {
|
|
88
90
|
onSubmit({ [q.question]: opt.label });
|
|
@@ -91,23 +93,23 @@ export function UserQuestionCard({ request, onSubmit, className, }) {
|
|
|
91
93
|
selectOption(q.question, opt.label, q.multiSelect);
|
|
92
94
|
}
|
|
93
95
|
}, className: cn("flex items-start gap-2 rounded border px-2 py-1.5 text-left transition-colors", selected
|
|
94
|
-
? "border-
|
|
96
|
+
? "border-blue-500 bg-blue-500/15 text-foreground ring-1 ring-blue-500/30"
|
|
95
97
|
: "border-border text-muted-foreground hover:bg-accent"), children: [_jsx("span", { className: "mt-px shrink-0", children: q.multiSelect ? (selected ? "☑" : "☐") : selected ? "●" : "○" }), _jsxs("span", { className: "flex-1", children: [_jsx("span", { className: "font-medium", children: opt.label }), opt.description && (_jsxs("span", { className: "ml-1 opacity-70", children: ["\u2014 ", opt.description] }))] }), isSingleQuestion && (_jsx("kbd", { className: "ml-auto shrink-0 text-[9px] opacity-40", children: idx + 1 }))] }, opt.label));
|
|
96
98
|
}), (() => {
|
|
97
|
-
const isOther = answers[q.question]
|
|
99
|
+
const isOther = (answers[q.question] ?? []).includes(OTHER_LABEL);
|
|
98
100
|
const otherIdx = (q.options?.length ?? 0) + 1;
|
|
99
101
|
return (_jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => selectOption(q.question, OTHER_LABEL, q.multiSelect), className: cn("flex w-full items-start gap-2 rounded border px-2 py-1.5 text-left transition-colors", isOther
|
|
100
|
-
? "border-
|
|
102
|
+
? "border-blue-500 bg-blue-500/15 text-foreground ring-1 ring-blue-500/30"
|
|
101
103
|
: "border-border text-muted-foreground hover:bg-accent"), children: [_jsx("span", { className: "mt-px shrink-0", children: q.multiSelect ? (isOther ? "☑" : "☐") : isOther ? "●" : "○" }), _jsx("span", { className: "font-medium", children: "Other" }), isSingleQuestion && (_jsx("kbd", { className: "ml-auto shrink-0 text-[9px] opacity-40", children: otherIdx }))] }), isOther && (_jsx("input", { ref: (el) => {
|
|
102
104
|
otherInputRefs.current[q.question] = el;
|
|
103
|
-
}, type: "text", className: "mt-1 w-full rounded border border-border bg-background px-2 py-1 text-foreground focus:outline-none focus:ring-1 focus:ring-
|
|
105
|
+
}, type: "text", className: "mt-1 w-full rounded border border-border bg-background px-2 py-1 text-foreground focus:outline-none focus:ring-1 focus:ring-blue-500/50", placeholder: "Type your answer\u2026", value: otherText[q.question] ?? "", onChange: (e) => setOtherText((prev) => ({ ...prev, [q.question]: e.target.value })), onKeyDown: (e) => {
|
|
104
106
|
if (e.key === "Enter" && otherText[q.question]?.trim()) {
|
|
105
107
|
e.preventDefault();
|
|
106
108
|
onSubmit(resolvedAnswers());
|
|
107
109
|
}
|
|
108
110
|
} }))] }));
|
|
109
|
-
})()] })), !hasOptions && (_jsx("input", { type: "text", className: "mt-1.5 w-full rounded border border-border bg-background px-2 py-1 text-foreground focus:outline-none focus:ring-1 focus:ring-
|
|
110
|
-
if (e.key === "Enter" && (answers[q.question] ?? "").trim()) {
|
|
111
|
+
})()] })), !hasOptions && (_jsx("input", { type: "text", className: "mt-1.5 w-full rounded border border-border bg-background px-2 py-1 text-foreground focus:outline-none focus:ring-1 focus:ring-blue-500/50", placeholder: "Type your answer\u2026", value: (answers[q.question] ?? [])[0] ?? "", onChange: (e) => setAnswers((prev) => ({ ...prev, [q.question]: [e.target.value] })), onKeyDown: (e) => {
|
|
112
|
+
if (e.key === "Enter" && (answers[q.question]?.[0] ?? "").trim()) {
|
|
111
113
|
e.preventDefault();
|
|
112
114
|
onSubmit(resolvedAnswers());
|
|
113
115
|
}
|
package/package.json
CHANGED
package/src/theme.css
CHANGED
|
@@ -4,11 +4,11 @@
|
|
|
4
4
|
* Provides the CSS variable bridge (via @theme inline) and a neutral color
|
|
5
5
|
* palette so fireworks-ai components render correctly out of the box.
|
|
6
6
|
*
|
|
7
|
-
* If your app already uses shadcn/ui
|
|
8
|
-
*
|
|
9
|
-
*
|
|
7
|
+
* If your app already uses shadcn/ui you don't need this file — fireworks-ai
|
|
8
|
+
* components use only standard shadcn variables plus Tailwind's built-in
|
|
9
|
+
* color palette (amber, emerald, blue) for status indicators.
|
|
10
10
|
*
|
|
11
|
-
* Usage:
|
|
11
|
+
* Usage (non-shadcn apps):
|
|
12
12
|
* @import "fireworks-ai/theme.css";
|
|
13
13
|
*/
|
|
14
14
|
|