@chatsdk-dev/elements 0.0.1 → 0.1.2

package/dist/components/ai-elements/schema-display.js

@@ -1,313 +0,0 @@
-import { Badge } from '@chatsdk-dev/ui/components/badge';
-import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '@chatsdk-dev/ui/components/collapsible';
-import { cn } from '@chatsdk-dev/ui/lib/utils';
-import { ChevronRightIcon } from 'lucide-react';
-import { createContext, useContext, useMemo } from 'react';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-
-var SchemaDisplayContext = createContext({
-  method: "GET",
-  path: ""
-});
-var methodStyles = {
-  DELETE: "bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400",
-  GET: "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400",
-  PATCH: "bg-yellow-100 text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400",
-  POST: "bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400",
-  PUT: "bg-orange-100 text-orange-700 dark:bg-orange-900/30 dark:text-orange-400"
-};
-var SchemaDisplayHeader = ({
-  className,
-  children,
-  ...props
-}) => /* @__PURE__ */ jsx(
-  "div",
-  {
-    className: cn("flex items-center gap-3 border-b px-4 py-3", className),
-    ...props,
-    children
-  }
-);
-var SchemaDisplayMethod = ({
-  className,
-  children,
-  ...props
-}) => {
-  const { method } = useContext(SchemaDisplayContext);
-  return /* @__PURE__ */ jsx(
-    Badge,
-    {
-      className: cn("font-mono text-xs", methodStyles[method], className),
-      variant: "secondary",
-      ...props,
-      children: children ?? method
-    }
-  );
-};
-var SchemaDisplayPath = ({
-  className,
-  children,
-  ...props
-}) => {
-  const { path } = useContext(SchemaDisplayContext);
-  const highlightedPath = path.replaceAll(
-    /\{([^}]+)\}/g,
-    '<span class="text-blue-600 dark:text-blue-400">{$1}</span>'
-  );
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: cn("font-mono text-sm", className),
-      dangerouslySetInnerHTML: { __html: children ?? highlightedPath },
-      ...props
-    }
-  );
-};
-var SchemaDisplayDescription = ({
-  className,
-  children,
-  ...props
-}) => {
-  const { description } = useContext(SchemaDisplayContext);
-  return /* @__PURE__ */ jsx(
-    "p",
-    {
-      className: cn(
-        "border-b px-4 py-3 text-muted-foreground text-sm",
-        className
-      ),
-      ...props,
-      children: children ?? description
-    }
-  );
-};
-var SchemaDisplayContent = ({
-  className,
-  children,
-  ...props
-}) => /* @__PURE__ */ jsx("div", { className: cn("divide-y", className), ...props, children });
-var SchemaDisplayParameter = ({
-  name,
-  type,
-  required,
-  description,
-  location,
-  className,
-  ...props
-}) => /* @__PURE__ */ jsxs("div", { className: cn("px-4 py-3 pl-10", className), ...props, children: [
-  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-    /* @__PURE__ */ jsx("span", { className: "font-mono text-sm", children: name }),
-    /* @__PURE__ */ jsx(Badge, { className: "text-xs", variant: "outline", children: type }),
-    location && /* @__PURE__ */ jsx(Badge, { className: "text-xs", variant: "secondary", children: location }),
-    required && /* @__PURE__ */ jsx(
-      Badge,
-      {
-        className: "bg-red-100 text-red-700 text-xs dark:bg-red-900/30 dark:text-red-400",
-        variant: "secondary",
-        children: "required"
-      }
-    )
-  ] }),
-  description && /* @__PURE__ */ jsx("p", { className: "mt-1 text-muted-foreground text-sm", children: description })
-] });
-var SchemaDisplayParameters = ({
-  className,
-  children,
-  ...props
-}) => {
-  const { parameters } = useContext(SchemaDisplayContext);
-  return /* @__PURE__ */ jsxs(Collapsible, { className: cn(className), defaultOpen: true, ...props, children: [
-    /* @__PURE__ */ jsxs(CollapsibleTrigger, { className: "group flex w-full items-center gap-2 px-4 py-3 text-left transition-colors hover:bg-muted/50", children: [
-      /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }),
-      /* @__PURE__ */ jsx("span", { className: "font-medium text-sm", children: "Parameters" }),
-      /* @__PURE__ */ jsx(Badge, { className: "ml-auto text-xs", variant: "secondary", children: parameters?.length })
-    ] }),
-    /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx("div", { className: "divide-y border-t", children: children ?? parameters?.map((param) => /* @__PURE__ */ jsx(SchemaDisplayParameter, { ...param }, param.name)) }) })
-  ] });
-};
-var SchemaDisplayProperty = ({
-  name,
-  type,
-  required,
-  description,
-  properties,
-  items,
-  depth = 0,
-  className,
-  ...props
-}) => {
-  const hasChildren = properties || items;
-  const paddingLeft = 40 + depth * 16;
-  if (hasChildren) {
-    return /* @__PURE__ */ jsxs(Collapsible, { defaultOpen: depth < 2, children: [
-      /* @__PURE__ */ jsxs(
-        CollapsibleTrigger,
-        {
-          className: cn(
-            "group flex w-full items-center gap-2 py-3 text-left transition-colors hover:bg-muted/50",
-            className
-          ),
-          style: { paddingLeft },
-          children: [
-            /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }),
-            /* @__PURE__ */ jsx("span", { className: "font-mono text-sm", children: name }),
-            /* @__PURE__ */ jsx(Badge, { className: "text-xs", variant: "outline", children: type }),
-            required && /* @__PURE__ */ jsx(
-              Badge,
-              {
-                className: "bg-red-100 text-red-700 text-xs dark:bg-red-900/30 dark:text-red-400",
-                variant: "secondary",
-                children: "required"
-              }
-            )
-          ]
-        }
-      ),
-      description && /* @__PURE__ */ jsx(
-        "p",
-        {
-          className: "pb-2 text-muted-foreground text-sm",
-          style: { paddingLeft: paddingLeft + 24 },
-          children: description
-        }
-      ),
-      /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsxs("div", { className: "divide-y border-t", children: [
-        properties?.map((prop) => /* @__PURE__ */ jsx(
-          SchemaDisplayProperty,
-          {
-            ...prop,
-            depth: depth + 1
-          },
-          prop.name
-        )),
-        items && /* @__PURE__ */ jsx(
-          SchemaDisplayProperty,
-          {
-            ...items,
-            depth: depth + 1,
-            name: `${name}[]`
-          }
-        )
-      ] }) })
-    ] });
-  }
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cn("py-3 pr-4", className),
-      style: { paddingLeft },
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx("span", { className: "size-4" }),
-          /* @__PURE__ */ jsx("span", { className: "font-mono text-sm", children: name }),
-          /* @__PURE__ */ jsx(Badge, { className: "text-xs", variant: "outline", children: type }),
-          required && /* @__PURE__ */ jsx(
-            Badge,
-            {
-              className: "bg-red-100 text-red-700 text-xs dark:bg-red-900/30 dark:text-red-400",
-              variant: "secondary",
-              children: "required"
-            }
-          )
-        ] }),
-        description && /* @__PURE__ */ jsx("p", { className: "mt-1 pl-6 text-muted-foreground text-sm", children: description })
-      ]
-    }
-  );
-};
-var SchemaDisplayRequest = ({
-  className,
-  children,
-  ...props
-}) => {
-  const { requestBody } = useContext(SchemaDisplayContext);
-  return /* @__PURE__ */ jsxs(Collapsible, { className: cn(className), defaultOpen: true, ...props, children: [
-    /* @__PURE__ */ jsxs(CollapsibleTrigger, { className: "group flex w-full items-center gap-2 px-4 py-3 text-left transition-colors hover:bg-muted/50", children: [
-      /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }),
-      /* @__PURE__ */ jsx("span", { className: "font-medium text-sm", children: "Request Body" })
-    ] }),
-    /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx("div", { className: "border-t", children: children ?? requestBody?.map((prop) => /* @__PURE__ */ jsx(SchemaDisplayProperty, { ...prop, depth: 0 }, prop.name)) }) })
-  ] });
-};
-var SchemaDisplayResponse = ({
-  className,
-  children,
-  ...props
-}) => {
-  const { responseBody } = useContext(SchemaDisplayContext);
-  return /* @__PURE__ */ jsxs(Collapsible, { className: cn(className), defaultOpen: true, ...props, children: [
-    /* @__PURE__ */ jsxs(CollapsibleTrigger, { className: "group flex w-full items-center gap-2 px-4 py-3 text-left transition-colors hover:bg-muted/50", children: [
-      /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }),
-      /* @__PURE__ */ jsx("span", { className: "font-medium text-sm", children: "Response" })
-    ] }),
-    /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx("div", { className: "border-t", children: children ?? responseBody?.map((prop) => /* @__PURE__ */ jsx(SchemaDisplayProperty, { ...prop, depth: 0 }, prop.name)) }) })
-  ] });
-};
-var SchemaDisplay = ({
-  method,
-  path,
-  description,
-  parameters,
-  requestBody,
-  responseBody,
-  className,
-  children,
-  ...props
-}) => {
-  const contextValue = useMemo(
-    () => ({
-      description,
-      method,
-      parameters,
-      path,
-      requestBody,
-      responseBody
-    }),
-    [description, method, parameters, path, requestBody, responseBody]
-  );
-  return /* @__PURE__ */ jsx(SchemaDisplayContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: cn(
-        "overflow-hidden rounded-lg border bg-background",
-        className
-      ),
-      ...props,
-      children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(SchemaDisplayHeader, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-          /* @__PURE__ */ jsx(SchemaDisplayMethod, {}),
-          /* @__PURE__ */ jsx(SchemaDisplayPath, {})
-        ] }) }),
-        description && /* @__PURE__ */ jsx(SchemaDisplayDescription, {}),
-        /* @__PURE__ */ jsxs(SchemaDisplayContent, { children: [
-          parameters && parameters.length > 0 && /* @__PURE__ */ jsx(SchemaDisplayParameters, {}),
-          requestBody && requestBody.length > 0 && /* @__PURE__ */ jsx(SchemaDisplayRequest, {}),
-          responseBody && responseBody.length > 0 && /* @__PURE__ */ jsx(SchemaDisplayResponse, {})
-        ] })
-      ] })
-    }
-  ) });
-};
-var SchemaDisplayBody = ({
-  className,
-  children,
-  ...props
-}) => /* @__PURE__ */ jsx("div", { className: cn("divide-y", className), ...props, children });
-var SchemaDisplayExample = ({
-  className,
-  children,
-  ...props
-}) => /* @__PURE__ */ jsx(
-  "pre",
-  {
-    className: cn(
-      "mx-4 mb-4 overflow-auto rounded-md bg-muted p-4 font-mono text-sm",
-      className
-    ),
-    ...props,
-    children
-  }
-);
-
-export { SchemaDisplay, SchemaDisplayBody, SchemaDisplayContent, SchemaDisplayDescription, SchemaDisplayExample, SchemaDisplayHeader, SchemaDisplayMethod, SchemaDisplayParameter, SchemaDisplayParameters, SchemaDisplayPath, SchemaDisplayProperty, SchemaDisplayRequest, SchemaDisplayResponse };

