@rolder/kit 3.0.0-alpha.8 → 3.0.0-alpha.81

package/src/ai/ui/conversation/FileIcon.tsx

@@ -1,143 +0,0 @@
-export const FileIcon = ({ mimeType }: { mimeType: string }) => {
-  switch (true) {
-    case mimeType.includes('image/'):
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="36"
-          height="36"
-          viewBox="0 0 36 36"
-          fill="none"
-          stroke="var(--mantine-color-text)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="Image"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M15 8h.01" />
-          <path d="M3 6a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3v-12" />
-          <path d="M3 16l5 -5c.928 -.893 2.072 -.893 3 0l5 5" />
-          <path d="M14 14l1 -1c.928 -.893 2.072 -.893 3 0l3 3" />
-        </svg>
-      );
-    case mimeType.includes('application/pdf'):
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="36"
-          height="36"
-          viewBox="0 0 36 36"
-          fill="none"
-          stroke="var(--mantine-color-text)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="FilePdf"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4" />
-          <path d="M5 18h1.5a1.5 1.5 0 0 0 0 -3h-1.5v6" />
-          <path d="M17 18h2" />
-          <path d="M20 15h-3v6" />
-          <path d="M11 15v6h1a2 2 0 0 0 2 -2v-2a2 2 0 0 0 -2 -2h-1" />
-        </svg>
-      );
-    case mimeType === 'word':
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="36"
-          height="36"
-          viewBox="0 0 36 36"
-          fill="none"
-          stroke="var(--mantine-color-text)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="FileDoc"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4" />
-          <path d="M5 15v6h1a2 2 0 0 0 2 -2v-2a2 2 0 0 0 -2 -2h-1" />
-          <path d="M20 16.5a1.5 1.5 0 0 0 -3 0v3a1.5 1.5 0 0 0 3 0" />
-          <path d="M12.5 15a1.5 1.5 0 0 1 1.5 1.5v3a1.5 1.5 0 0 1 -3 0v-3a1.5 1.5 0 0 1 1.5 -1.5" />
-        </svg>
-      );
-    case mimeType === 'excel':
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="36"
-          height="36"
-          viewBox="0 0 36 36"
-          fill="none"
-          stroke="var(--mantine-color-text)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="FileXls"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4" />
-          <path d="M4 15l4 6" />
-          <path d="M4 21l4 -6" />
-          <path d="M17 20.25c0 .414 .336 .75 .75 .75h1.25a1 1 0 0 0 1 -1v-1a1 1 0 0 0 -1 -1h-1a1 1 0 0 1 -1 -1v-1a1 1 0 0 1 1 -1h1.25a.75 .75 0 0 1 .75 .75" />
-          <path d="M11 15v6h3" />
-        </svg>
-      );
-    case mimeType === 'powerpoint':
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="36"
-          height="36"
-          viewBox="0 0 36 36"
-          fill="none"
-          stroke="var(--mantine-color-text)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="FilePpt"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M5 18h1.5a1.5 1.5 0 0 0 0 -3h-1.5v6" />
-          <path d="M11 18h1.5a1.5 1.5 0 0 0 0 -3h-1.5v6" />
-          <path d="M16.5 15h3" />
-          <path d="M18 15v6" />
-          <path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4" />
-        </svg>
-      );
-    default:
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="36"
-          height="36"
-          viewBox="0 0 36 36"
-          fill="none"
-          stroke="var(--mantine-color-text)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="File"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M15 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M18 17h-7a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h4l5 5v7a2 2 0 0 1 -2 2" />
-          <path d="M16 17v2a2 2 0 0 1 -2 2h-7a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h2" />
-        </svg>
-      );
-  }
-};

package/src/ai/ui/conversation/Loader.tsx

@@ -1,8 +0,0 @@
-import { type LoaderProps, Loader as MantineLoader } from '@mantine/core';
-import { useConversation } from './ConversationContext';
-
-export const Loader = (props: LoaderProps) => {
-  const { loading } = useConversation();
-
-  return loading ? <MantineLoader size={28} type="dots" {...props} /> : null;
-};

package/src/ai/ui/conversation/Message.tsx

