@app-studio/web 0.8.95 → 0.8.97

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@app-studio/web",
-  "version": "0.8.95",
+  "version": "0.8.97",
   "main": "dist/index.js",
   "typings": "dist/components/index.d.ts",
   "files": [
@@ -106,7 +106,7 @@
     "@types/react-test-renderer": "^18.0.0",
     "@typescript-eslint/eslint-plugin": "^5.59.7",
     "@typescript-eslint/parser": "^5.59.7",
-    "app-studio": "^0.6.13",
+    "app-studio": "^0.6.16",
     "async-mutex": "^0.5.0",
     "babel-jest": "^29.5.0",
     "babel-loader": "^9.1.2",
@@ -153,7 +153,7 @@
     "ts-loader": "^9.4.2",
     "tsc-alias": "^1.8.8",
     "tsdx": "^0.14.1",
-    "tslib": "^2.6.2",
+    "tslib": "^2.8.1",
     "web-vitals": "^2.1.4",
     "webpack": "^5.89.0",
     "webpack-bundle-analyzer": "^4.8.0",

package/dist/components/Chat/AIResponseDisplay/AIResponseDisplay/AIResponseDisplay.props.d.ts

@@ -1,40 +0,0 @@
-/**
- * AIResponseDisplay Props
- *
- * Defines the properties for the AIResponseDisplay component, which renders
- * AI-generated content with support for formatting, code blocks, and more.
- */
-import { ViewProps } from 'app-studio';
-import { AIResponseDisplayStyles } from './AIResponseDisplay.type';
-export interface AIResponseDisplayProps extends ViewProps {
-    /**
-     * Content to display - can include markdown-like formatting
-     * such as code blocks, inline code, and links
-     */
-    content: string;
-    /**
-     * Whether to enable syntax highlighting for code blocks
-     * @default true
-     */
-    enableSyntaxHighlighting?: boolean;
-    /**
-     * Whether to enable citations (e.g., [1], [2])
-     * @default true
-     */
-    enableCitations?: boolean;
-    /**
-     * Whether to enable math rendering (LaTeX-like syntax)
-     * @default false
-     */
-    enableMath?: boolean;
-    /**
-     * Whether to enable automatic link detection and formatting
-     * @default true
-     */
-    enableLinkDetection?: boolean;
-    /**
-     * Custom styles for different parts of the component
-     * Follows the design system with consistent spacing, typography, and colors
-     */
-    styles?: AIResponseDisplayStyles;
-}

package/dist/components/Chat/AIResponseDisplay/AIResponseDisplay/AIResponseDisplay.style.d.ts

@@ -1,10 +0,0 @@
-/**
- * AIResponseDisplay Styles
- */
-import { ViewProps } from 'app-studio';
-export declare const containerStyles: ViewProps;
-export declare const textStyles: ViewProps;
-export declare const codeBlockStyles: ViewProps;
-export declare const inlineCodeStyles: ViewProps;
-export declare const citationStyles: ViewProps;
-export declare const linkStyles: ViewProps;

package/dist/components/Chat/AIResponseDisplay/AIResponseDisplay/AIResponseDisplay.type.d.ts

@@ -1,23 +0,0 @@
-/**
- * AIResponseDisplay Types
- *
- * Defines the types used by the AIResponseDisplay component
- */
-import { ViewProps } from 'app-studio';
-/**
- * Styles for different parts of the AIResponseDisplay component
- */
-export interface AIResponseDisplayStyles {
-    /** Styles for the main container */
-    container?: ViewProps;
-    /** Styles for the text content */
-    text?: ViewProps;
-    /** Styles for code blocks */
-    codeBlock?: ViewProps;
-    /** Styles for citations */
-    citation?: ViewProps;
-    /** Styles for inline code */
-    inlineCode?: ViewProps;
-    /** Styles for links */
-    link?: ViewProps;
-}

package/dist/components/Chat/AIResponseDisplay/AIResponseDisplay/AIResponseDisplay.view.d.ts

@@ -1,9 +0,0 @@
-/**
- * AIResponseDisplay View
- *
- * A component for displaying AI-generated responses with support for
- * code blocks, inline code, links, and other formatting.
- */
-import React from 'react';
-import { AIResponseDisplayProps } from './AIResponseDisplay.props';
-export declare const AIResponseDisplayView: React.FC<AIResponseDisplayProps>;

package/dist/components/Chat/AIResponseDisplay/AIResponseDisplay.d.ts

@@ -1,10 +0,0 @@
-/**
- * AIResponseDisplay Component
- *
- * A component for displaying AI-generated responses with support for
- * code blocks, inline code, and other formatting.
- */
-import React from 'react';
-import { AIResponseDisplayProps } from './AIResponseDisplay/AIResponseDisplay.props';
-export declare const AIResponseDisplay: React.FC<AIResponseDisplayProps>;
-export type { AIResponseDisplayProps } from './AIResponseDisplay/AIResponseDisplay.props';

package/dist/components/Chat/AIResponseDisplay/examples/basic.d.ts

@@ -1,5 +0,0 @@
-/**
- * Basic AIResponseDisplay Example
- */
-import React from 'react';
-export declare const BasicAIResponseDisplay: () => React.JSX.Element;

package/dist/components/Chat/AIResponseDisplay/examples/index.d.ts

@@ -1,4 +0,0 @@
-/**
- * AIResponseDisplay Examples
- */
-export * from './basic';

package/dist/components/Chat/ChatInterface/ChatInterface/ChatInterface.props.d.ts

@@ -1,56 +0,0 @@
-/**
- * ChatInterface Props
- */
-/// <reference types="react" />
-import { ViewProps } from 'app-studio';
-import { Message, ChatInterfaceStyles } from './ChatInterface.type';
-export interface ChatInterfaceProps extends ViewProps {
-    /**
-     * Array of messages to display in the chat
-     */
-    messages: Message[];
-    /**
-     * Callback function when a new message is submitted
-     */
-    onSubmit?: (message: string) => void;
-    /**
-     * Callback function when a message is edited
-     */
-    onEdit?: (id: string, newContent: string) => void;
-    /**
-     * Callback function when a message is deleted
-     */
-    onDelete?: (id: string) => void;
-    /**
-     * Whether to show the loading indicator
-     */
-    isLoading?: boolean;
-    /**
-     * Placeholder text for the input field
-     */
-    placeholder?: string;
-    /**
-     * Whether to enable file uploads
-     */
-    enableFileUpload?: boolean;
-    /**
-     * Whether to enable voice input
-     */
-    enableVoiceInput?: boolean;
-    /**
-     * Whether to enable AI suggestions
-     */
-    enableSuggestions?: boolean;
-    /**
-     * URL of the background image
-     */
-    backgroundImageUrl?: string;
-    /**
-     * Custom styles for the component
-     */
-    styles?: ChatInterfaceStyles;
-    /**
-     * Children components
-     */
-    children?: React.ReactNode;
-}

package/dist/components/Chat/ChatInterface/ChatInterface/ChatInterface.state.d.ts

@@ -1,12 +0,0 @@
-/**
- * ChatInterface State
- */
-/// <reference types="react" />
-export declare const useChatInterfaceState: (initialMessages?: never[]) => {
-    inputValue: string;
-    isSubmitting: boolean;
-    messagesEndRef: import("react").RefObject<HTMLDivElement>;
-    handleInputChange: (value: string) => void;
-    handleSubmit: (callback?: ((message: string) => void) | undefined) => void;
-    setInputValue: import("react").Dispatch<import("react").SetStateAction<string>>;
-};

package/dist/components/Chat/ChatInterface/ChatInterface/ChatInterface.style.d.ts

@@ -1,10 +0,0 @@
-/**
- * ChatInterface Styles
- */
-import { ViewProps } from 'app-studio';
-export declare const defaultContainerStyles: ViewProps;
-export declare const defaultMessagesContainerStyles: ViewProps;
-export declare const defaultInputContainerStyles: ViewProps;
-export declare const defaultControlsContainerStyles: ViewProps;
-export declare const backgroundImageStyles: ViewProps;
-export declare const backgroundOverlayStyles: ViewProps;

package/dist/components/Chat/ChatInterface/ChatInterface/ChatInterface.type.d.ts

@@ -1,19 +0,0 @@
-/**
- * ChatInterface Types
- */
-import { ViewProps } from 'app-studio';
-export declare type MessageType = 'user' | 'assistant' | 'system' | 'error';
-export interface Message {
-    id: string;
-    type: MessageType;
-    content: string;
-    timestamp: Date;
-    isLoading?: boolean;
-    metadata?: Record<string, any>;
-}
-export interface ChatInterfaceStyles {
-    container?: ViewProps;
-    messagesContainer?: ViewProps;
-    inputContainer?: ViewProps;
-    controlsContainer?: ViewProps;
-}

package/dist/components/Chat/ChatInterface/ChatInterface/ChatInterface.view.d.ts

@@ -1,14 +0,0 @@
-/**
- * ChatInterface View
- */
-import React from 'react';
-import { ChatInterfaceProps } from './ChatInterface.props';
-interface Props extends ChatInterfaceProps {
-    inputValue: string;
-    isSubmitting: boolean;
-    messagesEndRef: React.RefObject<HTMLDivElement>;
-    handleInputChange: (value: string) => void;
-    handleSubmit: () => void;
-}
-export declare const ChatInterfaceView: React.FC<Props>;
-export {};

package/dist/components/Chat/ChatInterface/ChatInterface.d.ts

@@ -1,11 +0,0 @@
-/**
- * ChatInterface Component
- *
- * A comprehensive chat interface for AI applications that includes
- * message display, user input, and various controls.
- */
-import React from 'react';
-import { ChatInterfaceProps } from './ChatInterface/ChatInterface.props';
-export declare const ChatInterface: React.FC<ChatInterfaceProps>;
-export type { ChatInterfaceProps } from './ChatInterface/ChatInterface.props';
-export type { Message, MessageType } from './ChatInterface/ChatInterface.type';

package/dist/components/Chat/CodeBlock/CodeBlock/CodeBlock.props.d.ts

@@ -1,35 +0,0 @@
-/**
- * CodeBlock Props
- */
-import { ViewProps } from 'app-studio';
-import { CodeBlockStyles } from './CodeBlock.type';
-export interface CodeBlockProps extends ViewProps {
-    /**
-     * Code content to display
-     */
-    code: string;
-    /**
-     * Programming language for syntax highlighting
-     */
-    language?: string;
-    /**
-     * Whether to show line numbers
-     */
-    showLineNumbers?: boolean;
-    /**
-     * Whether to enable syntax highlighting
-     */
-    enableSyntaxHighlighting?: boolean;
-    /**
-     * Whether to show a copy button
-     */
-    showCopyButton?: boolean;
-    /**
-     * Whether to show the language label
-     */
-    showLanguageLabel?: boolean;
-    /**
-     * Custom styles for the component
-     */
-    styles?: CodeBlockStyles;
-}

package/dist/components/Chat/CodeBlock/CodeBlock/CodeBlock.state.d.ts

@@ -1,7 +0,0 @@
-/**
- * CodeBlock State
- */
-export declare const useCodeBlockState: () => {
-    isCopied: boolean;
-    copyToClipboard: (text: string) => void;
-};

package/dist/components/Chat/CodeBlock/CodeBlock/CodeBlock.style.d.ts

@@ -1,12 +0,0 @@
-/**
- * CodeBlock Styles
- *
- * Styles for the CodeBlock component following the design guidelines
- */
-import { ViewProps } from 'app-studio';
-export declare const containerStyles: ViewProps;
-export declare const headerStyles: ViewProps;
-export declare const contentStyles: ViewProps;
-export declare const footerStyles: ViewProps;
-export declare const copyButtonStyles: ViewProps;
-export declare const languageLabelStyles: ViewProps;

package/dist/components/Chat/CodeBlock/CodeBlock/CodeBlock.type.d.ts

@@ -1,11 +0,0 @@
-/**
- * CodeBlock Types
- */
-import { ViewProps } from 'app-studio';
-export interface CodeBlockStyles {
-    container?: ViewProps;
-    header?: ViewProps;
-    content?: ViewProps;
-    footer?: ViewProps;
-    copyButton?: ViewProps;
-}

package/dist/components/Chat/CodeBlock/CodeBlock/CodeBlock.view.d.ts

@@ -1,11 +0,0 @@
-/**
- * CodeBlock View
- */
-import React from 'react';
-import { CodeBlockProps } from './CodeBlock.props';
-interface Props extends CodeBlockProps {
-    isCopied: boolean;
-    copyToClipboard: (text: string) => void;
-}
-export declare const CodeBlockView: React.FC<Props>;
-export {};

package/dist/components/Chat/CodeBlock/CodeBlock.d.ts

@@ -1,10 +0,0 @@
-/**
- * CodeBlock Component
- *
- * A component for displaying code with syntax highlighting, line numbers,
- * and a copy button.
- */
-import React from 'react';
-import { CodeBlockProps } from './CodeBlock/CodeBlock.props';
-export declare const CodeBlock: React.FC<CodeBlockProps>;
-export type { CodeBlockProps } from './CodeBlock/CodeBlock.props';

package/dist/components/Chat/FileUploader/FileUploader/FileUploader.props.d.ts

@@ -1,47 +0,0 @@
-/**
- * FileUploader Props
- */
-import { ViewProps } from 'app-studio';
-import { UploadedFile, FileUploaderStyles } from './FileUploader.type';
-export interface FileUploaderProps extends ViewProps {
-    /**
-     * List of uploaded files
-     */
-    files: UploadedFile[];
-    /**
-     * Callback function when files are added
-     */
-    onFilesAdded: (files: File[]) => void;
-    /**
-     * Callback function when a file is removed
-     */
-    onFileRemove: (fileId: string) => void;
-    /**
-     * Callback function when a file is retried after an error
-     */
-    onFileRetry?: (fileId: string) => void;
-    /**
-     * Maximum number of files allowed
-     */
-    maxFiles?: number;
-    /**
-     * Maximum file size in bytes
-     */
-    maxSize?: number;
-    /**
-     * Accepted file types
-     */
-    accept?: string;
-    /**
-     * Whether to allow multiple files
-     */
-    multiple?: boolean;
-    /**
-     * Whether the uploader is disabled
-     */
-    isDisabled?: boolean;
-    /**
-     * Custom styles for the component
-     */
-    styles?: FileUploaderStyles;
-}

package/dist/components/Chat/FileUploader/FileUploader/FileUploader.state.d.ts

@@ -1,15 +0,0 @@
-/**
- * FileUploader State
- */
-/// <reference types="react" />
-export declare const useFileUploaderState: (onFilesAdded: (files: File[]) => void, maxFiles: number, maxSize: number, accept: string) => {
-    isDragging: boolean;
-    fileInputRef: import("react").RefObject<HTMLInputElement>;
-    handleDragEnter: (e: React.DragEvent) => void;
-    handleDragLeave: (e: React.DragEvent) => void;
-    handleDragOver: (e: React.DragEvent) => void;
-    handleDrop: (e: React.DragEvent) => void;
-    handleFileInputChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    openFileDialog: () => void;
-    formatBytes: (bytes: number, decimals?: number) => string;
-};

package/dist/components/Chat/FileUploader/FileUploader/FileUploader.style.d.ts

@@ -1,15 +0,0 @@
-/**
- * FileUploader Styles
- */
-import { ViewProps } from 'app-studio';
-export declare const containerStyles: ViewProps;
-export declare const dropzoneStyles: (isDragging: boolean) => ViewProps;
-export declare const fileListStyles: ViewProps;
-export declare const fileItemStyles: ViewProps;
-export declare const fileIconStyles: (fileType: string) => ViewProps;
-export declare const fileInfoStyles: ViewProps;
-export declare const fileNameStyles: ViewProps;
-export declare const fileSizeStyles: ViewProps;
-export declare const fileActionsStyles: ViewProps;
-export declare const progressBarContainerStyles: ViewProps;
-export declare const progressBarStyles: (progress: number) => ViewProps;

package/dist/components/Chat/FileUploader/FileUploader/FileUploader.type.d.ts

@@ -1,24 +0,0 @@
-/**
- * FileUploader Types
- */
-import { ViewProps } from 'app-studio';
-export interface UploadedFile {
-    id: string;
-    name: string;
-    size: number;
-    type: string;
-    url?: string;
-    file: File;
-    progress?: number;
-    error?: string;
-    isUploading?: boolean;
-}
-export interface FileUploaderStyles {
-    container?: ViewProps;
-    dropzone?: ViewProps;
-    fileList?: ViewProps;
-    fileItem?: ViewProps;
-    fileInfo?: ViewProps;
-    fileActions?: ViewProps;
-    progressBar?: ViewProps;
-}

package/dist/components/Chat/FileUploader/FileUploader/FileUploader.view.d.ts

@@ -1,18 +0,0 @@
-/**
- * FileUploader View
- */
-import React from 'react';
-import { FileUploaderProps } from './FileUploader.props';
-interface Props extends FileUploaderProps {
-    isDragging: boolean;
-    fileInputRef: React.RefObject<HTMLInputElement>;
-    handleDragEnter: (e: React.DragEvent) => void;
-    handleDragLeave: (e: React.DragEvent) => void;
-    handleDragOver: (e: React.DragEvent) => void;
-    handleDrop: (e: React.DragEvent) => void;
-    handleFileInputChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    openFileDialog: () => void;
-    formatBytes: (bytes: number, decimals?: number) => string;
-}
-export declare const FileUploaderView: React.FC<Props>;
-export {};

package/dist/components/Chat/FileUploader/FileUploader.d.ts

@@ -1,11 +0,0 @@
-/**
- * FileUploader Component
- *
- * A component for uploading files with drag and drop support, progress tracking,
- * and file validation.
- */
-import React from 'react';
-import { FileUploaderProps } from './FileUploader/FileUploader.props';
-export declare const FileUploader: React.FC<FileUploaderProps>;
-export type { FileUploaderProps } from './FileUploader/FileUploader.props';
-export type { UploadedFile } from './FileUploader/FileUploader.type';

package/dist/components/Chat/LoadingIndicator/LoadingIndicator/LoadingIndicator.props.d.ts

@@ -1,27 +0,0 @@
-/**
- * LoadingIndicator Props
- */
-import { ViewProps } from 'app-studio';
-import { LoadingIndicatorSize, LoadingIndicatorVariant, LoadingIndicatorStyles } from './LoadingIndicator.type';
-export interface LoadingIndicatorProps extends ViewProps {
-    /**
-     * Size of the loading indicator
-     */
-    size?: LoadingIndicatorSize;
-    /**
-     * Variant of the loading indicator
-     */
-    variant?: LoadingIndicatorVariant;
-    /**
-     * Color of the loading indicator
-     */
-    color?: string;
-    /**
-     * Text to display alongside the loading indicator
-     */
-    text?: string;
-    /**
-     * Custom styles for the component
-     */
-    styles?: LoadingIndicatorStyles;
-}

package/dist/components/Chat/LoadingIndicator/LoadingIndicator/LoadingIndicator.style.d.ts

@@ -1,13 +0,0 @@
-/**
- * LoadingIndicator Styles
- */
-import { ViewProps } from 'app-studio';
-import { LoadingIndicatorSize } from './LoadingIndicator.type';
-export declare const containerStyles: ViewProps;
-export declare const sizeMap: Record<LoadingIndicatorSize, number>;
-export declare const dotSizeMap: Record<LoadingIndicatorSize, number>;
-export declare const spinnerStyles: (size: LoadingIndicatorSize, color: string) => ViewProps;
-export declare const dotContainerStyles: ViewProps;
-export declare const dotStyles: (size: LoadingIndicatorSize, color: string, index: number) => ViewProps;
-export declare const typingContainerStyles: ViewProps;
-export declare const typingDotStyles: (size: LoadingIndicatorSize, color: string, index: number) => ViewProps;

package/dist/components/Chat/LoadingIndicator/LoadingIndicator/LoadingIndicator.type.d.ts

@@ -1,11 +0,0 @@
-/**
- * LoadingIndicator Types
- */
-import { ViewProps } from 'app-studio';
-export declare type LoadingIndicatorSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-export declare type LoadingIndicatorVariant = 'spinner' | 'dots' | 'pulse' | 'typing';
-export interface LoadingIndicatorStyles {
-    container?: ViewProps;
-    spinner?: ViewProps;
-    dot?: ViewProps;
-}

package/dist/components/Chat/LoadingIndicator/LoadingIndicator/LoadingIndicator.view.d.ts

@@ -1,6 +0,0 @@
-/**
- * LoadingIndicator View
- */
-import React from 'react';
-import { LoadingIndicatorProps } from './LoadingIndicator.props';
-export declare const LoadingIndicatorView: React.FC<LoadingIndicatorProps>;

package/dist/components/Chat/LoadingIndicator/LoadingIndicator.d.ts

@@ -1,10 +0,0 @@
-/**
- * LoadingIndicator Component
- *
- * A versatile loading indicator with multiple variants and sizes.
- */
-import React from 'react';
-import { LoadingIndicatorProps } from './LoadingIndicator/LoadingIndicator.props';
-export declare const LoadingIndicator: React.FC<LoadingIndicatorProps>;
-export type { LoadingIndicatorProps } from './LoadingIndicator/LoadingIndicator.props';
-export type { LoadingIndicatorSize, LoadingIndicatorVariant, } from './LoadingIndicator/LoadingIndicator.type';

package/dist/components/Chat/MessageBubble/MessageBubble/MessageBubble.props.d.ts

@@ -1,36 +0,0 @@
-/**
- * MessageBubble Props
- */
-import { ViewProps } from 'app-studio';
-import { Message } from '../../ChatInterface/ChatInterface/ChatInterface.type';
-import { MessageBubbleStyles } from './MessageBubble.type';
-export interface MessageBubbleProps extends ViewProps {
-    /**
-     * Message object to display
-     */
-    message: Message;
-    /**
-     * Callback function when the message is edited
-     */
-    onEdit?: (newContent: string) => void;
-    /**
-     * Callback function when the message is deleted
-     */
-    onDelete?: () => void;
-    /**
-     * Whether to show the timestamp
-     */
-    showTimestamp?: boolean;
-    /**
-     * Whether to show the avatar
-     */
-    showAvatar?: boolean;
-    /**
-     * Whether to show action buttons (edit, delete, etc.)
-     */
-    showActions?: boolean;
-    /**
-     * Custom styles for the component
-     */
-    styles?: MessageBubbleStyles;
-}

package/dist/components/Chat/MessageBubble/MessageBubble/MessageBubble.state.d.ts

@@ -1,14 +0,0 @@
-/**
- * MessageBubble State
- */
-/// <reference types="react" />
-export declare const useMessageBubbleState: () => {
-    isEditing: boolean;
-    editValue: string;
-    isHovered: boolean;
-    setEditValue: import("react").Dispatch<import("react").SetStateAction<string>>;
-    setIsHovered: import("react").Dispatch<import("react").SetStateAction<boolean>>;
-    startEditing: (initialContent: string) => void;
-    cancelEditing: () => void;
-    saveEditing: (onEdit?: ((newContent: string) => void) | undefined) => void;
-};

package/dist/components/Chat/MessageBubble/MessageBubble/MessageBubble.style.d.ts

@@ -1,10 +0,0 @@
-/**
- * MessageBubble Styles
- */
-import { ViewProps } from 'app-studio';
-import { MessageType } from '../../ChatInterface/ChatInterface/ChatInterface.type';
-export declare const getContainerStyles: (type: MessageType, isHovered: boolean) => ViewProps;
-export declare const getMessageContentStyles: (type: MessageType) => ViewProps;
-export declare const contentStyles: ViewProps;
-export declare const timestampStyles: ViewProps;
-export declare const actionsStyles: ViewProps;

package/dist/components/Chat/MessageBubble/MessageBubble/MessageBubble.type.d.ts

@@ -1,11 +0,0 @@
-/**
- * MessageBubble Types
- */
-import { ViewProps } from 'app-studio';
-export interface MessageBubbleStyles {
-    container?: ViewProps;
-    content?: ViewProps;
-    avatar?: ViewProps;
-    timestamp?: ViewProps;
-    actions?: ViewProps;
-}