@mcp-b/react-components 0.1.1 → 0.1.2

package/dist/components/PromptInput.d.ts

@@ -0,0 +1,399 @@
+import { r as ButtonProps } from "../Button-QCM8ZKgR.js";
+import { A as SelectTriggerProps, M as SelectValueProps, S as SelectProps, f as SelectOption, j as SelectValue, r as SelectContentProps, s as SelectItemProps, t as Select } from "../Select-CRsKCJ9x.js";
+import { Combobox, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxPopup, ComboboxPositioner, ComboboxSeparator, ComboboxTrigger } from "./Combobox.js";
+import { MenuItemProps, MenuPopupProps, MenuProps } from "./Menu.js";
+import { Tab, TabPanel, TabsList } from "./Tabs.js";
+import * as React from "react";
+
+//#region src/components/PromptInput.d.ts
+interface PromptInputFilePart {
+  type: "file";
+  id?: string;
+  filename?: string;
+  mediaType?: string;
+  url?: string;
+}
+interface PromptInputReferencedSource {
+  id?: string;
+  title?: string;
+  url?: string;
+  [key: string]: unknown;
+}
+/** The payload produced when the prompt input is submitted. */
+interface PromptInputMessage {
+  text: string;
+  files: PromptInputFilePart[];
+}
+/** Lifecycle status of an in-flight model request. */
+type PromptInputStatus = "ready" | "submitted" | "streaming" | "error";
+interface AttachmentsContext {
+  files: Array<PromptInputFilePart & {
+    id: string;
+  }>;
+  add: (files: File[] | FileList) => void;
+  remove: (id: string) => void;
+  clear: () => void;
+  openFileDialog: () => void;
+  fileInputRef: React.RefObject<HTMLInputElement | null>;
+}
+interface TextInputContext {
+  value: string;
+  setInput: (value: string) => void;
+  clear: () => void;
+}
+interface PromptInputControllerProps {
+  textInput: TextInputContext;
+  attachments: AttachmentsContext;
+  __registerFileInput: (ref: React.RefObject<HTMLInputElement | null>, open: () => void) => void;
+}
+interface ReferencedSourcesContext {
+  sources: Array<PromptInputReferencedSource & {
+    id: string;
+  }>;
+  add: (sources: PromptInputReferencedSource[] | PromptInputReferencedSource) => void;
+  remove: (id: string) => void;
+  clear: () => void;
+}
+declare function usePromptInputController(): PromptInputControllerProps;
+declare function useProviderAttachments(): AttachmentsContext;
+declare function usePromptInputAttachments(): AttachmentsContext;
+declare function usePromptInputReferencedSources(): ReferencedSourcesContext;
+interface PromptInputProviderProps extends React.PropsWithChildren {
+  initialInput?: string;
+}
+declare function PromptInputProvider({
+  initialInput,
+  children
+}: PromptInputProviderProps): React.JSX.Element;
+interface PromptInputProps extends Omit<React.FormHTMLAttributes<HTMLFormElement>, "onSubmit" | "onError"> {
+  /** Accepted file MIME types/extensions, passed to the hidden file input. */
+  accept?: string;
+  /** Allows multiple files in a single file picker/drop action. */
+  multiple?: boolean;
+  /** Listen for file drops on the whole document instead of only the form. */
+  globalDrop?: boolean;
+  /** Clears the hidden file input when attachments are cleared. */
+  syncHiddenInput?: boolean;
+  /** Maximum number of attached files. */
+  maxFiles?: number;
+  /** Maximum accepted file size in bytes. */
+  maxFileSize?: number;
+  /** Called when file validation rejects an attachment. */
+  onError?: (error: {
+    code: "max_files" | "max_file_size" | "accept";
+    message: string;
+  }) => void;
+  /** Called with the trimmed message text and files when the form is submitted. */
+  onSubmit?: (message: PromptInputMessage, event: React.FormEvent<HTMLFormElement>) => void | Promise<void>;
+}
+/**
+ * Chat-style composer form. Wraps a textarea and footer controls, with
+ * Enter-to-submit semantics, auto-resizing behavior, and optional attachments.
+ * Adapted from Vercel AI Elements and restyled with Sigvelo CSS tokens.
+ *
+ * Use for assistant/chat submit forms. Do not use it as a generic textarea or
+ * non-chat form. Sigvelo changes: uses shared Menu, Select, Combobox, Tabs,
+ * Button, and Tooltip components; maps styles to CSS tokens; adds local
+ * attachment and referenced-source helpers.
+ *
+ * The form handles Enter-to-submit while multiline editing remains in the
+ * textarea. Attachment controls need accessible labels through their buttons
+ * and menus. Add new shared tools here when multiple apps need them.
+ *
+ * @example
+ * ```tsx
+ * <PromptInput onSubmit={({ text, files }) => sendMessage(text, files)}>
+ *   <PromptInputBody>
+ *     <PromptInputTextarea placeholder="Ask Sigvelo..." />
+ *   </PromptInputBody>
+ *   <PromptInputFooter>
+ *     <PromptInputTools>
+ *       <PromptInputActionAddAttachments />
+ *     </PromptInputTools>
+ *     <PromptInputSubmit status="ready" />
+ *   </PromptInputFooter>
+ * </PromptInput>
+ * ```
+ *
+ * @see {@link https://elements.ai-sdk.dev/components/prompt-input | AI Elements Prompt Input}
+ */
+declare function PromptInput({
+  className,
+  accept,
+  multiple,
+  globalDrop,
+  syncHiddenInput,
+  maxFiles,
+  maxFileSize,
+  onError,
+  onSubmit,
+  children,
+  id,
+  ref,
+  ...props
+}: PromptInputProps & {
+  ref?: React.Ref<HTMLFormElement>;
+}): React.JSX.Element;
+interface PromptInputHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare function PromptInputHeader({
+  className,
+  children,
+  ref,
+  ...props
+}: PromptInputHeaderProps & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
+interface PromptInputBodyProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare function PromptInputBody({
+  className,
+  children,
+  ref,
+  ...props
+}: PromptInputBodyProps & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
+interface PromptInputFooterProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare function PromptInputFooter({
+  className,
+  children,
+  ref,
+  ...props
+}: PromptInputFooterProps & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
+interface PromptInputToolsProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare function PromptInputTools({
+  className,
+  children,
+  ref,
+  ...props
+}: PromptInputToolsProps & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
+interface PromptInputTextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
+  minHeight?: number;
+  maxHeight?: number;
+}
+declare function PromptInputTextarea({
+  className,
+  placeholder,
+  rows,
+  minHeight,
+  maxHeight,
+  onChange,
+  onCompositionEnd,
+  onCompositionStart,
+  onKeyDown,
+  onInput,
+  onPaste,
+  ref,
+  ...props
+}: PromptInputTextareaProps & {
+  ref?: React.Ref<HTMLTextAreaElement>;
+}): React.JSX.Element;
+type TooltipSide = "top" | "right" | "bottom" | "left";
+type PromptInputButtonTooltip = string | {
+  content: React.ReactNode;
+  shortcut?: string;
+  side?: TooltipSide;
+};
+type PromptInputTooltipConfig = Exclude<PromptInputButtonTooltip, string>;
+interface PromptInputButtonProps extends Omit<ButtonProps, "children" | "className"> {
+  className?: string;
+  tooltip?: PromptInputButtonTooltip;
+  children?: React.ReactNode;
+}
+declare function PromptInputButton({
+  className,
+  tooltip,
+  variant,
+  color,
+  size,
+  children,
+  "aria-label": ariaLabel,
+  ref,
+  ...props
+}: PromptInputButtonProps & {
+  ref?: React.Ref<HTMLButtonElement>;
+}): React.JSX.Element;
+type PromptInputActionMenuProps = MenuProps;
+declare function PromptInputActionMenu(props: PromptInputActionMenuProps): React.JSX.Element;
+type PromptInputActionMenuTriggerProps = PromptInputButtonProps;
+declare function PromptInputActionMenuTrigger({
+  className,
+  children,
+  ...props
+}: PromptInputActionMenuTriggerProps): React.JSX.Element;
+type PromptInputActionMenuContentProps = MenuPopupProps;
+declare function PromptInputActionMenuContent({
+  className,
+  children,
+  ...props
+}: PromptInputActionMenuContentProps): React.JSX.Element;
+type PromptInputActionMenuItemProps = MenuItemProps;
+declare function PromptInputActionMenuItem({
+  className,
+  ...props
+}: PromptInputActionMenuItemProps): React.JSX.Element;
+interface PromptInputActionAddAttachmentsProps extends PromptInputActionMenuItemProps {
+  label?: string;
+}
+declare function PromptInputActionAddAttachments({
+  label,
+  onClick,
+  children,
+  ...props
+}: PromptInputActionAddAttachmentsProps): React.JSX.Element;
+interface PromptInputActionAddScreenshotProps extends PromptInputActionMenuItemProps {
+  label?: string;
+}
+declare function PromptInputActionAddScreenshot({
+  label,
+  onClick,
+  children,
+  ...props
+}: PromptInputActionAddScreenshotProps): React.JSX.Element;
+interface PromptInputSubmitProps extends Omit<ButtonProps, "children" | "className" | "type"> {
+  className?: string;
+  status?: PromptInputStatus;
+  onStop?: () => void;
+  children?: React.ReactNode;
+  label?: string;
+}
+declare function PromptInputSubmit({
+  className,
+  status,
+  onStop,
+  variant,
+  color,
+  size,
+  onClick,
+  children,
+  label,
+  ref,
+  ...props
+}: PromptInputSubmitProps & {
+  ref?: React.Ref<HTMLButtonElement>;
+}): React.JSX.Element;
+type PromptInputSelectProps = SelectProps;
+declare const PromptInputSelect: typeof Select;
+type PromptInputSelectTriggerProps = SelectTriggerProps;
+declare function PromptInputSelectTrigger(props: PromptInputSelectTriggerProps): React.JSX.Element;
+type PromptInputSelectContentProps = SelectContentProps;
+declare function PromptInputSelectContent(props: PromptInputSelectContentProps): React.JSX.Element;
+type PromptInputSelectItemProps = SelectItemProps;
+declare const PromptInputSelectItem: typeof SelectOption;
+type PromptInputSelectValueProps = SelectValueProps;
+declare const PromptInputSelectValue: typeof SelectValue;
+interface PromptInputHoverCardProps extends React.HTMLAttributes<HTMLDivElement> {
+  openDelay?: number;
+  closeDelay?: number;
+}
+declare function PromptInputHoverCard({
+  openDelay,
+  closeDelay,
+  className,
+  children,
+  ref,
+  ...props
+}: PromptInputHoverCardProps & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
+interface PromptInputHoverCardTriggerProps extends React.HTMLAttributes<HTMLSpanElement> {}
+declare function PromptInputHoverCardTrigger({
+  className,
+  ref,
+  ...props
+}: PromptInputHoverCardTriggerProps & {
+  ref?: React.Ref<HTMLSpanElement>;
+}): React.JSX.Element;
+interface PromptInputHoverCardContentProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare function PromptInputHoverCardContent({
+  className,
+  ref,
+  ...props
+}: PromptInputHoverCardContentProps & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element | null;
+type PromptInputTabsListProps = React.ComponentPropsWithoutRef<typeof TabsList>;
+declare const PromptInputTabsList: typeof TabsList;
+type PromptInputTabProps = React.ComponentPropsWithoutRef<typeof Tab>;
+declare const PromptInputTab: typeof Tab;
+type PromptInputTabBodyProps = React.ComponentPropsWithoutRef<typeof TabPanel>;
+declare const PromptInputTabBody: typeof TabPanel;
+interface PromptInputTabLabelProps extends React.HTMLAttributes<HTMLHeadingElement> {}
+declare function PromptInputTabLabel({
+  className,
+  ref,
+  ...props
+}: PromptInputTabLabelProps & {
+  ref?: React.Ref<HTMLHeadingElement>;
+}): React.JSX.Element;
+interface PromptInputTabItemProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare function PromptInputTabItem({
+  className,
+  ref,
+  ...props
+}: PromptInputTabItemProps & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
+type PromptInputCommandProps = React.ComponentPropsWithoutRef<typeof Combobox>;
+declare const PromptInputCommand: typeof import("@base-ui/react").ComboboxRoot & {
+  Root: typeof import("@base-ui/react").ComboboxRoot;
+  Input: typeof ComboboxInput;
+  Trigger: typeof ComboboxTrigger;
+  Clear: ({
+    className,
+    ref,
+    ...props
+  }: Omit<React.ComponentPropsWithRef<typeof import("@base-ui/react").ComboboxClear>, "className"> & {
+    className?: string;
+  } & {
+    ref?: React.Ref<HTMLButtonElement>;
+  }) => React.JSX.Element;
+  Portal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").AutocompletePortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+  Positioner: typeof ComboboxPositioner;
+  Popup: typeof ComboboxPopup;
+  Content: typeof ComboboxPopup;
+  List: typeof ComboboxList;
+  Item: typeof ComboboxItem;
+  ItemIndicator: ({
+    className,
+    ref,
+    ...props
+  }: Omit<React.ComponentPropsWithRef<typeof import("@base-ui/react").ComboboxItemIndicator>, "className"> & {
+    className?: string;
+  } & {
+    ref?: React.Ref<HTMLSpanElement>;
+  }) => React.JSX.Element;
+  Empty: typeof ComboboxEmpty;
+  Group: typeof ComboboxGroup;
+  GroupLabel: typeof ComboboxLabel;
+  Label: typeof ComboboxLabel;
+  Value: typeof import("@base-ui/react").ComboboxValue;
+  Chips: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ComboboxChipsProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+  Chip: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ComboboxChipProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+  ChipsInput: typeof ComboboxInput;
+  Collection: typeof import("@base-ui/react").ComboboxCollection;
+  Separator: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").SeparatorProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+type PromptInputCommandInputProps = React.ComponentPropsWithoutRef<typeof ComboboxInput>;
+declare const PromptInputCommandInput: typeof ComboboxInput;
+interface PromptInputCommandListProps extends React.HTMLAttributes<HTMLDivElement> {}
+declare function PromptInputCommandList({
+  className,
+  ref,
+  ...props
+}: PromptInputCommandListProps & {
+  ref?: React.Ref<HTMLDivElement>;
+}): React.JSX.Element;
+type PromptInputCommandEmptyProps = React.ComponentPropsWithoutRef<typeof ComboboxEmpty>;
+declare const PromptInputCommandEmpty: typeof ComboboxEmpty;
+type PromptInputCommandGroupProps = React.ComponentPropsWithoutRef<typeof ComboboxGroup>;
+declare const PromptInputCommandGroup: typeof ComboboxGroup;
+type PromptInputCommandItemProps = React.ComponentPropsWithoutRef<typeof ComboboxItem>;
+declare const PromptInputCommandItem: typeof ComboboxItem;
+type PromptInputCommandSeparatorProps = React.ComponentPropsWithoutRef<typeof ComboboxSeparator>;
+declare const PromptInputCommandSeparator: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").SeparatorProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { AttachmentsContext, PromptInput, PromptInputActionAddAttachments, PromptInputActionAddAttachmentsProps, PromptInputActionAddScreenshot, PromptInputActionAddScreenshotProps, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuContentProps, PromptInputActionMenuItem, PromptInputActionMenuItemProps, PromptInputActionMenuProps, PromptInputActionMenuTrigger, PromptInputActionMenuTriggerProps, PromptInputBody, PromptInputBodyProps, PromptInputButton, PromptInputButtonProps, PromptInputButtonTooltip, PromptInputCommand, PromptInputCommandEmpty, PromptInputCommandEmptyProps, PromptInputCommandGroup, PromptInputCommandGroupProps, PromptInputCommandInput, PromptInputCommandInputProps, PromptInputCommandItem, PromptInputCommandItemProps, PromptInputCommandList, PromptInputCommandListProps, PromptInputCommandProps, PromptInputCommandSeparator, PromptInputCommandSeparatorProps, PromptInputControllerProps, PromptInputFilePart, PromptInputFooter, PromptInputFooterProps, PromptInputHeader, PromptInputHeaderProps, PromptInputHoverCard, PromptInputHoverCardContent, PromptInputHoverCardContentProps, PromptInputHoverCardProps, PromptInputHoverCardTrigger, PromptInputHoverCardTriggerProps, PromptInputMessage, PromptInputProps, PromptInputProvider, PromptInputProviderProps, PromptInputReferencedSource, PromptInputSelect, PromptInputSelectContent, PromptInputSelectContentProps, PromptInputSelectItem, PromptInputSelectItemProps, PromptInputSelectProps, PromptInputSelectTrigger, PromptInputSelectTriggerProps, PromptInputSelectValue, PromptInputSelectValueProps, PromptInputStatus, PromptInputSubmit, PromptInputSubmitProps, PromptInputTab, PromptInputTabBody, PromptInputTabBodyProps, PromptInputTabItem, PromptInputTabItemProps, PromptInputTabLabel, PromptInputTabLabelProps, PromptInputTabProps, PromptInputTabsList, PromptInputTabsListProps, PromptInputTextarea, PromptInputTextareaProps, PromptInputTools, PromptInputToolsProps, PromptInputTooltipConfig, ReferencedSourcesContext, TextInputContext, TooltipSide, usePromptInputAttachments, usePromptInputController, usePromptInputReferencedSources, useProviderAttachments };