package/dist/components/ai-elements/shimmer.d.ts

@@ -1,14 +0,0 @@
-import * as react from 'react';
-import { ElementType } from 'react';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-
-interface TextShimmerProps {
-    children: string;
-    as?: ElementType;
-    className?: string;
-    duration?: number;
-    spread?: number;
-}
-declare const Shimmer: react.MemoExoticComponent<({ children, as: Component, className, duration, spread, }: TextShimmerProps) => react_jsx_runtime.JSX.Element>;
-
-export { Shimmer, type TextShimmerProps };

package/dist/components/ai-elements/shimmer.js

@@ -1 +0,0 @@
-export { Shimmer } from '../../chunk-NIC3MOMY.js';

package/dist/components/ai-elements/snippet.d.ts

@@ -1,22 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText } from '@chatsdk-dev/ui/components/input-group';
-import { ComponentProps } from 'react';
-
-type SnippetProps = ComponentProps<typeof InputGroup> & {
-    code: string;
-};
-declare const Snippet: ({ code, className, children, ...props }: SnippetProps) => react_jsx_runtime.JSX.Element;
-type SnippetAddonProps = ComponentProps<typeof InputGroupAddon>;
-declare const SnippetAddon: (props: SnippetAddonProps) => react_jsx_runtime.JSX.Element;
-type SnippetTextProps = ComponentProps<typeof InputGroupText>;
-declare const SnippetText: ({ className, ...props }: SnippetTextProps) => react_jsx_runtime.JSX.Element;
-type SnippetInputProps = Omit<ComponentProps<typeof InputGroupInput>, "readOnly" | "value">;
-declare const SnippetInput: ({ className, ...props }: SnippetInputProps) => react_jsx_runtime.JSX.Element;
-type SnippetCopyButtonProps = ComponentProps<typeof InputGroupButton> & {
-    onCopy?: () => void;
-    onError?: (error: Error) => void;
-    timeout?: number;
-};
-declare const SnippetCopyButton: ({ onCopy, onError, timeout, children, className, ...props }: SnippetCopyButtonProps) => react_jsx_runtime.JSX.Element;
-
-export { Snippet, SnippetAddon, type SnippetAddonProps, SnippetCopyButton, type SnippetCopyButtonProps, SnippetInput, type SnippetInputProps, type SnippetProps, SnippetText, type SnippetTextProps };

