@liveblocks/react-ui/dist/components/internal/AiComposer.cjs.map

A set of React pre-built components for the Liveblocks products. Liveblocks is the all-in-one toolkit to build collaborative products like Figma, Notion, and more.

{"version":3,"file":"AiComposer.cjs","sources":["../../../src/components/internal/AiComposer.tsx"],"sourcesContent":["import {\n  type AiChatMessage,\n  type CopilotId,\n  type MessageId,\n} from \"@liveblocks/core\";\nimport { useSendAiMessage } from \"@liveblocks/react\";\nimport {\n  type ComponentProps,\n  type FormEvent,\n  forwardRef,\n  type SyntheticEvent,\n  useCallback,\n} from \"react\";\n\nimport { SendIcon } from \"../../icons/Send\";\nimport { StopIcon } from \"../../icons/Stop\";\nimport {\n  type AiComposerOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as AiComposerPrimitive from \"../../primitives/AiComposer\";\nimport { useAiComposer } from \"../../primitives/AiComposer/contexts\";\nimport type {\n  AiComposerEditorProps,\n  AiComposerFormProps,\n  AiComposerSubmitMessage,\n} from \"../../primitives/AiComposer/types\";\nimport { cn } from \"../../utils/cn\";\nimport { Button } from \"./Button\";\nimport { ShortcutTooltip, TooltipProvider } from \"./Tooltip\";\n\n/* -------------------------------------------------------------------------------------------------\n * AiComposer\n * -----------------------------------------------------------------------------------------------*/\nexport interface AiComposerProps\n  extends Omit<ComponentProps<\"form\">, \"defaultValue\"> {\n  /**\n   * The composer's initial value.\n   */\n  defaultValue?: string;\n\n  /**\n   * The event handler called when the composer is submitted.\n   */\n  onComposerSubmit?: (\n    message: AiComposerSubmitMessage,\n    event: FormEvent<HTMLFormElement>\n  ) => void;\n\n  /**\n   * The event handler called after the composer is submitted.\n   *\n   * @internal This API will change, and is not considered stable. DO NOT RELY on it.\n   */\n  onComposerSubmitted?: (message: AiChatMessage) => void;\n\n  /**\n   * Whether the composer is disabled.\n   */\n  disabled?: AiComposerFormProps[\"disabled\"];\n\n  /**\n   * Whether to focus the composer on mount.\n   */\n  autoFocus?: AiComposerEditorProps[\"autoFocus\"];\n\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<GlobalOverrides & AiComposerOverrides>;\n\n  /**\n   * The ID of the chat the composer belongs to.\n   */\n  chatId: string;\n\n  /**\n   * The ID of the copilot to use to send the message.\n   */\n  copilotId?: CopilotId;\n\n  /**\n   * The time, in milliseconds, before an AI response will timeout.\n   */\n  responseTimeout?: number;\n\n  /**\n   * @internal\n   */\n  branchId?: MessageId;\n\n  /**\n   * @internal\n   */\n  stream?: boolean;\n}\n\nfunction AiComposerAction({\n  overrides,\n}: {\n  overrides?: AiComposerProps[\"overrides\"];\n}) {\n  const { canAbort } = useAiComposer();\n  const $ = useOverrides(overrides);\n\n  const preventDefault = useCallback((event: SyntheticEvent) => {\n    event.preventDefault();\n  }, []);\n\n  const stopPropagation = useCallback((event: SyntheticEvent) => {\n    event.stopPropagation();\n  }, []);\n\n  return canAbort ? (\n    <ShortcutTooltip content={$.AI_COMPOSER_ABORT}>\n      <AiComposerPrimitive.Abort asChild>\n        <Button\n          onPointerDown={preventDefault}\n          onClick={stopPropagation}\n          className=\"lb-ai-composer-action\"\n          variant=\"secondary\"\n          aria-label={$.AI_COMPOSER_ABORT}\n          icon={<StopIcon />}\n        />\n      </AiComposerPrimitive.Abort>\n    </ShortcutTooltip>\n  ) : (\n    <ShortcutTooltip content={$.AI_COMPOSER_SEND} shortcut=\"Enter\">\n      <AiComposerPrimitive.Submit asChild>\n        <Button\n          onPointerDown={preventDefault}\n          onClick={stopPropagation}\n          className=\"lb-ai-composer-action\"\n          variant=\"primary\"\n          aria-label={$.AI_COMPOSER_SEND}\n          icon={<SendIcon />}\n        />\n      </AiComposerPrimitive.Submit>\n    </ShortcutTooltip>\n  );\n}\n\nexport const AiComposer = forwardRef<HTMLFormElement, AiComposerProps>(\n  (\n    {\n      defaultValue,\n      onComposerSubmit,\n      disabled,\n      autoFocus,\n      overrides,\n      className,\n      chatId,\n      branchId,\n      copilotId,\n      responseTimeout,\n      stream = true,\n      onComposerSubmitted,\n      ...props\n    },\n    forwardedRef\n  ) => {\n    const $ = useOverrides(overrides);\n    const sendAiMessage = useSendAiMessage(chatId, {\n      stream,\n      copilotId,\n      timeout: responseTimeout,\n    });\n\n    const handleComposerSubmit = useCallback(\n      (message: AiComposerSubmitMessage, event: FormEvent<HTMLFormElement>) => {\n        onComposerSubmit?.(message, event);\n\n        if (event.isDefaultPrevented()) return;\n\n        const newMessage = sendAiMessage(message.text);\n\n        onComposerSubmitted?.(newMessage);\n      },\n      [onComposerSubmit, sendAiMessage, onComposerSubmitted]\n    );\n\n    return (\n      <TooltipProvider>\n        <AiComposerPrimitive.Form\n          className={cn(\n            \"lb-root lb-ai-composer lb-ai-composer-form\",\n            className\n          )}\n          dir={$.dir}\n          {...props}\n          disabled={disabled}\n          ref={forwardedRef}\n          onComposerSubmit={handleComposerSubmit}\n          chatId={chatId}\n          branchId={branchId}\n        >\n          <div className=\"lb-ai-composer-editor-container\">\n            <AiComposerPrimitive.Editor\n              autoFocus={autoFocus}\n              className=\"lb-ai-composer-editor\"\n              placeholder={$.AI_COMPOSER_PLACEHOLDER}\n              defaultValue={defaultValue}\n            />\n\n            <div className=\"lb-ai-composer-footer\">\n              <div className=\"lb-ai-composer-editor-actions\">\n                {/* No actions for now but it makes sense to keep the DOM structure */}\n              </div>\n\n              <div className=\"lb-ai-composer-actions\">\n                <AiComposerAction overrides={overrides} />\n              </div>\n            </div>\n          </div>\n        </AiComposerPrimitive.Form>\n      </TooltipProvider>\n    );\n  }\n);\n"],"names":["overrides","useAiComposer","useOverrides","useCallback","jsx","ShortcutTooltip","AiComposerPrimitive.Abort","Button","StopIcon","AiComposerPrimitive.Submit","SendIcon","forwardRef","useSendAiMessage","TooltipProvider","AiComposerPrimitive.Form","cn","jsxs","AiComposerPrimitive.Editor"],"mappings":"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"}