@@ -1,34 +0,0 @@
-import { Paper } from '@mantine/core';
-import type { UIMessage } from 'ai';
-import { Streamdown } from 'streamdown';
-import { useConversation } from './ConversationContext';
-import { useChatMessage } from './useChatMessage';
-
-export const Message = <T extends UIMessage>({ message }: { message: T }) => {
-  const textParts = message?.parts?.filter((i) => i.type === 'text');
-  const lastTextPart = textParts?.[textParts.length - 1];
-
-  const chatMessage = useChatMessage(lastTextPart);
-
-  const { streaming } = useConversation();
-
-  return chatMessage && message.role !== 'system' ? (
-    <Paper
-      radius="md"
-      px="md"
-      py="sm"
-      maw="80%"
-      ml={message.role === 'user' ? 'auto' : undefined}
-      bg={
-        message.role === 'user'
-          ? 'var(--mantine-color-default-hover)'
-          : 'var(--mantine-primary-color-light)'
-      }
-      fz="sm"
-    >
-      <Streamdown isAnimating={streaming && message.role === 'assistant'}>
-        {chatMessage}
-      </Streamdown>
-    </Paper>
-  ) : null;
-};

package/src/ai/ui/conversation/Root.tsx

@@ -1,24 +0,0 @@
-import { Paper, Stack } from '@mantine/core';
-import { ScrollArea } from '../../../ui/scrollArea';
-import { Provider } from './ConversationProvider';
-import type { ConversationProps } from './types';
-
-export const Root = ({
-  children,
-  loading,
-  streaming,
-  empty,
-  ...props
-}: ConversationProps) => {
-  return (
-    <Provider loading={loading} streaming={streaming} empty={empty}>
-      <Paper withBorder radius="md" {...props}>
-        <ScrollArea autoScroll scrollToBottomOnInit p="md">
-          <Stack>{children}</Stack>
-
-          <ScrollArea.ScrollButton />
-        </ScrollArea>
-      </Paper>
-    </Provider>
-  );
-};

package/src/ai/ui/conversation/index.ts

@@ -1,16 +0,0 @@
-import { Empty } from './Empty';
-import { File } from './File';
-import { Loader } from './Loader';
-import { Message } from './Message';
-import { Root } from './Root';
-
-export type { ConversationProps } from './types';
-export { useChatMessage } from './useChatMessage';
-
-export const Conversation = {
-  Root,
-  Message,
-  File,
-  Loader,
-  Empty,
-};

package/src/ai/ui/conversation/types.ts

@@ -1,8 +0,0 @@
-import type { PaperProps } from '@mantine/core';
-
-export interface ConversationProps extends PaperProps {
-  children?: React.ReactNode;
-  loading: boolean;
-  streaming: boolean;
-  empty: boolean;
-}

package/src/ai/ui/conversation/useChatMessage.ts

@@ -1,13 +0,0 @@
-import type { TextUIPart } from 'ai';
-import { useEffect, useState } from 'react';
-import { parseAiMessagePart } from '../../utils/parseAiMessagePart';
-
-export const useChatMessage = (part: TextUIPart) => {
-  const [parsedText, setParsedText] = useState('');
-
-  useEffect(() => {
-    parseAiMessagePart(part).then((i) => setParsedText(i.text));
-  }, [part]);
-
-  return parsedText;
-};

package/src/ai/ui/promptInput/File.tsx

@@ -1,98 +0,0 @@
-import {
-  ActionIcon,
-  FileButton,
-  type FileButtonProps,
-  Tooltip,
-} from '@mantine/core';
-import { useRef } from 'react';
-import { FileIcon } from './FileIcon';
-import { usePromptInput } from './PromptInputContext';
-
-export const File = (props: Omit<FileButtonProps, 'onChange' | 'children'>) => {
-  const resetRef = useRef<() => void>(null);
-  const { file, setFile, accept, submiting, uploading } = usePromptInput();
-
-  return (
-    <FileButton
-      resetRef={resetRef}
-      onChange={async (file) => {
-        // Проверка для сценария отмены в системном диалоговом окне
-        if (file) setFile(file);
-      }}
-      accept={accept}
-      disabled={submiting || uploading}
-      {...props}
-    >
-      {(props) => (
-        <ActionIcon.Group>
-          <ActionIcon
-            size="lg"
-            variant="default"
-            disabled={submiting}
-            loading={uploading}
-            classNames={{ root: 'rolder-prompt-input-file-action-action' }}
-            {...props}
-          >
-            <svg
-              xmlns="http://www.w3.org/2000/svg"
-              width="24"
-              height="24"
-              viewBox="0 0 24 24"
-              fill="none"
-              stroke="currentColor"
-              strokeWidth="1.5"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              role="img"
-              aria-label="Paperclip"
-            >
-              <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-              <path d="M15 7l-6.5 6.5a1.5 1.5 0 0 0 3 3l6.5 -6.5a3 3 0 0 0 -6 -6l-6.5 6.5a4.5 4.5 0 0 0 9 9l6.5 -6.5" />
-            </svg>
-          </ActionIcon>
-
-          {file && (
-            <>
-              <Tooltip label={file.name} openDelay={500}>
-                <ActionIcon.GroupSection variant="default" size="lg">
-                  <FileIcon mimeType={file.type} />
-                </ActionIcon.GroupSection>
-              </Tooltip>
-
-              <ActionIcon
-                size="lg"
-                variant="default"
-                classNames={{ root: 'rolder-prompt-input-file-action-action' }}
-                onClick={() => {
-                  resetRef.current?.();
-                  setFile(undefined);
-                }}
-              >
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="24"
-                  height="24"
-                  viewBox="0 0 24 24"
-                  fill="none"
-                  stroke="currentColor"
-                  strokeWidth="1.5"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  role="img"
-                  aria-label="Trash"
-                >
-                  <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-                  <path d="M4 7l16 0" />
-                  <path d="M10 11l0 6" />
-                  <path d="M14 11l0 6" />
-                  <path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12" />
-                  <path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3" />
-                </svg>
-              </ActionIcon>
-            </>
-          )}
-        </ActionIcon.Group>
-      )}
-    </FileButton>
-  );
-};

