Function PromptTokenField

packages/@react-spectrum/ai/src/PromptField.tsx:302–401

(props: PromptTokenFieldProps)

}

export function PromptTokenField(props: PromptTokenFieldProps) {
  let {completionTrigger, renderCompletions, children} = props;
  let {
    prompt,
    setPrompt,
    acceptedAttachmentTypes,
    setAttachments,
    onAddAttachments,
    inputRef,
    onSubmit
  } = useContext(PromptFieldContext);
  let [isFocused, setFocused] = useState(false);

  let [filterAnchor, filterValue] = useMemo(() => {
    if (completionTrigger) {
      let filterAnchor = prompt.findText(
        prompt.caretPosition,
        Direction.Backward,
        completionTrigger
      );
      if (filterAnchor != null) {
        let filterValue = prompt.slice(filterAnchor, prompt.caretPosition).toString();
        return [filterAnchor, filterValue];
      }
    }
    return [null, null];
  }, [completionTrigger, prompt]);

  let items = useMemo(() => {
    return filterValue != null ? renderCompletions?.(filterValue) : null;
  }, [filterValue, renderCompletions]);

  return (
    <Autocomplete>
      <TokenField
        value={prompt}
        onChange={setPrompt}
        multiline
        aria-label="Prompt"
        data-placeholder="Ready to get started? Ask a question, share an idea, or add a task."
        ref={inputRef}
        onFocus={e => {
          if (e.isTrusted) {
            setFocused(true);
          }
        }}
        onBlur={e => {
          if (e.isTrusted) {
            setFocused(false);
          }
        }}
        onPaste={
          acceptedAttachmentTypes
            ? e => {
                let clipboardData = e.clipboardData as DataTransfer;
                let attachments: PromptFieldAttachment[] = [];
                for (let item of clipboardData.items) {
                  if (matchMimeType(item.type, acceptedAttachmentTypes)) {