package/dist/components/ai-elements/snippet.js

@@ -1,90 +0,0 @@
-import { InputGroup, InputGroupAddon, InputGroupText, InputGroupInput, InputGroupButton } from '@chatsdk-dev/ui/components/input-group';
-import { cn } from '@chatsdk-dev/ui/lib/utils';
-import { CheckIcon, CopyIcon } from 'lucide-react';
-import { createContext, useMemo, useContext, useState, useRef, useCallback, useEffect } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-var SnippetContext = createContext({
-  code: ""
-});
-var Snippet = ({
-  code,
-  className,
-  children,
-  ...props
-}) => {
-  const contextValue = useMemo(() => ({ code }), [code]);
-  return /* @__PURE__ */ jsx(SnippetContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(InputGroup, { className: cn("font-mono", className), ...props, children }) });
-};
-var SnippetAddon = (props) => /* @__PURE__ */ jsx(InputGroupAddon, { ...props });
-var SnippetText = ({ className, ...props }) => /* @__PURE__ */ jsx(
-  InputGroupText,
-  {
-    className: cn("pl-2 font-normal text-muted-foreground", className),
-    ...props
-  }
-);
-var SnippetInput = ({ className, ...props }) => {
-  const { code } = useContext(SnippetContext);
-  return /* @__PURE__ */ jsx(
-    InputGroupInput,
-    {
-      className: cn("text-foreground", className),
-      readOnly: true,
-      value: code,
-      ...props
-    }
-  );
-};
-var SnippetCopyButton = ({
-  onCopy,
-  onError,
-  timeout = 2e3,
-  children,
-  className,
-  ...props
-}) => {
-  const [isCopied, setIsCopied] = useState(false);
-  const timeoutRef = useRef(0);
-  const { code } = useContext(SnippetContext);
-  const copyToClipboard = useCallback(async () => {
-    if (typeof window === "undefined" || !navigator?.clipboard?.writeText) {
-      onError?.(new Error("Clipboard API not available"));
-      return;
-    }
-    try {
-      if (!isCopied) {
-        await navigator.clipboard.writeText(code);
-        setIsCopied(true);
-        onCopy?.();
-        timeoutRef.current = window.setTimeout(
-          () => setIsCopied(false),
-          timeout
-        );
-      }
-    } catch (error) {
-      onError?.(error);
-    }
-  }, [code, onCopy, onError, timeout, isCopied]);
-  useEffect(
-    () => () => {
-      window.clearTimeout(timeoutRef.current);
-    },
-    []
-  );
-  const Icon = isCopied ? CheckIcon : CopyIcon;
-  return /* @__PURE__ */ jsx(
-    InputGroupButton,
-    {
-      "aria-label": "Copy",
-      className,
-      onClick: copyToClipboard,
-      size: "icon-sm",
-      title: "Copy",
-      ...props,
-      children: children ?? /* @__PURE__ */ jsx(Icon, { className: "size-3.5", size: 14 })
-    }
-  );
-};
-
-export { Snippet, SnippetAddon, SnippetCopyButton, SnippetInput, SnippetText };