package/src/ai/ui/promptInput/FileIcon.tsx

@@ -1,149 +0,0 @@
-export const FileIcon = ({ mimeType }: { mimeType: string }) => {
-  switch (true) {
-    case mimeType.includes('image/'):
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="24"
-          height="24"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="var(--mantine-color-dimmed)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="Image"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M15 8h.01" />
-          <path d="M3 6a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3v-12" />
-          <path d="M3 16l5 -5c.928 -.893 2.072 -.893 3 0l5 5" />
-          <path d="M14 14l1 -1c.928 -.893 2.072 -.893 3 0l3 3" />
-        </svg>
-      );
-    case mimeType.includes('application/pdf'):
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="24"
-          height="24"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="var(--mantine-color-dimmed)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="FilePdf"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4" />
-          <path d="M5 18h1.5a1.5 1.5 0 0 0 0 -3h-1.5v6" />
-          <path d="M17 18h2" />
-          <path d="M20 15h-3v6" />
-          <path d="M11 15v6h1a2 2 0 0 0 2 -2v-2a2 2 0 0 0 -2 -2h-1" />
-        </svg>
-      );
-    case mimeType.includes(
-      'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
-    ):
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="24"
-          height="24"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="var(--mantine-color-dimmed)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="FileDoc"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4" />
-          <path d="M5 15v6h1a2 2 0 0 0 2 -2v-2a2 2 0 0 0 -2 -2h-1" />
-          <path d="M20 16.5a1.5 1.5 0 0 0 -3 0v3a1.5 1.5 0 0 0 3 0" />
-          <path d="M12.5 15a1.5 1.5 0 0 1 1.5 1.5v3a1.5 1.5 0 0 1 -3 0v-3a1.5 1.5 0 0 1 1.5 -1.5" />
-        </svg>
-      );
-    case mimeType.includes(
-      'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
-    ):
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="24"
-          height="24"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="var(--mantine-color-dimmed)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="FileXls"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4" />
-          <path d="M4 15l4 6" />
-          <path d="M4 21l4 -6" />
-          <path d="M17 20.25c0 .414 .336 .75 .75 .75h1.25a1 1 0 0 0 1 -1v-1a1 1 0 0 0 -1 -1h-1a1 1 0 0 1 -1 -1v-1a1 1 0 0 1 1 -1h1.25a.75 .75 0 0 1 .75 .75" />
-          <path d="M11 15v6h3" />
-        </svg>
-      );
-    case mimeType.includes(
-      'application/vnd.openxmlformats-officedocument.presentationml.presentation',
-    ):
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="24"
-          height="24"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="var(--mantine-color-dimmed)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="FilePpt"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M14 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M5 18h1.5a1.5 1.5 0 0 0 0 -3h-1.5v6" />
-          <path d="M11 18h1.5a1.5 1.5 0 0 0 0 -3h-1.5v6" />
-          <path d="M16.5 15h3" />
-          <path d="M18 15v6" />
-          <path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4" />
-        </svg>
-      );
-    default:
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="24"
-          height="24"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="var(--mantine-color-dimmed)"
-          strokeWidth="1.5"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          role="img"
-          aria-label="File"
-        >
-          <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-          <path d="M15 3v4a1 1 0 0 0 1 1h4" />
-          <path d="M18 17h-7a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h4l5 5v7a2 2 0 0 1 -2 2" />
-          <path d="M16 17v2a2 2 0 0 1 -2 2h-7a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h2" />
-        </svg>
-      );
-  }
-};

