sparkdesign 0.3.0 → 0.3.2

package/dist/registry/chat/reasoning-step/types.d.ts

@@ -0,0 +1,95 @@
+/**
+ * [INPUT]: N/A
+ * [OUTPUT]: Type definitions for ReasoningStep compound component
+ * [POS]: registry/chat/reasoning-step - ReasoningStep 组件类型定义
+ */
+import type { ReactNode } from 'react';
+export type ReasoningStepDetail = {
+    type: 'action';
+    action: string;
+    desc?: string;
+    details?: ReasoningStepDetail[];
+} | {
+    type: 'file';
+    filename: string;
+    lines?: string;
+    path?: string;
+    fileType?: string;
+    details?: ReasoningStepDetail[];
+};
+export type ReasoningStepStatus = 'completed' | 'in-progress';
+export interface ReasoningStepRootProps {
+    /** 主文本 */
+    text: ReactNode;
+    /** 描述文本 */
+    description?: string;
+    /** 状态 */
+    status?: ReasoningStepStatus;
+    /** 自定义图标 */
+    icon?: ReactNode;
+    /** 是否显示图标 */
+    showIcon?: boolean;
+    /** 详情数据 */
+    details?: ReasoningStepDetail[];
+    /** 子组件 */
+    children?: ReactNode;
+    /** 动画持续时间 */
+    duration?: number;
+    /** 动画扩散度 */
+    spread?: number;
+    /** 禁用展开动画 */
+    disableExpandAnimation?: boolean;
+    /** 默认展开 */
+    defaultExpanded?: boolean;
+    /** 受控展开状态 */
+    expanded?: boolean;
+    /** 展开状态变化回调 */
+    onExpandedChange?: (expanded: boolean) => void;
+    /** 自定义眼睛图标 */
+    eyeIcon?: ReactNode;
+    /** 自定义箭头图标 */
+    arrowRightIcon?: ReactNode;
+}
+export type ReasoningStepProps = ReasoningStepRootProps;
+export interface ReasoningStepHeaderProps {
+    className?: string;
+}
+export interface ReasoningStepDetailsProps {
+    className?: string;
+    children?: ReactNode;
+}
+export interface ReasoningStepDetailRowProps {
+    detail: ReasoningStepDetail;
+    depth?: number;
+    pathKey?: string;
+    className?: string;
+}
+export interface ReasoningStepContextValue {
+    status: ReasoningStepStatus;
+    isExpanded: boolean;
+    isHovered: boolean;
+    setIsHovered: (hovered: boolean) => void;
+    toggleExpanded: () => void;
+    effectiveExpanded: boolean;
+    effectiveShowIcon: boolean;
+    hasExpandableContent: boolean;
+    text: ReactNode;
+    description?: string;
+    details?: ReasoningStepDetail[];
+    detailsChildren?: ReactNode;
+    duration: number;
+    spread: number;
+    disableExpandAnimation: boolean;
+    detailIndent: string;
+    expandedNestedKeys: Set<string>;
+    toggleNested: (pathKey: string) => void;
+    icon?: ReactNode;
+    eyeIcon: ReactNode;
+    arrowRightIcon: ReactNode;
+}
+export interface ReasoningStepCompound {
+    Root: React.FC<ReasoningStepRootProps>;
+    Header: React.FC<ReasoningStepHeaderProps>;
+    Details: React.FC<ReasoningStepDetailsProps>;
+    DetailRow: React.FC<ReasoningStepDetailRowProps>;
+}

package/dist/registry/chat/response/compound.d.ts