package/dist/components/ai-elements/sources.d.ts

@@ -1,16 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { CollapsibleContent, CollapsibleTrigger } from '@chatsdk-dev/ui/components/collapsible';
-import { ComponentProps } from 'react';
-
-type SourcesProps = ComponentProps<"div">;
-declare const Sources: ({ className, ...props }: SourcesProps) => react_jsx_runtime.JSX.Element;
-type SourcesTriggerProps = ComponentProps<typeof CollapsibleTrigger> & {
-    count: number;
-};
-declare const SourcesTrigger: ({ className, count, children, ...props }: SourcesTriggerProps) => react_jsx_runtime.JSX.Element;
-type SourcesContentProps = ComponentProps<typeof CollapsibleContent>;
-declare const SourcesContent: ({ className, ...props }: SourcesContentProps) => react_jsx_runtime.JSX.Element;
-type SourceProps = ComponentProps<"a">;
-declare const Source: ({ href, title, children, ...props }: SourceProps) => react_jsx_runtime.JSX.Element;
-
-export { Source, type SourceProps, Sources, SourcesContent, type SourcesContentProps, type SourcesProps, SourcesTrigger, type SourcesTriggerProps };

package/dist/components/ai-elements/sources.js

@@ -1,62 +0,0 @@
-import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '@chatsdk-dev/ui/components/collapsible';
-import { cn } from '@chatsdk-dev/ui/lib/utils';
-import { ChevronDownIcon, BookIcon } from 'lucide-react';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-
-var Sources = ({ className, ...props }) => /* @__PURE__ */ jsx(
-  Collapsible,
-  {
-    className: cn("not-prose mb-4 text-primary text-xs", className),
-    ...props
-  }
-);
-var SourcesTrigger = ({
-  className,
-  count,
-  children,
-  ...props
-}) => /* @__PURE__ */ jsx(
-  CollapsibleTrigger,
-  {
-    className: cn("flex items-center gap-2", className),
-    ...props,
-    children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs("p", { className: "font-medium", children: [
-        "Used ",
-        count,
-        " sources"
-      ] }),
-      /* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-4 w-4" })
-    ] })
-  }
-);
-var SourcesContent = ({
-  className,
-  ...props
-}) => /* @__PURE__ */ jsx(
-  CollapsibleContent,
-  {
-    className: cn(
-      "mt-3 flex w-fit flex-col gap-2",
-      "data-[state=closed]:fade-out-0 data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2 outline-none data-[state=closed]:animate-out data-[state=open]:animate-in",
-      className
-    ),
-    ...props
-  }
-);
-var Source = ({ href, title, children, ...props }) => /* @__PURE__ */ jsx(
-  "a",
-  {
-    className: "flex items-center gap-2",
-    href,
-    rel: "noreferrer",
-    target: "_blank",
-    ...props,
-    children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(BookIcon, { className: "h-4 w-4" }),
-      /* @__PURE__ */ jsx("span", { className: "block font-medium", children: title })
-    ] })
-  }
-);
-
-export { Source, Sources, SourcesContent, SourcesTrigger };

