@arcote.tech/arc-chat 0.4.7 → 0.5.0

package/src/react/question-tabs.tsx

@@ -1,157 +0,0 @@
-import { Trans } from "@arcote.tech/platform";
-import { Box, Button, TextareaField } from "@arcote.tech/arc-ds";
-import { Send, Check } from "lucide-react";
-import { useState } from "react";
-import type { Question, QuestionAnswers } from "./types";
-
-interface QuestionTabsProps {
-  questions: Question[];
-  onSubmit: (answers: QuestionAnswers) => void;
-}
-
-export function QuestionTabs({ questions, onSubmit }: QuestionTabsProps) {
-  const [activeTab, setActiveTab] = useState(0);
-  const [answers, setAnswers] = useState<QuestionAnswers>(
-    () =>
-      Object.fromEntries(
-        questions.map((q) => [q.id, { selected: [], text: "" }]),
-      ),
-  );
-
-  const current = questions[activeTab];
-  const currentAnswer = answers[current.id] ?? { selected: [], text: "" };
-
-  const toggleOption = (option: string) => {
-    const selected = currentAnswer.selected.includes(option)
-      ? currentAnswer.selected.filter((o) => o !== option)
-      : [...currentAnswer.selected, option];
-    setAnswers((prev) => ({
-      ...prev,
-      [current.id]: { ...prev[current.id], selected },
-    }));
-  };
-
-  const setText = (text: string) => {
-    setAnswers((prev) => ({
-      ...prev,
-      [current.id]: { ...prev[current.id], text },
-    }));
-  };
-
-  const hasCustomText = currentAnswer.text.trim().length > 0;
-
-  const totalAnswered = questions.filter(
-    (q) =>
-      (answers[q.id]?.selected.length ?? 0) > 0 ||
-      (answers[q.id]?.text ?? "").trim().length > 0,
-  ).length;
-
-  return (
-    <Box className="p-0 overflow-hidden">
-      {/* Tabs */}
-      <div className="flex border-b border-border overflow-x-auto">
-        {questions.map((q, i) => {
-          const hasAnswer =
-            (answers[q.id]?.selected.length ?? 0) > 0 ||
-            (answers[q.id]?.text ?? "").trim().length > 0;
-          return (
-            <button
-              key={q.id}
-              type="button"
-              onClick={() => setActiveTab(i)}
-              className={`flex items-center gap-1.5 px-3 py-2 text-xs font-medium whitespace-nowrap transition-colors border-b-2 -mb-px ${
-                i === activeTab
-                  ? "border-primary text-primary"
-                  : "border-transparent text-muted-foreground hover:text-foreground"
-              }`}
-            >
-              {hasAnswer && (
-                <span className="h-1.5 w-1.5 rounded-full bg-primary shrink-0" />
-              )}
-              {q.label}
-            </button>
-          );
-        })}
-      </div>
-
-      {/* Content */}
-      <div className="p-3 space-y-1.5">
-        <p className="text-xs text-muted-foreground mb-2">
-          {current.description}
-        </p>
-
-        {/* Options */}
-        {current.options.map((option) => {
-          const isSelected = currentAnswer.selected.includes(option);
-          return (
-            <button
-              key={option}
-              type="button"
-              onClick={() => toggleOption(option)}
-              className={`flex items-center gap-2.5 w-full rounded-lg px-3 py-2.5 text-left transition-colors ${
-                isSelected
-                  ? "bg-primary/10 border border-primary/20"
-                  : "bg-muted/50 border border-transparent hover:bg-muted"
-              }`}
-            >
-              <div
-                className={`flex h-4 w-4 shrink-0 items-center justify-center rounded border transition-colors ${
-                  isSelected
-                    ? "border-primary bg-primary"
-                    : "border-input bg-transparent"
-                }`}
-              >
-                {isSelected && (
-                  <Check className="h-3 w-3 text-primary-foreground" />
-                )}
-              </div>
-              <span className="text-sm">{option}</span>
-            </button>
-          );
-        })}
-
-        {/* Custom option */}
-        <div
-          className={`flex items-start gap-2.5 w-full rounded-lg px-3 py-2.5 transition-colors ${
-            hasCustomText
-              ? "bg-primary/10 border border-primary/20"
-              : "bg-muted/50 border border-transparent"
-          }`}
-        >
-          <div
-            className={`flex h-4 w-4 shrink-0 items-center justify-center rounded border transition-colors mt-0.5 ${
-              hasCustomText
-                ? "border-primary bg-primary"
-                : "border-input bg-transparent"
-            }`}
-          >
-            {hasCustomText && (
-              <Check className="h-3 w-3 text-primary-foreground" />
-            )}
-          </div>
-          <div className="flex-1">
-            <TextareaField
-              value={currentAnswer.text}
-              onChange={(val) => setText(val ?? "")}
-              placeholder="Własna odpowiedź..."
-              rows={1}
-            />
-          </div>
-        </div>
-      </div>
-
-      {/* Footer */}
-      <div className="flex items-center justify-between border-t border-border px-3 py-2">
-        <span className="text-[10px] text-muted-foreground">
-          {totalAnswered}/{questions.length} <Trans>uzupełnione</Trans>
-        </span>
-        <Button
-          size="sm"
-          icon={Send}
-          label={<Trans>Wyślij</Trans>}
-          onClick={() => onSubmit(answers)}
-        />
-      </div>
-    </Box>
-  );
-}

package/src/react/tool-use-block.tsx

@@ -1,34 +0,0 @@
-import { CheckCircle2, ArrowRight } from "lucide-react";
-import type { ToolUse } from "./types";
-
-interface ToolUseBlockProps {
-  toolUse: ToolUse;
-  onClick?: () => void;
-}
-
-export function ToolUseBlock({ toolUse, onClick }: ToolUseBlockProps) {
-  const Component = onClick ? "button" : "div";
-
-  return (
-    <Component
-      type={onClick ? "button" : undefined}
-      onClick={onClick}
-      className={`flex items-start gap-3 w-full rounded-xl border border-green-500/20 bg-green-500/5 p-3 text-left transition-colors ${
-        onClick ? "hover:bg-green-500/10 cursor-pointer" : ""
-      }`}
-    >
-      <CheckCircle2 className="h-4 w-4 text-green-500 mt-0.5 shrink-0" />
-      <div className="flex-1 min-w-0">
-        <p className="text-xs font-medium text-green-700 dark:text-green-400">
-          {toolUse.action}
-        </p>
-        <p className="text-xs text-muted-foreground mt-0.5 line-clamp-1">
-          {toolUse.value}
-        </p>
-      </div>
-      {onClick && (
-        <ArrowRight className="h-3.5 w-3.5 text-muted-foreground mt-0.5 shrink-0" />
-      )}
-    </Component>
-  );
-}

package/src/react/types.ts

@@ -1,36 +0,0 @@
-export interface ToolUse {
-  action: string;
-  value: string;
-  link?: string;
-}
-
-export interface Question {
-  id: string;
-  label: string;
-  description: string;
-  options: string[];
-}
-
-export interface QuestionAnswers {
-  [questionId: string]: { selected: string[]; text: string };
-}
-
-export interface ChatMessageData {
-  id: string;
-  role: "user" | "assistant" | "system" | "tool";
-  content: string;
-  toolUses?: ToolUse[];
-  questions?: Question[];
-  isStreaming?: boolean;
-}
-
-export interface ChatModel {
-  value: string;
-  label: string;
-}
-
-export interface SendMessageOptions {
-  model: string;
-  webSearch: boolean;
-  attachments?: string[];
-}