@@ -0,0 +1,25 @@
+import type { ResponseThinkingProps, ResponseStepsProps, ResponseStepProps, ResponseContentProps, ResponseImageGeneratingProps, ResponseDefaultLayoutProps } from './types';
+export declare function ResponseThinking({ className }: ResponseThinkingProps): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace ResponseThinking {
+    var displayName: string;
+}
+export declare function ResponseSteps({ className, children }: ResponseStepsProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ResponseSteps {
+    var displayName: string;
+}
+export declare function ResponseStepComponent({ step, status }: ResponseStepProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ResponseStepComponent {
+    var displayName: string;
+}
+export declare function ResponseContent({ markdown, streaming, onStreamComplete, className, }: ResponseContentProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ResponseContent {
+    var displayName: string;
+}
+export declare function ResponseImageGenerating({ width, height, className, }: ResponseImageGeneratingProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ResponseImageGenerating {
+    var displayName: string;
+}
+export declare function ResponseDefaultLayout({ className }: ResponseDefaultLayoutProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ResponseDefaultLayout {
+    var displayName: string;
+}

package/dist/registry/chat/response/context.d.ts

@@ -0,0 +1,9 @@
+import type { ResponseContextValue, ResponseRootProps, ResponseRound } from './types';
+declare const DEMO_ROUNDS: ResponseRound[];
+declare const DEMO_FINAL_MD = "## Plan\n\nI will organize your **1,000 local photos** by building an index, clustering them into albums, and then performing a safe rename + move operation.\n\n### Folder structure\n\n```text\nPictures/\n  Organized/\n    2026-01-18 \u2014 San Francisco \u2014 Golden Gate Park/\n    2026-01-05 \u2014 Home \u2014 Documents/\n    2025-12-31 \u2014 New Year's Eve/\n    _Duplicates/\n    _Unsorted/\n```\n\n### Naming scheme\n\n`YYYY-MM-DD_HH-mm-ss__<Location>__<Scene>__<Counter>.<ext>`\n\nExample:\n\n`2026-01-18_15-42-11__San-Francisco__Outdoor__001.jpg`\n\n### Safety checks\n\n- [x] Dry-run all operations\n- [x] Detect collisions and append counters\n- [x] Keep an audit log (CSV)\n- [ ] Execute moves (requires confirmation)\n\n---\n\n## Next step\n\nIf you want, I can generate a **preview report** first (top 50 renames + album summary) before applying changes.\n";
+export declare function useResponseContext(): ResponseContextValue;
+export declare function ResponseRootProvider({ simulate, phase, rounds, finalMarkdown, onSimulateComplete, onStepChange, thinkingIndicator, children, }: ResponseRootProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ResponseRootProvider {
+    var displayName: string;
+}
+export { DEMO_ROUNDS, DEMO_FINAL_MD };

package/dist/registry/chat/response/index.d.ts

@@ -0,0 +1,15 @@
+/**
+ * [INPUT]: ResponseProps
+ * [OUTPUT]: Response compound component
+ * [POS]: registry/chat/response - Response 复合组件主入口
+ *
+ * 设计模式：shadcn 风格复合组件
+ * - Response = 便捷导出（Root + DefaultLayout）
+ * - Response.Root/Thinking/Steps/Step/Content/ImageGenerating = 复合子组件
+ */
+import type { HTMLAttributes } from 'react';
+import { useResponseContext, DEMO_ROUNDS, DEMO_FINAL_MD } from './context';
+import type { ResponseProps, ResponseCompound, ResponsePhase, ResponseStep, ResponseStepToolType, ResponseRound, ResponseBlock, BlockType } from './types';
+export declare const Response: React.FC<ResponseProps & HTMLAttributes<HTMLDivElement>> & ResponseCompound;
+export type { ResponseProps, ResponsePhase, ResponseStep, ResponseStepToolType, ResponseRound, ResponseBlock, BlockType, ResponseCompound, };
+export { useResponseContext, DEMO_ROUNDS, DEMO_FINAL_MD };

package/dist/registry/chat/response/types.d.ts

@@ -0,0 +1,99 @@
+/**
+ * [INPUT]: N/A
+ * [OUTPUT]: Type definitions for Response compound component
+ * [POS]: registry/chat/response - Response 组件类型定义
+ */
+import type { HTMLAttributes, ReactNode } from 'react';
+import type { ReasoningStepDetail } from '../reasoning-step';
+export type ResponsePhase = 'thinking' | 'streaming' | 'done' | 'imageGenerating';
+export type ResponseStepToolType = 'read' | 'edit' | 'search';
+export interface ResponseStep {
+    text: string;
+    description?: string;
+    details?: ReasoningStepDetail[];
+    toolType?: ResponseStepToolType;
+}
+export interface ResponseRound {
+    step: ResponseStep;
+    simpleMd: string;
+}
+export type BlockType = 'think' | 'composer' | 'md';
+export interface ResponseBlock {
+    type: BlockType;
+    step?: ResponseStep;
+    md?: string;
+}
+export interface ResponseRootProps {
+    /** 是否启用流式模拟 */
+    simulate?: boolean;
+    /** 当前阶段 */
+    phase?: ResponsePhase;
+    /** 响应轮次数据 */
+    rounds?: ResponseRound[];
+    /** 最终 Markdown 内容 */
+    finalMarkdown?: string;
+    /** 模拟完成回调 */
+    onSimulateComplete?: () => void;
+    /** 步骤变化回调 */
+    onStepChange?: (text: string, toolType?: ResponseStepToolType) => void;
+    /** 自定义 ThinkingIndicator（主库注入 Lottie） */
+    thinkingIndicator?: ReactNode;
+    /** 自定义 className */
+    className?: string;
+    /** 子组件 */
+    children?: ReactNode;
+}
+export interface ResponseProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'>, ResponseRootProps {
+}
+export interface ResponseThinkingProps {
+    className?: string;
+}
+export interface ResponseStepsProps {
+    className?: string;
+    children?: ReactNode;
+}
+export interface ResponseStepProps {
+    step: ResponseStep;
+    status?: 'completed' | 'in-progress';
+}
+export interface ResponseContentProps {
+    /** Markdown 内容 */
+    markdown?: string;
+    /** 是否流式渲染 */
+    streaming?: boolean;
+    /** 流式渲染完成回调 */
+    onStreamComplete?: () => void;
+    className?: string;
+}
+export interface ResponseImageGeneratingProps {
+    width?: string;
+    height?: string;
+    className?: string;
+}
+export interface ResponseDefaultLayoutProps {
+    className?: string;
+}
+export interface ResponseContextValue {
+    phase: ResponsePhase;
+    simulate: boolean;
+    rounds: ResponseRound[];
+    finalMarkdown: string;
+    blocks: ResponseBlock[];
+    visibleIndex: number;
+    setVisibleIndex: React.Dispatch<React.SetStateAction<number>>;
+    isSimDone: boolean;
+    currentBlock: ResponseBlock | null;
+    showThink: boolean;
+    onSimulateComplete?: () => void;
+    onStepChange?: (text: string, toolType?: ResponseStepToolType) => void;
+    thinkingIndicator: ReactNode;
+}
+export interface ResponseCompound {
+    Root: React.FC<ResponseRootProps>;
+    Thinking: React.FC<ResponseThinkingProps>;
+    Steps: React.FC<ResponseStepsProps>;
+    Step: React.FC<ResponseStepProps>;
+    Content: React.FC<ResponseContentProps>;
+    ImageGenerating: React.FC<ResponseImageGeneratingProps>;
+    DefaultLayout: React.FC<ResponseDefaultLayoutProps>;
+}

package/dist/registry/chat/user-message.d.ts

@@ -0,0 +1,6 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+export interface UserMessageProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+    children: ReactNode;
+    maxWidth?: string | number;
+}
+export declare const UserMessage: import("react").ForwardRefExoticComponent<UserMessageProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/registry/chat/user-question/compound.d.ts

@@ -0,0 +1,37 @@
+import type { ReactNode } from 'react';
+import type { UserQuestionItem } from './types';
+export interface UserQuestionHeaderProps {
+    className?: string;
+}
+export declare function UserQuestionHeader({ className }: UserQuestionHeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace UserQuestionHeader {
+    var displayName: string;
+}
+export interface UserQuestionCardProps {
+    question: UserQuestionItem;
+    qIndex: number;
+    className?: string;
+}
+export declare function UserQuestionCard({ question, qIndex, className }: UserQuestionCardProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace UserQuestionCard {
+    var displayName: string;
+}
+export interface UserQuestionCardsProps {
+    className?: string;
+    children?: ReactNode;
+}
+export declare function UserQuestionCards({ className, children }: UserQuestionCardsProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace UserQuestionCards {
+    var displayName: string;
+}
+export interface UserQuestionFooterProps {
+    className?: string;
+}
+export declare function UserQuestionFooter({ className }: UserQuestionFooterProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace UserQuestionFooter {
+    var displayName: string;
+}
+export declare function UserQuestionDefaultLayout(): import("react/jsx-runtime").JSX.Element;
+export declare namespace UserQuestionDefaultLayout {
+    var displayName: string;
+}

package/dist/registry/chat/user-question/context.d.ts

@@ -0,0 +1,55 @@
+import type { ReactNode, MutableRefObject, Dispatch, SetStateAction } from 'react';
+import { type UserQuestionItem, type UserQuestionLabels, type UserQuestionHandle } from './types';
+export interface UserQuestionContextValue {
+    questions: UserQuestionItem[];
+    labels: Required<UserQuestionLabels>;
+    currentQuestionIndex: number;
+    setCurrentQuestionIndex: (i: number) => void;
+    answers: Record<string, string[]>;
+    setAnswers: Dispatch<SetStateAction<Record<string, string[]>>>;
+    customInputs: Record<string, string>;
+    setCustomInputs: Dispatch<SetStateAction<Record<string, string>>>;
+    focusedOptionIndex: number;
+    setFocusedOptionIndex: (i: number) => void;
+    isSubmitting: boolean;
+    setIsSubmitting: (v: boolean) => void;
+    maxQuestionHeight: number | undefined;
+    scrollContainerRef: MutableRefObject<HTMLDivElement | null>;
+    questionRefs: MutableRefObject<Map<number, HTMLDivElement>>;
+    customInputRefs: MutableRefObject<Map<string, HTMLInputElement>>;
+    setShouldScrollToQuestion: (v: boolean) => void;
+    currentQuestion: UserQuestionItem | undefined;
+    currentOptions: {
+        label: string;
+        description?: string;
+    }[];
+    allQuestionsAnswered: boolean;
+    currentQuestionHasAnswer: boolean;
+    getSelectedOptionIndex: (i: number) => number;
+    handleOptionClick: (questionText: string, optionLabel: string, questionIndex: number) => void;
+    handlePrevious: () => void;
+    handleNext: () => void;
+    handleContinue: () => void;
+    handleSkip: () => void;
+    handleRecommend: () => void;
+    chat4Icon: ReactNode;
+    arrowUpSIcon: ReactNode;
+    arrowDownSIcon: ReactNode;
+    sparklingIcon: ReactNode;
+    hasCustomText: boolean;
+}
+export declare function useUserQuestionContext(): UserQuestionContextValue;
+export interface UserQuestionRootProps {
+    questions: UserQuestionItem[];
+    resetKey?: string;
+    onAnswer: (answers: Record<string, string>) => void;
+    onSkip: () => void;
+    hasCustomText?: boolean;
+    labels?: UserQuestionLabels;
+    chat4Icon?: ReactNode;
+    arrowUpSIcon?: ReactNode;
+    arrowDownSIcon?: ReactNode;
+    sparklingIcon?: ReactNode;
+    children?: ReactNode;
+}
+export declare const UserQuestionRootProvider: import("react").ForwardRefExoticComponent<UserQuestionRootProps & import("react").RefAttributes<UserQuestionHandle>>;

package/dist/registry/chat/user-question/index.d.ts

@@ -1,7 +1,15 @@
-import { type UserQuestionProps, type UserQuestionHandle } from './types';
+import { useUserQuestionContext, type UserQuestionRootProps } from './context';
+import { UserQuestionHeader, UserQuestionCard, UserQuestionCards, UserQuestionFooter, UserQuestionDefaultLayout } from './compound';
+import type { UserQuestionProps, UserQuestionHandle } from './types';
 export type { UserQuestionOption, UserQuestionItem, UserQuestionLabels, UserQuestionProps, UserQuestionHandle, } from './types';
 export { DEFAULT_LABELS, NO_PREFERENCE_VALUE } from './types';
-export { UserQuestionHeader } from './UserQuestionHeader';
-export { UserQuestionCard } from './UserQuestionCard';
-export { UserQuestionFooter } from './UserQuestionFooter';
-export declare const UserQuestion: import("react").NamedExoticComponent<UserQuestionProps & import("react").RefAttributes<UserQuestionHandle>>;
+export interface UserQuestionCompound {
+    Root: React.ForwardRefExoticComponent<UserQuestionRootProps & React.RefAttributes<UserQuestionHandle>>;
+    Header: typeof UserQuestionHeader;
+    Card: typeof UserQuestionCard;
+    Cards: typeof UserQuestionCards;
+    Footer: typeof UserQuestionFooter;
+    DefaultLayout: typeof UserQuestionDefaultLayout;
+}
+export declare const UserQuestion: React.ForwardRefExoticComponent<UserQuestionProps & React.RefAttributes<UserQuestionHandle>> & UserQuestionCompound;
+export { useUserQuestionContext, UserQuestionDefaultLayout };

package/dist/registry/chat/user-question/useUserQuestionKeyboard.d.ts

@@ -1,4 +1,3 @@
-import type { MutableRefObject } from 'react';
 import type { UserQuestionItem, UserQuestionOption } from './types';
 export interface UseUserQuestionKeyboardProps {
     isSubmitting: boolean;
@@ -10,9 +9,9 @@ export interface UseUserQuestionKeyboardProps {
     setFocusedOptionIndex: (n: number) => void;
     currentQuestionHasAnswer: boolean;
     getSelectedOptionIndex: (i: number) => number;
-    shouldScrollToQuestionRef: MutableRefObject<boolean>;
+    setShouldScrollToQuestion: (v: boolean) => void;
     setCurrentQuestionIndex: (i: number) => void;
     handleOptionClick: (questionText: string, optionLabel: string, questionIndex: number) => void;
     handleContinue: () => void;
 }
-export declare function useUserQuestionKeyboard({ isSubmitting, currentQuestion, currentOptions, currentQuestionIndex, questions, focusedOptionIndex, setFocusedOptionIndex, currentQuestionHasAnswer, getSelectedOptionIndex, shouldScrollToQuestionRef, setCurrentQuestionIndex, handleOptionClick, handleContinue, }: UseUserQuestionKeyboardProps): void;
+export declare function useUserQuestionKeyboard({ isSubmitting, currentQuestion, currentOptions, currentQuestionIndex, questions, focusedOptionIndex, setFocusedOptionIndex, currentQuestionHasAnswer, getSelectedOptionIndex, setShouldScrollToQuestion, setCurrentQuestionIndex, handleOptionClick, handleContinue, }: UseUserQuestionKeyboardProps): void;