Docs: Chatbot example does not run as written

[theimpossibleleap]

Hello! First and foremost, this is an awesome toolkit and component UI for applied AI. I'm really excited to dive in and use it more!

I wanted to just point out a few issues with the Chatbot Example as written. I looked in the repo to try and find where to edit the documentation example specifically, and only found the ai-elements/packages/examples/src/chatbot.tsx example, which is different code than the docs. If you can point me in the right direction of the docs I can absolutely submit a PR to correct.

There is a missing comma on the import for Actions, as well as unused and missing imports that are needed. The Action import is missing but required for the example to work, and ActionsTrigger as well as ActionsContent are unused. The following block:

import {
  Actions
  ActionsTrigger,
  ActionsContent,
} from '@/components/ai-elements/actions';

Should be:

import {
  Actions,
  Action
} from '@/components/ai-elements/actions';

Fragment is also needed by the example, but not imported.

import { useState, Fragment } from "react";

There are a few missing Icons as well. GlobeIcon is the only one imported, but the example requires RefreshCcwIcon and CopyIcon as well.

import { GlobeIcon, RefreshCcwIcon, CopyIcon } from "lucide-react";

After making these adjustments the code ran as expected. One other small note.. On the <Action> component, labeled "Retry", there is an arrow function () => regenerate(), but regenerate() is not defined. I haven't used the Retry feature yet, but this function does not exist in the example code.

Hope this helps!

Thank you!