package/dist/components/ai-elements/speech-input.d.ts

@@ -1,57 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { Button } from '@chatsdk-dev/ui/components/button';
-import { ComponentProps } from 'react';
-
-interface SpeechRecognition extends EventTarget {
-    continuous: boolean;
-    interimResults: boolean;
-    lang: string;
-    start(): void;
-    stop(): void;
-    onstart: ((this: SpeechRecognition, ev: Event) => void) | null;
-    onend: ((this: SpeechRecognition, ev: Event) => void) | null;
-    onresult: ((this: SpeechRecognition, ev: SpeechRecognitionEvent) => void) | null;
-    onerror: ((this: SpeechRecognition, ev: SpeechRecognitionErrorEvent) => void) | null;
-}
-interface SpeechRecognitionEvent extends Event {
-    results: SpeechRecognitionResultList;
-    resultIndex: number;
-}
-interface SpeechRecognitionResultList {
-    readonly length: number;
-    item(index: number): SpeechRecognitionResult;
-    [index: number]: SpeechRecognitionResult;
-}
-interface SpeechRecognitionResult {
-    readonly length: number;
-    item(index: number): SpeechRecognitionAlternative;
-    [index: number]: SpeechRecognitionAlternative;
-    isFinal: boolean;
-}
-interface SpeechRecognitionAlternative {
-    transcript: string;
-    confidence: number;
-}
-interface SpeechRecognitionErrorEvent extends Event {
-    error: string;
-}
-declare global {
-    interface Window {
-        SpeechRecognition: new () => SpeechRecognition;
-        webkitSpeechRecognition: new () => SpeechRecognition;
-    }
-}
-type SpeechInputProps = ComponentProps<typeof Button> & {
-    onTranscriptionChange?: (text: string) => void;
-    /**
-     * Callback for when audio is recorded using MediaRecorder fallback.
-     * This is called in browsers that don't support the Web Speech API (Firefox, Safari).
-     * The callback receives an audio Blob that should be sent to a transcription service.
-     * Return the transcribed text, which will be passed to onTranscriptionChange.
-     */
-    onAudioRecorded?: (audioBlob: Blob) => Promise<string>;
-    lang?: string;
-};
-declare const SpeechInput: ({ className, onTranscriptionChange, onAudioRecorded, lang, ...props }: SpeechInputProps) => react_jsx_runtime.JSX.Element;
-
-export { SpeechInput, type SpeechInputProps };