package/src/ai/ui/promptInput/Footer.tsx

@@ -1,5 +0,0 @@
-import { Group, type GroupProps } from '@mantine/core';
-
-export const Footer = (props: GroupProps) => (
-  <Group justify="space-between" p="xs" {...props} />
-);

package/src/ai/ui/promptInput/PromptInputContext.ts

@@ -1,24 +0,0 @@
-import { createContext, useContext } from 'react';
-
-export interface PromptInputContext {
-  text: string;
-  setText: (text: string) => void;
-  file?: File;
-  setFile: (file?: File) => void;
-  onSubmit: () => void;
-  submiting: boolean;
-  uploading: boolean;
-  accept?: string;
-}
-
-export const PromptInputContext = createContext<PromptInputContext | null>(
-  null,
-);
-
-export const usePromptInput = () => {
-  const context = useContext(PromptInputContext);
-  if (!context) {
-    throw new Error('usePromptInput must be used within a PromptInputProvider');
-  }
-  return context;
-};

package/src/ai/ui/promptInput/PromptInputProvider.tsx

@@ -1,54 +0,0 @@
-import { useState } from 'react';
-import { PromptInputContext } from './PromptInputContext';
-import type { PromptInputProps } from './types';
-
-export const Provider = ({
-  children,
-  onSubmit,
-  submiting,
-  uploading,
-  accept = ['text', 'image', 'pdf'],
-}: PromptInputProps) => {
-  const [text, setText] = useState('');
-  const [file, setFile] = useState<File | undefined>();
-
-  const value: PromptInputContext = {
-    text,
-    setText,
-    file,
-    setFile,
-    onSubmit: () => {
-      if (text.trim()) {
-        onSubmit({ text: text.trim(), file });
-        setText('');
-        setFile(undefined);
-      }
-    },
-    submiting,
-    uploading,
-    accept: accept
-      .map((type) => {
-        switch (type) {
-          case 'text':
-            return 'text/plain';
-          case 'image':
-            return 'image/*';
-          case 'pdf':
-            return 'application/pdf';
-          case 'excel':
-            return 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
-          case 'word':
-            return 'application/vnd.openxmlformats-officedocument.wordprocessingml.document';
-          default:
-            return type;
-        }
-      })
-      .join(','),
-  };
-
-  return (
-    <PromptInputContext.Provider value={value}>
-      {children}
-    </PromptInputContext.Provider>
-  );
-};

package/src/ai/ui/promptInput/Root.tsx

@@ -1,29 +0,0 @@
-import { Paper, type PaperProps } from '@mantine/core';
-import clsx from 'clsx';
-import { Provider } from './PromptInputProvider';
-import type { PromptInputProps } from './types';
-
-export const Root = ({
-  className,
-  onSubmit,
-  submiting,
-  uploading,
-  accept,
-  ...props
-}: PaperProps & PromptInputProps) => {
-  return (
-    <Provider
-      onSubmit={onSubmit}
-      submiting={submiting}
-      uploading={uploading}
-      accept={accept}
-    >
-      <Paper
-        radius="md"
-        withBorder
-        className={clsx('rolder-prompt-input-root', className)}
-        {...props}
-      />
-    </Provider>
-  );
-};

package/src/ai/ui/promptInput/Submit.tsx

@@ -1,39 +0,0 @@
-import { ActionIcon, type ActionIconProps } from '@mantine/core';
-import { usePromptInput } from './PromptInputContext';
-
-export const Submit = ({ children, ...props }: ActionIconProps) => {
-  const Icon = (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      stroke="currentColor"
-      strokeWidth="1.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-      role="img"
-      aria-label="Submit"
-    >
-      <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-      <path d="M9 20v-8h-3.586a1 1 0 0 1 -.707 -1.707l6.586 -6.586a1 1 0 0 1 1.414 0l6.586 6.586a1 1 0 0 1 -.707 1.707h-3.586v8a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1" />
-    </svg>
-  );
-
-  const { onSubmit, submiting, uploading } = usePromptInput();
-
-  return (
-    <ActionIcon
-      aria-label="Submit"
-      variant="light"
-      size="lg"
-      onClick={onSubmit}
-      disabled={uploading}
-      loading={submiting}
-      {...props}
-    >
-      {children ?? Icon}
-    </ActionIcon>
-  );
-};