From b22cdd1b5676667be612523a06197a62ad67d2d0 Mon Sep 17 00:00:00 2001
From: TheSisb <shadiisber@gmail.com>
Date: Wed, 24 Apr 2024 15:51:07 -0500
Subject: [PATCH 01/55] chore: checkpoint ai log and ai msg

---
 .../ai-log/__tests__/index.spec.tsx           | 11 ++++
 .../paste-core/components/ai-log/build.js     |  3 +
 .../paste-core/components/ai-log/package.json | 59 +++++++++++++++++
 .../components/ai-log/src/AIChatLog.tsx       | 37 +++++++++++
 .../components/ai-log/src/AIChatLogger.tsx    | 58 ++++++++++++++++
 .../components/ai-log/src/AIChatMessage.tsx   | 36 ++++++++++
 .../ai-log/src/AIChatMessageContent.tsx       | 40 +++++++++++
 .../ai-log/src/AIChatMessageMeta.tsx          | 43 ++++++++++++
 .../ai-log/src/AIChatMessageMetaItem.tsx      | 47 +++++++++++++
 .../components/ai-log/src/index.tsx           | 15 +++++
 .../components/ai-log/src/useAIChatLogger.tsx | 39 +++++++++++
 .../ai-log/stories/index.stories.tsx          | 66 +++++++++++++++++++
 .../components/ai-log/tsconfig.json           | 12 ++++
 yarn.lock                                     | 55 +++++++++++++++-
 14 files changed, 520 insertions(+), 1 deletion(-)
 create mode 100644 packages/paste-core/components/ai-log/__tests__/index.spec.tsx
 create mode 100644 packages/paste-core/components/ai-log/build.js
 create mode 100644 packages/paste-core/components/ai-log/package.json
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatLog.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatLogger.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatMessage.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/index.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/useAIChatLogger.tsx
 create mode 100644 packages/paste-core/components/ai-log/stories/index.stories.tsx
 create mode 100644 packages/paste-core/components/ai-log/tsconfig.json

diff --git a/packages/paste-core/components/ai-log/__tests__/index.spec.tsx b/packages/paste-core/components/ai-log/__tests__/index.spec.tsx
new file mode 100644
index 0000000000..3383edf6bd
--- /dev/null
+++ b/packages/paste-core/components/ai-log/__tests__/index.spec.tsx
@@ -0,0 +1,11 @@
+import * as React from 'react';
+import {render} from '@testing-library/react';
+
+import {AiLog} from '../src';
+
+describe('AiLog', () => {
+  it('should render', () => {
+    const {getByText} = render(<AiLog>test</AiLog>);
+    expect(getByText('test')).toBeDefined();
+  });
+});
diff --git a/packages/paste-core/components/ai-log/build.js b/packages/paste-core/components/ai-log/build.js
new file mode 100644
index 0000000000..a4edeab49b
--- /dev/null
+++ b/packages/paste-core/components/ai-log/build.js
@@ -0,0 +1,3 @@
+const {build} = require('../../../../tools/build/esbuild');
+
+build(require('./package.json'));
diff --git a/packages/paste-core/components/ai-log/package.json b/packages/paste-core/components/ai-log/package.json
new file mode 100644
index 0000000000..8b487c5aef
--- /dev/null
+++ b/packages/paste-core/components/ai-log/package.json
@@ -0,0 +1,59 @@
+{
+  "name": "@twilio-paste/ai-log",
+  "version": "0.0.0",
+  "category": "data display",
+  "status": "production",
+  "description": "Ai chat log.",
+  "author": "Twilio Inc.",
+  "license": "MIT",
+  "main:dev": "src/index.tsx",
+  "main": "dist/index.js",
+  "module": "dist/index.es.js",
+  "types": "dist/index.d.ts",
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "yarn clean && NODE_ENV=production node build.js && tsc",
+    "build:js": "NODE_ENV=development node build.js",
+    "build:typedocs": "tsx ../../../../tools/build/generate-type-docs",
+    "clean": "rm -rf ./dist",
+    "tsc": "tsc"
+  },
+  "peerDependencies": {
+    "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/box": "^10.2.0",
+    "@twilio-paste/color-contrast-utils": "^5.0.0",
+    "@twilio-paste/customization": "^8.1.1",
+    "@twilio-paste/design-tokens": "^10.3.0",
+    "@twilio-paste/style-props": "^9.1.1",
+    "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/theme": "^11.0.1",
+    "@twilio-paste/types": "^6.0.0",
+    "@types/react": "^16.8.6 || ^17.0.2 || ^18.0.27",
+    "@types/react-dom": "^16.8.6 || ^17.0.2 || ^18.0.10",
+    "react": "^16.8.6 || ^17.0.2 || ^18.0.0",
+    "react-dom": "^16.8.6 || ^17.0.2 || ^18.0.0"
+  },
+  "devDependencies": {
+    "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/box": "^10.2.0",
+    "@twilio-paste/color-contrast-utils": "^5.0.0",
+    "@twilio-paste/customization": "^8.1.1",
+    "@twilio-paste/design-tokens": "^10.3.0",
+    "@twilio-paste/style-props": "^9.1.1",
+    "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/theme": "^11.0.1",
+    "@twilio-paste/types": "^6.0.0",
+    "@types/react": "^18.0.27",
+    "@types/react-dom": "^18.0.10",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "tsx": "^3.12.10",
+    "typescript": "^4.9.4"
+  }
+}
diff --git a/packages/paste-core/components/ai-log/src/AIChatLog.tsx b/packages/paste-core/components/ai-log/src/AIChatLog.tsx
new file mode 100644
index 0000000000..23a31253a9
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatLog.tsx
@@ -0,0 +1,37 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatLogProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   * @default '{constantCase component-name}'
+   * @type {BoxProps['element']}
+   * @memberof AIChatLogProps
+   */
+  element?: BoxProps["element"];
+}
+
+export const AIChatLog = React.forwardRef<HTMLDivElement, AIChatLogProps>(
+  ({ element = "AI_LOG", children, ...props }, ref) => {
+    return (
+      <Box role="log" padding="space70" element={element} ref={ref} {...safelySpreadBoxProps(props)}>
+        <Box
+          as="div"
+          role="list"
+          margin="space0"
+          padding="space0"
+          display="flex"
+          flexDirection="column"
+          rowGap="space130"
+        >
+          {children}
+        </Box>
+      </Box>
+    );
+  },
+);
+
+AIChatLog.displayName = "AIChatLog";
diff --git a/packages/paste-core/components/ai-log/src/AIChatLogger.tsx b/packages/paste-core/components/ai-log/src/AIChatLogger.tsx
new file mode 100644
index 0000000000..8424516062
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatLogger.tsx
@@ -0,0 +1,58 @@
+import { animated, useReducedMotion, useTransition } from "@twilio-paste/animation-library";
+import { Box } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+import { AIChatLog } from "./AIChatLog";
+import type { AIChat } from "./useAIChatLogger";
+
+const AnimatedAI = animated(Box);
+type StyleProps = React.ComponentProps<typeof AnimatedAI>["style"];
+
+export interface AIChatLoggerProps extends HTMLPasteProps<"div"> {
+  /**
+   * Array of AIs in the log. Use with useAIChatLogger()
+   *
+   * @default 'AI_ATTACHMENT'
+   * @type {BoxProps['element']}
+   * @memberof AIAttachmentProps
+   */
+  AIs: AIChat[];
+  children?: never;
+}
+
+const buildTransitionX = (AIChat: AIChat): number => {
+  if (AIChat.variant === "ai") return -100;
+  if (AIChat.variant === "user") return 100;
+  return 0;
+};
+
+export const AIChatLogger = React.forwardRef<HTMLDivElement, AIChatLoggerProps>(({ AIs, ...props }, ref) => {
+  const transitions = useTransition(AIs, {
+    keys: (AIChat: AIChat) => AIChat.id,
+    from: (AIChat: AIChat): StyleProps => ({ opacity: 0, x: buildTransitionX(AIChat) }),
+    enter: { opacity: 1, x: 0 },
+    leave: (AIChat: AIChat): StyleProps => ({ opacity: 0, x: buildTransitionX(AIChat) }),
+    config: {
+      mass: 0.7,
+      tension: 190,
+      friction: 16,
+    },
+  });
+
+  const animatedAIs = useReducedMotion()
+    ? AIs.map((AIChat) => React.cloneElement(AIChat.content, { key: AIChat.id }))
+    : transitions((styles: StyleProps, AIChat: AIChat, { key }: { key: string }) => (
+        <AnimatedAI as="div" style={styles} key={key}>
+          {AIChat.content}
+        </AnimatedAI>
+      ));
+
+  return (
+    <AIChatLog {...props} ref={ref}>
+      {animatedAIs}
+    </AIChatLog>
+  );
+});
+
+AIChatLogger.displayName = "AIChatLogger";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-log/src/AIChatMessage.tsx
new file mode 100644
index 0000000000..9f4b56e970
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatMessage.tsx
@@ -0,0 +1,36 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps, BoxStyleProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE"
+   * @type {BoxProps["element"]}
+   * @memberof ChatMessageProps
+   */
+  element?: BoxElementProps["element"];
+}
+
+export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
+  ({ children, element = "CHAT_MESSAGE", ...props }, ref) => {
+    return (
+      <Box
+        role="listitem"
+        display="flex"
+        flexDirection="column"
+        rowGap="space40"
+        ref={ref}
+        element={element}
+        {...safelySpreadBoxProps(props)}
+      >
+        {children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessage.displayName = "AIChatMessage";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx b/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
new file mode 100644
index 0000000000..0958389f62
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
@@ -0,0 +1,40 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps, BoxStyleProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageContentProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatBubbleProps
+   */
+  element?: BoxElementProps["element"];
+}
+
+export const AIChatMessageContent = React.forwardRef<HTMLDivElement, AIChatMessageContentProps>(
+  ({ children, element = "CHAT_MESSAGE_CONTENT", ...props }, ref) => {
+    return (
+      <Box
+        display="inline-block"
+        color="colorText"
+        fontSize="fontSize30"
+        lineHeight="lineHeight20"
+        wordWrap="break-word"
+        maxWidth="100%"
+        minWidth={0}
+        element={element}
+        ref={ref}
+        whiteSpace="pre-wrap"
+        {...safelySpreadBoxProps(props)}
+      >
+        {children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageContent.displayName = "AIChatMessageContent";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx b/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
new file mode 100644
index 0000000000..dd19c55fcc
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
@@ -0,0 +1,43 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageMetaProps extends HTMLPasteProps<"div"> {
+  /**
+   *
+   * @default null
+   * @type {string}
+   * @memberof AIChatMessageMetaProps
+   */
+  "aria-label": string;
+  children: NonNullable<React.ReactNode>;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE_META"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageMetaProps
+   */
+  element?: BoxElementProps["element"];
+}
+
+export const AIChatMessageMeta = React.forwardRef<HTMLDivElement, AIChatMessageMetaProps>(
+  ({ children, element = "CHAT_MESSAGE_META", ...props }, ref) => {
+    return (
+      <Box
+        {...safelySpreadBoxProps(props)}
+        ref={ref}
+        element={element}
+        display="flex"
+        alignItems="center"
+        columnGap="space30"
+        fontWeight="fontWeightMedium"
+      >
+        {children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageMeta.displayName = "AIChatMessageMeta";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx b/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
new file mode 100644
index 0000000000..72b7e033d2
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
@@ -0,0 +1,47 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageMetaItemProps extends HTMLPasteProps<"div"> {
+  children: NonNullable<React.ReactNode>;
+  variant: "author" | "timestamp";
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE_META_ITEM"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageMetaItemProps
+   */
+  element?: BoxElementProps["element"];
+}
+
+const variantStyles = {
+  author: {
+    color: "colorText",
+    lineHeight: "lineHeight50",
+    fontSize: "fontSize40",
+  },
+  timestamp: {},
+};
+
+export const AIChatMessageMetaItem = React.forwardRef<HTMLDivElement, AIChatMessageMetaItemProps>(
+  ({ children, element = "CHAT_MESSAGE_META_ITEM", ...props }, ref) => (
+    <Box
+      ref={ref}
+      element={element}
+      display="flex"
+      alignItems="flex-start"
+      columnGap="space30"
+      color="colorText"
+      lineHeight="lineHeight50"
+      fontSize="fontSize40"
+      {...variantStyles[props.variant]}
+      {...safelySpreadBoxProps(props)}
+    >
+      {children}
+    </Box>
+  ),
+);
+
+AIChatMessageMetaItem.displayName = "AIChatMessageMetaItem";
diff --git a/packages/paste-core/components/ai-log/src/index.tsx b/packages/paste-core/components/ai-log/src/index.tsx
new file mode 100644
index 0000000000..65e31ebf04
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/index.tsx
@@ -0,0 +1,15 @@
+export { AIChatMessage } from "./AIChatMessage";
+export type { AIChatMessageProps } from "./AIChatMessage";
+export { AIChatMessageMeta } from "./AIChatMessageMeta";
+export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
+export { AIChatMessageMetaItem } from "./AIChatMessageMetaItem";
+export type { AIChatMessageMetaItemProps } from "./AIChatMessageMetaItem";
+export { AIChatMessageContent } from "./AIChatMessageContent";
+export type { AIChatMessageContentProps } from "./AIChatMessageContent";
+
+export { AIChatLog } from "./AIChatLog";
+export type { AIChatLogProps } from "./AIChatLog";
+export { useAIChatLogger } from "./useAIChatLogger";
+export type { UseAIChatLogger } from "./useAIChatLogger";
+export { AIChatLogger } from "./AIChatLogger";
+export type { AIChatLoggerProps } from "./AIChatLogger";
diff --git a/packages/paste-core/components/ai-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-log/src/useAIChatLogger.tsx
new file mode 100644
index 0000000000..6d785d5f6b
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/useAIChatLogger.tsx
@@ -0,0 +1,39 @@
+import { uid } from "@twilio-paste/uid-library";
+import * as React from "react";
+
+export type AIChat = {
+  id: string;
+  content: React.ReactElement;
+};
+
+export type PartialIDChat = Omit<AIChat, "id"> & Partial<Pick<AIChat, "id">>;
+
+type PushAIChat = (chat: PartialIDChat) => void;
+type PopAIChat = (id?: string) => void;
+
+export type UseAIChatLogger = (...initialChats: PartialIDChat[]) => {
+  aiChats: AIChat[];
+  push: PushAIChat;
+  pop: PopAIChat;
+  clear: () => void;
+};
+
+const aiChatWithId = (chat: PartialIDChat): AIChat => ({ ...chat, id: chat.id || uid(chat.content) });
+
+export const useAIChatLogger: UseAIChatLogger = (...initialChats) => {
+  const parsedInitialChats = React.useMemo(() => initialChats.map(aiChatWithId), [initialChats]);
+
+  const [aiChats, setAIChats] = React.useState<AIChat[]>(parsedInitialChats);
+
+  const push: PushAIChat = React.useCallback((next) => {
+    setAIChats((prev) => prev.concat(aiChatWithId(next)));
+  }, []);
+
+  const pop: PopAIChat = React.useCallback((id) => {
+    setAIChats((prev) => (id ? prev.filter((chat) => chat.id !== id) : prev.slice(0, -1)));
+  }, []);
+
+  const clear: () => void = React.useCallback(() => setAIChats([]), []);
+
+  return { push, pop, aiChats, clear };
+};
diff --git a/packages/paste-core/components/ai-log/stories/index.stories.tsx b/packages/paste-core/components/ai-log/stories/index.stories.tsx
new file mode 100644
index 0000000000..2f9fc10400
--- /dev/null
+++ b/packages/paste-core/components/ai-log/stories/index.stories.tsx
@@ -0,0 +1,66 @@
+import * as React from "react";
+
+import { Avatar } from "@twilio-paste/avatar";
+import { Box } from "@twilio-paste/box";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { useUID } from "@twilio-paste/uid-library";
+import { AIChatLog, AIChatMessage, AIChatMessageContent, AIChatMessageMeta, AIChatMessageMetaItem } from "../src";
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Log",
+  component: AIChatLog,
+};
+
+export const Default = (): React.ReactNode => {
+  const [showButton, setShowButton] = React.useState(true);
+  const chatBoxUniqueID = useUID();
+  return (
+    <Box maxHeight="size40" overflowY="scroll" id={chatBoxUniqueID}>
+      <AIChatLog>
+        <AIChatMessage>
+          <AIChatMessageMeta aria-label="You said">
+            <AIChatMessageMetaItem variant="author">
+              <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
+              You
+            </AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+          <AIChatMessageContent>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageContent>
+          <AIChatMessageMeta aria-label="Quick actions available:">
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+          <AIChatMessageMeta aria-label="Feedback form">
+            <AIChatMessageMetaItem>Was this helpful?</AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+        </AIChatMessage>
+        <AIChatMessage variant="ai">
+          <AIChatMessageMeta aria-label="You said">
+            <AIChatMessageMetaItem>
+              <Avatar name="A" icon={ArtificialIntelligenceIcon} size="sizeIcon20" />
+              AI Bot
+            </AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+          <AIChatMessageContent>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageContent>
+          <AIChatMessageMeta aria-label="Quick actions available:">
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+          <AIChatMessageMeta aria-label="Feedback form">
+            <AIChatMessageMetaItem>Was this helpful?</AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+        </AIChatMessage>
+      </AIChatLog>
+    </Box>
+  );
+};
diff --git a/packages/paste-core/components/ai-log/tsconfig.json b/packages/paste-core/components/ai-log/tsconfig.json
new file mode 100644
index 0000000000..b5daed7034
--- /dev/null
+++ b/packages/paste-core/components/ai-log/tsconfig.json
@@ -0,0 +1,12 @@
+{
+  "extends": "../../../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "dist/",
+  },
+  "include": [
+    "src/**/*",
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}
diff --git a/yarn.lock b/yarn.lock
index 5d5fac83e8..e21441e8ef 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11216,6 +11216,42 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"@twilio-paste/ai-log@workspace:packages/paste-core/components/ai-log":
+  version: 0.0.0-use.local
+  resolution: "@twilio-paste/ai-log@workspace:packages/paste-core/components/ai-log"
+  dependencies:
+    "@twilio-paste/animation-library": ^2.0.0
+    "@twilio-paste/box": ^10.2.0
+    "@twilio-paste/color-contrast-utils": ^5.0.0
+    "@twilio-paste/customization": ^8.1.1
+    "@twilio-paste/design-tokens": ^10.3.0
+    "@twilio-paste/style-props": ^9.1.1
+    "@twilio-paste/styling-library": ^3.0.0
+    "@twilio-paste/theme": ^11.0.1
+    "@twilio-paste/types": ^6.0.0
+    "@types/react": ^18.0.27
+    "@types/react-dom": ^18.0.10
+    react: ^18.0.0
+    react-dom: ^18.0.0
+    tsx: ^3.12.10
+    typescript: ^4.9.4
+  peerDependencies:
+    "@twilio-paste/animation-library": ^2.0.0
+    "@twilio-paste/box": ^10.2.0
+    "@twilio-paste/color-contrast-utils": ^5.0.0
+    "@twilio-paste/customization": ^8.1.1
+    "@twilio-paste/design-tokens": ^10.3.0
+    "@twilio-paste/style-props": ^9.1.1
+    "@twilio-paste/styling-library": ^3.0.0
+    "@twilio-paste/theme": ^11.0.1
+    "@twilio-paste/types": ^6.0.0
+    "@types/react": ^16.8.6 || ^17.0.2 || ^18.0.27
+    "@types/react-dom": ^16.8.6 || ^17.0.2 || ^18.0.10
+    react: ^16.8.6 || ^17.0.2 || ^18.0.0
+    react-dom: ^16.8.6 || ^17.0.2 || ^18.0.0
+  languageName: unknown
+  linkType: soft
+
 "@twilio-paste/alert-dialog@^9.2.0, @twilio-paste/alert-dialog@workspace:packages/paste-core/components/alert-dialog":
   version: 0.0.0-use.local
   resolution: "@twilio-paste/alert-dialog@workspace:packages/paste-core/components/alert-dialog"
@@ -41657,7 +41693,7 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
-"source-map-support@npm:^0.5.16, source-map-support@npm:~0.5.12, source-map-support@npm:~0.5.19, source-map-support@npm:~0.5.20":
+"source-map-support@npm:^0.5.16, source-map-support@npm:^0.5.21, source-map-support@npm:~0.5.12, source-map-support@npm:~0.5.19, source-map-support@npm:~0.5.20":
   version: 0.5.21
   resolution: "source-map-support@npm:0.5.21"
   dependencies:
@@ -43669,6 +43705,23 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
+"tsx@npm:^3.12.10":
+  version: 3.14.0
+  resolution: "tsx@npm:3.14.0"
+  dependencies:
+    esbuild: ~0.18.20
+    fsevents: ~2.3.3
+    get-tsconfig: ^4.7.2
+    source-map-support: ^0.5.21
+  dependenciesMeta:
+    fsevents:
+      optional: true
+  bin:
+    tsx: dist/cli.mjs
+  checksum: afcef5d9b90b5800cf1ffb749e943f63042d78a4c0d9eef6e13e43f4ecab465d45e2c9812a2c515cbdc2ee913ff1cd01bf5c606a48013dd3ce2214a631b45557
+  languageName: node
+  linkType: hard
+
 "tsx@npm:^4.0.0":
   version: 4.6.2
   resolution: "tsx@npm:4.6.2"

From 5c21b5bc5571a2ebb2aa597edf4a4f3b4985b11a Mon Sep 17 00:00:00 2001
From: TheSisb <shadiisber@gmail.com>
Date: Thu, 9 May 2024 16:58:01 -0500
Subject: [PATCH 02/55] chore: checkpoint

---
 .codesandbox/ci.json                          |   1 +
 .../paste-codemods/tools/.cache/mappings.json |   7 ++
 .../__tests__/index.spec.tsx                  |   0
 .../{ai-log => ai-chat-log}/build.js          |   0
 .../{ai-log => ai-chat-log}/package.json      |   4 +-
 .../{ai-log => ai-chat-log}/src/AIChatLog.tsx |   2 +-
 .../src/AIChatLogger.tsx                      |   0
 .../src/AIChatMessage.tsx                     |   2 +-
 .../src/AIChatMessageActions.tsx}             |  21 +---
 .../ai-chat-log/src/AIChatMessageBody.tsx     |  59 ++++++++++
 .../ai-chat-log/src/AIChatMessageFeedback.tsx |  67 +++++++++++
 .../ai-chat-log/src/AIChatMessageLoading.tsx  |  56 +++++++++
 .../src/AIChatMessageMeta.tsx                 |   2 +-
 .../{ai-log => ai-chat-log}/src/index.tsx     |  12 +-
 .../src/useAIChatLogger.tsx                   |   0
 .../ai-chat-log/stories/index.stories.tsx     |  93 +++++++++++++++
 .../ai-chat-log/stories/parts.stories.tsx     | 106 ++++++++++++++++++
 .../{ai-log => ai-chat-log}/tsconfig.json     |   0
 .../ai-log/src/AIChatMessageContent.tsx       |  40 -------
 .../ai-log/stories/index.stories.tsx          |  66 -----------
 .../chat-log/stories/index.stories.tsx        |   2 -
 packages/paste-core/core-bundle/.gitignore    |   1 +
 packages/paste-core/core-bundle/package.json  |   1 +
 .../core-bundle/side-panel/package.json       |   8 ++
 .../core-bundle/src/ai-chat-log.tsx           |   1 +
 packages/paste-core/core-bundle/src/index.tsx |   1 +
 yarn.lock                                     |  26 +----
 27 files changed, 424 insertions(+), 154 deletions(-)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/__tests__/index.spec.tsx (100%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/build.js (100%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/package.json (96%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/AIChatLog.tsx (94%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/AIChatLogger.tsx (100%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/AIChatMessage.tsx (93%)
 rename packages/paste-core/components/{ai-log/src/AIChatMessageMetaItem.tsx => ai-chat-log/src/AIChatMessageActions.tsx} (60%)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/AIChatMessageMeta.tsx (94%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/index.tsx (50%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/useAIChatLogger.tsx (100%)
 create mode 100644 packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
 rename packages/paste-core/components/{ai-log => ai-chat-log}/tsconfig.json (100%)
 delete mode 100644 packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
 delete mode 100644 packages/paste-core/components/ai-log/stories/index.stories.tsx
 create mode 100644 packages/paste-core/core-bundle/side-panel/package.json
 create mode 100644 packages/paste-core/core-bundle/src/ai-chat-log.tsx

diff --git a/.codesandbox/ci.json b/.codesandbox/ci.json
index 7c6c6bc585..216bcfd9c6 100644
--- a/.codesandbox/ci.json
+++ b/.codesandbox/ci.json
@@ -5,6 +5,7 @@
     "/packages/paste-icons",
     "/packages/paste-core/core-bundle",
     "/packages/paste-core/components/account-switcher",
+    "/packages/paste-core/components/ai-chat-log",
     "/packages/paste-core/components/alert",
     "/packages/paste-core/components/alert-dialog",
     "/packages/paste-core/components/anchor",
diff --git a/packages/paste-codemods/tools/.cache/mappings.json b/packages/paste-codemods/tools/.cache/mappings.json
index 395930baac..aa05274a43 100644
--- a/packages/paste-codemods/tools/.cache/mappings.json
+++ b/packages/paste-codemods/tools/.cache/mappings.json
@@ -6,6 +6,13 @@
   "AccountSwitcherItemRadio": "@twilio-paste/core/account-switcher",
   "AccountSwitcherSeparator": "@twilio-paste/core/account-switcher",
   "useAccountSwitcherState": "@twilio-paste/core/account-switcher",
+  "AIChatLog": "@twilio-paste/core/ai-chat-log",
+  "AIChatLogger": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessage": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageContent": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageMeta": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageMetaItem": "@twilio-paste/core/ai-chat-log",
+  "useAIChatLogger": "@twilio-paste/core/ai-chat-log",
   "Alert": "@twilio-paste/core/alert",
   "AlertDialog": "@twilio-paste/core/alert-dialog",
   "Anchor": "@twilio-paste/core/anchor",
diff --git a/packages/paste-core/components/ai-log/__tests__/index.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
similarity index 100%
rename from packages/paste-core/components/ai-log/__tests__/index.spec.tsx
rename to packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
diff --git a/packages/paste-core/components/ai-log/build.js b/packages/paste-core/components/ai-chat-log/build.js
similarity index 100%
rename from packages/paste-core/components/ai-log/build.js
rename to packages/paste-core/components/ai-chat-log/build.js
diff --git a/packages/paste-core/components/ai-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
similarity index 96%
rename from packages/paste-core/components/ai-log/package.json
rename to packages/paste-core/components/ai-chat-log/package.json
index 8b487c5aef..1f34742229 100644
--- a/packages/paste-core/components/ai-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "@twilio-paste/ai-log",
+  "name": "@twilio-paste/ai-chat-log",
   "version": "0.0.0",
   "category": "data display",
   "status": "production",
@@ -53,7 +53,7 @@
     "@types/react-dom": "^18.0.10",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
-    "tsx": "^3.12.10",
+    "tsx": "^4.0.0",
     "typescript": "^4.9.4"
   }
 }
diff --git a/packages/paste-core/components/ai-log/src/AIChatLog.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
similarity index 94%
rename from packages/paste-core/components/ai-log/src/AIChatLog.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
index 23a31253a9..baf90b4e59 100644
--- a/packages/paste-core/components/ai-log/src/AIChatLog.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
@@ -15,7 +15,7 @@ export interface AIChatLogProps extends HTMLPasteProps<"div"> {
 }
 
 export const AIChatLog = React.forwardRef<HTMLDivElement, AIChatLogProps>(
-  ({ element = "AI_LOG", children, ...props }, ref) => {
+  ({ element = "AI_CHAT_LOG", children, ...props }, ref) => {
     return (
       <Box role="log" padding="space70" element={element} ref={ref} {...safelySpreadBoxProps(props)}>
         <Box
diff --git a/packages/paste-core/components/ai-log/src/AIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
similarity index 100%
rename from packages/paste-core/components/ai-log/src/AIChatLogger.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
similarity index 93%
rename from packages/paste-core/components/ai-log/src/AIChatMessage.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index 9f4b56e970..f576b8f0d5 100644
--- a/packages/paste-core/components/ai-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -16,7 +16,7 @@ export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
 }
 
 export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
-  ({ children, element = "CHAT_MESSAGE", ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE", ...props }, ref) => {
     return (
       <Box
         role="listitem"
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
similarity index 60%
rename from packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
index 72b7e033d2..f30ebfbc9c 100644
--- a/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
@@ -3,9 +3,8 @@ import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-export interface AIChatMessageMetaItemProps extends HTMLPasteProps<"div"> {
+export interface AIChatMessageActionsProps extends HTMLPasteProps<"div"> {
   children: NonNullable<React.ReactNode>;
-  variant: "author" | "timestamp";
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
@@ -16,18 +15,10 @@ export interface AIChatMessageMetaItemProps extends HTMLPasteProps<"div"> {
   element?: BoxElementProps["element"];
 }
 
-const variantStyles = {
-  author: {
-    color: "colorText",
-    lineHeight: "lineHeight50",
-    fontSize: "fontSize40",
-  },
-  timestamp: {},
-};
-
-export const AIChatMessageMetaItem = React.forwardRef<HTMLDivElement, AIChatMessageMetaItemProps>(
-  ({ children, element = "CHAT_MESSAGE_META_ITEM", ...props }, ref) => (
+export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessageActionsProps>(
+  ({ children, element = "AI_CHAT_MESSAGE_ACTIONS", ...props }, ref) => (
     <Box
+      {...safelySpreadBoxProps(props)}
       ref={ref}
       element={element}
       display="flex"
@@ -36,12 +27,10 @@ export const AIChatMessageMetaItem = React.forwardRef<HTMLDivElement, AIChatMess
       color="colorText"
       lineHeight="lineHeight50"
       fontSize="fontSize40"
-      {...variantStyles[props.variant]}
-      {...safelySpreadBoxProps(props)}
     >
       {children}
     </Box>
   ),
 );
 
-AIChatMessageMetaItem.displayName = "AIChatMessageMetaItem";
+AIChatMessageActions.displayName = "AIChatMessageActions";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
new file mode 100644
index 0000000000..1ed4a4244f
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
@@ -0,0 +1,59 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import type { ThemeShape } from "@twilio-paste/theme";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+const Variants = {
+  default: {
+    fontSize: "fontSize30" as ThemeShape["fontSizes"],
+    lineHeight: "lineHeight30" as ThemeShape["lineHeights"],
+  },
+  fullScreen: {
+    fontSize: "fontSize40" as ThemeShape["fontSizes"],
+    lineHeight: "lineHeight40" as ThemeShape["lineHeights"],
+  },
+};
+
+export interface AIChatMessageBodyProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatBubbleProps
+   */
+  element?: BoxElementProps["element"];
+  /**
+   * Override the font size for full screen experiences.
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {"default" | "fullScreen"}
+   * @memberof AIChatBubbleProps
+   */
+  variant?: "default" | "fullScreen";
+}
+
+export const AIChatMessageBody = React.forwardRef<HTMLDivElement, AIChatMessageBodyProps>(
+  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY", ...props }, ref) => {
+    return (
+      <Box
+        {...safelySpreadBoxProps(props)}
+        {...Variants[variant]}
+        display="inline-block"
+        color="colorText"
+        wordWrap="break-word"
+        maxWidth="100%"
+        minWidth={0}
+        element={element}
+        ref={ref}
+        whiteSpace="pre-wrap"
+      >
+        {children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageBody.displayName = "AIChatMessageBody";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
new file mode 100644
index 0000000000..035406ce6a
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
@@ -0,0 +1,67 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
+import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageFeedbackProps extends HTMLPasteProps<"div"> {
+  children?: never;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE_META_ITEM"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageMetaItemProps
+   */
+  element?: BoxElementProps["element"];
+  label?: string;
+  i18nLikeLabel?: string;
+  i18nDislikeLabel?: string;
+  onLike: () => void;
+  onDislike: () => void;
+}
+
+export const AIChatMessageFeedback = React.forwardRef<HTMLDivElement, AIChatMessageFeedbackProps>(
+  (
+    {
+      label = "Is this helpful?",
+      i18nLikeLabel = "Like result",
+      i18nDislikeLabel = "Dislike result",
+      onLike,
+      onDislike,
+      element = "AI_CHAT_MESSAGE_FEEDBACK",
+      ...props
+    },
+    ref,
+  ) => (
+    <Box
+      {...safelySpreadBoxProps(props)}
+      ref={ref}
+      element={element}
+      display="inline-flex"
+      alignItems="flex-start"
+      columnGap="space30"
+      marginTop="space40"
+      color="colorTextIcon"
+      lineHeight="lineHeight20"
+      fontSize="fontSize20"
+      backgroundColor="colorBackgroundBody"
+      boxShadow="shadowBorderWeaker"
+      borderRadius="borderRadius30"
+      paddingX="space30"
+      paddingY="space20"
+    >
+      <span>{label}</span>
+      <Button variant="reset" size="reset" onClick={onLike}>
+        <ThumbsUpIcon decorative={false} title={i18nLikeLabel} />
+      </Button>
+      <Button variant="reset" size="reset" onClick={onDislike}>
+        <ThumbsDownIcon decorative={false} title={i18nDislikeLabel} />
+      </Button>
+    </Box>
+  ),
+);
+
+AIChatMessageFeedback.displayName = "AIChatMessageFeedback";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
new file mode 100644
index 0000000000..67d468ae9e
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
@@ -0,0 +1,56 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { StopIcon } from "@twilio-paste/icons/esm/StopIcon";
+import { ScreenReaderOnly } from "@twilio-paste/screen-reader-only";
+import { SkeletonLoader } from "@twilio-paste/skeleton-loader";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+const clampedRandom = (min: number, max: number): number => {
+  return Math.min(Math.max(min, Math.random() * max), max);
+};
+export interface AIChatMessageLoadingProps extends HTMLPasteProps<"div"> {
+  children?: never;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE"
+   * @type {BoxProps["element"]}
+   * @memberof ChatMessageProps
+   */
+  element?: BoxElementProps["element"];
+  onStopLoading?: () => void;
+}
+
+export const AIChatMessageLoading = React.forwardRef<HTMLDivElement, AIChatMessageLoadingProps>(
+  ({ onStopLoading, element = "AI_CHAT_MESSAGE_LOADING", ...props }, ref) => {
+    const widths = React.useRef([clampedRandom(40, 75), clampedRandom(65, 100), clampedRandom(55, 80)]).current;
+
+    return (
+      <Box
+        {...safelySpreadBoxProps(props)}
+        ref={ref}
+        element={element}
+        role="listitem"
+        display="flex"
+        flexDirection="column"
+        rowGap="space40"
+      >
+        <SkeletonLoader width={`${widths[0]}%`} height="20px" />
+        <SkeletonLoader width={`${widths[1]}%`} height="20px" />
+        <SkeletonLoader width={`${widths[2]}%`} height="20px" />
+        {onStopLoading ? (
+          <Box display="flex" justifyContent="center">
+            <Button variant="secondary" size="rounded_small" onClick={onStopLoading}>
+              <StopIcon decorative={true} />
+              Stop generating <ScreenReaderOnly>AI response</ScreenReaderOnly>
+            </Button>
+          </Box>
+        ) : null}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageLoading.displayName = "AIChatMessageLoading";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
similarity index 94%
rename from packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
index dd19c55fcc..188a865be7 100644
--- a/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
@@ -23,7 +23,7 @@ export interface AIChatMessageMetaProps extends HTMLPasteProps<"div"> {
 }
 
 export const AIChatMessageMeta = React.forwardRef<HTMLDivElement, AIChatMessageMetaProps>(
-  ({ children, element = "CHAT_MESSAGE_META", ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE_META", ...props }, ref) => {
     return (
       <Box
         {...safelySpreadBoxProps(props)}
diff --git a/packages/paste-core/components/ai-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
similarity index 50%
rename from packages/paste-core/components/ai-log/src/index.tsx
rename to packages/paste-core/components/ai-chat-log/src/index.tsx
index 65e31ebf04..4bccb2475e 100644
--- a/packages/paste-core/components/ai-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -2,10 +2,14 @@ export { AIChatMessage } from "./AIChatMessage";
 export type { AIChatMessageProps } from "./AIChatMessage";
 export { AIChatMessageMeta } from "./AIChatMessageMeta";
 export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
-export { AIChatMessageMetaItem } from "./AIChatMessageMetaItem";
-export type { AIChatMessageMetaItemProps } from "./AIChatMessageMetaItem";
-export { AIChatMessageContent } from "./AIChatMessageContent";
-export type { AIChatMessageContentProps } from "./AIChatMessageContent";
+export { AIChatMessageBody } from "./AIChatMessageBody";
+export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
+export { AIChatMessageActions } from "./AIChatMessageActions";
+export type { AIChatMessageActionsProps } from "./AIChatMessageActions";
+export { AIChatMessageFeedback } from "./AIChatMessageFeedback";
+export type { AIChatMessageFeedbackProps } from "./AIChatMessageFeedback";
+export { AIChatMessageLoading } from "./AIChatMessageLoading";
+export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 
 export { AIChatLog } from "./AIChatLog";
 export type { AIChatLogProps } from "./AIChatLog";
diff --git a/packages/paste-core/components/ai-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
similarity index 100%
rename from packages/paste-core/components/ai-log/src/useAIChatLogger.tsx
rename to packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
new file mode 100644
index 0000000000..5dce71eb83
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -0,0 +1,93 @@
+import * as React from "react";
+
+import { Avatar } from "@twilio-paste/avatar";
+import { Box } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { useUID } from "@twilio-paste/uid-library";
+
+import { Text } from "@twilio-paste/text";
+
+import {
+  AIChatLog,
+  AIChatMessage,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+} from "../src";
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Chat Log",
+  component: AIChatLog,
+};
+
+export const StandardUsage = (): React.ReactNode => {
+  return (
+    <AIChatLog>
+      <AIChatMessage>
+        <AIChatMessageMeta aria-label="You said">
+          <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
+          You
+        </AIChatMessageMeta>
+        <AIChatMessageBody variant="default">
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+      </AIChatMessage>
+
+      <AIChatMessage>
+        <AIChatMessageMeta aria-label="AI said">
+          <Avatar name="AI" size="sizeIcon50" icon={ArtificialIntelligenceIcon} />
+          AI Bot
+        </AIChatMessageMeta>
+        <AIChatMessageBody variant="default">
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+        <AIChatMessageMeta aria-label="Quick actions available:">
+          <ButtonGroup>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30007
+            </Button>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30007
+            </Button>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30009
+            </Button>
+          </ButtonGroup>
+        </AIChatMessageMeta>
+        <AIChatMessageMeta aria-label="Feedback form">
+          <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
+        </AIChatMessageMeta>
+      </AIChatMessage>
+
+      <AIChatMessage>
+        <AIChatMessageMeta aria-label="You said">
+          <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
+          You
+        </AIChatMessageMeta>
+        <AIChatMessageBody>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+      </AIChatMessage>
+
+      <AIChatMessage>
+        <AIChatMessageMeta aria-label="AI said">
+          <Avatar name="AI" size="sizeIcon50" icon={ArtificialIntelligenceIcon} />
+          AI Bot
+        </AIChatMessageMeta>
+        <AIChatMessageBody>
+          <AIChatMessageLoading onStopLoading={() => {}} />
+        </AIChatMessageBody>
+      </AIChatMessage>
+    </AIChatLog>
+  );
+};
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
new file mode 100644
index 0000000000..ad436df8d4
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -0,0 +1,106 @@
+import * as React from "react";
+
+import { Avatar } from "@twilio-paste/avatar";
+import { Box } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { InlineCode } from "@twilio-paste/inline-code";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { useUID } from "@twilio-paste/uid-library";
+
+import { Text } from "@twilio-paste/text";
+
+import {
+  AIChatLog,
+  AIChatMessage,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+} from "../src";
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Chat Log/Parts",
+  component: AIChatLog,
+};
+
+
+
+export const MessageBody = (): React.ReactNode => {
+  return (
+    <AIChatLog>
+      <AIChatMessageBody variant="default">Use <InlineCode>variant="default"</InlineCode> when the AI Chat Log is inside a small container.</AIChatMessageBody>
+      <AIChatMessageBody variant="fullScreen">Use <InlineCode>variant="fullSCreen"</InlineCode> when the AI Chat Log is a full screen experience.</AIChatMessageBody>
+    </AIChatLog>
+  );
+};
+
+
+export const MessageBodyWithParagraphs = (): React.ReactNode => {
+  return (
+    <AIChatLog>
+      <AIChatMessageBody variant="default">
+        <p>Test</p>
+        <p>Test</p>
+      </AIChatMessageBody>
+
+      <AIChatMessageBody variant="fullScreen">
+        <p>Test</p>
+        <p>Test</p>
+      </AIChatMessageBody>
+    </AIChatLog>
+  );
+};
+
+
+
+
+
+
+export const Loading = (): React.ReactNode => {
+  return (
+    <div>
+      <p>Pssst! The three rows have dynamic widths. Refresh to see it in action!</p>
+      <AIChatMessageLoading />
+    </div>
+  );
+};
+
+export const LoadingStopLoading = (): React.ReactNode => {
+  const [loading, setLoading] = React.useState(true);
+  return (
+    <div>
+      {loading ? (
+        <AIChatMessageLoading
+          onStopLoading={() => {
+            setLoading(false);
+          }}
+        />
+      ) : (
+        "Aborted loading!"
+      )}
+    </div>
+  );
+};
+LoadingStopLoading.storyName = "Loading with stop button";
+
+export const Feedback = (): React.ReactNode => {
+  /* eslint-disable no-alert */
+  return (
+    <AIChatMessageMeta aria-label="Feedback form">
+      <AIChatMessageFeedback onLike={() => alert("Like + 1")} onDislike={() => alert("Like - 1")} />
+    </AIChatMessageMeta>
+  );
+  /* eslint-enable no-alert */
+};
+
+export const FeedbackCustomLabels = (): React.ReactNode => {
+  /* eslint-disable no-alert */
+  return (
+    <AIChatMessageMeta aria-label="Feedback form">
+      <AIChatMessageFeedback label="Est-ce utile?" i18nDislikeLabel="pas aimer" i18nLikeLabel="aimer" onLike={() => alert("Like + 1")} onDislike={() => alert("Like - 1")} />
+    </AIChatMessageMeta>
+  );
+  /* eslint-enable no-alert */
+};
diff --git a/packages/paste-core/components/ai-log/tsconfig.json b/packages/paste-core/components/ai-chat-log/tsconfig.json
similarity index 100%
rename from packages/paste-core/components/ai-log/tsconfig.json
rename to packages/paste-core/components/ai-chat-log/tsconfig.json
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx b/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
deleted file mode 100644
index 0958389f62..0000000000
--- a/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps, BoxStyleProps } from "@twilio-paste/box";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import * as React from "react";
-
-export interface AIChatMessageContentProps extends HTMLPasteProps<"div"> {
-  children?: React.ReactNode;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "CHAT_BUBBLE"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatBubbleProps
-   */
-  element?: BoxElementProps["element"];
-}
-
-export const AIChatMessageContent = React.forwardRef<HTMLDivElement, AIChatMessageContentProps>(
-  ({ children, element = "CHAT_MESSAGE_CONTENT", ...props }, ref) => {
-    return (
-      <Box
-        display="inline-block"
-        color="colorText"
-        fontSize="fontSize30"
-        lineHeight="lineHeight20"
-        wordWrap="break-word"
-        maxWidth="100%"
-        minWidth={0}
-        element={element}
-        ref={ref}
-        whiteSpace="pre-wrap"
-        {...safelySpreadBoxProps(props)}
-      >
-        {children}
-      </Box>
-    );
-  },
-);
-
-AIChatMessageContent.displayName = "AIChatMessageContent";
diff --git a/packages/paste-core/components/ai-log/stories/index.stories.tsx b/packages/paste-core/components/ai-log/stories/index.stories.tsx
deleted file mode 100644
index 2f9fc10400..0000000000
--- a/packages/paste-core/components/ai-log/stories/index.stories.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import * as React from "react";
-
-import { Avatar } from "@twilio-paste/avatar";
-import { Box } from "@twilio-paste/box";
-import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
-import { useUID } from "@twilio-paste/uid-library";
-import { AIChatLog, AIChatMessage, AIChatMessageContent, AIChatMessageMeta, AIChatMessageMetaItem } from "../src";
-
-// eslint-disable-next-line import/no-default-export
-export default {
-  title: "Components/AI Log",
-  component: AIChatLog,
-};
-
-export const Default = (): React.ReactNode => {
-  const [showButton, setShowButton] = React.useState(true);
-  const chatBoxUniqueID = useUID();
-  return (
-    <Box maxHeight="size40" overflowY="scroll" id={chatBoxUniqueID}>
-      <AIChatLog>
-        <AIChatMessage>
-          <AIChatMessageMeta aria-label="You said">
-            <AIChatMessageMetaItem variant="author">
-              <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
-              You
-            </AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-          <AIChatMessageContent>
-            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
-            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-            impedit repellat assumenda.
-          </AIChatMessageContent>
-          <AIChatMessageMeta aria-label="Quick actions available:">
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-          <AIChatMessageMeta aria-label="Feedback form">
-            <AIChatMessageMetaItem>Was this helpful?</AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-        </AIChatMessage>
-        <AIChatMessage variant="ai">
-          <AIChatMessageMeta aria-label="You said">
-            <AIChatMessageMetaItem>
-              <Avatar name="A" icon={ArtificialIntelligenceIcon} size="sizeIcon20" />
-              AI Bot
-            </AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-          <AIChatMessageContent>
-            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
-            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-            impedit repellat assumenda.
-          </AIChatMessageContent>
-          <AIChatMessageMeta aria-label="Quick actions available:">
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-          <AIChatMessageMeta aria-label="Feedback form">
-            <AIChatMessageMetaItem>Was this helpful?</AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-        </AIChatMessage>
-      </AIChatLog>
-    </Box>
-  );
-};
diff --git a/packages/paste-core/components/chat-log/stories/index.stories.tsx b/packages/paste-core/components/chat-log/stories/index.stories.tsx
index a591fa21dc..f2a9688dd2 100644
--- a/packages/paste-core/components/chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/chat-log/stories/index.stories.tsx
@@ -125,8 +125,6 @@ export const ScrollingChatLog: StoryFn = () => {
               <HelpText variant="error" marginTop="space0">
                 Message failed
               </HelpText>
-            </ChatMessageMetaItem>
-            <ChatMessageMetaItem>
               <Button variant="link" onClick={() => {}}>
                 Resend
               </Button>
diff --git a/packages/paste-core/core-bundle/.gitignore b/packages/paste-core/core-bundle/.gitignore
index 84b80d657b..78137ef542 100644
--- a/packages/paste-core/core-bundle/.gitignore
+++ b/packages/paste-core/core-bundle/.gitignore
@@ -1,6 +1,7 @@
 # Automatically generated from "yarn generate-packages"
 /dist
 /account-switcher
+/ai-chat-log
 /alert
 /alert-dialog
 /anchor
diff --git a/packages/paste-core/core-bundle/package.json b/packages/paste-core/core-bundle/package.json
index 546d2e2c41..ae0e41fd64 100644
--- a/packages/paste-core/core-bundle/package.json
+++ b/packages/paste-core/core-bundle/package.json
@@ -72,6 +72,7 @@
   },
   "dependencies": {
     "@twilio-paste/account-switcher": "^3.0.1",
+    "@twilio-paste/ai-chat-log": "^0.0.0",
     "@twilio-paste/alert": "^14.1.0",
     "@twilio-paste/alert-dialog": "^9.2.0",
     "@twilio-paste/anchor": "^12.1.0",
diff --git a/packages/paste-core/core-bundle/side-panel/package.json b/packages/paste-core/core-bundle/side-panel/package.json
new file mode 100644
index 0000000000..1a4d6804f8
--- /dev/null
+++ b/packages/paste-core/core-bundle/side-panel/package.json
@@ -0,0 +1,8 @@
+{
+  "name": "@twilio-paste-core/side-panel",
+  "version": "0.0.0",
+  "private": true,
+  "sideEffects": false,
+  "main": "../dist/side-panel.js",
+  "types": "../dist/side-panel.d.ts"
+}
\ No newline at end of file
diff --git a/packages/paste-core/core-bundle/src/ai-chat-log.tsx b/packages/paste-core/core-bundle/src/ai-chat-log.tsx
new file mode 100644
index 0000000000..4904080312
--- /dev/null
+++ b/packages/paste-core/core-bundle/src/ai-chat-log.tsx
@@ -0,0 +1 @@
+export * from "@twilio-paste/ai-chat-log";
diff --git a/packages/paste-core/core-bundle/src/index.tsx b/packages/paste-core/core-bundle/src/index.tsx
index cdcb49ccd9..a5a0e09f33 100644
--- a/packages/paste-core/core-bundle/src/index.tsx
+++ b/packages/paste-core/core-bundle/src/index.tsx
@@ -1,4 +1,5 @@
 export * from "@twilio-paste/account-switcher";
+export * from "@twilio-paste/ai-chat-log";
 export * from "@twilio-paste/alert";
 export * from "@twilio-paste/alert-dialog";
 export * from "@twilio-paste/anchor";
diff --git a/yarn.lock b/yarn.lock
index e21441e8ef..040c21089f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11216,9 +11216,9 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@twilio-paste/ai-log@workspace:packages/paste-core/components/ai-log":
+"@twilio-paste/ai-chat-log@^0.0.0, @twilio-paste/ai-chat-log@workspace:packages/paste-core/components/ai-chat-log":
   version: 0.0.0-use.local
-  resolution: "@twilio-paste/ai-log@workspace:packages/paste-core/components/ai-log"
+  resolution: "@twilio-paste/ai-chat-log@workspace:packages/paste-core/components/ai-chat-log"
   dependencies:
     "@twilio-paste/animation-library": ^2.0.0
     "@twilio-paste/box": ^10.2.0
@@ -11233,7 +11233,7 @@ __metadata:
     "@types/react-dom": ^18.0.10
     react: ^18.0.0
     react-dom: ^18.0.0
-    tsx: ^3.12.10
+    tsx: ^4.0.0
     typescript: ^4.9.4
   peerDependencies:
     "@twilio-paste/animation-library": ^2.0.0
@@ -12231,6 +12231,7 @@ __metadata:
   resolution: "@twilio-paste/core@workspace:packages/paste-core/core-bundle"
   dependencies:
     "@twilio-paste/account-switcher": ^3.0.1
+    "@twilio-paste/ai-chat-log": ^0.0.0
     "@twilio-paste/alert": ^14.1.0
     "@twilio-paste/alert-dialog": ^9.2.0
     "@twilio-paste/anchor": ^12.1.0
@@ -41693,7 +41694,7 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
-"source-map-support@npm:^0.5.16, source-map-support@npm:^0.5.21, source-map-support@npm:~0.5.12, source-map-support@npm:~0.5.19, source-map-support@npm:~0.5.20":
+"source-map-support@npm:^0.5.16, source-map-support@npm:~0.5.12, source-map-support@npm:~0.5.19, source-map-support@npm:~0.5.20":
   version: 0.5.21
   resolution: "source-map-support@npm:0.5.21"
   dependencies:
@@ -43705,23 +43706,6 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
-"tsx@npm:^3.12.10":
-  version: 3.14.0
-  resolution: "tsx@npm:3.14.0"
-  dependencies:
-    esbuild: ~0.18.20
-    fsevents: ~2.3.3
-    get-tsconfig: ^4.7.2
-    source-map-support: ^0.5.21
-  dependenciesMeta:
-    fsevents:
-      optional: true
-  bin:
-    tsx: dist/cli.mjs
-  checksum: afcef5d9b90b5800cf1ffb749e943f63042d78a4c0d9eef6e13e43f4ecab465d45e2c9812a2c515cbdc2ee913ff1cd01bf5c606a48013dd3ce2214a631b45557
-  languageName: node
-  linkType: hard
-
 "tsx@npm:^4.0.0":
   version: 4.6.2
   resolution: "tsx@npm:4.6.2"

From 6a8f9dee1e5a6c3ea5bc01b08477e138381a04f0 Mon Sep 17 00:00:00 2001
From: TheSisb <shadiisber@gmail.com>
Date: Fri, 17 May 2024 14:12:44 -0500
Subject: [PATCH 03/55] chore: checkpoint more progress

---
 .../ai-chat-log/src/AIChatMessageActions.tsx  |  36 ----
 .../ai-chat-log/src/AIChatMessageAuthor.tsx   |  57 ++++++
 .../components/ai-chat-log/src/index.tsx      |   4 +-
 .../ai-chat-log/src/useAIChatLogger.tsx       |   2 +-
 .../ai-chat-log/stories/index.stories.tsx     |  28 +--
 .../stories/useAIChatLogger.storides.tsx      | 167 ++++++++++++++++++
 6 files changed, 236 insertions(+), 58 deletions(-)
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
deleted file mode 100644
index f30ebfbc9c..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps } from "@twilio-paste/box";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import * as React from "react";
-
-export interface AIChatMessageActionsProps extends HTMLPasteProps<"div"> {
-  children: NonNullable<React.ReactNode>;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "CHAT_MESSAGE_META_ITEM"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatMessageMetaItemProps
-   */
-  element?: BoxElementProps["element"];
-}
-
-export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessageActionsProps>(
-  ({ children, element = "AI_CHAT_MESSAGE_ACTIONS", ...props }, ref) => (
-    <Box
-      {...safelySpreadBoxProps(props)}
-      ref={ref}
-      element={element}
-      display="flex"
-      alignItems="flex-start"
-      columnGap="space30"
-      color="colorText"
-      lineHeight="lineHeight50"
-      fontSize="fontSize40"
-    >
-      {children}
-    </Box>
-  ),
-);
-
-AIChatMessageActions.displayName = "AIChatMessageActions";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
new file mode 100644
index 0000000000..ddbea84667
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -0,0 +1,57 @@
+import { Avatar } from "@twilio-paste/avatar";
+import type { BoxElementProps } from "@twilio-paste/box";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import type { ThemeShape } from "@twilio-paste/theme";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+import { AIChatMessageMeta } from "./AIChatMessageMeta";
+
+export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
+  /**
+   * The name of the author of the chat message
+   *
+   * @type {string}
+   * @memberof AIChatMessageAuthorProps
+   */
+  children: string;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "AI_CHAT_MESSAGE_AUTHOR"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageAuthorProps
+   */
+  element?: BoxElementProps["element"];
+  /**
+   * Screen reader label for the author
+   *
+   * @type {string}
+   * @memberof AIChatMessageAuthorProps
+   */
+  "aria-label": string;
+  /**
+   * Whether the author is a bot or not
+   *
+   * @default false
+   * @type {boolean}
+   * @memberof AIChatMessageAuthorProps
+   */
+  bot?: boolean;
+}
+
+export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
+  ({ children, bot = false, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
+    return (
+      <AIChatMessageMeta {...props} ref={ref} aria-label={props["aria-label"]} element={element}>
+        {bot ? (
+          <Avatar name={children} size="sizeIcon50" icon={ArtificialIntelligenceIcon} element={`${element}_AVATAR}`} />
+        ) : (
+          <Avatar name={children} size="sizeIcon50" color="decorative30" element={`${element}_AVATAR}`} />
+        )}
+        {children}
+      </AIChatMessageMeta>
+    );
+  },
+);
+
+AIChatMessageAuthor.displayName = "AIChatMessageAuthor";
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 4bccb2475e..06700fe480 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -4,8 +4,8 @@ export { AIChatMessageMeta } from "./AIChatMessageMeta";
 export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
 export { AIChatMessageBody } from "./AIChatMessageBody";
 export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
-export { AIChatMessageActions } from "./AIChatMessageActions";
-export type { AIChatMessageActionsProps } from "./AIChatMessageActions";
+export { AIChatMessageAuthor } from "./AIChatMessageAuthor";
+export type { AIChatMessageAuthorProps } from "./AIChatMessageAuthor";
 export { AIChatMessageFeedback } from "./AIChatMessageFeedback";
 export type { AIChatMessageFeedbackProps } from "./AIChatMessageFeedback";
 export { AIChatMessageLoading } from "./AIChatMessageLoading";
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index 6d785d5f6b..b94e034b74 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -12,7 +12,7 @@ type PushAIChat = (chat: PartialIDChat) => void;
 type PopAIChat = (id?: string) => void;
 
 export type UseAIChatLogger = (...initialChats: PartialIDChat[]) => {
-  aiChats: AIChat[];
+  chats: AIChat[];
   push: PushAIChat;
   pop: PopAIChat;
   clear: () => void;
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 5dce71eb83..8ebf1d4168 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -12,6 +12,7 @@ import { Text } from "@twilio-paste/text";
 import {
   AIChatLog,
   AIChatMessage,
+  AIChatMessageAuthor,
   AIChatMessageBody,
   AIChatMessageFeedback,
   AIChatMessageLoading,
@@ -28,22 +29,17 @@ export const StandardUsage = (): React.ReactNode => {
   return (
     <AIChatLog>
       <AIChatMessage>
-        <AIChatMessageMeta aria-label="You said">
-          <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
-          You
-        </AIChatMessageMeta>
+        <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
         <AIChatMessageBody variant="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
           impedit repellat assumenda.
         </AIChatMessageBody>
       </AIChatMessage>
-
       <AIChatMessage>
-        <AIChatMessageMeta aria-label="AI said">
-          <Avatar name="AI" size="sizeIcon50" icon={ArtificialIntelligenceIcon} />
-          AI Bot
-        </AIChatMessageMeta>
+        <AIChatMessageAuthor aria-label="AI said" bot>
+          Good Bot
+        </AIChatMessageAuthor>
         <AIChatMessageBody variant="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
@@ -66,24 +62,18 @@ export const StandardUsage = (): React.ReactNode => {
           <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
         </AIChatMessageMeta>
       </AIChatMessage>
-
       <AIChatMessage>
-        <AIChatMessageMeta aria-label="You said">
-          <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
-          You
-        </AIChatMessageMeta>
+        <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
         <AIChatMessageBody>
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
           impedit repellat assumenda.
         </AIChatMessageBody>
       </AIChatMessage>
-
       <AIChatMessage>
-        <AIChatMessageMeta aria-label="AI said">
-          <Avatar name="AI" size="sizeIcon50" icon={ArtificialIntelligenceIcon} />
-          AI Bot
-        </AIChatMessageMeta>
+        <AIChatMessageAuthor aria-label="AI said" bot>
+          Good Bot
+        </AIChatMessageAuthor>
         <AIChatMessageBody>
           <AIChatMessageLoading onStopLoading={() => {}} />
         </AIChatMessageBody>
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx
new file mode 100644
index 0000000000..6b9a331d81
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx
@@ -0,0 +1,167 @@
+import type { StoryFn } from "@storybook/react";
+import { Box } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { Input } from "@twilio-paste/input";
+import { Label } from "@twilio-paste/label";
+import { ListItem, OrderedList } from "@twilio-paste/list";
+import { RadioButton, RadioButtonGroup } from "@twilio-paste/radio-button-group";
+import { Stack } from "@twilio-paste/stack";
+import { useUID } from "@twilio-paste/uid-library";
+import * as React from "react";
+
+
+
+import { Avatar } from "@twilio-paste/avatar";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+
+
+import {
+  AIChatLog
+  AIChatLoggergerger,
+  AIChatMessage,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+  useAIChatLogger
+} from "../src";
+
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Chat Log/useAIChatLogger",
+};
+
+
+
+
+
+
+export const UseChatLogger: StoryFn = () => {
+  const pushID = useUID();
+  const popID = useUID();
+  const messageID = useUID();
+  const variantId = useUID();
+
+  const { chats, push, pop, clear } = useAIChatLogger(
+    {
+      content: (
+        <AIChatMessage>
+          <AIChatMessageBody>Hi my name is Jane Doe how can I help you?</AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    },
+    {
+      content: (
+        <AIChatMessage>
+          <AIChatMessageBody>I need some help with the Twilio API</AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    },
+    {
+      content: (
+        <AIChatMessage>
+          <AIChatMessageBody>Of course! Can you provide more detail?</AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    },
+  );
+  console.log(chats, push, pop);
+
+  const handlePushSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
+    e.preventDefault();
+    const form = e.currentTarget;
+    const data = new FormData(form);
+    const message = data.get("message");
+    const variant = (data.get("variant") || "inbound") as MessageVariants;
+    const id = data.get("id");
+
+    const chat: PartialIDChat = {
+      variant,
+      content: (
+        <AIChatMessage variant={variant}>
+          <AIChatMessageBody>{message}</AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    };
+
+    if (id) {
+      chat.id = id?.toString();
+    }
+
+    push(chat);
+    form.reset();
+  };
+
+  const handlePopSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
+    e.preventDefault();
+    const form = e.currentTarget;
+    const data = new FormData(form);
+    const id = data.get("id")?.toString();
+
+    pop(id);
+    form.reset();
+  };
+
+  return (
+    <Stack orientation="vertical" spacing="space80">
+      <Box display="flex" columnGap="space80" alignItems="flex-start">
+        <form onSubmit={handlePushSubmit}>
+          <Stack orientation="vertical" spacing="space40">
+            <legend>Push</legend>
+            <div>
+              <Label required htmlFor={messageID}>
+                Message
+              </Label>
+              <Input required name="message" id={messageID} type="text" />
+            </div>
+            <div>
+              <Label htmlFor={pushID}>Push ID</Label>
+              <Input name="id" id={pushID} type="text" />
+            </div>
+            <RadioButtonGroup required id={variantId} attached name="variant" legend="variant">
+              <RadioButton value="inbound">inbound</RadioButton>
+              <RadioButton value="outbound">outbound</RadioButton>
+            </RadioButtonGroup>
+            <Button type="submit" variant="secondary">
+              Submit Push
+            </Button>
+          </Stack>
+        </form>
+        <form onSubmit={handlePopSubmit}>
+          <Stack orientation="vertical" spacing="space40">
+            <legend>Pop</legend>
+            <div>
+              <Label htmlFor={popID}>Pop ID</Label>
+              <Input name="id" id={popID} type="text" />
+            </div>
+            <Button type="submit" variant="secondary">
+              Submit Pop
+            </Button>
+          </Stack>
+        </form>
+        <Stack orientation="vertical" spacing="space40">
+          <legend>Clear</legend>
+          <Button type="submit" variant="secondary" onClick={clear}>
+            Clear All History
+          </Button>
+        </Stack>
+        <OrderedList aria-label="ordered list">
+          {chats.map(({ id }) => (
+            <ListItem key={id}>
+              <code>{id}</code>
+            </ListItem>
+          ))}
+        </OrderedList>
+      </Box>
+      <AIChatLogger chats={chats} />
+    </Stack>
+  );
+};
+UseChatLogger.parameters = {
+  a11y: {
+    // no need to a11y check composition of a11y checked components
+    disable: true,
+  },
+};

From f51a267e3ef32bb94425e3c5e408d9bca4388f50 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Wed, 29 May 2024 15:54:15 -0500
Subject: [PATCH 04/55] chore: typo fix

---
 .../ai-chat-log/stories/parts.stories.tsx     | 26 ++++++++++---------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index ad436df8d4..8ed5adbe19 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -4,8 +4,8 @@ import { Avatar } from "@twilio-paste/avatar";
 import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
-import { InlineCode } from "@twilio-paste/inline-code";
 import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { InlineCode } from "@twilio-paste/inline-code";
 import { useUID } from "@twilio-paste/uid-library";
 
 import { Text } from "@twilio-paste/text";
@@ -25,18 +25,19 @@ export default {
   component: AIChatLog,
 };
 
-
-
 export const MessageBody = (): React.ReactNode => {
   return (
     <AIChatLog>
-      <AIChatMessageBody variant="default">Use <InlineCode>variant="default"</InlineCode> when the AI Chat Log is inside a small container.</AIChatMessageBody>
-      <AIChatMessageBody variant="fullScreen">Use <InlineCode>variant="fullSCreen"</InlineCode> when the AI Chat Log is a full screen experience.</AIChatMessageBody>
+      <AIChatMessageBody variant="default">
+        Use <InlineCode>variant="default"</InlineCode> when the AI Chat Log is inside a small container.
+      </AIChatMessageBody>
+      <AIChatMessageBody variant="fullScreen">
+        Use <InlineCode>variant="fullScreen"</InlineCode> when the AI Chat Log is a full screen experience.
+      </AIChatMessageBody>
     </AIChatLog>
   );
 };
 
-
 export const MessageBodyWithParagraphs = (): React.ReactNode => {
   return (
     <AIChatLog>
@@ -53,11 +54,6 @@ export const MessageBodyWithParagraphs = (): React.ReactNode => {
   );
 };
 
-
-
-
-
-
 export const Loading = (): React.ReactNode => {
   return (
     <div>
@@ -99,7 +95,13 @@ export const FeedbackCustomLabels = (): React.ReactNode => {
   /* eslint-disable no-alert */
   return (
     <AIChatMessageMeta aria-label="Feedback form">
-      <AIChatMessageFeedback label="Est-ce utile?" i18nDislikeLabel="pas aimer" i18nLikeLabel="aimer" onLike={() => alert("Like + 1")} onDislike={() => alert("Like - 1")} />
+      <AIChatMessageFeedback
+        label="Est-ce utile?"
+        i18nDislikeLabel="pas aimer"
+        i18nLikeLabel="aimer"
+        onLike={() => alert("Like + 1")}
+        onDislike={() => alert("Like - 1")}
+      />
     </AIChatMessageMeta>
   );
   /* eslint-enable no-alert */

From e0fffdfea18e71893e90c0b336dbfdc3a620b3cb Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 09:58:09 -0500
Subject: [PATCH 05/55] chore: wip working useAILogger

---
 .../ai-chat-log/src/AIChatLogger.tsx          |   2 +-
 .../ai-chat-log/src/AIChatMessage.tsx         |  36 ++--
 .../ai-chat-log/src/AIChatMessageAuthor.tsx   |   6 +-
 .../ai-chat-log/src/MessageVariantContext.tsx |   4 +
 .../components/ai-chat-log/src/index.tsx      |   4 +-
 .../ai-chat-log/src/useAIChatLogger.tsx       |   4 +-
 .../ai-chat-log/stories/index.stories.tsx     |  18 +-
 .../stories/useAIChatLogger.storides.tsx      | 167 ------------------
 8 files changed, 43 insertions(+), 198 deletions(-)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
index 8424516062..6f763de617 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
@@ -22,7 +22,7 @@ export interface AIChatLoggerProps extends HTMLPasteProps<"div"> {
 }
 
 const buildTransitionX = (AIChat: AIChat): number => {
-  if (AIChat.variant === "ai") return -100;
+  if (AIChat.variant === "bot") return -100;
   if (AIChat.variant === "user") return 100;
   return 0;
 };
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index f576b8f0d5..b22978a3ba 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -1,7 +1,8 @@
 import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps, BoxStyleProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
+import { MessageVariantContext, MessageVariants } from "./MessageVariantContext";
 
 export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
@@ -13,22 +14,31 @@ export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
    * @memberof ChatMessageProps
    */
   element?: BoxElementProps["element"];
+  /**
+   *
+   * @default null
+   * @type {MessageVariants}
+   * @memberof ChatMessageProps
+   */
+  variant: MessageVariants;
 }
 
 export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
-  ({ children, element = "AI_CHAT_MESSAGE", ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE", variant, ...props }, ref) => {
     return (
-      <Box
-        role="listitem"
-        display="flex"
-        flexDirection="column"
-        rowGap="space40"
-        ref={ref}
-        element={element}
-        {...safelySpreadBoxProps(props)}
-      >
-        {children}
-      </Box>
+      <MessageVariantContext.Provider value={variant}>
+        <Box
+          role="listitem"
+          display="flex"
+          flexDirection="column"
+          rowGap="space40"
+          ref={ref}
+          element={element}
+          {...safelySpreadBoxProps(props)}
+        >
+          {children}
+        </Box>
+      </MessageVariantContext.Provider>
     );
   },
 );
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
index ddbea84667..72fe6722b4 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -1,10 +1,10 @@
 import { Avatar } from "@twilio-paste/avatar";
 import type { BoxElementProps } from "@twilio-paste/box";
 import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
-import type { ThemeShape } from "@twilio-paste/theme";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 import { AIChatMessageMeta } from "./AIChatMessageMeta";
+import { MessageVariantContext } from "./MessageVariantContext";
 
 export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
   /**
@@ -41,9 +41,11 @@ export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
 
 export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
   ({ children, bot = false, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
+    const messageVariant = React.useContext(MessageVariantContext);
+
     return (
       <AIChatMessageMeta {...props} ref={ref} aria-label={props["aria-label"]} element={element}>
-        {bot ? (
+        {messageVariant === "bot" ? (
           <Avatar name={children} size="sizeIcon50" icon={ArtificialIntelligenceIcon} element={`${element}_AVATAR}`} />
         ) : (
           <Avatar name={children} size="sizeIcon50" color="decorative30" element={`${element}_AVATAR}`} />
diff --git a/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx b/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
new file mode 100644
index 0000000000..844228bc89
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
@@ -0,0 +1,4 @@
+import * as React from "react";
+
+export type MessageVariants = "bot" | "user";
+export const MessageVariantContext = React.createContext<MessageVariants>("bot");
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 06700fe480..317c3cf0f4 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -14,6 +14,8 @@ export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 export { AIChatLog } from "./AIChatLog";
 export type { AIChatLogProps } from "./AIChatLog";
 export { useAIChatLogger } from "./useAIChatLogger";
-export type { UseAIChatLogger } from "./useAIChatLogger";
+export type { UseAIChatLogger, PartialIDChat as PartialIdChatAI } from "./useAIChatLogger";
 export { AIChatLogger } from "./AIChatLogger";
 export type { AIChatLoggerProps } from "./AIChatLogger";
+
+export type { MessageVariants } from "./MessageVariantContext";
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index b94e034b74..d1ab4c4e64 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -1,8 +1,10 @@
 import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
+import { MessageVariants } from "./MessageVariantContext";
 
 export type AIChat = {
   id: string;
+  variant: MessageVariants;
   content: React.ReactElement;
 };
 
@@ -12,7 +14,7 @@ type PushAIChat = (chat: PartialIDChat) => void;
 type PopAIChat = (id?: string) => void;
 
 export type UseAIChatLogger = (...initialChats: PartialIDChat[]) => {
-  chats: AIChat[];
+  aiChats: AIChat[];
   push: PushAIChat;
   pop: PopAIChat;
   clear: () => void;
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 8ebf1d4168..28d902432c 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -1,13 +1,7 @@
 import * as React from "react";
 
-import { Avatar } from "@twilio-paste/avatar";
-import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
-import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
-import { useUID } from "@twilio-paste/uid-library";
-
-import { Text } from "@twilio-paste/text";
 
 import {
   AIChatLog,
@@ -28,7 +22,7 @@ export default {
 export const StandardUsage = (): React.ReactNode => {
   return (
     <AIChatLog>
-      <AIChatMessage>
+      <AIChatMessage variant="user">
         <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
         <AIChatMessageBody variant="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
@@ -36,10 +30,8 @@ export const StandardUsage = (): React.ReactNode => {
           impedit repellat assumenda.
         </AIChatMessageBody>
       </AIChatMessage>
-      <AIChatMessage>
-        <AIChatMessageAuthor aria-label="AI said" bot>
-          Good Bot
-        </AIChatMessageAuthor>
+      <AIChatMessage variant="bot">
+        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
         <AIChatMessageBody variant="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
@@ -62,7 +54,7 @@ export const StandardUsage = (): React.ReactNode => {
           <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
         </AIChatMessageMeta>
       </AIChatMessage>
-      <AIChatMessage>
+      <AIChatMessage variant="user">
         <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
         <AIChatMessageBody>
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
@@ -70,7 +62,7 @@ export const StandardUsage = (): React.ReactNode => {
           impedit repellat assumenda.
         </AIChatMessageBody>
       </AIChatMessage>
-      <AIChatMessage>
+      <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said" bot>
           Good Bot
         </AIChatMessageAuthor>
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx
deleted file mode 100644
index 6b9a331d81..0000000000
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx
+++ /dev/null
@@ -1,167 +0,0 @@
-import type { StoryFn } from "@storybook/react";
-import { Box } from "@twilio-paste/box";
-import { Button } from "@twilio-paste/button";
-import { Input } from "@twilio-paste/input";
-import { Label } from "@twilio-paste/label";
-import { ListItem, OrderedList } from "@twilio-paste/list";
-import { RadioButton, RadioButtonGroup } from "@twilio-paste/radio-button-group";
-import { Stack } from "@twilio-paste/stack";
-import { useUID } from "@twilio-paste/uid-library";
-import * as React from "react";
-
-
-
-import { Avatar } from "@twilio-paste/avatar";
-import { ButtonGroup } from "@twilio-paste/button-group";
-import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
-
-
-import {
-  AIChatLog
-  AIChatLoggergerger,
-  AIChatMessage,
-  AIChatMessageBody,
-  AIChatMessageFeedback,
-  AIChatMessageLoading,
-  AIChatMessageMeta,
-  useAIChatLogger
-} from "../src";
-
-
-// eslint-disable-next-line import/no-default-export
-export default {
-  title: "Components/AI Chat Log/useAIChatLogger",
-};
-
-
-
-
-
-
-export const UseChatLogger: StoryFn = () => {
-  const pushID = useUID();
-  const popID = useUID();
-  const messageID = useUID();
-  const variantId = useUID();
-
-  const { chats, push, pop, clear } = useAIChatLogger(
-    {
-      content: (
-        <AIChatMessage>
-          <AIChatMessageBody>Hi my name is Jane Doe how can I help you?</AIChatMessageBody>
-        </AIChatMessage>
-      ),
-    },
-    {
-      content: (
-        <AIChatMessage>
-          <AIChatMessageBody>I need some help with the Twilio API</AIChatMessageBody>
-        </AIChatMessage>
-      ),
-    },
-    {
-      content: (
-        <AIChatMessage>
-          <AIChatMessageBody>Of course! Can you provide more detail?</AIChatMessageBody>
-        </AIChatMessage>
-      ),
-    },
-  );
-  console.log(chats, push, pop);
-
-  const handlePushSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
-    e.preventDefault();
-    const form = e.currentTarget;
-    const data = new FormData(form);
-    const message = data.get("message");
-    const variant = (data.get("variant") || "inbound") as MessageVariants;
-    const id = data.get("id");
-
-    const chat: PartialIDChat = {
-      variant,
-      content: (
-        <AIChatMessage variant={variant}>
-          <AIChatMessageBody>{message}</AIChatMessageBody>
-        </AIChatMessage>
-      ),
-    };
-
-    if (id) {
-      chat.id = id?.toString();
-    }
-
-    push(chat);
-    form.reset();
-  };
-
-  const handlePopSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
-    e.preventDefault();
-    const form = e.currentTarget;
-    const data = new FormData(form);
-    const id = data.get("id")?.toString();
-
-    pop(id);
-    form.reset();
-  };
-
-  return (
-    <Stack orientation="vertical" spacing="space80">
-      <Box display="flex" columnGap="space80" alignItems="flex-start">
-        <form onSubmit={handlePushSubmit}>
-          <Stack orientation="vertical" spacing="space40">
-            <legend>Push</legend>
-            <div>
-              <Label required htmlFor={messageID}>
-                Message
-              </Label>
-              <Input required name="message" id={messageID} type="text" />
-            </div>
-            <div>
-              <Label htmlFor={pushID}>Push ID</Label>
-              <Input name="id" id={pushID} type="text" />
-            </div>
-            <RadioButtonGroup required id={variantId} attached name="variant" legend="variant">
-              <RadioButton value="inbound">inbound</RadioButton>
-              <RadioButton value="outbound">outbound</RadioButton>
-            </RadioButtonGroup>
-            <Button type="submit" variant="secondary">
-              Submit Push
-            </Button>
-          </Stack>
-        </form>
-        <form onSubmit={handlePopSubmit}>
-          <Stack orientation="vertical" spacing="space40">
-            <legend>Pop</legend>
-            <div>
-              <Label htmlFor={popID}>Pop ID</Label>
-              <Input name="id" id={popID} type="text" />
-            </div>
-            <Button type="submit" variant="secondary">
-              Submit Pop
-            </Button>
-          </Stack>
-        </form>
-        <Stack orientation="vertical" spacing="space40">
-          <legend>Clear</legend>
-          <Button type="submit" variant="secondary" onClick={clear}>
-            Clear All History
-          </Button>
-        </Stack>
-        <OrderedList aria-label="ordered list">
-          {chats.map(({ id }) => (
-            <ListItem key={id}>
-              <code>{id}</code>
-            </ListItem>
-          ))}
-        </OrderedList>
-      </Box>
-      <AIChatLogger chats={chats} />
-    </Stack>
-  );
-};
-UseChatLogger.parameters = {
-  a11y: {
-    // no need to a11y check composition of a11y checked components
-    disable: true,
-  },
-};

From 8437c066243f1a322c71a8515b059e693baaa82c Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 11:45:10 -0500
Subject: [PATCH 06/55] feat: message typewriter component

---
 .../src/AIChatMessageBodyTypeWriter.tsx       | 117 ++++++++++
 .../ai-chat-log/stories/parts.stories.tsx     |  12 ++
 .../stories/useAIChatLogger.stories.tsx       | 204 ++++++++++++++++++
 3 files changed, 333 insertions(+)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
new file mode 100644
index 0000000000..0311f086dc
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
@@ -0,0 +1,117 @@
+import { animated } from "@twilio-paste/animation-library";
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import type { ThemeShape } from "@twilio-paste/theme";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import { set } from "lodash";
+import * as React from "react";
+import { text } from "stream/consumers";
+
+const Variants = {
+  default: {
+    fontSize: "fontSize30" as ThemeShape["fontSizes"],
+    lineHeight: "lineHeight30" as ThemeShape["lineHeights"],
+  },
+  fullScreen: {
+    fontSize: "fontSize40" as ThemeShape["fontSizes"],
+    lineHeight: "lineHeight40" as ThemeShape["lineHeights"],
+  },
+};
+
+export interface AIChatMessageBodyTypeWriterProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatBubbleProps
+   */
+  element?: BoxElementProps["element"];
+  /**
+   * Override the font size for full screen experiences.
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {"default" | "fullScreen"}
+   * @memberof AIChatBubbleProps
+   */
+  variant?: "default" | "fullScreen";
+  /**
+   * Whether the text should be animated with type writer effect
+   *
+   * @default false
+   * @type {boolean}
+   * @memberof AIChatMessageBodyTypeWriterProps
+   */
+  animated?: boolean;
+}
+
+export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AIChatMessageBodyTypeWriterProps>(
+  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY", animated, ...props }, ref) => {
+    const [animatedText, setAnimatedText] = React.useState("");
+    const [textOfChild, setTextOfChild] = React.useState("");
+
+    const findNestedElementText = (children: React.ReactNode): string => {
+      let text = "";
+
+      React.Children.forEach(children, (child) => {
+        if (typeof child === "string") {
+          text += child;
+        } else if (React.isValidElement(child)) {
+          text += findNestedElementText(child.props.children);
+        }
+      });
+
+      return text;
+    };
+
+    React.useEffect(() => {
+      let text=  "";
+      React.Children.forEach(children, (child) => {
+        if (typeof child === "string") {
+          text += child;
+        } else if (React.isValidElement(child)) {
+          text += findNestedElementText(child.props.children);
+        }
+      });
+
+      setTextOfChild(text);
+
+    }, []);
+
+    React.useEffect(() => {
+      let interval: NodeJS.Timeout;
+
+      if (animated) {
+        interval = setInterval(() => {
+          if (textOfChild.length > animatedText.length) {
+            setAnimatedText((prevText) => prevText + textOfChild[prevText.length]);
+          } else {
+            clearInterval(interval);
+          }
+        }, 25);
+      }
+
+      return () => clearInterval(interval);
+    }, [textOfChild, animatedText, animated]);
+
+    return (
+      <Box
+        {...safelySpreadBoxProps(props)}
+        {...Variants[variant]}
+        display="inline-block"
+        color="colorText"
+        wordWrap="break-word"
+        maxWidth="100%"
+        minWidth={0}
+        element={element}
+        ref={ref}
+        whiteSpace="pre-wrap"
+      >
+        {animated ? animatedText : children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageBodyTypeWriter.displayName = "AIChatMessageBodyTypeWriter";
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index 8ed5adbe19..3b5953d741 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -18,6 +18,7 @@ import {
   AIChatMessageLoading,
   AIChatMessageMeta,
 } from "../src";
+import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
 
 // eslint-disable-next-line import/no-default-export
 export default {
@@ -106,3 +107,14 @@ export const FeedbackCustomLabels = (): React.ReactNode => {
   );
   /* eslint-enable no-alert */
 };
+
+export const MessageBodyTypeWriter = (): React.ReactNode => {
+  return (
+    <AIChatMessageBodyTypeWriter animated={true}>
+      <span style={{ fontWeight: 600 }}>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</span> Deserunt
+      delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex
+      fugiat quisquam itaque, earum sit <a href="https://google.com">nesciunt impedit repellat assumenda.</a>
+    </AIChatMessageBodyTypeWriter>
+  );
+};
+LoadingStopLoading.storyName = "Message Body Type Writer";
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
new file mode 100644
index 0000000000..630e114b5f
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -0,0 +1,204 @@
+import type { StoryFn } from "@storybook/react";
+import { Box } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { Input } from "@twilio-paste/input";
+import { Label } from "@twilio-paste/label";
+import { ListItem, OrderedList } from "@twilio-paste/list";
+import { RadioButton, RadioButtonGroup } from "@twilio-paste/radio-button-group";
+import { Stack } from "@twilio-paste/stack";
+import { uid, useUID } from "@twilio-paste/uid-library";
+import * as React from "react";
+
+import {
+  AIChatLogger,
+  AIChatMessage,
+  AIChatMessageAuthor,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+  MessageVariants,
+  PartialIdChatAI,
+  useAIChatLogger,
+} from "../src";
+import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Chat Log/useAIChatLogger",
+};
+
+export const UseChatLogger: StoryFn = () => {
+  const pushID = useUID();
+  const popID = useUID();
+  const messageID = useUID();
+  const variantId = useUID();
+
+  const { aiChats, push, pop, clear } = useAIChatLogger(
+    {
+      variant: "user",
+      content: (
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    },
+    {
+      variant: "bot",
+      content: (
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt
+            delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex
+            fugiat quisquam itaque, earum sit nesciunt impedit repellat assumenda.
+          </AIChatMessageBody>
+          <AIChatMessageMeta aria-label="Quick actions available:">
+            <ButtonGroup>
+              <Button variant="secondary" onClick={() => {}} size="small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="small">
+                30009
+              </Button>
+            </ButtonGroup>
+          </AIChatMessageMeta>
+          <AIChatMessageMeta aria-label="Feedback form">
+            <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
+          </AIChatMessageMeta>{" "}
+        </AIChatMessage>
+      ),
+    },
+  );
+
+  const handlePushSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
+    e.preventDefault();
+    const form = e.currentTarget;
+    const data = new FormData(form);
+    const message = data.get("message") as string;
+    const variant = (data.get("variant") || "ai") as MessageVariants;
+    const id = data.get("id");
+    const isBot = variant === "bot";
+
+    const chat: PartialIdChatAI = {
+      variant,
+      content: (
+        <AIChatMessage variant={variant}>
+          <AIChatMessageAuthor aria-label={isBot ? "AI said" : "You said"}>
+            {isBot ? "Good Bot" : "Gibby Radki"}
+          </AIChatMessageAuthor>
+          <AIChatMessageBodyTypeWriter text={message}>{message}</AIChatMessageBodyTypeWriter>
+        </AIChatMessage>
+      ),
+    };
+
+    if (id || isBot) {
+      chat.id = id?.toString() || uid(chat.content);
+    }
+
+    if (isBot) {
+      push({
+        id: uid(chat.content),
+        variant,
+        content: (
+          <AIChatMessage variant="bot">
+            <AIChatMessageAuthor aria-label="AI said" bot>
+              Good Bot
+            </AIChatMessageAuthor>
+            <AIChatMessageBody>
+              <AIChatMessageLoading />
+            </AIChatMessageBody>
+          </AIChatMessage>
+        ),
+      });
+      setTimeout(() => {
+        pop(chat.id);
+        push(chat);
+      }, 1000);
+    } else {
+      push(chat);
+    }
+
+    form.reset();
+  };
+
+  const handlePopSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
+    e.preventDefault();
+    const form = e.currentTarget;
+    const data = new FormData(form);
+    const id = data.get("id")?.toString();
+
+    pop(id);
+    form.reset();
+  };
+
+  return (
+    <Stack orientation="vertical" spacing="space80">
+      <Box display="flex" columnGap="space80" alignItems="flex-start">
+        <form onSubmit={handlePushSubmit}>
+          <Stack orientation="vertical" spacing="space40">
+            <legend>Push</legend>
+            <div>
+              <Label required htmlFor={messageID}>
+                Message
+              </Label>
+              <Input required name="message" id={messageID} type="text" />
+            </div>
+            <div>
+              <Label htmlFor={pushID}>Push ID</Label>
+              <Input name="id" id={pushID} type="text" />
+            </div>
+            <RadioButtonGroup required id={variantId} attached name="variant" legend="variant">
+              <RadioButton value="bot">bot</RadioButton>
+              <RadioButton value="user">user</RadioButton>
+            </RadioButtonGroup>
+            <Button type="submit" variant="secondary">
+              Submit Push
+            </Button>
+          </Stack>
+        </form>
+        <form onSubmit={handlePopSubmit}>
+          <Stack orientation="vertical" spacing="space40">
+            <legend>Pop</legend>
+            <div>
+              <Label htmlFor={popID}>Pop ID</Label>
+              <Input name="id" id={popID} type="text" />
+            </div>
+            <Button type="submit" variant="secondary">
+              Submit Pop
+            </Button>
+          </Stack>
+        </form>
+        <Stack orientation="vertical" spacing="space40">
+          <legend>Clear</legend>
+          <Button type="submit" variant="secondary" onClick={clear}>
+            Clear All History
+          </Button>
+        </Stack>
+        <OrderedList aria-label="ordered list">
+          {aiChats.map(({ id }) => (
+            <ListItem key={id}>
+              <code>{id}</code>
+            </ListItem>
+          ))}
+        </OrderedList>
+      </Box>
+      <AIChatLogger AIs={aiChats} />
+    </Stack>
+  );
+};
+UseChatLogger.parameters = {
+  a11y: {
+    // no need to a11y check composition of a11y checked components
+    disable: true,
+  },
+};

From b35952fed60d3175a2bfe5085e8efa32eb0cd5fd Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 13:07:17 -0500
Subject: [PATCH 07/55] chore: working typewriter

---
 .../ai-chat-log/__tests__/index.spec.tsx      |  14 +-
 .../src/AIChatMessageBodyTypeWriter.tsx       | 140 ++++++++++++++----
 .../components/ai-chat-log/src/index.tsx      |   2 +
 .../ai-chat-log/stories/index.stories.tsx     |   3 +-
 .../ai-chat-log/stories/parts.stories.tsx     |  51 ++++---
 .../stories/useAIChatLogger.stories.tsx       |   8 +-
 6 files changed, 159 insertions(+), 59 deletions(-)

diff --git a/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
index 3383edf6bd..213832ca50 100644
--- a/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
+++ b/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
@@ -1,11 +1,11 @@
-import * as React from 'react';
-import {render} from '@testing-library/react';
+import { render } from "@testing-library/react";
+import * as React from "react";
 
-import {AiLog} from '../src';
+import { AIChatLog } from "../src";
 
-describe('AiLog', () => {
-  it('should render', () => {
-    const {getByText} = render(<AiLog>test</AiLog>);
-    expect(getByText('test')).toBeDefined();
+describe("AiLog", () => {
+  it("should render", () => {
+    const { getByText } = render(<AIChatLog>test</AIChatLog>);
+    expect(getByText("test")).toBeDefined();
   });
 });
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
index 0311f086dc..4bebf1c9d3 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
@@ -1,11 +1,9 @@
-import { animated } from "@twilio-paste/animation-library";
 import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { ThemeShape } from "@twilio-paste/theme";
 import type { HTMLPasteProps } from "@twilio-paste/types";
-import { set } from "lodash";
 import * as React from "react";
-import { text } from "stream/consumers";
+import { uid } from "react-uid";
 
 const Variants = {
   default: {
@@ -23,23 +21,23 @@ export interface AIChatMessageBodyTypeWriterProps extends HTMLPasteProps<"div">
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_BUBBLE"
+   * @default "AI_CHAT_MESSAGE_BODY_TYPE_WRITER"
    * @type {BoxProps["element"]}
-   * @memberof AIChatBubbleProps
+   * @memberof AIChatMessageBodyTypeWriterProps
    */
   element?: BoxElementProps["element"];
   /**
    * Override the font size for full screen experiences.
    *
-   * @default "CHAT_BUBBLE"
+   * @default "default"
    * @type {"default" | "fullScreen"}
-   * @memberof AIChatBubbleProps
+   * @memberof AIChatMessageBodyTypeWriterProps
    */
   variant?: "default" | "fullScreen";
   /**
    * Whether the text should be animated with type writer effect
    *
-   * @default false
+   * @default true
    * @type {boolean}
    * @memberof AIChatMessageBodyTypeWriterProps
    */
@@ -47,9 +45,28 @@ export interface AIChatMessageBodyTypeWriterProps extends HTMLPasteProps<"div">
 }
 
 export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AIChatMessageBodyTypeWriterProps>(
-  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY", animated, ...props }, ref) => {
-    const [animatedText, setAnimatedText] = React.useState("");
-    const [textOfChild, setTextOfChild] = React.useState("");
+  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY_TYPE_WRITER", animated = true, ...props }, ref) => {
+    const [textLessChildren, setTextLessChildren] = React.useState<React.ReactNode[]>([]);
+    const [animatedChildren, setAnimatedChildren] = React.useState<React.ReactNode[]>([]);
+    const [childrenText, setChildrenText] = React.useState<string[]>([]);
+
+    // Initially split all children from text and elements
+    React.useEffect(() => {
+      if (textLessChildren.length === 0 && childrenText.length === 0 && animated) {
+        React.Children.forEach(children, (child) => {
+          // Strings dn onot neet to copy props
+          if (typeof child === "string") {
+            setChildrenText((prevState) => [...prevState, child]);
+            setTextLessChildren((prevState) => [...prevState, ""]);
+          } else if (React.isValidElement(child)) {
+            setChildrenText((prevState) => [...prevState, findNestedElementText(child.props.children)]);
+            const { children, ...rest } = child.props;
+            // by using {...rest} we take all props except children (the text inside the element )
+            setTextLessChildren((prevState) => [...prevState, <child.type {...rest} />]);
+          }
+        });
+      }
+    }, []);
 
     const findNestedElementText = (children: React.ReactNode): string => {
       let text = "";
@@ -58,6 +75,7 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
         if (typeof child === "string") {
           text += child;
         } else if (React.isValidElement(child)) {
+          // Recursively find text in nested elements
           text += findNestedElementText(child.props.children);
         }
       });
@@ -65,35 +83,95 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
       return text;
     };
 
-    React.useEffect(() => {
-      let text=  "";
-      React.Children.forEach(children, (child) => {
-        if (typeof child === "string") {
-          text += child;
-        } else if (React.isValidElement(child)) {
-          text += findNestedElementText(child.props.children);
-        }
-      });
+    const handleAnimationChangeForChild = (index: number) => {
+      const animationChild = animatedChildren[index];
+      const textForChild = childrenText[index];
 
-      setTextOfChild(text);
+      let currentText = "";
 
-    }, []);
+      if (React.isValidElement(animationChild)) {
+        currentText += findNestedElementText(animationChild.props.children);
+        setAnimatedChildren((prev) =>
+          prev.map((el, i) => {
+            if (i === index) {
+              return (
+                <animationChild.type {...animationChild.props}>
+                  {findNestedElementText(animationChild.props.children) + textForChild[currentText.length]}
+                </animationChild.type>
+              );
+            }
+            return el;
+          }),
+        );
+      } else {
+        currentText += animationChild;
+        setAnimatedChildren((prev) =>
+          prev.map((el, i) => {
+            if (i === index) {
+              return currentText + textForChild[currentText.length];
+            }
+            return el;
+          }),
+        );
+      }
+    };
+
+    const handleAddNewAnimatedElWithFirstChar = (index: number) => {
+      const textForChild = childrenText[index];
+      const child = React.Children.toArray(children)[index];
+
+      if (React.isValidElement(child)) {
+        setAnimatedChildren((prevState) => [...prevState, <child.type {...child.props}>{textForChild[0]}</child.type>]);
+      } else {
+        setAnimatedChildren((prevState) => [...prevState, textForChild[0]]);
+      }
+    };
 
     React.useEffect(() => {
       let interval: NodeJS.Timeout;
 
       if (animated) {
         interval = setInterval(() => {
-          if (textOfChild.length > animatedText.length) {
-            setAnimatedText((prevText) => prevText + textOfChild[prevText.length]);
-          } else {
-            clearInterval(interval);
+          if (textLessChildren.length > 0 && childrenText.length > 0) {
+            if (animatedChildren.length === 0) {
+              handleAddNewAnimatedElWithFirstChar(0);
+            } else {
+              /**
+               * Find the index of an element in the animated children array where the text content does not
+               * match the text length passed in
+               */
+              const indexOfElementToUpdate = animatedChildren.findIndex((child, i) => {
+                let currentText = "";
+
+                if (React.isValidElement(child)) {
+                  currentText += findNestedElementText(child.props.children);
+                } else {
+                  currentText += child;
+                }
+                if (currentText.length < childrenText[i].length) {
+                  return true;
+                }
+                return false;
+              });
+
+              if (indexOfElementToUpdate >= 0) {
+                handleAnimationChangeForChild(indexOfElementToUpdate);
+              }
+              // If text content matches another check is needed to add the next element that is missing
+              if (indexOfElementToUpdate === -1 && animatedChildren.length < textLessChildren.length) {
+                handleAddNewAnimatedElWithFirstChar(animatedChildren.length);
+              }
+              // If no element is missing and all text is the stop the interval
+              else {
+                clearInterval(interval);
+              }
+            }
           }
         }, 25);
       }
 
       return () => clearInterval(interval);
-    }, [textOfChild, animatedText, animated]);
+    }, [textLessChildren, childrenText, animatedChildren]);
 
     return (
       <Box
@@ -108,7 +186,13 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
         ref={ref}
         whiteSpace="pre-wrap"
       >
-        {animated ? animatedText : children}
+        {animated
+          ? animatedChildren.map((el, idx) => (
+              <Box as="span" key={uid(idx)}>
+                {el}
+              </Box>
+            ))
+          : children}
       </Box>
     );
   },
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 317c3cf0f4..0d551188f5 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -4,6 +4,8 @@ export { AIChatMessageMeta } from "./AIChatMessageMeta";
 export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
 export { AIChatMessageBody } from "./AIChatMessageBody";
 export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
+export { AIChatMessageBodyTypeWriter } from "./AIChatMessageBodyTypeWriter";
+export type { AIChatMessageBodyTypeWriterProps } from "./AIChatMessageBodyTypeWriter";
 export { AIChatMessageAuthor } from "./AIChatMessageAuthor";
 export type { AIChatMessageAuthorProps } from "./AIChatMessageAuthor";
 export { AIChatMessageFeedback } from "./AIChatMessageFeedback";
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 28d902432c..84cb5c6a91 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -1,7 +1,6 @@
-import * as React from "react";
-
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
+import * as React from "react";
 
 import {
   AIChatLog,
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index 3b5953d741..10640140be 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -1,24 +1,18 @@
-import * as React from "react";
-
-import { Avatar } from "@twilio-paste/avatar";
+import { Anchor } from "@twilio-paste/anchor";
 import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
-import { ButtonGroup } from "@twilio-paste/button-group";
-import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { Heading } from "@twilio-paste/heading";
 import { InlineCode } from "@twilio-paste/inline-code";
-import { useUID } from "@twilio-paste/uid-library";
-
-import { Text } from "@twilio-paste/text";
+import * as React from "react";
 
 import {
   AIChatLog,
-  AIChatMessage,
   AIChatMessageBody,
+  AIChatMessageBodyTypeWriter,
   AIChatMessageFeedback,
   AIChatMessageLoading,
   AIChatMessageMeta,
 } from "../src";
-import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
 
 // eslint-disable-next-line import/no-default-export
 export default {
@@ -30,10 +24,10 @@ export const MessageBody = (): React.ReactNode => {
   return (
     <AIChatLog>
       <AIChatMessageBody variant="default">
-        Use <InlineCode>variant="default"</InlineCode> when the AI Chat Log is inside a small container.
+        Use <InlineCode>variant=&quot;default&quot;</InlineCode> when the AI Chat Log is inside a small container.
       </AIChatMessageBody>
       <AIChatMessageBody variant="fullScreen">
-        Use <InlineCode>variant="fullScreen"</InlineCode> when the AI Chat Log is a full screen experience.
+        Use <InlineCode>variant=&quot;fullScreen&quot;</InlineCode> when the AI Chat Log is a full screen experience.
       </AIChatMessageBody>
     </AIChatLog>
   );
@@ -110,11 +104,32 @@ export const FeedbackCustomLabels = (): React.ReactNode => {
 
 export const MessageBodyTypeWriter = (): React.ReactNode => {
   return (
-    <AIChatMessageBodyTypeWriter animated={true}>
-      <span style={{ fontWeight: 600 }}>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</span> Deserunt
-      delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex
-      fugiat quisquam itaque, earum sit <a href="https://google.com">nesciunt impedit repellat assumenda.</a>
-    </AIChatMessageBodyTypeWriter>
+    <Box>
+      <Heading as="h2" variant="heading20">
+        With enriched text
+      </Heading>
+      <Box marginBottom="space60">
+        <AIChatMessageBodyTypeWriter animated={true}>
+          <span style={{ fontWeight: 600 }}>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</span> Deserunt
+          delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat
+          quisquam itaque, earum sit <a href="https://google.com">nesciunt impedit repellat assumenda.</a> new text,{" "}
+          <Anchor showExternal href="https://google.com">
+            434324
+          </Anchor>
+          <Button variant="secondary">30007</Button>
+        </AIChatMessageBodyTypeWriter>
+      </Box>
+      <Heading as="h2" variant="heading20">
+        Without enriched text:
+      </Heading>
+
+      <Box>
+        <AIChatMessageBodyTypeWriter animated={true}>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendiiure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
+        </AIChatMessageBodyTypeWriter>
+      </Box>
+    </Box>
   );
 };
-LoadingStopLoading.storyName = "Message Body Type Writer";
+MessageBodyTypeWriter.storyName = "Message Body Type Writer";
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index 630e114b5f..28969c6e07 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -55,9 +55,9 @@ export const UseChatLogger: StoryFn = () => {
         <AIChatMessage variant="bot">
           <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
           <AIChatMessageBody>
-            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt
-            delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex
-            fugiat quisquam itaque, earum sit nesciunt impedit repellat assumenda.
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus
+            eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
+            nesciunt impedit repellat assumenda.
           </AIChatMessageBody>
           <AIChatMessageMeta aria-label="Quick actions available:">
             <ButtonGroup>
@@ -96,7 +96,7 @@ export const UseChatLogger: StoryFn = () => {
           <AIChatMessageAuthor aria-label={isBot ? "AI said" : "You said"}>
             {isBot ? "Good Bot" : "Gibby Radki"}
           </AIChatMessageAuthor>
-          <AIChatMessageBodyTypeWriter text={message}>{message}</AIChatMessageBodyTypeWriter>
+          <AIChatMessageBodyTypeWriter>{message}</AIChatMessageBodyTypeWriter>
         </AIChatMessage>
       ),
     };

From 6fe0f56124be9268783b76c7260ea93a9520fe8d Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 13:45:05 -0500
Subject: [PATCH 08/55] chore: name cleanup and JSDoc

---
 .../components/ai-chat-log/src/AIChatLog.tsx    |  2 +-
 .../components/ai-chat-log/src/AIChatLogger.tsx | 14 +++++++-------
 .../ai-chat-log/src/AIChatMessage.tsx           | 17 +++++++++--------
 .../ai-chat-log/src/AIChatMessageAuthor.tsx     |  4 ++--
 .../ai-chat-log/src/AIChatMessageBody.tsx       |  8 ++++----
 .../ai-chat-log/src/AIChatMessageFeedback.tsx   |  4 ++--
 .../ai-chat-log/src/AIChatMessageLoading.tsx    |  4 ++--
 .../ai-chat-log/src/AIChatMessageMeta.tsx       |  2 +-
 .../ai-chat-log/src/AIMessageVariantContext.tsx |  4 ++++
 .../ai-chat-log/src/MessageVariantContext.tsx   |  4 ----
 .../components/ai-chat-log/src/index.tsx        |  4 ++--
 .../ai-chat-log/src/useAIChatLogger.tsx         | 12 ++++++------
 .../ai-chat-log/stories/parts.stories.tsx       |  4 ++--
 .../stories/useAIChatLogger.stories.tsx         | 10 +++++-----
 14 files changed, 47 insertions(+), 46 deletions(-)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
index baf90b4e59..c1db631fc2 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
@@ -7,7 +7,7 @@ export interface AIChatLogProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
-   * @default '{constantCase component-name}'
+   * @default 'AI_CHAT_LOG'
    * @type {BoxProps['element']}
    * @memberof AIChatLogProps
    */
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
index 6f763de617..723a6e4791 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
@@ -13,11 +13,11 @@ export interface AIChatLoggerProps extends HTMLPasteProps<"div"> {
   /**
    * Array of AIs in the log. Use with useAIChatLogger()
    *
-   * @default 'AI_ATTACHMENT'
-   * @type {BoxProps['element']}
-   * @memberof AIAttachmentProps
+   * @default null
+   * @type {AIChat[]}
+   * @memberof AIChatLoggerProps
    */
-  AIs: AIChat[];
+  aiChats: AIChat[];
   children?: never;
 }
 
@@ -27,8 +27,8 @@ const buildTransitionX = (AIChat: AIChat): number => {
   return 0;
 };
 
-export const AIChatLogger = React.forwardRef<HTMLDivElement, AIChatLoggerProps>(({ AIs, ...props }, ref) => {
-  const transitions = useTransition(AIs, {
+export const AIChatLogger = React.forwardRef<HTMLDivElement, AIChatLoggerProps>(({ aiChats, ...props }, ref) => {
+  const transitions = useTransition(aiChats, {
     keys: (AIChat: AIChat) => AIChat.id,
     from: (AIChat: AIChat): StyleProps => ({ opacity: 0, x: buildTransitionX(AIChat) }),
     enter: { opacity: 1, x: 0 },
@@ -41,7 +41,7 @@ export const AIChatLogger = React.forwardRef<HTMLDivElement, AIChatLoggerProps>(
   });
 
   const animatedAIs = useReducedMotion()
-    ? AIs.map((AIChat) => React.cloneElement(AIChat.content, { key: AIChat.id }))
+    ? aiChats.map((AIChat) => React.cloneElement(AIChat.content, { key: AIChat.id }))
     : transitions((styles: StyleProps, AIChat: AIChat, { key }: { key: string }) => (
         <AnimatedAI as="div" style={styles} key={key}>
           {AIChat.content}
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index b22978a3ba..4c5cac61e5 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -2,31 +2,32 @@ import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
-import { MessageVariantContext, MessageVariants } from "./MessageVariantContext";
+import { AIMessageVariantContext, AIMessageVariants } from "./AIMessageVariantContext";
 
 export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_MESSAGE"
+   * @default "AI_CHAT_MESSAGE"
    * @type {BoxProps["element"]}
-   * @memberof ChatMessageProps
+   * @memberof AIChatMessageProps
    */
   element?: BoxElementProps["element"];
   /**
+   * The variant of the message to distiguish between user and bot messages
    *
    * @default null
-   * @type {MessageVariants}
-   * @memberof ChatMessageProps
+   * @type {AIMessageVariants}
+   * @memberof AIChatMessageProps
    */
-  variant: MessageVariants;
+  variant: AIMessageVariants;
 }
 
 export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
   ({ children, element = "AI_CHAT_MESSAGE", variant, ...props }, ref) => {
     return (
-      <MessageVariantContext.Provider value={variant}>
+      <AIMessageVariantContext.Provider value={variant}>
         <Box
           role="listitem"
           display="flex"
@@ -38,7 +39,7 @@ export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps
         >
           {children}
         </Box>
-      </MessageVariantContext.Provider>
+      </AIMessageVariantContext.Provider>
     );
   },
 );
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
index 72fe6722b4..fb3fc3df5d 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -4,7 +4,7 @@ import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIn
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 import { AIChatMessageMeta } from "./AIChatMessageMeta";
-import { MessageVariantContext } from "./MessageVariantContext";
+import { AIMessageVariantContext } from "./AIMessageVariantContext";
 
 export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
   /**
@@ -41,7 +41,7 @@ export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
 
 export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
   ({ children, bot = false, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
-    const messageVariant = React.useContext(MessageVariantContext);
+    const messageVariant = React.useContext(AIMessageVariantContext);
 
     return (
       <AIChatMessageMeta {...props} ref={ref} aria-label={props["aria-label"]} element={element}>
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
index 1ed4a4244f..cd826d1cf1 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
@@ -20,17 +20,17 @@ export interface AIChatMessageBodyProps extends HTMLPasteProps<"div"> {
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_BUBBLE"
+   * @default "AI_CHAT_MESSAGE_BODY"
    * @type {BoxProps["element"]}
-   * @memberof AIChatBubbleProps
+   * @memberof AIChatMessageBodyProps
    */
   element?: BoxElementProps["element"];
   /**
    * Override the font size for full screen experiences.
    *
-   * @default "CHAT_BUBBLE"
+   * @default "default"
    * @type {"default" | "fullScreen"}
-   * @memberof AIChatBubbleProps
+   * @memberof AIChatMessageBodyProps
    */
   variant?: "default" | "fullScreen";
 }
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
index 035406ce6a..90cecd703e 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
@@ -11,9 +11,9 @@ export interface AIChatMessageFeedbackProps extends HTMLPasteProps<"div"> {
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_MESSAGE_META_ITEM"
+   * @default "AI_CHAT_MESSAGE_FEEDBACK"
    * @type {BoxProps["element"]}
-   * @memberof AIChatMessageMetaItemProps
+   * @memberof AIChatMessageFeedbackProps
    */
   element?: BoxElementProps["element"];
   label?: string;
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
index 67d468ae9e..6758a04436 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
@@ -15,9 +15,9 @@ export interface AIChatMessageLoadingProps extends HTMLPasteProps<"div"> {
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_MESSAGE"
+   * @default "AI_CHAT_MESSAGE_LOADING"
    * @type {BoxProps["element"]}
-   * @memberof ChatMessageProps
+   * @memberof AIChatMessageLoadingProps
    */
   element?: BoxElementProps["element"];
   onStopLoading?: () => void;
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
index 188a865be7..714357a84a 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
@@ -15,7 +15,7 @@ export interface AIChatMessageMetaProps extends HTMLPasteProps<"div"> {
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_MESSAGE_META"
+   * @default "AI_CHAT_MESSAGE_META"
    * @type {BoxProps["element"]}
    * @memberof AIChatMessageMetaProps
    */
diff --git a/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx b/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
new file mode 100644
index 0000000000..24f10cc224
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
@@ -0,0 +1,4 @@
+import * as React from "react";
+
+export type AIMessageVariants = "bot" | "user";
+export const AIMessageVariantContext = React.createContext<AIMessageVariants>("bot");
diff --git a/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx b/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
deleted file mode 100644
index 844228bc89..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-import * as React from "react";
-
-export type MessageVariants = "bot" | "user";
-export const MessageVariantContext = React.createContext<MessageVariants>("bot");
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 0d551188f5..024fb0f2b0 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -16,8 +16,8 @@ export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 export { AIChatLog } from "./AIChatLog";
 export type { AIChatLogProps } from "./AIChatLog";
 export { useAIChatLogger } from "./useAIChatLogger";
-export type { UseAIChatLogger, PartialIDChat as PartialIdChatAI } from "./useAIChatLogger";
+export type { UseAIChatLogger, AIPartialIDChat } from "./useAIChatLogger";
 export { AIChatLogger } from "./AIChatLogger";
 export type { AIChatLoggerProps } from "./AIChatLogger";
 
-export type { MessageVariants } from "./MessageVariantContext";
+export type { AIMessageVariants } from "./AIMessageVariantContext";
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index d1ab4c4e64..1ff2cf2b6a 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -1,26 +1,26 @@
 import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
-import { MessageVariants } from "./MessageVariantContext";
+import { AIMessageVariants } from "./AIMessageVariantContext";
 
 export type AIChat = {
   id: string;
-  variant: MessageVariants;
+  variant: AIMessageVariants;
   content: React.ReactElement;
 };
 
-export type PartialIDChat = Omit<AIChat, "id"> & Partial<Pick<AIChat, "id">>;
+export type AIPartialIDChat = Omit<AIChat, "id"> & Partial<Pick<AIChat, "id">>;
 
-type PushAIChat = (chat: PartialIDChat) => void;
+type PushAIChat = (chat: AIPartialIDChat) => void;
 type PopAIChat = (id?: string) => void;
 
-export type UseAIChatLogger = (...initialChats: PartialIDChat[]) => {
+export type UseAIChatLogger = (...initialChats: AIPartialIDChat[]) => {
   aiChats: AIChat[];
   push: PushAIChat;
   pop: PopAIChat;
   clear: () => void;
 };
 
-const aiChatWithId = (chat: PartialIDChat): AIChat => ({ ...chat, id: chat.id || uid(chat.content) });
+const aiChatWithId = (chat: AIPartialIDChat): AIChat => ({ ...chat, id: chat.id || uid(chat.content) });
 
 export const useAIChatLogger: UseAIChatLogger = (...initialChats) => {
   const parsedInitialChats = React.useMemo(() => initialChats.map(aiChatWithId), [initialChats]);
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index 10640140be..e84fbe392a 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -120,11 +120,11 @@ export const MessageBodyTypeWriter = (): React.ReactNode => {
         </AIChatMessageBodyTypeWriter>
       </Box>
       <Heading as="h2" variant="heading20">
-        Without enriched text:
+        Without enriched text [fullscreen variant]:
       </Heading>
 
       <Box>
-        <AIChatMessageBodyTypeWriter animated={true}>
+        <AIChatMessageBodyTypeWriter animated={true} variant="fullScreen">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendiiure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
         </AIChatMessageBodyTypeWriter>
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index 28969c6e07..fe4268b651 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -18,8 +18,8 @@ import {
   AIChatMessageFeedback,
   AIChatMessageLoading,
   AIChatMessageMeta,
-  MessageVariants,
-  PartialIdChatAI,
+  AIMessageVariants,
+  AIPartialIDChat,
   useAIChatLogger,
 } from "../src";
 import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
@@ -85,11 +85,11 @@ export const UseChatLogger: StoryFn = () => {
     const form = e.currentTarget;
     const data = new FormData(form);
     const message = data.get("message") as string;
-    const variant = (data.get("variant") || "ai") as MessageVariants;
+    const variant = (data.get("variant") || "ai") as AIMessageVariants;
     const id = data.get("id");
     const isBot = variant === "bot";
 
-    const chat: PartialIdChatAI = {
+    const chat: AIPartialIDChat = {
       variant,
       content: (
         <AIChatMessage variant={variant}>
@@ -192,7 +192,7 @@ export const UseChatLogger: StoryFn = () => {
           ))}
         </OrderedList>
       </Box>
-      <AIChatLogger AIs={aiChats} />
+      <AIChatLogger aiChats={aiChats} />
     </Stack>
   );
 };

From bb64b7310797840d2e1695148a510a9415bcc2aa Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 15:37:52 -0500
Subject: [PATCH 09/55] chore: lint updates

---
 .../components/ai-chat-log/build.js           |  4 +-
 .../components/ai-chat-log/package.json       | 12 +++++
 .../ai-chat-log/src/AIChatMessage.tsx         |  4 +-
 .../ai-chat-log/src/AIChatMessageAuthor.tsx   | 11 +----
 .../src/AIChatMessageBodyTypeWriter.tsx       | 47 ++++++++++---------
 .../ai-chat-log/src/useAIChatLogger.tsx       |  1 +
 .../ai-chat-log/stories/parts.stories.tsx     | 22 +++++++--
 .../stories/useAIChatLogger.stories.tsx       |  6 +--
 yarn.lock                                     | 12 +++++
 9 files changed, 79 insertions(+), 40 deletions(-)

diff --git a/packages/paste-core/components/ai-chat-log/build.js b/packages/paste-core/components/ai-chat-log/build.js
index a4edeab49b..27dd98f98e 100644
--- a/packages/paste-core/components/ai-chat-log/build.js
+++ b/packages/paste-core/components/ai-chat-log/build.js
@@ -1,3 +1,3 @@
-const {build} = require('../../../../tools/build/esbuild');
+const { build } = require("../../../../tools/build/esbuild");
 
-build(require('./package.json'));
+build(require("./package.json"));
diff --git a/packages/paste-core/components/ai-chat-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
index 1f34742229..c3d4346c84 100644
--- a/packages/paste-core/components/ai-chat-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -26,14 +26,20 @@
   },
   "peerDependencies": {
     "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/avatar": "^9.0.0",
     "@twilio-paste/box": "^10.2.0",
+    "@twilio-paste/button": "^14.0.0",
     "@twilio-paste/color-contrast-utils": "^5.0.0",
     "@twilio-paste/customization": "^8.1.1",
     "@twilio-paste/design-tokens": "^10.3.0",
+    "@twilio-paste/icons": "^12.0.0",
+    "@twilio-paste/screen-reader-only": "^13.0.0",
+    "@twilio-paste/skeleton-loader": "^6.1.0",
     "@twilio-paste/style-props": "^9.1.1",
     "@twilio-paste/styling-library": "^3.0.0",
     "@twilio-paste/theme": "^11.0.1",
     "@twilio-paste/types": "^6.0.0",
+    "@twilio-paste/uid-library": "^2.0.0",
     "@types/react": "^16.8.6 || ^17.0.2 || ^18.0.27",
     "@types/react-dom": "^16.8.6 || ^17.0.2 || ^18.0.10",
     "react": "^16.8.6 || ^17.0.2 || ^18.0.0",
@@ -41,14 +47,20 @@
   },
   "devDependencies": {
     "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/avatar": "^9.1.0",
     "@twilio-paste/box": "^10.2.0",
+    "@twilio-paste/button": "^14.1.0",
     "@twilio-paste/color-contrast-utils": "^5.0.0",
     "@twilio-paste/customization": "^8.1.1",
     "@twilio-paste/design-tokens": "^10.3.0",
+    "@twilio-paste/icons": "^12.2.1",
+    "@twilio-paste/screen-reader-only": "^13.1.1",
+    "@twilio-paste/skeleton-loader": "^6.1.0",
     "@twilio-paste/style-props": "^9.1.1",
     "@twilio-paste/styling-library": "^3.0.0",
     "@twilio-paste/theme": "^11.0.1",
     "@twilio-paste/types": "^6.0.0",
+    "@twilio-paste/uid-library": "^2.0.0",
     "@types/react": "^18.0.27",
     "@types/react-dom": "^18.0.10",
     "react": "^18.0.0",
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index 4c5cac61e5..612f4debf7 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -2,7 +2,9 @@ import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
-import { AIMessageVariantContext, AIMessageVariants } from "./AIMessageVariantContext";
+
+import { AIMessageVariantContext } from "./AIMessageVariantContext";
+import type { AIMessageVariants } from "./AIMessageVariantContext";
 
 export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
index fb3fc3df5d..05e522ce32 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -3,6 +3,7 @@ import type { BoxElementProps } from "@twilio-paste/box";
 import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
+
 import { AIChatMessageMeta } from "./AIChatMessageMeta";
 import { AIMessageVariantContext } from "./AIMessageVariantContext";
 
@@ -29,18 +30,10 @@ export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
    * @memberof AIChatMessageAuthorProps
    */
   "aria-label": string;
-  /**
-   * Whether the author is a bot or not
-   *
-   * @default false
-   * @type {boolean}
-   * @memberof AIChatMessageAuthorProps
-   */
-  bot?: boolean;
 }
 
 export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
-  ({ children, bot = false, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
     const messageVariant = React.useContext(AIMessageVariantContext);
 
     return (
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
index 4bebf1c9d3..e4a9f4f2e2 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
@@ -2,8 +2,8 @@ import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { ThemeShape } from "@twilio-paste/theme";
 import type { HTMLPasteProps } from "@twilio-paste/types";
+import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
-import { uid } from "react-uid";
 
 const Variants = {
   default: {
@@ -50,6 +50,21 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
     const [animatedChildren, setAnimatedChildren] = React.useState<React.ReactNode[]>([]);
     const [childrenText, setChildrenText] = React.useState<string[]>([]);
 
+    const findNestedElementText = (elementNode: React.ReactNode): string => {
+      let text = "";
+
+      React.Children.forEach(elementNode, (child) => {
+        if (typeof child === "string") {
+          text += child;
+        } else if (React.isValidElement(child)) {
+          // Recursively find text in nested elements
+          text += findNestedElementText(child.props.children);
+        }
+      });
+
+      return text;
+    };
+
     // Initially split all children from text and elements
     React.useEffect(() => {
       if (textLessChildren.length === 0 && childrenText.length === 0 && animated) {
@@ -60,30 +75,15 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
             setTextLessChildren((prevState) => [...prevState, ""]);
           } else if (React.isValidElement(child)) {
             setChildrenText((prevState) => [...prevState, findNestedElementText(child.props.children)]);
-            const { children, ...rest } = child.props;
+            const { children: elementChildren, ...rest } = child.props;
             // by using {...rest} we take all props except children (the text inside the element )
-            setTextLessChildren((prevState) => [...prevState, <child.type {...rest} />]);
+            setTextLessChildren((prevState) => [...prevState, <child.type key={rest.key} {...rest} />]);
           }
         });
       }
     }, []);
 
-    const findNestedElementText = (children: React.ReactNode): string => {
-      let text = "";
-
-      React.Children.forEach(children, (child) => {
-        if (typeof child === "string") {
-          text += child;
-        } else if (React.isValidElement(child)) {
-          // Recursively find text in nested elements
-          text += findNestedElementText(child.props.children);
-        }
-      });
-
-      return text;
-    };
-
-    const handleAnimationChangeForChild = (index: number) => {
+    const handleAnimationChangeForChild = (index: number): void => {
       const animationChild = animatedChildren[index];
       const textForChild = childrenText[index];
 
@@ -116,12 +116,17 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
       }
     };
 
-    const handleAddNewAnimatedElWithFirstChar = (index: number) => {
+    const handleAddNewAnimatedElWithFirstChar = (index: number): void => {
       const textForChild = childrenText[index];
       const child = React.Children.toArray(children)[index];
 
       if (React.isValidElement(child)) {
-        setAnimatedChildren((prevState) => [...prevState, <child.type {...child.props}>{textForChild[0]}</child.type>]);
+        setAnimatedChildren((prevState) => [
+          ...prevState,
+          <child.type key={child.props.key} {...child.props}>
+            {textForChild[0]}
+          </child.type>,
+        ]);
       } else {
         setAnimatedChildren((prevState) => [...prevState, textForChild[0]]);
       }
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index 1ff2cf2b6a..5d319afab2 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -1,5 +1,6 @@
 import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
+
 import { AIMessageVariants } from "./AIMessageVariantContext";
 
 export type AIChat = {
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index e84fbe392a..d7e3a32c55 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -1,6 +1,7 @@
 import { Anchor } from "@twilio-paste/anchor";
 import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
+import { Disclosure, DisclosureContent, DisclosureHeading } from "@twilio-paste/disclosure";
 import { Heading } from "@twilio-paste/heading";
 import { InlineCode } from "@twilio-paste/inline-code";
 import * as React from "react";
@@ -109,22 +110,37 @@ export const MessageBodyTypeWriter = (): React.ReactNode => {
         With enriched text
       </Heading>
       <Box marginBottom="space60">
-        <AIChatMessageBodyTypeWriter animated={true}>
+        <AIChatMessageBodyTypeWriter>
           <span style={{ fontWeight: 600 }}>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</span> Deserunt
           delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat
           quisquam itaque, earum sit <a href="https://google.com">nesciunt impedit repellat assumenda.</a> new text,{" "}
           <Anchor showExternal href="https://google.com">
             434324
           </Anchor>
-          <Button variant="secondary">30007</Button>
         </AIChatMessageBodyTypeWriter>
+        <br />
+        <AIChatMessageBody>
+          <Disclosure>
+            <DisclosureHeading as="h4" variant="heading40">
+              Between the World and Me by Ta-Nehisi Coates
+            </DisclosureHeading>
+            <DisclosureContent>
+              But race is the child of racism, not the father. And the process of naming “the people” has never been a
+              matter of genealogy and physiognomy so much as one of hierarchy. Difference in hue and hair is old. But
+              the belief in the preeminence of hue and hair, the notion that these factors can correctly organize a
+              society and that they signify deeper attributes, which are indelible—this is the new idea at the heart of
+              these new people who have been brought up hopelessly, tragically, deceitfully, to believe that they are
+              white.
+            </DisclosureContent>
+          </Disclosure>
+        </AIChatMessageBody>
       </Box>
       <Heading as="h2" variant="heading20">
         Without enriched text [fullscreen variant]:
       </Heading>
 
       <Box>
-        <AIChatMessageBodyTypeWriter animated={true} variant="fullScreen">
+        <AIChatMessageBodyTypeWriter variant="fullScreen">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendiiure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
         </AIChatMessageBodyTypeWriter>
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index fe4268b651..e0b9e544eb 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -96,7 +96,7 @@ export const UseChatLogger: StoryFn = () => {
           <AIChatMessageAuthor aria-label={isBot ? "AI said" : "You said"}>
             {isBot ? "Good Bot" : "Gibby Radki"}
           </AIChatMessageAuthor>
-          <AIChatMessageBodyTypeWriter>{message}</AIChatMessageBodyTypeWriter>
+          <AIChatMessageBodyTypeWriter animated={isBot}>{message}</AIChatMessageBodyTypeWriter>
         </AIChatMessage>
       ),
     };
@@ -111,9 +111,7 @@ export const UseChatLogger: StoryFn = () => {
         variant,
         content: (
           <AIChatMessage variant="bot">
-            <AIChatMessageAuthor aria-label="AI said" bot>
-              Good Bot
-            </AIChatMessageAuthor>
+            <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
             <AIChatMessageBody>
               <AIChatMessageLoading />
             </AIChatMessageBody>
diff --git a/yarn.lock b/yarn.lock
index dd1dbdf26e..66a5c8ab42 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11221,14 +11221,20 @@ __metadata:
   resolution: "@twilio-paste/ai-chat-log@workspace:packages/paste-core/components/ai-chat-log"
   dependencies:
     "@twilio-paste/animation-library": ^2.0.0
+    "@twilio-paste/avatar": ^9.1.0
     "@twilio-paste/box": ^10.2.0
+    "@twilio-paste/button": ^14.1.0
     "@twilio-paste/color-contrast-utils": ^5.0.0
     "@twilio-paste/customization": ^8.1.1
     "@twilio-paste/design-tokens": ^10.3.0
+    "@twilio-paste/icons": ^12.2.1
+    "@twilio-paste/screen-reader-only": ^13.1.1
+    "@twilio-paste/skeleton-loader": ^6.1.0
     "@twilio-paste/style-props": ^9.1.1
     "@twilio-paste/styling-library": ^3.0.0
     "@twilio-paste/theme": ^11.0.1
     "@twilio-paste/types": ^6.0.0
+    "@twilio-paste/uid-library": ^2.0.0
     "@types/react": ^18.0.27
     "@types/react-dom": ^18.0.10
     react: ^18.0.0
@@ -11237,14 +11243,20 @@ __metadata:
     typescript: ^4.9.4
   peerDependencies:
     "@twilio-paste/animation-library": ^2.0.0
+    "@twilio-paste/avatar": ^9.0.0
     "@twilio-paste/box": ^10.2.0
+    "@twilio-paste/button": ^14.0.0
     "@twilio-paste/color-contrast-utils": ^5.0.0
     "@twilio-paste/customization": ^8.1.1
     "@twilio-paste/design-tokens": ^10.3.0
+    "@twilio-paste/icons": ^12.0.0
+    "@twilio-paste/screen-reader-only": ^13.0.0
+    "@twilio-paste/skeleton-loader": ^6.1.0
     "@twilio-paste/style-props": ^9.1.1
     "@twilio-paste/styling-library": ^3.0.0
     "@twilio-paste/theme": ^11.0.1
     "@twilio-paste/types": ^6.0.0
+    "@twilio-paste/uid-library": ^2.0.0
     "@types/react": ^16.8.6 || ^17.0.2 || ^18.0.27
     "@types/react-dom": ^16.8.6 || ^17.0.2 || ^18.0.10
     react: ^16.8.6 || ^17.0.2 || ^18.0.0

From a7d924ff7f06267b11e4e482c7fa61dcb8f072ba Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 15:42:08 -0500
Subject: [PATCH 10/55] chore: chageset

---
 .changeset/eighty-seas-sit.md | 6 ++++++
 1 file changed, 6 insertions(+)
 create mode 100644 .changeset/eighty-seas-sit.md

diff --git a/.changeset/eighty-seas-sit.md b/.changeset/eighty-seas-sit.md
new file mode 100644
index 0000000000..774fd01d3f
--- /dev/null
+++ b/.changeset/eighty-seas-sit.md
@@ -0,0 +1,6 @@
+---
+"@twilio-paste/ai-chat-log": major
+"@twilio-paste/core": minor
+---
+
+[AIChatLog]: Added a new AIChatLog compoennt to the library to display interactions between AI entities

From 5ee7cf445711bbe1ca4a44228aa2d6ca00e08cb9 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 15:50:55 -0500
Subject: [PATCH 11/55] chore: fix lint & build

---
 packages/paste-core/components/ai-chat-log/package.json | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/packages/paste-core/components/ai-chat-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
index c3d4346c84..bef2f140bd 100644
--- a/packages/paste-core/components/ai-chat-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -25,6 +25,7 @@
     "tsc": "tsc"
   },
   "peerDependencies": {
+    "@twilio-paste/anchor": "^12.1.0",
     "@twilio-paste/animation-library": "^2.0.0",
     "@twilio-paste/avatar": "^9.0.0",
     "@twilio-paste/box": "^10.2.0",
@@ -35,8 +36,11 @@
     "@twilio-paste/icons": "^12.0.0",
     "@twilio-paste/screen-reader-only": "^13.0.0",
     "@twilio-paste/skeleton-loader": "^6.1.0",
+    "@twilio-paste/spinner": "^14.0.0",
+    "@twilio-paste/stack": "^8.0.0",
     "@twilio-paste/style-props": "^9.1.1",
     "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/text": "^10.0.0",
     "@twilio-paste/theme": "^11.0.1",
     "@twilio-paste/types": "^6.0.0",
     "@twilio-paste/uid-library": "^2.0.0",
@@ -46,6 +50,7 @@
     "react-dom": "^16.8.6 || ^17.0.2 || ^18.0.0"
   },
   "devDependencies": {
+    "@twilio-paste/anchor": "^12.1.0",
     "@twilio-paste/animation-library": "^2.0.0",
     "@twilio-paste/avatar": "^9.1.0",
     "@twilio-paste/box": "^10.2.0",
@@ -56,8 +61,11 @@
     "@twilio-paste/icons": "^12.2.1",
     "@twilio-paste/screen-reader-only": "^13.1.1",
     "@twilio-paste/skeleton-loader": "^6.1.0",
+    "@twilio-paste/spinner": "^14.1.1",
+    "@twilio-paste/stack": "^8.1.0",
     "@twilio-paste/style-props": "^9.1.1",
     "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/text": "^10.1.0",
     "@twilio-paste/theme": "^11.0.1",
     "@twilio-paste/types": "^6.0.0",
     "@twilio-paste/uid-library": "^2.0.0",

From 925fd0a062fc893675b04ab71bf1c00c57a94747 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 15:51:12 -0500
Subject: [PATCH 12/55] chore: build update

---
 packages/paste-codemods/tools/.cache/mappings.json | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/paste-codemods/tools/.cache/mappings.json b/packages/paste-codemods/tools/.cache/mappings.json
index 6450f6294e..7cb8ee1f68 100644
--- a/packages/paste-codemods/tools/.cache/mappings.json
+++ b/packages/paste-codemods/tools/.cache/mappings.json
@@ -9,9 +9,12 @@
   "AIChatLog": "@twilio-paste/core/ai-chat-log",
   "AIChatLogger": "@twilio-paste/core/ai-chat-log",
   "AIChatMessage": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageContent": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageAuthor": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageBody": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageBodyTypeWriter": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageFeedback": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageLoading": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageMeta": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageMetaItem": "@twilio-paste/core/ai-chat-log",
   "useAIChatLogger": "@twilio-paste/core/ai-chat-log",
   "Alert": "@twilio-paste/core/alert",
   "AlertDialog": "@twilio-paste/core/alert-dialog",

From 9cb001a6e45699ab7a27c0ca3b57637be5456f33 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 16:06:51 -0500
Subject: [PATCH 13/55] chore: yarn update

---
 yarn.lock | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/yarn.lock b/yarn.lock
index 66a5c8ab42..ef6f733466 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11220,6 +11220,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@twilio-paste/ai-chat-log@workspace:packages/paste-core/components/ai-chat-log"
   dependencies:
+    "@twilio-paste/anchor": ^12.1.0
     "@twilio-paste/animation-library": ^2.0.0
     "@twilio-paste/avatar": ^9.1.0
     "@twilio-paste/box": ^10.2.0
@@ -11230,8 +11231,11 @@ __metadata:
     "@twilio-paste/icons": ^12.2.1
     "@twilio-paste/screen-reader-only": ^13.1.1
     "@twilio-paste/skeleton-loader": ^6.1.0
+    "@twilio-paste/spinner": ^14.1.1
+    "@twilio-paste/stack": ^8.1.0
     "@twilio-paste/style-props": ^9.1.1
     "@twilio-paste/styling-library": ^3.0.0
+    "@twilio-paste/text": ^10.1.0
     "@twilio-paste/theme": ^11.0.1
     "@twilio-paste/types": ^6.0.0
     "@twilio-paste/uid-library": ^2.0.0
@@ -11242,6 +11246,7 @@ __metadata:
     tsx: ^4.0.0
     typescript: ^4.9.4
   peerDependencies:
+    "@twilio-paste/anchor": ^12.1.0
     "@twilio-paste/animation-library": ^2.0.0
     "@twilio-paste/avatar": ^9.0.0
     "@twilio-paste/box": ^10.2.0
@@ -11252,8 +11257,11 @@ __metadata:
     "@twilio-paste/icons": ^12.0.0
     "@twilio-paste/screen-reader-only": ^13.0.0
     "@twilio-paste/skeleton-loader": ^6.1.0
+    "@twilio-paste/spinner": ^14.0.0
+    "@twilio-paste/stack": ^8.0.0
     "@twilio-paste/style-props": ^9.1.1
     "@twilio-paste/styling-library": ^3.0.0
+    "@twilio-paste/text": ^10.0.0
     "@twilio-paste/theme": ^11.0.1
     "@twilio-paste/types": ^6.0.0
     "@twilio-paste/uid-library": ^2.0.0

From 9dcf2db60c57df2aca7e9e8766c5795f49be3a04 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Mon, 10 Jun 2024 15:44:49 -0400
Subject: [PATCH 14/55] chore: cleanup, renaming, small refactors

---
 .../paste-codemods/tools/.cache/mappings.json |     3 +-
 .../ai-chat-log/src/AIChatMessage.tsx         |    21 +-
 ...ssageMeta.tsx => AIChatMessageActions.tsx} |    14 +-
 .../ai-chat-log/src/AIChatMessageAuthor.tsx   |    56 +-
 .../ai-chat-log/src/AIChatMessageBody.tsx     |    16 +-
 .../ai-chat-log/src/AIChatMessageFeedback.tsx |    40 +-
 .../ai-chat-log/src/AIChatMessageRewrite.tsx  |    70 +
 .../ai-chat-log/src/AIMessageContext.tsx      |     9 +
 .../src/AIMessageVariantContext.tsx           |     4 -
 .../components/ai-chat-log/src/index.tsx      |     8 +-
 .../ai-chat-log/src/useAIChatLogger.tsx       |     2 +-
 .../ai-chat-log/stories/index.stories.tsx     |    36 +-
 .../ai-chat-log/stories/parts.stories.tsx     |    63 +-
 .../stories/useAIChatLogger.stories.tsx       |    16 +-
 .../components/ai-chat-log/tsconfig.json      |    10 +-
 .../components/ai-chat-log/type-docs.json     | 16003 ++++++++++++++++
 16 files changed, 16276 insertions(+), 95 deletions(-)
 rename packages/paste-core/components/ai-chat-log/src/{AIChatMessageMeta.tsx => AIChatMessageActions.tsx} (65%)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIMessageContext.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/type-docs.json

diff --git a/packages/paste-codemods/tools/.cache/mappings.json b/packages/paste-codemods/tools/.cache/mappings.json
index 7cb8ee1f68..65c3039a3f 100644
--- a/packages/paste-codemods/tools/.cache/mappings.json
+++ b/packages/paste-codemods/tools/.cache/mappings.json
@@ -9,12 +9,13 @@
   "AIChatLog": "@twilio-paste/core/ai-chat-log",
   "AIChatLogger": "@twilio-paste/core/ai-chat-log",
   "AIChatMessage": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageActions": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageAuthor": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageBody": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageBodyTypeWriter": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageFeedback": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageLoading": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageMeta": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageRewrite": "@twilio-paste/core/ai-chat-log",
   "useAIChatLogger": "@twilio-paste/core/ai-chat-log",
   "Alert": "@twilio-paste/core/alert",
   "AlertDialog": "@twilio-paste/core/alert-dialog",
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index 612f4debf7..ac87899cec 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -1,10 +1,11 @@
 import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
+import { useUID } from "@twilio-paste/uid-library";
 import * as React from "react";
 
-import { AIMessageVariantContext } from "./AIMessageVariantContext";
-import type { AIMessageVariants } from "./AIMessageVariantContext";
+import { AIMessageContext } from "./AIMessageContext";
+import type { AIMessageVariants } from "./AIMessageContext";
 
 export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
@@ -19,17 +20,25 @@ export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   /**
    * The variant of the message to distiguish between user and bot messages
    *
-   * @default null
    * @type {AIMessageVariants}
    * @memberof AIChatMessageProps
    */
   variant: AIMessageVariants;
+  /**
+   * Custom id for the message body
+   *
+   * @default unique ID
+   * @type {string}
+   * @memberof AIChatMessageProps
+   */
+  id?: string;
 }
 
 export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
-  ({ children, element = "AI_CHAT_MESSAGE", variant, ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE", variant, id, ...props }, ref) => {
+    const AIChatMessageId = id || useUID();
     return (
-      <AIMessageVariantContext.Provider value={variant}>
+      <AIMessageContext.Provider value={{ variant, id: AIChatMessageId }}>
         <Box
           role="listitem"
           display="flex"
@@ -41,7 +50,7 @@ export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps
         >
           {children}
         </Box>
-      </AIMessageVariantContext.Provider>
+      </AIMessageContext.Provider>
     );
   },
 );
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
similarity index 65%
rename from packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
index 714357a84a..c0df6f20b8 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
@@ -3,27 +3,27 @@ import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-export interface AIChatMessageMetaProps extends HTMLPasteProps<"div"> {
+export interface AIChatMessageActionsProps extends HTMLPasteProps<"div"> {
   /**
    *
    * @default null
    * @type {string}
-   * @memberof AIChatMessageMetaProps
+   * @memberof AIChatMessageActionsProps
    */
   "aria-label": string;
   children: NonNullable<React.ReactNode>;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "AI_CHAT_MESSAGE_META"
+   * @default "AI_CHAT_MESSAGE_ACTIONS"
    * @type {BoxProps["element"]}
-   * @memberof AIChatMessageMetaProps
+   * @memberof AIChatMessageActionsProps
    */
   element?: BoxElementProps["element"];
 }
 
-export const AIChatMessageMeta = React.forwardRef<HTMLDivElement, AIChatMessageMetaProps>(
-  ({ children, element = "AI_CHAT_MESSAGE_META", ...props }, ref) => {
+export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessageActionsProps>(
+  ({ children, element = "AI_CHAT_MESSAGE_ACTIONS", ...props }, ref) => {
     return (
       <Box
         {...safelySpreadBoxProps(props)}
@@ -40,4 +40,4 @@ export const AIChatMessageMeta = React.forwardRef<HTMLDivElement, AIChatMessageM
   },
 );
 
-AIChatMessageMeta.displayName = "AIChatMessageMeta";
+AIChatMessageActions.displayName = "AIChatMessageActions";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
index 05e522ce32..fec52c0682 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -1,11 +1,12 @@
 import { Avatar } from "@twilio-paste/avatar";
 import type { BoxElementProps } from "@twilio-paste/box";
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import type { GenericIconProps } from "@twilio-paste/icons/esm/types";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-import { AIChatMessageMeta } from "./AIChatMessageMeta";
-import { AIMessageVariantContext } from "./AIMessageVariantContext";
+import { AIMessageContext } from "./AIMessageContext";
 
 export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
   /**
@@ -30,21 +31,58 @@ export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
    * @memberof AIChatMessageAuthorProps
    */
   "aria-label": string;
+  /**
+   * Custom name for the user Avatar's initials to override the default Avatar content. See Avatar API documentation for more information.
+   *
+   * @type {string}
+   * @memberof AIChatMessageAuthorProps
+   */
+  avatarName?: string;
+  /**
+   * Custom src path for the user Avatar's image to override the default Avatar content. See Avatar API documentation for more information.
+   *
+   * @type {string}
+   * @memberof AIChatMessageAuthorProps
+   */
+  avatarSrc?: string;
+  /**
+   * Custom svg for the user Avatar's icon to override the default Avatar content. See Avatar API documentation for more information.
+   *
+   * @type {React.FC<React.PropsWithChildren<GenericIconProps>>}
+   * @memberof AIChatMessageAuthorProps
+   */
+  avatarIcon?: React.FC<React.PropsWithChildren<GenericIconProps>>;
 }
 
 export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
-  ({ children, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
-    const messageVariant = React.useContext(AIMessageVariantContext);
+  ({ children, element = "AI_CHAT_MESSAGE_AUTHOR", avatarName, avatarIcon, avatarSrc, ...props }, ref) => {
+    const { variant } = React.useContext(AIMessageContext);
 
     return (
-      <AIChatMessageMeta {...props} ref={ref} aria-label={props["aria-label"]} element={element}>
-        {messageVariant === "bot" ? (
-          <Avatar name={children} size="sizeIcon50" icon={ArtificialIntelligenceIcon} element={`${element}_AVATAR}`} />
+      <Box
+        {...safelySpreadBoxProps(props)}
+        ref={ref}
+        aria-label={props["aria-label"]}
+        element={element}
+        display="flex"
+        alignItems="center"
+        columnGap="space30"
+        fontWeight="fontWeightMedium"
+      >
+        {variant === "bot" ? (
+          <Avatar name={children} size="sizeIcon50" icon={ArtificialIntelligenceIcon} element={`${element}_AVATAR`} />
         ) : (
-          <Avatar name={children} size="sizeIcon50" color="decorative30" element={`${element}_AVATAR}`} />
+          <Avatar
+            size="sizeIcon50"
+            color="decorative30"
+            element={`${element}_AVATAR`}
+            name={avatarName || children}
+            icon={avatarIcon}
+            src={avatarSrc}
+          />
         )}
         {children}
-      </AIChatMessageMeta>
+      </Box>
     );
   },
 );
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
index cd826d1cf1..d81589c611 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
@@ -4,7 +4,9 @@ import type { ThemeShape } from "@twilio-paste/theme";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-const Variants = {
+import { AIMessageContext } from "./AIMessageContext";
+
+const Sizes = {
   default: {
     fontSize: "fontSize30" as ThemeShape["fontSizes"],
     lineHeight: "lineHeight30" as ThemeShape["lineHeights"],
@@ -16,6 +18,7 @@ const Variants = {
 };
 
 export interface AIChatMessageBodyProps extends HTMLPasteProps<"div"> {
+  id?: never; // id is passed down through the context from AIChatMessage for a11y (aria-controls on the rewrite button)
   children?: React.ReactNode;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
@@ -26,21 +29,23 @@ export interface AIChatMessageBodyProps extends HTMLPasteProps<"div"> {
    */
   element?: BoxElementProps["element"];
   /**
-   * Override the font size for full screen experiences.
+   * Use a larger font size and line height for fullscreen experiences.
    *
    * @default "default"
    * @type {"default" | "fullScreen"}
    * @memberof AIChatMessageBodyProps
    */
-  variant?: "default" | "fullScreen";
+  size?: "default" | "fullScreen";
 }
 
 export const AIChatMessageBody = React.forwardRef<HTMLDivElement, AIChatMessageBodyProps>(
-  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY", ...props }, ref) => {
+  ({ children, size = "default", element = "AI_CHAT_MESSAGE_BODY", ...props }, ref) => {
+    const { id } = React.useContext(AIMessageContext);
+
     return (
       <Box
         {...safelySpreadBoxProps(props)}
-        {...Variants[variant]}
+        {...Sizes[size]}
         display="inline-block"
         color="colorText"
         wordWrap="break-word"
@@ -49,6 +54,7 @@ export const AIChatMessageBody = React.forwardRef<HTMLDivElement, AIChatMessageB
         element={element}
         ref={ref}
         whiteSpace="pre-wrap"
+        id={id}
       >
         {children}
       </Box>
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
index 90cecd703e..ba62b7e038 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
@@ -16,10 +16,43 @@ export interface AIChatMessageFeedbackProps extends HTMLPasteProps<"div"> {
    * @memberof AIChatMessageFeedbackProps
    */
   element?: BoxElementProps["element"];
+  /**
+   * Custom label text for the message feedback component
+   *
+   * @default "Is this helpful?"
+   * @type {string}
+   * @memberof AIChatMessageFeedbackProps
+   */
   label?: string;
+  /**
+   * Custom accessible label for the "Like result" button for non-English languages
+   *
+   * @default "Like result"
+   * @type {string}
+   * @memberof AIChatMessageFeedbackProps
+   */
   i18nLikeLabel?: string;
+  /**
+   * Custom accessible label for the "Dislike result" button for non-English languages
+   *
+   * @default "Dislike result"
+   * @type {string}
+   * @memberof AIChatMessageFeedbackProps
+   */
   i18nDislikeLabel?: string;
+  /**
+   * Function to call on click of "Like result" button
+   *
+   * @type {() => void}
+   * @memberof AIChatMessageFeedbackProps
+   */
   onLike: () => void;
+  /**
+   * Function to call on click of "Disike result" button
+   *
+   * @type {() => void}
+   * @memberof AIChatMessageFeedbackProps
+   */
   onDislike: () => void;
 }
 
@@ -43,7 +76,6 @@ export const AIChatMessageFeedback = React.forwardRef<HTMLDivElement, AIChatMess
       display="inline-flex"
       alignItems="flex-start"
       columnGap="space30"
-      marginTop="space40"
       color="colorTextIcon"
       lineHeight="lineHeight20"
       fontSize="fontSize20"
@@ -53,11 +85,11 @@ export const AIChatMessageFeedback = React.forwardRef<HTMLDivElement, AIChatMess
       paddingX="space30"
       paddingY="space20"
     >
-      <span>{label}</span>
-      <Button variant="reset" size="reset" onClick={onLike}>
+      <Box as="span">{label}</Box>
+      <Button variant="reset" size="reset" onClick={onLike} element={`${element}_LIKE_BUTTON`}>
         <ThumbsUpIcon decorative={false} title={i18nLikeLabel} />
       </Button>
-      <Button variant="reset" size="reset" onClick={onDislike}>
+      <Button variant="reset" size="reset" onClick={onDislike} element={`${element}_DISLIKE_BUTTON`}>
         <ThumbsDownIcon decorative={false} title={i18nDislikeLabel} />
       </Button>
     </Box>
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
new file mode 100644
index 0000000000..380d248b45
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
@@ -0,0 +1,70 @@
+import { safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { RefreshIcon } from "@twilio-paste/icons/esm/RefreshIcon";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+import { AIMessageContext } from "./AIMessageContext";
+
+export interface AIChatMessageRewriteProps extends HTMLPasteProps<"button"> {
+  children?: never;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "AI_CHAT_MESSAGE_REWRITE"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageRewriteProps
+   */
+  element?: BoxElementProps["element"];
+  /**
+   * Custom label text for the message rewrite component
+   *
+   * @default "Rewrite"
+   * @type {string}
+   * @memberof AIChatMessageRewriteProps
+   */
+  label?: string;
+  /**
+   * Function to call on click of message rewrite button
+   *
+   * @type {() => void}
+   * @memberof AIChatMessageRewriteProps
+   */
+  onRewrite: () => void;
+}
+
+export const AIChatMessageRewrite = React.forwardRef<HTMLButtonElement, AIChatMessageRewriteProps>(
+  ({ label = "Rewrite", onRewrite, element = "AI_CHAT_MESSAGE_REWRITE", ...props }, ref) => {
+    const { id: messageBodyId } = React.useContext(AIMessageContext);
+
+    return (
+      <Button
+        {...safelySpreadBoxProps(props)}
+        variant="reset"
+        size="reset"
+        ref={ref}
+        element={element}
+        display="inline-flex"
+        alignItems="flex-start"
+        columnGap="space30"
+        color="colorTextIcon"
+        lineHeight="lineHeight30"
+        fontSize="fontSize30"
+        fontWeight="fontWeightSemibold"
+        backgroundColor="colorBackgroundBody"
+        boxShadow="shadowBorderWeaker"
+        borderRadius="borderRadius30"
+        paddingX="space30"
+        paddingY="space20"
+        onClick={onRewrite}
+        aria-controls={messageBodyId}
+      >
+        <RefreshIcon decorative />
+        {label}
+      </Button>
+    );
+  },
+);
+
+AIChatMessageRewrite.displayName = "AIChatMessageRewrite";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIMessageContext.tsx b/packages/paste-core/components/ai-chat-log/src/AIMessageContext.tsx
new file mode 100644
index 0000000000..8eea8b72d0
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIMessageContext.tsx
@@ -0,0 +1,9 @@
+import * as React from "react";
+
+export type AIMessageVariants = "bot" | "user";
+
+export interface AIMessageContextProps {
+  variant: AIMessageVariants;
+  id: string;
+}
+export const AIMessageContext = React.createContext<AIMessageContextProps>({} as any);
diff --git a/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx b/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
deleted file mode 100644
index 24f10cc224..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-import * as React from "react";
-
-export type AIMessageVariants = "bot" | "user";
-export const AIMessageVariantContext = React.createContext<AIMessageVariants>("bot");
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 024fb0f2b0..02b24da180 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -1,7 +1,7 @@
 export { AIChatMessage } from "./AIChatMessage";
 export type { AIChatMessageProps } from "./AIChatMessage";
-export { AIChatMessageMeta } from "./AIChatMessageMeta";
-export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
+export { AIChatMessageActions } from "./AIChatMessageActions";
+export type { AIChatMessageActionsProps } from "./AIChatMessageActions";
 export { AIChatMessageBody } from "./AIChatMessageBody";
 export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
 export { AIChatMessageBodyTypeWriter } from "./AIChatMessageBodyTypeWriter";
@@ -10,6 +10,8 @@ export { AIChatMessageAuthor } from "./AIChatMessageAuthor";
 export type { AIChatMessageAuthorProps } from "./AIChatMessageAuthor";
 export { AIChatMessageFeedback } from "./AIChatMessageFeedback";
 export type { AIChatMessageFeedbackProps } from "./AIChatMessageFeedback";
+export { AIChatMessageRewrite } from "./AIChatMessageRewrite";
+export type { AIChatMessageRewriteProps } from "./AIChatMessageRewrite";
 export { AIChatMessageLoading } from "./AIChatMessageLoading";
 export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 
@@ -20,4 +22,4 @@ export type { UseAIChatLogger, AIPartialIDChat } from "./useAIChatLogger";
 export { AIChatLogger } from "./AIChatLogger";
 export type { AIChatLoggerProps } from "./AIChatLogger";
 
-export type { AIMessageVariants } from "./AIMessageVariantContext";
+export type { AIMessageVariants } from "./AIMessageContext";
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index 5d319afab2..b13aa99184 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -1,7 +1,7 @@
 import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
 
-import { AIMessageVariants } from "./AIMessageVariantContext";
+import type { AIMessageVariants } from "./AIMessageContext";
 
 export type AIChat = {
   id: string;
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 84cb5c6a91..0147ba40d6 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -1,29 +1,34 @@
+// eslint-disable-next-line eslint-comments/disable-enable-pair
+/* eslint-disable import/no-extraneous-dependencies */
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
+import { UserIcon } from "@twilio-paste/icons/esm/UserIcon";
 import * as React from "react";
 
 import {
   AIChatLog,
   AIChatMessage,
+  AIChatMessageActions,
   AIChatMessageAuthor,
   AIChatMessageBody,
   AIChatMessageFeedback,
   AIChatMessageLoading,
-  AIChatMessageMeta,
+  AIChatMessageRewrite,
 } from "../src";
 
-// eslint-disable-next-line import/no-default-export
 export default {
   title: "Components/AI Chat Log",
   component: AIChatLog,
 };
 
-export const StandardUsage = (): React.ReactNode => {
+export const ExampleAIChatLog = (): React.ReactNode => {
   return (
     <AIChatLog>
       <AIChatMessage variant="user">
-        <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
-        <AIChatMessageBody variant="default">
+        <AIChatMessageAuthor avatarName="Gibby Ridki" avatarIcon={UserIcon} aria-label="You said at 2:36pm">
+          You
+        </AIChatMessageAuthor>
+        <AIChatMessageBody size="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
           impedit repellat assumenda.
@@ -31,27 +36,28 @@ export const StandardUsage = (): React.ReactNode => {
       </AIChatMessage>
       <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
-        <AIChatMessageBody variant="default">
+        <AIChatMessageBody size="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
           impedit repellat assumenda.
         </AIChatMessageBody>
-        <AIChatMessageMeta aria-label="Quick actions available:">
+        <AIChatMessageActions aria-label="Quick actions available:">
           <ButtonGroup>
-            <Button variant="secondary" onClick={() => {}} size="small">
+            <Button variant="secondary" onClick={() => {}} size="rounded_small">
               30007
             </Button>
-            <Button variant="secondary" onClick={() => {}} size="small">
+            <Button variant="secondary" onClick={() => {}} size="rounded_small">
               30007
             </Button>
-            <Button variant="secondary" onClick={() => {}} size="small">
+            <Button variant="secondary" onClick={() => {}} size="rounded_small">
               30009
             </Button>
           </ButtonGroup>
-        </AIChatMessageMeta>
-        <AIChatMessageMeta aria-label="Feedback form">
+        </AIChatMessageActions>
+        <AIChatMessageActions aria-label="Feedback form">
           <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-        </AIChatMessageMeta>
+          <AIChatMessageRewrite onRewrite={() => {}} />
+        </AIChatMessageActions>
       </AIChatMessage>
       <AIChatMessage variant="user">
         <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
@@ -62,9 +68,7 @@ export const StandardUsage = (): React.ReactNode => {
         </AIChatMessageBody>
       </AIChatMessage>
       <AIChatMessage variant="bot">
-        <AIChatMessageAuthor aria-label="AI said" bot>
-          Good Bot
-        </AIChatMessageAuthor>
+        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
         <AIChatMessageBody>
           <AIChatMessageLoading onStopLoading={() => {}} />
         </AIChatMessageBody>
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index d7e3a32c55..fb5ad4f55e 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -1,6 +1,7 @@
+// eslint-disable-next-line eslint-comments/disable-enable-pair
+/* eslint-disable import/no-extraneous-dependencies */
 import { Anchor } from "@twilio-paste/anchor";
 import { Box } from "@twilio-paste/box";
-import { Button } from "@twilio-paste/button";
 import { Disclosure, DisclosureContent, DisclosureHeading } from "@twilio-paste/disclosure";
 import { Heading } from "@twilio-paste/heading";
 import { InlineCode } from "@twilio-paste/inline-code";
@@ -8,11 +9,12 @@ import * as React from "react";
 
 import {
   AIChatLog,
+  AIChatMessageActions,
   AIChatMessageBody,
   AIChatMessageBodyTypeWriter,
   AIChatMessageFeedback,
   AIChatMessageLoading,
-  AIChatMessageMeta,
+  AIChatMessageRewrite,
 } from "../src";
 
 // eslint-disable-next-line import/no-default-export
@@ -21,36 +23,40 @@ export default {
   component: AIChatLog,
 };
 
-export const MessageBody = (): React.ReactNode => {
+export const AIMessageBody = (): React.ReactNode => {
   return (
     <AIChatLog>
-      <AIChatMessageBody variant="default">
-        Use <InlineCode>variant=&quot;default&quot;</InlineCode> when the AI Chat Log is inside a small container.
+      <AIChatMessageBody size="default">
+        Use <InlineCode>size=&quot;default&quot;</InlineCode> when the AI Chat Log is inside a small container.
       </AIChatMessageBody>
-      <AIChatMessageBody variant="fullScreen">
-        Use <InlineCode>variant=&quot;fullScreen&quot;</InlineCode> when the AI Chat Log is a full screen experience.
+      <AIChatMessageBody size="fullScreen">
+        Use <InlineCode>size=&quot;fullScreen&quot;</InlineCode> when the AI Chat Log is a full screen experience.
       </AIChatMessageBody>
     </AIChatLog>
   );
 };
 
-export const MessageBodyWithParagraphs = (): React.ReactNode => {
+export const AIMessageBodyWithParagraphs = (): React.ReactNode => {
   return (
     <AIChatLog>
-      <AIChatMessageBody variant="default">
-        <p>Test</p>
-        <p>Test</p>
+      <AIChatMessageBody size="default">
+        <p>
+          Use <InlineCode>size=&quot;default&quot;</InlineCode> when the AI Chat Log is inside a small container.
+        </p>
+        <p>Second paragraph within AI Chat Message Body.</p>
       </AIChatMessageBody>
 
-      <AIChatMessageBody variant="fullScreen">
-        <p>Test</p>
-        <p>Test</p>
+      <AIChatMessageBody size="fullScreen">
+        <p>
+          Use <InlineCode>size=&quot;fullScreen&quot;</InlineCode> when the AI Chat Log is a full screen experience.
+        </p>
+        <p>Second paragraph within AI Chat Message Body.</p>
       </AIChatMessageBody>
     </AIChatLog>
   );
 };
 
-export const Loading = (): React.ReactNode => {
+export const AIMessageLoading = (): React.ReactNode => {
   return (
     <div>
       <p>Pssst! The three rows have dynamic widths. Refresh to see it in action!</p>
@@ -58,8 +64,9 @@ export const Loading = (): React.ReactNode => {
     </div>
   );
 };
+AIMessageLoading.storyName = "AI Message (Loading)";
 
-export const LoadingStopLoading = (): React.ReactNode => {
+export const AIMessageLoadingStopLoading = (): React.ReactNode => {
   const [loading, setLoading] = React.useState(true);
   return (
     <div>
@@ -75,22 +82,22 @@ export const LoadingStopLoading = (): React.ReactNode => {
     </div>
   );
 };
-LoadingStopLoading.storyName = "Loading with stop button";
+AIMessageLoadingStopLoading.storyName = "AI Message (Loading - with Stop button)";
 
-export const Feedback = (): React.ReactNode => {
+export const AIMessageFeedback = (): React.ReactNode => {
   /* eslint-disable no-alert */
   return (
-    <AIChatMessageMeta aria-label="Feedback form">
+    <AIChatMessageActions aria-label="Feedback form">
       <AIChatMessageFeedback onLike={() => alert("Like + 1")} onDislike={() => alert("Like - 1")} />
-    </AIChatMessageMeta>
+    </AIChatMessageActions>
   );
   /* eslint-enable no-alert */
 };
 
-export const FeedbackCustomLabels = (): React.ReactNode => {
+export const AIMessageFeedbackI18nLabels = (): React.ReactNode => {
   /* eslint-disable no-alert */
   return (
-    <AIChatMessageMeta aria-label="Feedback form">
+    <AIChatMessageActions aria-label="Feedback form">
       <AIChatMessageFeedback
         label="Est-ce utile?"
         i18nDislikeLabel="pas aimer"
@@ -98,10 +105,19 @@ export const FeedbackCustomLabels = (): React.ReactNode => {
         onLike={() => alert("Like + 1")}
         onDislike={() => alert("Like - 1")}
       />
-    </AIChatMessageMeta>
+    </AIChatMessageActions>
   );
   /* eslint-enable no-alert */
 };
+AIMessageFeedbackI18nLabels.storyName = "AI Message Feedback (i18n)";
+
+export const AIMessageRewrite = (): React.ReactNode => {
+  return (
+    <AIChatMessageActions aria-label="message actions">
+      <AIChatMessageRewrite onRewrite={() => {}} />
+    </AIChatMessageActions>
+  );
+};
 
 export const MessageBodyTypeWriter = (): React.ReactNode => {
   return (
@@ -148,4 +164,3 @@ export const MessageBodyTypeWriter = (): React.ReactNode => {
     </Box>
   );
 };
-MessageBodyTypeWriter.storyName = "Message Body Type Writer";
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index e0b9e544eb..f016c6150b 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -1,3 +1,5 @@
+// eslint-disable-next-line eslint-comments/disable-enable-pair
+/* eslint-disable import/no-extraneous-dependencies */
 import type { StoryFn } from "@storybook/react";
 import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
@@ -13,18 +15,16 @@ import * as React from "react";
 import {
   AIChatLogger,
   AIChatMessage,
+  AIChatMessageActions,
   AIChatMessageAuthor,
   AIChatMessageBody,
   AIChatMessageFeedback,
   AIChatMessageLoading,
-  AIChatMessageMeta,
-  AIMessageVariants,
-  AIPartialIDChat,
   useAIChatLogger,
 } from "../src";
+import type { AIMessageVariants, AIPartialIDChat } from "../src";
 import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
 
-// eslint-disable-next-line import/no-default-export
 export default {
   title: "Components/AI Chat Log/useAIChatLogger",
 };
@@ -59,7 +59,7 @@ export const UseChatLogger: StoryFn = () => {
             eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
             nesciunt impedit repellat assumenda.
           </AIChatMessageBody>
-          <AIChatMessageMeta aria-label="Quick actions available:">
+          <AIChatMessageActions aria-label="Quick actions available:">
             <ButtonGroup>
               <Button variant="secondary" onClick={() => {}} size="small">
                 30007
@@ -71,10 +71,10 @@ export const UseChatLogger: StoryFn = () => {
                 30009
               </Button>
             </ButtonGroup>
-          </AIChatMessageMeta>
-          <AIChatMessageMeta aria-label="Feedback form">
+          </AIChatMessageActions>
+          <AIChatMessageActions aria-label="Feedback form">
             <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-          </AIChatMessageMeta>{" "}
+          </AIChatMessageActions>{" "}
         </AIChatMessage>
       ),
     },
diff --git a/packages/paste-core/components/ai-chat-log/tsconfig.json b/packages/paste-core/components/ai-chat-log/tsconfig.json
index b5daed7034..5e8a3b17a2 100644
--- a/packages/paste-core/components/ai-chat-log/tsconfig.json
+++ b/packages/paste-core/components/ai-chat-log/tsconfig.json
@@ -1,12 +1,8 @@
 {
   "extends": "../../../../tsconfig.json",
   "compilerOptions": {
-    "outDir": "dist/",
+    "outDir": "dist/"
   },
-  "include": [
-    "src/**/*",
-  ],
-  "exclude": [
-    "node_modules"
-  ]
+  "include": ["src/**/*"],
+  "exclude": ["node_modules"]
 }
diff --git a/packages/paste-core/components/ai-chat-log/type-docs.json b/packages/paste-core/components/ai-chat-log/type-docs.json
new file mode 100644
index 0000000000..5dd589f00c
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/type-docs.json
@@ -0,0 +1,16003 @@
+{
+  "AIChatMessage": {
+    "variant": {
+      "type": "AIMessageVariants",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "The variant of the message to distiguish between user and bot messages"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": "unique ID",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom id for the message body"
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageActions": {
+    "aria-label": {
+      "type": "string",
+      "defaultValue": "null",
+      "required": true,
+      "externalProp": false,
+      "description": "Defines a string value that labels the current element."
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_ACTIONS",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageBody": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_BODY",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "never",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "size": {
+      "type": "\"default\" | \"fullScreen\"",
+      "defaultValue": "default",
+      "required": false,
+      "externalProp": false,
+      "description": "Use a larger font size and line height for fullscreen experiences."
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageBodyTypeWriter": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "animated": {
+      "type": "boolean",
+      "defaultValue": true,
+      "required": false,
+      "externalProp": false,
+      "description": "Whether the text should be animated with type writer effect"
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_BODY_TYPE_WRITER",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "variant": {
+      "type": "\"default\" | \"fullScreen\"",
+      "defaultValue": "default",
+      "required": false,
+      "externalProp": false,
+      "description": "Override the font size for full screen experiences."
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageAuthor": {
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Screen reader label for the author"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "avatarIcon": {
+      "type": "FC<PropsWithChildren<GenericIconProps>>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false,
+      "description": "Custom svg for the user Avatar's icon to override the default Avatar content. See Avatar API documentation for more information."
+    },
+    "avatarName": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false,
+      "description": "Custom name for the user Avatar's initials to override the default Avatar content. See Avatar API documentation for more information."
+    },
+    "avatarSrc": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false,
+      "description": "Custom src path for the user Avatar's image to override the default Avatar content. See Avatar API documentation for more information."
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_AUTHOR",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageFeedback": {
+    "onDislike": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Function to call on click of \"Disike result\" button"
+    },
+    "onLike": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Function to call on click of \"Like result\" button"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_FEEDBACK",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "i18nDislikeLabel": {
+      "type": "string",
+      "defaultValue": "Dislike result",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom accessible label for the \"Dislike result\" button for non-English languages"
+    },
+    "i18nLikeLabel": {
+      "type": "string",
+      "defaultValue": "Like result",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom accessible label for the \"Like result\" button for non-English languages"
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "label": {
+      "type": "string",
+      "defaultValue": "Is this helpful?",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom label text for the message feedback component"
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageRewrite": {
+    "onRewrite": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Function to call on click of message rewrite button"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoFocus": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "disabled": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_REWRITE",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "form": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formAction": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formEncType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formMethod": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formNoValidate": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formTarget": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "label": {
+      "type": "string",
+      "defaultValue": "Rewrite",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom label text for the message rewrite component"
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "name": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "type": {
+      "type": "\"button\" | \"submit\" | \"reset\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "value": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageLoading": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_LOADING",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStopLoading": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatLog": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "'AI_CHAT_LOG'",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatLogger": {
+    "aiChats": {
+      "type": "AIChat[]",
+      "defaultValue": "null",
+      "required": true,
+      "externalProp": false,
+      "description": "Array of AIs in the log. Use with useAIChatLogger()"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  }
+}

From 6e627ec88478653af9db04a7d76993910279dfc7 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Tue, 11 Jun 2024 10:35:23 -0500
Subject: [PATCH 15/55] chore(docs): ai chat log init

---
 .../components/ai-chat-log/CHANGELOG.md       |     0
 .../components/ai-chat-log/package.json       |     2 +-
 .../components/ai-chat-log/type-docs.json     | 14313 ++++++++++++++++
 .../src/pages/components/ai-chat-log/api.mdx  |   100 +
 .../components/ai-chat-log/changelog.mdx      |    37 +
 .../pages/components/ai-chat-log/index.mdx    |   343 +
 6 files changed, 14794 insertions(+), 1 deletion(-)
 create mode 100644 packages/paste-core/components/ai-chat-log/CHANGELOG.md
 create mode 100644 packages/paste-core/components/ai-chat-log/type-docs.json
 create mode 100644 packages/paste-website/src/pages/components/ai-chat-log/api.mdx
 create mode 100644 packages/paste-website/src/pages/components/ai-chat-log/changelog.mdx
 create mode 100644 packages/paste-website/src/pages/components/ai-chat-log/index.mdx

diff --git a/packages/paste-core/components/ai-chat-log/CHANGELOG.md b/packages/paste-core/components/ai-chat-log/CHANGELOG.md
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/paste-core/components/ai-chat-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
index bef2f140bd..ef82d2c3d6 100644
--- a/packages/paste-core/components/ai-chat-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "category": "data display",
   "status": "production",
-  "description": "Ai chat log.",
+  "description": "AI chat log is a collection of components that allow users to read a series of messages with an AI.",
   "author": "Twilio Inc.",
   "license": "MIT",
   "main:dev": "src/index.tsx",
diff --git a/packages/paste-core/components/ai-chat-log/type-docs.json b/packages/paste-core/components/ai-chat-log/type-docs.json
new file mode 100644
index 0000000000..81f7e831e9
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/type-docs.json
@@ -0,0 +1,14313 @@
+{
+  "AIChatMessage": {
+    "variant": {
+      "type": "AIMessageVariants",
+      "defaultValue": "null",
+      "required": true,
+      "externalProp": false,
+      "description": "The variant of the message to distiguish between user and bot messages"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageMeta": {
+    "aria-label": {
+      "type": "string",
+      "defaultValue": "null",
+      "required": true,
+      "externalProp": false,
+      "description": "Defines a string value that labels the current element."
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_META",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageBody": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_BODY",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "variant": {
+      "type": "\"default\" | \"fullScreen\"",
+      "defaultValue": "default",
+      "required": false,
+      "externalProp": false,
+      "description": "Override the font size for full screen experiences."
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageBodyTypeWriter": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "animated": {
+      "type": "boolean",
+      "defaultValue": true,
+      "required": false,
+      "externalProp": false,
+      "description": "Whether the text should be animated with type writer effect"
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_BODY_TYPE_WRITER",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "variant": {
+      "type": "\"default\" | \"fullScreen\"",
+      "defaultValue": "default",
+      "required": false,
+      "externalProp": false,
+      "description": "Override the font size for full screen experiences."
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageAuthor": {
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Screen reader label for the author"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_AUTHOR",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageFeedback": {
+    "onDislike": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false
+    },
+    "onLike": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_FEEDBACK",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "i18nDislikeLabel": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false
+    },
+    "i18nLikeLabel": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageLoading": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_LOADING",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStopLoading": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatLog": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "'AI_CHAT_LOG'",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatLogger": {
+    "aiChats": {
+      "type": "AIChat[]",
+      "defaultValue": "null",
+      "required": true,
+      "externalProp": false,
+      "description": "Array of AIs in the log. Use with useAIChatLogger()"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  }
+}
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/api.mdx b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
new file mode 100644
index 0000000000..5e1e60a8b4
--- /dev/null
+++ b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
@@ -0,0 +1,100 @@
+export const meta = {
+  title: 'AI Chat Log - API',
+  package: '@twilio-paste/ai-chat-log',
+  description: 'An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot',
+  slug: '/components/ai-chat-log/api',
+};
+
+import Changelog from '@twilio-paste/ai-chat-log/CHANGELOG.md'; // I don't know why this is needed but if you remove it the page fails to render
+import packageJson from '@twilio-paste/ai-chat-log/package.json';
+
+import {SidebarCategoryRoutes} from '../../../constants';
+import ComponentPageLayout from '../../../layouts/ComponentPageLayout';
+import {getFeature, getNavigationData, getComponentApi} from '../../../utils/api';
+
+export default ComponentPageLayout;
+
+export const getStaticProps = async () => {
+  const navigationData = await getNavigationData();
+  const feature = await getFeature('AI Chat Log');
+  const {componentApi, componentApiTocData} = getComponentApi('@twilio-paste/ai-chat-log');
+  return {
+    props: {
+      data: {
+        ...packageJson,
+        ...feature,
+      },
+      componentApi,
+      mdxHeadings: [...mdxHeadings, ...componentApiTocData],
+      navigationData,
+      pageHeaderData: {
+        categoryRoute: SidebarCategoryRoutes.COMPONENTS,
+        githubUrl: 'https://github.com/twilio-labs/paste/tree/main/packages/paste-core/components/ai-chat-log',
+        storybookUrl: '/?path=/story/components-chatlog--example-chat-log',
+      },
+    },
+  };
+};
+
+## Installation
+
+```bash
+yarn add @twilio-paste/ai-chat-log - or - yarn add @twilio-paste/core
+```
+
+## Usage
+
+```jsx
+import {
+  AIChatLog,
+  AIChatMessage,
+  AIChatMessageAuthor,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+} from '@twilio-paste/core/ai-chat-log';
+
+export const Basic = () => {
+  return (
+    <AIChatLog>
+      <AIChatMessage variant="user">
+        <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+        <AIChatMessageBody variant="default">
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+      </AIChatMessage>
+      <AIChatMessage variant="bot">
+        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+        <AIChatMessageBody variant="default">
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+        <AIChatMessageMeta aria-label="Quick actions available:">
+          <ButtonGroup>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30007
+            </Button>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30007
+            </Button>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30009
+            </Button>
+          </ButtonGroup>
+        </AIChatMessageMeta>
+        <AIChatMessageMeta aria-label="Feedback form">
+          <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
+        </AIChatMessageMeta>
+      </AIChatMessage>
+    </AIChatLog>
+  );
+};
+```
+
+## Props
+
+<PropsTable componentApi={props.componentApi} />
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/changelog.mdx b/packages/paste-website/src/pages/components/ai-chat-log/changelog.mdx
new file mode 100644
index 0000000000..cf9f541644
--- /dev/null
+++ b/packages/paste-website/src/pages/components/ai-chat-log/changelog.mdx
@@ -0,0 +1,37 @@
+export const meta = {
+  title: 'AI Chat Log - Components',
+  package: '@twilio-paste/ai-chat-log',
+  description: 'An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot.',
+  slug: '/components/ai-chat-log/changelog',
+};
+
+import Changelog from '@twilio-paste/ai-chat-log/CHANGELOG.md';
+import packageJson from '@twilio-paste/ai-chat-log/package.json';
+
+import {SidebarCategoryRoutes} from '../../../constants';
+import ComponentPageLayout from '../../../layouts/ComponentPageLayout';
+import {getFeature, getNavigationData} from '../../../utils/api';
+
+export default ComponentPageLayout;
+
+export const getStaticProps = async () => {
+  const navigationData = await getNavigationData();
+  const feature = await getFeature('AI Chat Log');
+  return {
+    props: {
+      data: {
+        ...packageJson,
+        ...feature,
+      },
+      navigationData,
+      mdxHeadings,
+      pageHeaderData: {
+        categoryRoute: SidebarCategoryRoutes.COMPONENTS,
+        githubUrl: 'https://github.com/twilio-labs/paste/tree/main/packages/paste-core/components/ai-chat-log',
+        storybookUrl: '/?path=/story/components-chatlog--example-chat-log',
+      },
+    },
+  };
+};
+
+<Changelog />
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
new file mode 100644
index 0000000000..523d7f7cae
--- /dev/null
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -0,0 +1,343 @@
+export const meta = {
+  title: 'AI Chat Log - Components',
+  package: '@twilio-paste/ai-chat-log',
+  description: 'An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot',
+  slug: '/components/ai-chat-log/',
+};
+
+import {Anchor} from '@twilio-paste/anchor';
+import {Avatar} from '@twilio-paste/avatar';
+import {Box} from '@twilio-paste/box';
+import {
+  ChatAttachment,
+  ChatAttachmentDescription,
+  ChatAttachmentLink,
+  ChatBookend,
+  ChatBookendItem,
+  ChatBubble,
+  ChatEvent,
+  ChatLog,
+  ChatMessage,
+  ChatMessageMeta,
+  ChatMessageMetaItem,
+  useChatLogger,
+  ChatLogger,
+} from '@twilio-paste/chat-log';
+import Changelog from '@twilio-paste/ai-chat-log/CHANGELOG.md';
+import {DownloadIcon} from '@twilio-paste/icons/esm/DownloadIcon';
+import {HelpText} from '@twilio-paste/help-text';
+import {Callout, CalloutHeading, CalloutText} from '@twilio-paste/callout';
+import {Button} from '@twilio-paste/button';
+import {ButtonGroup} from '@twilio-paste/button-group';
+import {Stack} from '@twilio-paste/stack';
+
+import {SidebarCategoryRoutes} from '../../../constants';
+import {
+  basicInboundMessage,
+  basicOutboundMessage,
+  inboundMessageMeta,
+  outboundMessageMeta,
+  inboundMessageAttachment,
+  outboundMessageAttachment,
+  inboundComplexMessage,
+  outboundComplexMessage,
+  basicChatEvent,
+  basicChatBookend,
+  kitchenSink,
+  chatLoggerExample,
+} from '../../../component-examples/ChatLogExamples.ts';
+import packageJson from '@twilio-paste/chat-log/package.json';
+import ComponentPageLayout from '../../../layouts/ComponentPageLayout';
+import {getFeature, getNavigationData} from '../../../utils/api';
+
+export default ComponentPageLayout;
+
+export const getStaticProps = async () => {
+  const navigationData = await getNavigationData();
+  const feature = await getFeature('AI Chat Log');
+  return {
+    props: {
+      data: {
+        ...packageJson,
+        ...feature,
+      },
+      navigationData,
+      mdxHeadings,
+      pageHeaderData: {
+        categoryRoute: SidebarCategoryRoutes.COMPONENTS,
+        githubUrl: 'https://github.com/twilio-labs/paste/tree/main/packages/paste-core/components/ai-chat-log',
+        storybookUrl: '/?path=/story/components-chatlog--example-chat-log',
+      },
+    },
+  };
+};
+
+<LivePreview scope={{ChatLog, ChatMessage, ChatBubble, ChatMessageMeta, ChatMessageMetaItem, Avatar}} language="jsx">
+  {`<ChatLog>
+  <ChatMessage variant='inbound'>
+    <ChatBubble>
+      Hello, what can I help you with?
+    </ChatBubble>
+    <ChatMessageMeta aria-label="said by Gibby Radki at 3:35 PM">
+      <ChatMessageMetaItem>
+        <Avatar name="Gibby Radki" size="sizeIcon20" />
+        Gibby Radki ・ 3:35 PM
+      </ChatMessageMetaItem>
+    </ChatMessageMeta>
+  </ChatMessage>
+  <ChatMessage variant='outbound'>
+    <ChatBubble>
+      Hi! What is your return policy?
+    </ChatBubble>
+    <ChatMessageMeta aria-label="said by you at 3:35 PM">
+      <ChatMessageMetaItem>3:35 PM</ChatMessageMetaItem>
+    </ChatMessageMeta>
+  </ChatMessage>
+</ChatLog>`}
+</LivePreview>
+
+## Guidelines
+
+### About AI Chat Log
+
+A Chat Log is a way to display conversations between people and can include complex content like attachments. The chat can be between two or more people.
+
+The Chat Log package includes these main components:
+
+- ChatLog
+- ChatMessage
+- ChatBubble
+- ChatBookend
+- ChatEvent
+- ChatAttachment
+- ChatMessageMeta
+
+### Accessibility
+
+To ensure the chat is accessible, only use the Chat components within a ChatLog component and use ChatMessage to wrap ChatBubbles and ChatMessageMeta components together.
+
+The only other accessibility requirement is providing the ChatMessageMeta a descriptive label via the `aria-label` React prop.
+
+The ChatLog component has `role=”log”` which means that any new messages added to it are announced by assistive technology.
+
+## Examples
+
+### Basic Message
+
+A basic message is simply text sent from a chat participant and is built with the ChatMessage and ChatBubble components. It can either be inbound or outbound.
+
+#### Inbound
+
+<LivePreview scope={{ChatLog, ChatMessage, ChatBubble}} language="jsx" noInline>
+  {basicInboundMessage}
+</LivePreview>
+
+#### Outbound
+
+<LivePreview scope={{ChatLog, ChatMessage, ChatBubble}} language="jsx" noInline>
+  {basicOutboundMessage}
+</LivePreview>
+
+### Message with Message Meta
+
+Use Message Meta to append additional information to a message such as the name of the sender, the time, or a read receipt.
+
+ChatMessageMeta should be a child of ChatMessage so that the text and meta information are correctly grouped together for assistive technologies. It also needs a readable `aria-label` that summarizes what the meta information says.
+
+#### Inbound
+
+<LivePreview
+  scope={{ChatLog, ChatMessage, ChatBubble, ChatMessageMeta, ChatMessageMetaItem, Avatar}}
+  language="jsx"
+  noInline
+>
+  {inboundMessageMeta}
+</LivePreview>
+
+#### Outbound
+
+<LivePreview scope={{ChatLog, ChatMessage, ChatBubble, ChatMessageMeta, ChatMessageMetaItem}} language="jsx" noInline>
+  {outboundMessageMeta}
+</LivePreview>
+
+### Message with Attachment
+
+A message can include an attachment. If sent with additional text, the attachment should be in its own ChatBubble.
+
+#### Inbound
+
+<LivePreview
+  scope={{
+    ChatLog,
+    ChatMessage,
+    ChatBubble,
+    ChatAttachment,
+    ChatAttachmentDescription,
+    ChatAttachmentLink,
+    DownloadIcon,
+  }}
+  language="jsx"
+  noInline
+>
+  {inboundMessageAttachment}
+</LivePreview>
+
+#### Outbound
+
+<LivePreview
+  scope={{
+    ChatLog,
+    ChatMessage,
+    ChatBubble,
+    ChatAttachment,
+    ChatAttachmentDescription,
+    ChatAttachmentLink,
+    DownloadIcon,
+  }}
+  language="jsx"
+  noInline
+>
+  {outboundMessageAttachment}
+</LivePreview>
+
+### Complex Message
+
+ChatMessages can contain multiple ChatBubbles and ChatMessageMetas.
+
+#### Inbound
+
+<LivePreview
+  scope={{
+    ChatLog,
+    ChatAttachment,
+    ChatAttachmentDescription,
+    ChatAttachmentLink,
+    ChatBubble,
+    ChatMessage,
+    ChatMessageMeta,
+    ChatMessageMetaItem,
+    DownloadIcon,
+    Avatar,
+  }}
+  language="jsx"
+  noInline
+>
+  {inboundComplexMessage}
+</LivePreview>
+
+#### Outbound
+
+<LivePreview
+  scope={{
+    ChatLog,
+    ChatAttachment,
+    ChatAttachmentDescription,
+    ChatAttachmentLink,
+    ChatBubble,
+    ChatMessage,
+    ChatMessageMeta,
+    ChatMessageMetaItem,
+    DownloadIcon,
+  }}
+  language="jsx"
+  noInline
+>
+  {outboundComplexMessage}
+</LivePreview>
+
+### Chat Event
+
+Chat Events are for things that can happen during the chat, like someone joining or the chat transferring to a different agent.
+
+<LivePreview scope={{ChatLog, ChatEvent}} language="jsx" noInline>
+  {basicChatEvent}
+</LivePreview>
+
+### Chat Bookend
+
+Chat Bookends are for when the chat starts, ends, and the day when the chat spans multiple days.
+
+<LivePreview scope={{ChatLog, ChatBookend, ChatBookendItem}} language="jsx" noInline>
+  {basicChatBookend}
+</LivePreview>
+
+### Example Chat Log
+
+This example combines all the separate features displayed previously into one example. It shows how all the features work together harmoniously through composition.
+
+<LivePreview
+  scope={{
+    ChatAttachment,
+    ChatAttachmentDescription,
+    ChatAttachmentLink,
+    ChatBookend,
+    ChatBookendItem,
+    ChatBubble,
+    ChatEvent,
+    ChatLog,
+    ChatMessage,
+    ChatMessageMeta,
+    ChatMessageMetaItem,
+    Avatar,
+    DownloadIcon,
+    Box,
+  }}
+  language="jsx"
+  noInline
+>
+  {kitchenSink}
+</LivePreview>
+
+### useChatLogger hook
+
+The `useChatLogger` hook provides a hook based approach to managing chat state. It is best used with the `<ChatLogger />` component.
+
+`useChatLogger` returns 3 things:
+
+- An array of `chats`.
+- A `push` method used to add a chat, optionally with a custom ID
+- A `pop` method used to remove a chat, optionally via its ID.
+- A `clear` method used to remove all chats.
+
+##### ChatLogger component
+
+The `<ChatLogger />` component handles rendering the chats it is passed via props. It handles how chats enter and leave the UI.
+
+```
+const { chats }= useChatLogger();
+return <ChatLogger chats={chats} />;
+```
+
+##### Adding and removing a chat
+
+You can push or pop a chat based on an action or event. In this example it's based on a button click:
+
+<LivePreview
+  scope={{
+    useChatLogger,
+    ChatBubble,
+    ChatLogger,
+    ChatMessage,
+    ChatMessageMeta,
+    ChatMessageMetaItem,
+    Button,
+    ButtonGroup,
+    Stack,
+  }}
+  language="jsx"
+  noInline
+>
+  {chatLoggerExample}
+</LivePreview>
+
+## Composition Notes
+
+Keep content as concise as possible given the space constraints.
+
+### Error messages
+
+To convey an error related to whether a message was sent, use Help Text inside the Message Meta. Limit the message to a single sentence and focus on how the user can resolve the issue. Offer a [link-style retry button](/components/button#link-style-button) when applicable.
+
+To convey an error related to other actions taken in the Chat Log, like a file upload validation error, use a [Toast](/components/toast) at the top of the individual chat window.
+
+To convey an error that applies to the whole page, not just a particular Chat Log, use a page-level [Callout or Alert](/patterns/error-state#when-to-use-which-component).

From 9da6bcf4fec9667bd712e49f2b0bf0bb0498cf79 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Tue, 11 Jun 2024 10:51:11 -0500
Subject: [PATCH 16/55] chore(docs): functional init

---
 .../components/ai-chat-log/package.json       |  2 +-
 .../src/pages/components/ai-chat-log/api.mdx  |  6 --
 .../pages/components/ai-chat-log/index.mdx    | 60 ++++++++++++-------
 3 files changed, 38 insertions(+), 30 deletions(-)

diff --git a/packages/paste-core/components/ai-chat-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
index ef82d2c3d6..fbb2a742a3 100644
--- a/packages/paste-core/components/ai-chat-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -2,7 +2,7 @@
   "name": "@twilio-paste/ai-chat-log",
   "version": "0.0.0",
   "category": "data display",
-  "status": "production",
+  "status": "beta",
   "description": "AI chat log is a collection of components that allow users to read a series of messages with an AI.",
   "author": "Twilio Inc.",
   "license": "MIT",
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/api.mdx b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
index 5e1e60a8b4..562de995ce 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
@@ -78,12 +78,6 @@ export const Basic = () => {
             <Button variant="secondary" onClick={() => {}} size="small">
               30007
             </Button>
-            <Button variant="secondary" onClick={() => {}} size="small">
-              30007
-            </Button>
-            <Button variant="secondary" onClick={() => {}} size="small">
-              30009
-            </Button>
           </ButtonGroup>
         </AIChatMessageMeta>
         <AIChatMessageMeta aria-label="Feedback form">
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index 523d7f7cae..d6a130d9d4 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -23,6 +23,16 @@ import {
   useChatLogger,
   ChatLogger,
 } from '@twilio-paste/chat-log';
+import {
+  AIChatLog,
+  AIChatMessage,
+  AIChatMessageAuthor,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+} from '@twilio-paste/core/ai-chat-log';
+
 import Changelog from '@twilio-paste/ai-chat-log/CHANGELOG.md';
 import {DownloadIcon} from '@twilio-paste/icons/esm/DownloadIcon';
 import {HelpText} from '@twilio-paste/help-text';
@@ -46,7 +56,7 @@ import {
   kitchenSink,
   chatLoggerExample,
 } from '../../../component-examples/ChatLogExamples.ts';
-import packageJson from '@twilio-paste/chat-log/package.json';
+import packageJson from '@twilio-paste/ai-chat-log/package.json';
 import ComponentPageLayout from '../../../layouts/ComponentPageLayout';
 import {getFeature, getNavigationData} from '../../../utils/api';
 
@@ -72,28 +82,32 @@ export const getStaticProps = async () => {
   };
 };
 
-<LivePreview scope={{ChatLog, ChatMessage, ChatBubble, ChatMessageMeta, ChatMessageMetaItem, Avatar}} language="jsx">
-  {`<ChatLog>
-  <ChatMessage variant='inbound'>
-    <ChatBubble>
-      Hello, what can I help you with?
-    </ChatBubble>
-    <ChatMessageMeta aria-label="said by Gibby Radki at 3:35 PM">
-      <ChatMessageMetaItem>
-        <Avatar name="Gibby Radki" size="sizeIcon20" />
-        Gibby Radki ・ 3:35 PM
-      </ChatMessageMetaItem>
-    </ChatMessageMeta>
-  </ChatMessage>
-  <ChatMessage variant='outbound'>
-    <ChatBubble>
-      Hi! What is your return policy?
-    </ChatBubble>
-    <ChatMessageMeta aria-label="said by you at 3:35 PM">
-      <ChatMessageMetaItem>3:35 PM</ChatMessageMetaItem>
-    </ChatMessageMeta>
-  </ChatMessage>
-</ChatLog>`}
+<LivePreview scope={{
+  AIChatLog,
+  AIChatMessage,
+  AIChatMessageAuthor,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+}} language="jsx">
+  {`<AIChatLog>
+  <AIChatMessage variant="user">
+    <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+    <AIChatMessageBody variant="default">
+      What does the SMS delivery error code 30003 mean?
+    </AIChatMessageBody>
+  </AIChatMessage>
+  <AIChatMessage variant="bot">
+    <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+    <AIChatMessageBody variant="default">
+      Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
+    </AIChatMessageBody>
+    <AIChatMessageMeta aria-label="Feedback form">
+      <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
+    </AIChatMessageMeta>
+  </AIChatMessage>
+</AIChatLog>`}
 </LivePreview>
 
 ## Guidelines

From 6bdfff23d74d8a764cd755f57a68f27135709a02 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Wed, 12 Jun 2024 10:24:49 -0500
Subject: [PATCH 17/55] chore(docs): new sections complete with examples

---
 .../component-examples/AIChatLogExamples.ts   | 181 ++++++++++
 .../src/pages/components/ai-chat-log/api.mdx  |  47 +--
 .../components/ai-chat-log/changelog.mdx      |  25 +-
 .../pages/components/ai-chat-log/index.mdx    | 322 ++++++++++--------
 4 files changed, 386 insertions(+), 189 deletions(-)
 create mode 100644 packages/paste-website/src/component-examples/AIChatLogExamples.ts

diff --git a/packages/paste-website/src/component-examples/AIChatLogExamples.ts b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
new file mode 100644
index 0000000000..a58c66fcd8
--- /dev/null
+++ b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
@@ -0,0 +1,181 @@
+export const basicBotMessage = `
+const BasicMessage = () => {
+  return (
+    <AIChatLog>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
+          </AIChatMessageBody>
+        </AIChatMessage>
+    </AIChatLog>
+  );
+};
+
+render(
+  <BasicMessage />
+)`.trim();
+export const basicHumanMessage = `
+const BasicMessage = () => {
+  return (
+    <AIChatLog>
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            I would like some information on twilio error codes for undelivered messages
+          </AIChatMessageBody>
+        </AIChatMessage>
+    </AIChatLog>
+  );
+};
+
+render(
+  <BasicMessage />
+)`.trim();
+export const botWithFeedback = `
+const MessageWithFeedback = () => {
+  return (
+    <AIChatLog>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
+          </AIChatMessageBody>
+          <AIChatMessageMeta aria-label="Feedback form">
+            <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
+          </AIChatMessageMeta>
+        </AIChatMessage>
+    </AIChatLog>
+  );
+};
+
+render(
+  <MessageWithFeedback />
+)`.trim();
+export const botWithActionButtons = `
+const MessageWithActionButtons = () => {
+  return (
+    <AIChatLog>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
+          </AIChatMessageBody>
+          <AIChatMessageMeta aria-label="Quick actions available:">
+            <ButtonGroup>
+              <Button variant="secondary" onClick={() => {}} size="small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="small">
+                30009
+              </Button>
+            </ButtonGroup>
+          </AIChatMessageMeta>
+        </AIChatMessage>
+    </AIChatLog>
+  );
+};
+
+render(
+  <MessageWithActionButtons />
+)`.trim();
+export const botWithLoadingStopButton = `
+const MessageWithLoadingAndStop = () => {
+  return (
+    <AIChatLog>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said" bot>
+            Good Bot
+          </AIChatMessageAuthor>
+          <AIChatMessageBody>
+            <AIChatMessageLoading onStopLoading={() => {}} />
+          </AIChatMessageBody>
+        </AIChatMessage>
+    </AIChatLog>
+  );
+};
+
+render(
+  <MessageWithLoadingAndStop />
+)`.trim();
+export const botWithLoading = `
+const MessageWithLoading = () => {
+  return (
+    <AIChatLog>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said" bot>
+            Good Bot
+          </AIChatMessageAuthor>
+          <AIChatMessageBody>
+            <AIChatMessageLoading />
+          </AIChatMessageBody>
+        </AIChatMessage>
+    </AIChatLog>
+  );
+};
+
+render(
+  <MessageWithLoading />
+)`.trim();
+export const kitchenSink = `
+const AIChatLogExample = () => {
+  return (
+    <AIChatLog>
+      <AIChatMessage variant="user">
+        <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+        <AIChatMessageBody>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+      </AIChatMessage>
+      <AIChatMessage variant="bot">
+        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+        <AIChatMessageBody>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+        <AIChatMessageMeta aria-label="Quick actions available:">
+          <ButtonGroup>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30007
+            </Button>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30007
+            </Button>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30009
+            </Button>
+          </ButtonGroup>
+        </AIChatMessageMeta>
+        <AIChatMessageMeta aria-label="Feedback form">
+          <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
+        </AIChatMessageMeta>
+      </AIChatMessage>
+      <AIChatMessage variant="user">
+        <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
+        <AIChatMessageBody>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+      </AIChatMessage>
+      <AIChatMessage variant="bot">
+        <AIChatMessageAuthor aria-label="AI said" bot>
+          Good Bot
+        </AIChatMessageAuthor>
+        <AIChatMessageBody>
+          <AIChatMessageLoading onStopLoading={() => {}} />
+        </AIChatMessageBody>
+      </AIChatMessage>
+    </AIChatLog>
+  );
+};
+
+render(
+  <AIChatLogExample />
+)`.trim();
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/api.mdx b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
index 562de995ce..16d7912c1b 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
@@ -1,23 +1,24 @@
 export const meta = {
-  title: 'AI Chat Log - API',
-  package: '@twilio-paste/ai-chat-log',
-  description: 'An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot',
-  slug: '/components/ai-chat-log/api',
+  title: "AI Chat Log - API",
+  package: "@twilio-paste/ai-chat-log",
+  description:
+    "An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot",
+  slug: "/components/ai-chat-log/api",
 };
 
-import Changelog from '@twilio-paste/ai-chat-log/CHANGELOG.md'; // I don't know why this is needed but if you remove it the page fails to render
-import packageJson from '@twilio-paste/ai-chat-log/package.json';
+import Changelog from "@twilio-paste/ai-chat-log/CHANGELOG.md"; // I don't know why this is needed but if you remove it the page fails to render
+import packageJson from "@twilio-paste/ai-chat-log/package.json";
 
-import {SidebarCategoryRoutes} from '../../../constants';
-import ComponentPageLayout from '../../../layouts/ComponentPageLayout';
-import {getFeature, getNavigationData, getComponentApi} from '../../../utils/api';
+import { SidebarCategoryRoutes } from "../../../constants";
+import ComponentPageLayout from "../../../layouts/ComponentPageLayout";
+import { getFeature, getNavigationData, getComponentApi } from "../../../utils/api";
 
 export default ComponentPageLayout;
 
 export const getStaticProps = async () => {
   const navigationData = await getNavigationData();
-  const feature = await getFeature('AI Chat Log');
-  const {componentApi, componentApiTocData} = getComponentApi('@twilio-paste/ai-chat-log');
+  const feature = await getFeature("AI Chat Log");
+  const { componentApi, componentApiTocData } = getComponentApi("@twilio-paste/ai-chat-log");
   return {
     props: {
       data: {
@@ -29,8 +30,8 @@ export const getStaticProps = async () => {
       navigationData,
       pageHeaderData: {
         categoryRoute: SidebarCategoryRoutes.COMPONENTS,
-        githubUrl: 'https://github.com/twilio-labs/paste/tree/main/packages/paste-core/components/ai-chat-log',
-        storybookUrl: '/?path=/story/components-chatlog--example-chat-log',
+        githubUrl: "https://github.com/twilio-labs/paste/tree/main/packages/paste-core/components/ai-chat-log",
+        storybookUrl: "/?path=/story/components-chatlog--example-chat-log",
       },
     },
   };
@@ -53,33 +54,21 @@ import {
   AIChatMessageFeedback,
   AIChatMessageLoading,
   AIChatMessageMeta,
-} from '@twilio-paste/core/ai-chat-log';
+} from "@twilio-paste/core/ai-chat-log";
 
 export const Basic = () => {
   return (
     <AIChatLog>
       <AIChatMessage variant="user">
         <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
-        <AIChatMessageBody variant="default">
-          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
-          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-          impedit repellat assumenda.
-        </AIChatMessageBody>
+        <AIChatMessageBody variant="default">What does the SMS delivery error code 30003 mean?</AIChatMessageBody>
       </AIChatMessage>
       <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
         <AIChatMessageBody variant="default">
-          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
-          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-          impedit repellat assumenda.
+          Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be
+          a landline or phone that doesn't support SMS.
         </AIChatMessageBody>
-        <AIChatMessageMeta aria-label="Quick actions available:">
-          <ButtonGroup>
-            <Button variant="secondary" onClick={() => {}} size="small">
-              30007
-            </Button>
-          </ButtonGroup>
-        </AIChatMessageMeta>
         <AIChatMessageMeta aria-label="Feedback form">
           <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
         </AIChatMessageMeta>
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/changelog.mdx b/packages/paste-website/src/pages/components/ai-chat-log/changelog.mdx
index cf9f541644..b78049f582 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/changelog.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/changelog.mdx
@@ -1,22 +1,23 @@
 export const meta = {
-  title: 'AI Chat Log - Components',
-  package: '@twilio-paste/ai-chat-log',
-  description: 'An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot.',
-  slug: '/components/ai-chat-log/changelog',
+  title: "AI Chat Log - Components",
+  package: "@twilio-paste/ai-chat-log",
+  description:
+    "An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot.",
+  slug: "/components/ai-chat-log/changelog",
 };
 
-import Changelog from '@twilio-paste/ai-chat-log/CHANGELOG.md';
-import packageJson from '@twilio-paste/ai-chat-log/package.json';
+import Changelog from "@twilio-paste/ai-chat-log/CHANGELOG.md";
+import packageJson from "@twilio-paste/ai-chat-log/package.json";
 
-import {SidebarCategoryRoutes} from '../../../constants';
-import ComponentPageLayout from '../../../layouts/ComponentPageLayout';
-import {getFeature, getNavigationData} from '../../../utils/api';
+import { SidebarCategoryRoutes } from "../../../constants";
+import ComponentPageLayout from "../../../layouts/ComponentPageLayout";
+import { getFeature, getNavigationData } from "../../../utils/api";
 
 export default ComponentPageLayout;
 
 export const getStaticProps = async () => {
   const navigationData = await getNavigationData();
-  const feature = await getFeature('AI Chat Log');
+  const feature = await getFeature("AI Chat Log");
   return {
     props: {
       data: {
@@ -27,8 +28,8 @@ export const getStaticProps = async () => {
       mdxHeadings,
       pageHeaderData: {
         categoryRoute: SidebarCategoryRoutes.COMPONENTS,
-        githubUrl: 'https://github.com/twilio-labs/paste/tree/main/packages/paste-core/components/ai-chat-log',
-        storybookUrl: '/?path=/story/components-chatlog--example-chat-log',
+        githubUrl: "https://github.com/twilio-labs/paste/tree/main/packages/paste-core/components/ai-chat-log",
+        storybookUrl: "/?path=/story/components-chatlog--example-chat-log",
       },
     },
   };
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index d6a130d9d4..43964d076d 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -1,13 +1,14 @@
 export const meta = {
-  title: 'AI Chat Log - Components',
-  package: '@twilio-paste/ai-chat-log',
-  description: 'An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot',
-  slug: '/components/ai-chat-log/',
+  title: "AI Chat Log - Components",
+  package: "@twilio-paste/ai-chat-log",
+  description:
+    "An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot",
+  slug: "/components/ai-chat-log/",
 };
 
-import {Anchor} from '@twilio-paste/anchor';
-import {Avatar} from '@twilio-paste/avatar';
-import {Box} from '@twilio-paste/box';
+import { Anchor } from "@twilio-paste/anchor";
+import { Avatar } from "@twilio-paste/avatar";
+import { Box } from "@twilio-paste/box";
 import {
   ChatAttachment,
   ChatAttachmentDescription,
@@ -22,7 +23,7 @@ import {
   ChatMessageMetaItem,
   useChatLogger,
   ChatLogger,
-} from '@twilio-paste/chat-log';
+} from "@twilio-paste/chat-log";
 import {
   AIChatLog,
   AIChatMessage,
@@ -31,20 +32,18 @@ import {
   AIChatMessageFeedback,
   AIChatMessageLoading,
   AIChatMessageMeta,
-} from '@twilio-paste/core/ai-chat-log';
+} from "@twilio-paste/core/ai-chat-log";
 
-import Changelog from '@twilio-paste/ai-chat-log/CHANGELOG.md';
-import {DownloadIcon} from '@twilio-paste/icons/esm/DownloadIcon';
-import {HelpText} from '@twilio-paste/help-text';
-import {Callout, CalloutHeading, CalloutText} from '@twilio-paste/callout';
-import {Button} from '@twilio-paste/button';
-import {ButtonGroup} from '@twilio-paste/button-group';
-import {Stack} from '@twilio-paste/stack';
+import Changelog from "@twilio-paste/ai-chat-log/CHANGELOG.md";
+import { DownloadIcon } from "@twilio-paste/icons/esm/DownloadIcon";
+import { HelpText } from "@twilio-paste/help-text";
+import { Callout, CalloutHeading, CalloutText } from "@twilio-paste/callout";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { Stack } from "@twilio-paste/stack";
 
-import {SidebarCategoryRoutes} from '../../../constants';
+import { SidebarCategoryRoutes } from "../../../constants";
 import {
-  basicInboundMessage,
-  basicOutboundMessage,
   inboundMessageMeta,
   outboundMessageMeta,
   inboundMessageAttachment,
@@ -53,18 +52,27 @@ import {
   outboundComplexMessage,
   basicChatEvent,
   basicChatBookend,
-  kitchenSink,
   chatLoggerExample,
-} from '../../../component-examples/ChatLogExamples.ts';
-import packageJson from '@twilio-paste/ai-chat-log/package.json';
-import ComponentPageLayout from '../../../layouts/ComponentPageLayout';
-import {getFeature, getNavigationData} from '../../../utils/api';
+} from "../../../component-examples/ChatLogExamples.ts";
+
+import {
+  basicBotMessage,
+  basicHumanMessage,
+  botWithFeedback,
+  botWithActionButtons,
+  botWithLoadingStopButton,
+  botWithLoading,
+  kitchenSink,
+} from "../../../component-examples/AIChatLogExamples";
+import packageJson from "@twilio-paste/ai-chat-log/package.json";
+import ComponentPageLayout from "../../../layouts/ComponentPageLayout";
+import { getFeature, getNavigationData } from "../../../utils/api";
 
 export default ComponentPageLayout;
 
 export const getStaticProps = async () => {
   const navigationData = await getNavigationData();
-  const feature = await getFeature('AI Chat Log');
+  const feature = await getFeature("AI Chat Log");
   return {
     props: {
       data: {
@@ -75,37 +83,34 @@ export const getStaticProps = async () => {
       mdxHeadings,
       pageHeaderData: {
         categoryRoute: SidebarCategoryRoutes.COMPONENTS,
-        githubUrl: 'https://github.com/twilio-labs/paste/tree/main/packages/paste-core/components/ai-chat-log',
-        storybookUrl: '/?path=/story/components-chatlog--example-chat-log',
+        githubUrl: "https://github.com/twilio-labs/paste/tree/main/packages/paste-core/components/ai-chat-log",
+        storybookUrl: "/?path=/story/components-chatlog--example-chat-log",
       },
     },
   };
 };
 
-<LivePreview scope={{
-  AIChatLog,
-  AIChatMessage,
-  AIChatMessageAuthor,
-  AIChatMessageBody,
-  AIChatMessageFeedback,
-  AIChatMessageLoading,
-  AIChatMessageMeta,
-}} language="jsx">
+<LivePreview
+  scope={{
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+  }}
+  language="jsx"
+>
   {`<AIChatLog>
   <AIChatMessage variant="user">
     <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
-    <AIChatMessageBody variant="default">
+    <AIChatMessageBody>
       What does the SMS delivery error code 30003 mean?
     </AIChatMessageBody>
   </AIChatMessage>
   <AIChatMessage variant="bot">
     <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
-    <AIChatMessageBody variant="default">
+    <AIChatMessageBody>
       Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
     </AIChatMessageBody>
-    <AIChatMessageMeta aria-label="Feedback form">
-      <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-    </AIChatMessageMeta>
   </AIChatMessage>
 </AIChatLog>`}
 </LivePreview>
@@ -114,187 +119,208 @@ export const getStaticProps = async () => {
 
 ### About AI Chat Log
 
-A Chat Log is a way to display conversations between people and can include complex content like attachments. The chat can be between two or more people.
+An AI Chat Log is a way to display conversations between a user and AI.
 
-The Chat Log package includes these main components:
+The AI Chat Log package includes these main components:
 
-- ChatLog
-- ChatMessage
-- ChatBubble
-- ChatBookend
-- ChatEvent
-- ChatAttachment
-- ChatMessageMeta
+- AIChatLog
+- AIChatMessage
+- AIChatMessageAuthor
+- AIChatMessageBody
+- AIChatMessageMeta
+- AIChatMessageFeedback
+- AIChatMessageLoading
 
 ### Accessibility
 
-To ensure the chat is accessible, only use the Chat components within a ChatLog component and use ChatMessage to wrap ChatBubbles and ChatMessageMeta components together.
+To ensure the chat is accessible, only use the AI Chat components within an AIChatLog component and use AIChatMessage to wrap AIChatMessageBody, AIChatMessageMeta and AIChatMessageFeedback components together.
 
-The only other accessibility requirement is providing the ChatMessageMeta a descriptive label via the `aria-label` React prop.
+The only other accessibility requirement is providing the AIChatMessageMeta a descriptive label via the `aria-label` React prop.
 
-The ChatLog component has `role=”log”` which means that any new messages added to it are announced by assistive technology.
+The AIChatLog component has `role=”log”` which means that any new messages added to it are announced by assistive technology.
+
+### AI Chat Log vs Chat Log
+
+The main difference between AI chat Log and Chat Log is ...
 
 ## Examples
 
 ### Basic Message
 
-A basic message is simply text sent from a chat participant and is built with the ChatMessage and ChatBubble components. It can either be inbound or outbound.
+A message must include the author and body. Any message text from a user or a bot must be contained within the AIChatMessageBody component. Due to lengthy AI responses, the chat layout is now top-down
 
-#### Inbound
+#### Bot
 
-<LivePreview scope={{ChatLog, ChatMessage, ChatBubble}} language="jsx" noInline>
-  {basicInboundMessage}
+<LivePreview
+  scope={{
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+  }}
+  language="jsx"
+  noInline
+>
+  {basicBotMessage}
 </LivePreview>
 
-#### Outbound
+#### User
 
-<LivePreview scope={{ChatLog, ChatMessage, ChatBubble}} language="jsx" noInline>
-  {basicOutboundMessage}
+<LivePreview
+  scope={{
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+  }}
+  language="jsx"
+  noInline
+>
+  {basicHumanMessage}
 </LivePreview>
 
-### Message with Message Meta
-
-Use Message Meta to append additional information to a message such as the name of the sender, the time, or a read receipt.
+### Message Body Variants
 
-ChatMessageMeta should be a child of ChatMessage so that the text and meta information are correctly grouped together for assistive technologies. It also needs a readable `aria-label` that summarizes what the meta information says.
+The AIChatMessageBody component has two variants, `default` and `fullscreen`. The `fullscreen` variant is used where the ChatLog is displayed in the full width of the page where larger font size is needed.
 
-#### Inbound
+#### Default
 
 <LivePreview
-  scope={{ChatLog, ChatMessage, ChatBubble, ChatMessageMeta, ChatMessageMetaItem, Avatar}}
+  scope={{
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+  }}
   language="jsx"
-  noInline
 >
-  {inboundMessageMeta}
+  {`<AIChatLog>
+  <AIChatMessage variant="user">
+    <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+    <AIChatMessageBody variant="default">
+      What does the SMS delivery error code 30003 mean?
+    </AIChatMessageBody>
+  </AIChatMessage>
+</AIChatLog>`}
 </LivePreview>
 
-#### Outbound
+#### Fullscreen
 
-<LivePreview scope={{ChatLog, ChatMessage, ChatBubble, ChatMessageMeta, ChatMessageMetaItem}} language="jsx" noInline>
-  {outboundMessageMeta}
+<LivePreview
+  scope={{
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+  }}
+  language="jsx"
+>
+  {`<AIChatLog>
+  <AIChatMessage variant="user">
+    <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+    <AIChatMessageBody variant="fullScreen">
+      What does the SMS delivery error code 30003 mean?
+    </AIChatMessageBody>
+  </AIChatMessage>
+</AIChatLog>`}
 </LivePreview>
 
-### Message with Attachment
+### Message with Message Meta
+
+Use Message Meta to append additional information to a message such as AIChatMessageFeedback or custom action buttons .
 
-A message can include an attachment. If sent with additional text, the attachment should be in its own ChatBubble.
+ChatMessageMeta should be a child of ChatMessage so that the text and meta information are correctly grouped together for assistive technologies. It also needs a readable `aria-label` that summarizes what the meta information says.
 
-#### Inbound
+#### Bot with Feedback
 
 <LivePreview
   scope={{
-    ChatLog,
-    ChatMessage,
-    ChatBubble,
-    ChatAttachment,
-    ChatAttachmentDescription,
-    ChatAttachmentLink,
-    DownloadIcon,
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+    AIChatMessageFeedback,
+    AIChatMessageMeta,
   }}
   language="jsx"
   noInline
 >
-  {inboundMessageAttachment}
+  {botWithFeedback}
 </LivePreview>
 
-#### Outbound
+#### Bot with Action Buttons
 
 <LivePreview
   scope={{
-    ChatLog,
-    ChatMessage,
-    ChatBubble,
-    ChatAttachment,
-    ChatAttachmentDescription,
-    ChatAttachmentLink,
-    DownloadIcon,
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+    AIChatMessageMeta,
+    ButtonGroup,
+    Button,
   }}
   language="jsx"
   noInline
 >
-  {outboundMessageAttachment}
+  {botWithActionButtons}
 </LivePreview>
 
-### Complex Message
+### Loading States
+
+Use the AIChatMessageLoading component to indicate that the bot is typing or processing a response.
 
-ChatMessages can contain multiple ChatBubbles and ChatMessageMetas.
+The SkeletonLoader lengths vary on each render to give a more natural pending message body interaction.
 
-#### Inbound
+#### Loading
 
 <LivePreview
   scope={{
-    ChatLog,
-    ChatAttachment,
-    ChatAttachmentDescription,
-    ChatAttachmentLink,
-    ChatBubble,
-    ChatMessage,
-    ChatMessageMeta,
-    ChatMessageMetaItem,
-    DownloadIcon,
-    Avatar,
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+    AIChatMessageMeta,
+    AIChatMessageLoading,
   }}
   language="jsx"
   noInline
 >
-  {inboundComplexMessage}
+  {botWithLoading}
 </LivePreview>
 
-#### Outbound
+#### Loading with Stop Button
 
 <LivePreview
   scope={{
-    ChatLog,
-    ChatAttachment,
-    ChatAttachmentDescription,
-    ChatAttachmentLink,
-    ChatBubble,
-    ChatMessage,
-    ChatMessageMeta,
-    ChatMessageMetaItem,
-    DownloadIcon,
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+    AIChatMessageMeta,
+    AIChatMessageLoading,
   }}
   language="jsx"
   noInline
 >
-  {outboundComplexMessage}
-</LivePreview>
-
-### Chat Event
-
-Chat Events are for things that can happen during the chat, like someone joining or the chat transferring to a different agent.
-
-<LivePreview scope={{ChatLog, ChatEvent}} language="jsx" noInline>
-  {basicChatEvent}
-</LivePreview>
-
-### Chat Bookend
-
-Chat Bookends are for when the chat starts, ends, and the day when the chat spans multiple days.
-
-<LivePreview scope={{ChatLog, ChatBookend, ChatBookendItem}} language="jsx" noInline>
-  {basicChatBookend}
+  {botWithLoadingStopButton}
 </LivePreview>
 
-### Example Chat Log
+### Example AI Chat Log
 
 This example combines all the separate features displayed previously into one example. It shows how all the features work together harmoniously through composition.
 
 <LivePreview
   scope={{
-    ChatAttachment,
-    ChatAttachmentDescription,
-    ChatAttachmentLink,
-    ChatBookend,
-    ChatBookendItem,
-    ChatBubble,
-    ChatEvent,
-    ChatLog,
-    ChatMessage,
-    ChatMessageMeta,
-    ChatMessageMetaItem,
-    Avatar,
-    DownloadIcon,
-    Box,
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+    AIChatMessageFeedback,
+    AIChatMessageLoading,
+    AIChatMessageMeta,
+    Button,
+    ButtonGroup,
   }}
   language="jsx"
   noInline
@@ -354,4 +380,4 @@ To convey an error related to whether a message was sent, use Help Text inside t
 
 To convey an error related to other actions taken in the Chat Log, like a file upload validation error, use a [Toast](/components/toast) at the top of the individual chat window.
 
-To convey an error that applies to the whole page, not just a particular Chat Log, use a page-level [Callout or Alert](/patterns/error-state#when-to-use-which-component).
+To convey an error that applies to the whole page, not just a particular Chat Log, use a page-level [Callout or Alert](/patterns/error-state#when-to-use-which-component).ButtonGroup,

From 64b9cfd065f9752afc629dd85316aacf1cce2ef1 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Wed, 12 Jun 2024 11:38:57 -0500
Subject: [PATCH 18/55] chore(docs): wip

---
 .../component-examples/AIChatLogExamples.ts   | 28 ++++++++++---------
 .../pages/components/ai-chat-log/index.mdx    |  2 +-
 2 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/packages/paste-website/src/component-examples/AIChatLogExamples.ts b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
index a58c66fcd8..3ad6c9dc91 100644
--- a/packages/paste-website/src/component-examples/AIChatLogExamples.ts
+++ b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
@@ -125,24 +125,20 @@ const AIChatLogExample = () => {
   return (
     <AIChatLog>
       <AIChatMessage variant="user">
-        <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+        <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
         <AIChatMessageBody>
-          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
-          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-          impedit repellat assumenda.
+          Hi, I'm getting errors codes when sending an SMS.
         </AIChatMessageBody>
       </AIChatMessage>
       <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
         <AIChatMessageBody>
-          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
-          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-          impedit repellat assumenda.
+          Error codes can be returned from various parts of the process. What error codes are you encountering?
         </AIChatMessageBody>
         <AIChatMessageMeta aria-label="Quick actions available:">
           <ButtonGroup>
             <Button variant="secondary" onClick={() => {}} size="small">
-              30007
+              21608
             </Button>
             <Button variant="secondary" onClick={() => {}} size="small">
               30007
@@ -152,21 +148,27 @@ const AIChatLogExample = () => {
             </Button>
           </ButtonGroup>
         </AIChatMessageMeta>
+      </AIChatMessage>
+      <AIChatMessage variant="bot">
+        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+        <AIChatMessageBody>
+          Error 21608 means you're trying to send a message from an unverified number. Is your number verified in your Twilio account?
+        </AIChatMessageBody>
         <AIChatMessageMeta aria-label="Feedback form">
           <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
         </AIChatMessageMeta>
       </AIChatMessage>
       <AIChatMessage variant="user">
-        <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
+        <AIChatMessageAuthor aria-label="You said" bot>
+          Gibby Radki
+        </AIChatMessageAuthor>
         <AIChatMessageBody>
-          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
-          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-          impedit repellat assumenda.
+          No, how do I verify it?
         </AIChatMessageBody>
       </AIChatMessage>
       <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said" bot>
-          Good Bot
+          Good Bot  
         </AIChatMessageAuthor>
         <AIChatMessageBody>
           <AIChatMessageLoading onStopLoading={() => {}} />
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index 43964d076d..73acc29119 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -330,7 +330,7 @@ This example combines all the separate features displayed previously into one ex
 
 ### useChatLogger hook
 
-The `useChatLogger` hook provides a hook based approach to managing chat state. It is best used with the `<ChatLogger />` component.
+The `useAIChatLogger` hook provides a hook based approach to managing chat state. It is best used with the `<ChatLogger />` component.
 
 `useChatLogger` returns 3 things:
 

From 0407ea312a9295ed75a6eff87c303ea53fb98cb9 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Wed, 12 Jun 2024 11:45:24 -0500
Subject: [PATCH 19/55] chore(docs): update package decription

---
 packages/paste-core/components/ai-chat-log/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/paste-core/components/ai-chat-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
index fbb2a742a3..e1fecb0625 100644
--- a/packages/paste-core/components/ai-chat-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "category": "data display",
   "status": "beta",
-  "description": "AI chat log is a collection of components that allow users to read a series of messages with an AI.",
+  "description": "An AI Chat Log is a collection of AI Chat components for displaying conversations between a human and an AI bot.",
   "author": "Twilio Inc.",
   "license": "MIT",
   "main:dev": "src/index.tsx",

From ba59388a93214452c0b0eb9f14a0a27d3c8041bc Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Wed, 12 Jun 2024 12:44:57 -0500
Subject: [PATCH 20/55] chore(docs): chat log typo

---
 packages/paste-website/src/pages/components/chat-log/index.mdx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/paste-website/src/pages/components/chat-log/index.mdx b/packages/paste-website/src/pages/components/chat-log/index.mdx
index 6638f26bcb..3387b7d49d 100644
--- a/packages/paste-website/src/pages/components/chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/chat-log/index.mdx
@@ -292,7 +292,7 @@ This example combines all the separate features displayed previously into one ex
 
 The `useChatLogger` hook provides a hook based approach to managing chat state. It is best used with the `<ChatLogger />` component.
 
-`useChatLogger` returns 3 things:
+`useChatLogger` returns 4 things:
 
 - An array of `chats`.
 - A `push` method used to add a chat, optionally with a custom ID

From ab9835e889fcdc547c94593561969d241305eb86 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Wed, 12 Jun 2024 12:57:15 -0500
Subject: [PATCH 21/55] chore(docs): renaming for enw imports and AIChatLogger
 example

---
 .../component-examples/AIChatLogExamples.ts   | 108 +++++++++++++++--
 .../pages/components/ai-chat-log/index.mdx    | 111 +++++++++++-------
 2 files changed, 169 insertions(+), 50 deletions(-)

diff --git a/packages/paste-website/src/component-examples/AIChatLogExamples.ts b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
index 3ad6c9dc91..c4dabe716f 100644
--- a/packages/paste-website/src/component-examples/AIChatLogExamples.ts
+++ b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
@@ -41,9 +41,9 @@ const MessageWithFeedback = () => {
           <AIChatMessageBody>
             Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
           </AIChatMessageBody>
-          <AIChatMessageMeta aria-label="Feedback form">
+          <AIChatMessageActions aria-label="Feedback form">
             <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-          </AIChatMessageMeta>
+          </AIChatMessageActions>
         </AIChatMessage>
     </AIChatLog>
   );
@@ -59,12 +59,12 @@ const MessageWithActionButtons = () => {
         <AIChatMessage variant="bot">
           <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
           <AIChatMessageBody>
-            Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
+          Error codes can be returned from various parts of the process. What error codes are you encountering?
           </AIChatMessageBody>
-          <AIChatMessageMeta aria-label="Quick actions available:">
+          <AIChatMessageActions aria-label="Quick actions available:">
             <ButtonGroup>
               <Button variant="secondary" onClick={() => {}} size="small">
-                30007
+                30005
               </Button>
               <Button variant="secondary" onClick={() => {}} size="small">
                 30007
@@ -73,7 +73,7 @@ const MessageWithActionButtons = () => {
                 30009
               </Button>
             </ButtonGroup>
-          </AIChatMessageMeta>
+          </AIChatMessageActions>
         </AIChatMessage>
     </AIChatLog>
   );
@@ -135,7 +135,7 @@ const AIChatLogExample = () => {
         <AIChatMessageBody>
           Error codes can be returned from various parts of the process. What error codes are you encountering?
         </AIChatMessageBody>
-        <AIChatMessageMeta aria-label="Quick actions available:">
+        <AIChatMessageActions aria-label="Quick actions available:">
           <ButtonGroup>
             <Button variant="secondary" onClick={() => {}} size="small">
               21608
@@ -147,16 +147,16 @@ const AIChatLogExample = () => {
               30009
             </Button>
           </ButtonGroup>
-        </AIChatMessageMeta>
+        </AIChatMessageActions>
       </AIChatMessage>
       <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
         <AIChatMessageBody>
           Error 21608 means you're trying to send a message from an unverified number. Is your number verified in your Twilio account?
         </AIChatMessageBody>
-        <AIChatMessageMeta aria-label="Feedback form">
+        <AIChatMessageActions aria-label="Feedback form">
           <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-        </AIChatMessageMeta>
+        </AIChatMessageActions>
       </AIChatMessage>
       <AIChatMessage variant="user">
         <AIChatMessageAuthor aria-label="You said" bot>
@@ -181,3 +181,91 @@ const AIChatLogExample = () => {
 render(
   <AIChatLogExample />
 )`.trim();
+export const aiChatLoggerExample = `
+const aiChatFactory = ([ message, variant, metaLabel, meta ]) => {
+  const time = new Date(0).toLocaleString(
+    'en-US',
+    { hour: 'numeric', minute: 'numeric', timeZone: 'UTC', hour12: true }
+  )
+
+  return {
+    variant,
+    content: (
+      <AIChatMessage variant={variant}>
+         <AIChatMessageAuthor aria-label={metaLabel + time}>{meta}</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            {message}
+          </AIChatMessageBody>
+      </AIChatMessage>
+    )
+  }
+};
+
+const chatTemplates = [
+  ["Hello", "user", "You said at ", "Gibby Radki"],
+  ["Hi there", "bot", "AI said at ", "Good Bot"],
+  ["Greetings", "user", "You said at ", "Gibby Radki"],
+  ["Good to meet you", "bot", "AI said at ", "Good Bot"]
+];
+
+const AIChatLoggerExample = () => {
+  const [templateIdx, setTemplateIdx] = React.useState(2);
+  const { aiChats, push, pop, clear } = useAIChatLogger(
+    aiChatFactory(chatTemplates[0]),
+    aiChatFactory(chatTemplates[1])
+  );
+
+  const pushChat = () => {
+    const template = chatTemplates[templateIdx];
+    setTemplateIdx((idx) => ++idx % chatTemplates.length);
+    const chat = aiChatFactory(template);
+
+    if (template[1] ===  "bot") {
+      const id = uid(chat.content);
+      console.log(id);
+      push({
+        id,
+        variant: template[1],
+        content: (
+          <AIChatMessage variant="bot">
+            <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+            <AIChatMessageBody>
+              <AIChatMessageLoading />
+            </AIChatMessageBody>
+          </AIChatMessage>
+        ),
+      });
+      setTimeout(() => {
+        console.log("replacing id:", id);
+        push({...chat, id});
+      }, 1000);
+    } else {
+      push(chat);
+    }
+  }
+
+  const popChat = () => {
+    pop();
+    setTemplateIdx((idx) => idx === 0 ? idx : --idx % chatTemplates.length);
+  }
+
+  return(
+    <Stack orientation="vertical">
+      <ButtonGroup>
+        <Button variant="primary" onClick={pushChat}>
+          Push Chat
+        </Button>
+        <Button variant="primary" onClick={popChat}>
+          Pop Chat
+        </Button>
+        <Button variant="primary" onClick={clear}>
+          Clear Chat
+        </Button>
+      </ButtonGroup>
+      <AIChatLogger aiChats={aiChats} />
+    </Stack>
+  )
+}
+
+render(<AIChatLoggerExample />);
+`.trim();
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index 73acc29119..841b7c31bd 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -2,13 +2,14 @@ export const meta = {
   title: "AI Chat Log - Components",
   package: "@twilio-paste/ai-chat-log",
   description:
-    "An AI Chat Log is a collection of Chat components for displaying conversations between a human and an AI bot",
+    "An AI Chat Log is a collection of AI Chat components for displaying conversations between a human and an AI bot.",
   slug: "/components/ai-chat-log/",
 };
 
 import { Anchor } from "@twilio-paste/anchor";
 import { Avatar } from "@twilio-paste/avatar";
 import { Box } from "@twilio-paste/box";
+import { uid } from "@twilio-paste/uid-library";
 import {
   ChatAttachment,
   ChatAttachmentDescription,
@@ -31,7 +32,9 @@ import {
   AIChatMessageBody,
   AIChatMessageFeedback,
   AIChatMessageLoading,
-  AIChatMessageMeta,
+  AIChatLogger,
+  useAIChatLogger,
+  AIChatMessageActions
 } from "@twilio-paste/core/ai-chat-log";
 
 import Changelog from "@twilio-paste/ai-chat-log/CHANGELOG.md";
@@ -63,6 +66,7 @@ import {
   botWithLoadingStopButton,
   botWithLoading,
   kitchenSink,
+  aiChatLoggerExample,
 } from "../../../component-examples/AIChatLogExamples";
 import packageJson from "@twilio-paste/ai-chat-log/package.json";
 import ComponentPageLayout from "../../../layouts/ComponentPageLayout";
@@ -127,22 +131,18 @@ The AI Chat Log package includes these main components:
 - AIChatMessage
 - AIChatMessageAuthor
 - AIChatMessageBody
-- AIChatMessageMeta
+- AIChatMessageActions
 - AIChatMessageFeedback
 - AIChatMessageLoading
 
 ### Accessibility
 
-To ensure the chat is accessible, only use the AI Chat components within an AIChatLog component and use AIChatMessage to wrap AIChatMessageBody, AIChatMessageMeta and AIChatMessageFeedback components together.
+To ensure the chat is accessible, only use the AI Chat components within an AIChatLog component and use AIChatMessage to wrap AIChatMessageBody, AIChatMessageActions and AIChatMessageFeedback components together.
 
-The only other accessibility requirement is providing the AIChatMessageMeta a descriptive label via the `aria-label` React prop.
+The only other accessibility requirement is providing the AIChatMessageActions a descriptive label via the `aria-label` React prop.
 
 The AIChatLog component has `role=”log”` which means that any new messages added to it are announced by assistive technology.
 
-### AI Chat Log vs Chat Log
-
-The main difference between AI chat Log and Chat Log is ...
-
 ## Examples
 
 ### Basic Message
@@ -225,13 +225,13 @@ The AIChatMessageBody component has two variants, `default` and `fullscreen`. Th
 </AIChatLog>`}
 </LivePreview>
 
-### Message with Message Meta
+### Message with Actions
 
-Use Message Meta to append additional information to a message such as AIChatMessageFeedback or custom action buttons .
+Use AIChatMessageActions to append additional information to a message such as AIChatMessageFeedback or custom action buttons .
 
-ChatMessageMeta should be a child of ChatMessage so that the text and meta information are correctly grouped together for assistive technologies. It also needs a readable `aria-label` that summarizes what the meta information says.
+AIChatMessageActions should be a child of AIChatMessage so that the text and meta information are correctly grouped together for assistive technologies. It also needs a readable `aria-label` that summarizes what the meta information says.
 
-#### Bot with Feedback
+#### Action Buttons
 
 <LivePreview
   scope={{
@@ -239,16 +239,17 @@ ChatMessageMeta should be a child of ChatMessage so that the text and meta infor
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageFeedback,
-    AIChatMessageMeta,
+    AIChatMessageActions,
+    ButtonGroup,
+    Button,
   }}
   language="jsx"
   noInline
 >
-  {botWithFeedback}
+  {botWithActionButtons}
 </LivePreview>
 
-#### Bot with Action Buttons
+#### Feedback
 
 <LivePreview
   scope={{
@@ -256,16 +257,37 @@ ChatMessageMeta should be a child of ChatMessage so that the text and meta infor
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageMeta,
-    ButtonGroup,
-    Button,
+    AIChatMessageFeedback,
+    AIChatMessageActions,
   }}
   language="jsx"
   noInline
 >
-  {botWithActionButtons}
+  {botWithFeedback}
 </LivePreview>
 
+#### Feedback Internationalization
+The labels on feedback can be internationalized by passing using the `i18nDislikeLabel` and `i18nLikeLabel` to describe the feedback options.
+
+<LivePreview
+  scope={{
+    AIChatMessageFeedback,
+    AIChatMessageActions
+  }}
+  language="jsx"
+>
+  {`<AIChatMessageActions aria-label="Feedback form">
+  <AIChatMessageFeedback
+    label="Est-ce utile?"
+    i18nDislikeLabel="pas aimer"
+    i18nLikeLabel="aimer"
+    onLike={() => {}}
+    onDislike={() => {}}
+  />
+</AIChatMessageActions>`}
+</LivePreview>
+
+
 ### Loading States
 
 Use the AIChatMessageLoading component to indicate that the bot is typing or processing a response.
@@ -280,7 +302,7 @@ The SkeletonLoader lengths vary on each render to give a more natural pending me
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageMeta,
+    AIChatMessageActions,
     AIChatMessageLoading,
   }}
   language="jsx"
@@ -297,7 +319,7 @@ The SkeletonLoader lengths vary on each render to give a more natural pending me
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageMeta,
+    AIChatMessageActions,
     AIChatMessageLoading,
   }}
   language="jsx"
@@ -318,7 +340,7 @@ This example combines all the separate features displayed previously into one ex
     AIChatMessageBody,
     AIChatMessageFeedback,
     AIChatMessageLoading,
-    AIChatMessageMeta,
+    AIChatMessageActions,
     Button,
     ButtonGroup,
   }}
@@ -328,24 +350,24 @@ This example combines all the separate features displayed previously into one ex
   {kitchenSink}
 </LivePreview>
 
-### useChatLogger hook
+### useAIChatLogger hook
 
-The `useAIChatLogger` hook provides a hook based approach to managing chat state. It is best used with the `<ChatLogger />` component.
+The `useAIChatLogger` hook provides a hook based approach to managing AI chat state. It is best used with the `<AIChatLogger />` component.
 
-`useChatLogger` returns 3 things:
+`useAIChatLogger` returns 4 things:
 
-- An array of `chats`.
+- An array of `aiChats`.
 - A `push` method used to add a chat, optionally with a custom ID
 - A `pop` method used to remove a chat, optionally via its ID.
 - A `clear` method used to remove all chats.
 
-##### ChatLogger component
+##### AIChatLogger component
 
-The `<ChatLogger />` component handles rendering the chats it is passed via props. It handles how chats enter and leave the UI.
+The `<AIChatLogger />` component handles rendering the chats it is passed via props. It handles how chats enter and leave the UI.
 
 ```
-const { chats }= useChatLogger();
-return <ChatLogger chats={chats} />;
+const { aiChats }= useAIChatLogger();
+return <AIChatLogger aiChats={aiChats} />;
 ```
 
 ##### Adding and removing a chat
@@ -354,30 +376,39 @@ You can push or pop a chat based on an action or event. In this example it's bas
 
 <LivePreview
   scope={{
-    useChatLogger,
-    ChatBubble,
-    ChatLogger,
-    ChatMessage,
-    ChatMessageMeta,
-    ChatMessageMetaItem,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+    AIChatMessageFeedback,
+    AIChatMessageLoading,
+    AIChatMessageActions,
     Button,
     ButtonGroup,
+    useAIChatLogger,
+    AIChatLogger,
     Stack,
+    uid
   }}
   language="jsx"
   noInline
 >
-  {chatLoggerExample}
+  {aiChatLoggerExample}
 </LivePreview>
 
 ## Composition Notes
 
 Keep content as concise as possible given the space constraints.
 
+
+### AI Chat Log vs Chat Log
+
+The main difference between AI chat Log and Chat Log is ...
+
+
 ### Error messages
 
 To convey an error related to whether a message was sent, use Help Text inside the Message Meta. Limit the message to a single sentence and focus on how the user can resolve the issue. Offer a [link-style retry button](/components/button#link-style-button) when applicable.
 
 To convey an error related to other actions taken in the Chat Log, like a file upload validation error, use a [Toast](/components/toast) at the top of the individual chat window.
 
-To convey an error that applies to the whole page, not just a particular Chat Log, use a page-level [Callout or Alert](/patterns/error-state#when-to-use-which-component).ButtonGroup,
+To convey an error that applies to the whole page, not just a particular Chat Log, use a page-level [Callout or Alert](/patterns/error-state#when-to-use-which-component).

From 369cad707eec2f0115aa1ccfbd743747550d58e6 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Wed, 12 Jun 2024 15:18:39 -0500
Subject: [PATCH 22/55] chore(docs): loading notes and removal of action
 buttons

---
 .../component-examples/AIChatLogExamples.ts   | 44 +++---------
 .../pages/components/ai-chat-log/index.mdx    | 71 +++----------------
 2 files changed, 19 insertions(+), 96 deletions(-)

diff --git a/packages/paste-website/src/component-examples/AIChatLogExamples.ts b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
index c4dabe716f..7a34e0f97c 100644
--- a/packages/paste-website/src/component-examples/AIChatLogExamples.ts
+++ b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
@@ -52,36 +52,6 @@ const MessageWithFeedback = () => {
 render(
   <MessageWithFeedback />
 )`.trim();
-export const botWithActionButtons = `
-const MessageWithActionButtons = () => {
-  return (
-    <AIChatLog>
-        <AIChatMessage variant="bot">
-          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
-          <AIChatMessageBody>
-          Error codes can be returned from various parts of the process. What error codes are you encountering?
-          </AIChatMessageBody>
-          <AIChatMessageActions aria-label="Quick actions available:">
-            <ButtonGroup>
-              <Button variant="secondary" onClick={() => {}} size="small">
-                30005
-              </Button>
-              <Button variant="secondary" onClick={() => {}} size="small">
-                30007
-              </Button>
-              <Button variant="secondary" onClick={() => {}} size="small">
-                30009
-              </Button>
-            </ButtonGroup>
-          </AIChatMessageActions>
-        </AIChatMessage>
-    </AIChatLog>
-  );
-};
-
-render(
-  <MessageWithActionButtons />
-)`.trim();
 export const botWithLoadingStopButton = `
 const MessageWithLoadingAndStop = () => {
   return (
@@ -214,6 +184,7 @@ const AIChatLoggerExample = () => {
     aiChatFactory(chatTemplates[0]),
     aiChatFactory(chatTemplates[1])
   );
+  const [loading, setLoading] = React.useState(false);
 
   const pushChat = () => {
     const template = chatTemplates[templateIdx];
@@ -222,7 +193,7 @@ const AIChatLoggerExample = () => {
 
     if (template[1] ===  "bot") {
       const id = uid(chat.content);
-      console.log(id);
+      setLoading(true);
       push({
         id,
         variant: template[1],
@@ -236,8 +207,9 @@ const AIChatLoggerExample = () => {
         ),
       });
       setTimeout(() => {
-        console.log("replacing id:", id);
-        push({...chat, id});
+        pop(id);
+        setLoading(false);
+        push(chat);
       }, 1000);
     } else {
       push(chat);
@@ -252,13 +224,13 @@ const AIChatLoggerExample = () => {
   return(
     <Stack orientation="vertical">
       <ButtonGroup>
-        <Button variant="primary" onClick={pushChat}>
+        <Button variant="primary" disabled={loading} onClick={pushChat}>
           Push Chat
         </Button>
-        <Button variant="primary" onClick={popChat}>
+        <Button variant="primary" disabled={loading} onClick={popChat}>
           Pop Chat
         </Button>
-        <Button variant="primary" onClick={clear}>
+        <Button variant="primary" disabled={loading} onClick={clear}>
           Clear Chat
         </Button>
       </ButtonGroup>
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index 841b7c31bd..a1eb1f4181 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -10,6 +10,7 @@ import { Anchor } from "@twilio-paste/anchor";
 import { Avatar } from "@twilio-paste/avatar";
 import { Box } from "@twilio-paste/box";
 import { uid } from "@twilio-paste/uid-library";
+import {Paragraph} from "@twilio-paste/paragraph";
 import {
   ChatAttachment,
   ChatAttachmentDescription,
@@ -62,7 +63,6 @@ import {
   basicBotMessage,
   basicHumanMessage,
   botWithFeedback,
-  botWithActionButtons,
   botWithLoadingStopButton,
   botWithLoading,
   kitchenSink,
@@ -179,11 +179,9 @@ A message must include the author and body. Any message text from a user or a bo
   {basicHumanMessage}
 </LivePreview>
 
-### Message Body Variants
+### Message Body Sizes
 
-The AIChatMessageBody component has two variants, `default` and `fullscreen`. The `fullscreen` variant is used where the ChatLog is displayed in the full width of the page where larger font size is needed.
-
-#### Default
+The AIChatMessageBody component has two sizes, `default` and `fullScreen`. The `fullScreen` size is used where the ChatLog is displayed in the full width of the page where larger font size is needed.
 
 <LivePreview
   scope={{
@@ -196,30 +194,15 @@ The AIChatMessageBody component has two variants, `default` and `fullscreen`. Th
 >
   {`<AIChatLog>
   <AIChatMessage variant="user">
-    <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
-    <AIChatMessageBody variant="default">
-      What does the SMS delivery error code 30003 mean?
+    <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
+    <AIChatMessageBody size="default">
+      I'm a message that should be displayed in compact elements
     </AIChatMessageBody>
   </AIChatMessage>
-</AIChatLog>`}
-</LivePreview>
-
-#### Fullscreen
-
-<LivePreview
-  scope={{
-    AIChatLog,
-    AIChatMessage,
-    AIChatMessageAuthor,
-    AIChatMessageBody,
-  }}
-  language="jsx"
->
-  {`<AIChatLog>
   <AIChatMessage variant="user">
-    <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
-    <AIChatMessageBody variant="fullScreen">
-      What does the SMS delivery error code 30003 mean?
+    <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
+    <AIChatMessageBody size="fullScreen">
+      I'm a message that will be displayed in full screen width
     </AIChatMessageBody>
   </AIChatMessage>
 </AIChatLog>`}
@@ -231,24 +214,6 @@ Use AIChatMessageActions to append additional information to a message such as A
 
 AIChatMessageActions should be a child of AIChatMessage so that the text and meta information are correctly grouped together for assistive technologies. It also needs a readable `aria-label` that summarizes what the meta information says.
 
-#### Action Buttons
-
-<LivePreview
-  scope={{
-    AIChatLog,
-    AIChatMessage,
-    AIChatMessageAuthor,
-    AIChatMessageBody,
-    AIChatMessageActions,
-    ButtonGroup,
-    Button,
-  }}
-  language="jsx"
-  noInline
->
-  {botWithActionButtons}
-</LivePreview>
-
 #### Feedback
 
 <LivePreview
@@ -290,7 +255,7 @@ The labels on feedback can be internationalized by passing using the `i18nDislik
 
 ### Loading States
 
-Use the AIChatMessageLoading component to indicate that the bot is typing or processing a response.
+Use the AIChatMessageLoading component to indicate that the bot is typing or processing a response. During this time **no user input should be accepted**. No new messages should be added to a chat until the AI operation is finished processing.
 
 The SkeletonLoader lengths vary on each render to give a more natural pending message body interaction.
 
@@ -397,18 +362,4 @@ You can push or pop a chat based on an action or event. In this example it's bas
 
 ## Composition Notes
 
-Keep content as concise as possible given the space constraints.
-
-
-### AI Chat Log vs Chat Log
-
-The main difference between AI chat Log and Chat Log is ...
-
-
-### Error messages
-
-To convey an error related to whether a message was sent, use Help Text inside the Message Meta. Limit the message to a single sentence and focus on how the user can resolve the issue. Offer a [link-style retry button](/components/button#link-style-button) when applicable.
-
-To convey an error related to other actions taken in the Chat Log, like a file upload validation error, use a [Toast](/components/toast) at the top of the individual chat window.
-
-To convey an error that applies to the whole page, not just a particular Chat Log, use a page-level [Callout or Alert](/patterns/error-state#when-to-use-which-component).
+Keep content as concise as possible given the space constraints.
\ No newline at end of file

From 2c6d0a2bf0ab84e96a4340864b3dafa046cea457 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Wed, 12 Jun 2024 15:53:43 -0500
Subject: [PATCH 23/55] chore(docs): reference other type of ChatLog

---
 .../paste-website/src/pages/components/ai-chat-log/index.mdx    | 2 +-
 packages/paste-website/src/pages/components/chat-log/index.mdx  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index a1eb1f4181..4a63ccf142 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -123,7 +123,7 @@ export const getStaticProps = async () => {
 
 ### About AI Chat Log
 
-An AI Chat Log is a way to display conversations between a user and AI.
+An AI Chat Log is a way to display conversations between a user and AI. If you are looking for a chat between 2 or more humans please refer to [ChatLog](/components/chat-log).
 
 The AI Chat Log package includes these main components:
 
diff --git a/packages/paste-website/src/pages/components/chat-log/index.mdx b/packages/paste-website/src/pages/components/chat-log/index.mdx
index 3387b7d49d..d7f6729504 100644
--- a/packages/paste-website/src/pages/components/chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/chat-log/index.mdx
@@ -100,7 +100,7 @@ export const getStaticProps = async () => {
 
 ### About Chat Log
 
-A Chat Log is a way to display conversations between people and can include complex content like attachments. The chat can be between two or more people.
+A Chat Log is a way to display conversations between people and can include complex content like attachments. The chat can be between two or more people. If you are looking for a chat between a human and an AI please refer to [AIChatLog](/components/ai-chat-log).
 
 The Chat Log package includes these main components:
 

From 173a752cb5211a1770e7cde644554b1ccd6d3d94 Mon Sep 17 00:00:00 2001
From: TheSisb <shadiisber@gmail.com>
Date: Wed, 24 Apr 2024 15:51:07 -0500
Subject: [PATCH 24/55] chore: checkpoint ai log and ai msg

---
 .../ai-log/__tests__/index.spec.tsx           | 11 ++++
 .../paste-core/components/ai-log/build.js     |  3 +
 .../paste-core/components/ai-log/package.json | 59 +++++++++++++++++
 .../components/ai-log/src/AIChatLog.tsx       | 37 +++++++++++
 .../components/ai-log/src/AIChatLogger.tsx    | 58 ++++++++++++++++
 .../components/ai-log/src/AIChatMessage.tsx   | 36 ++++++++++
 .../ai-log/src/AIChatMessageContent.tsx       | 40 +++++++++++
 .../ai-log/src/AIChatMessageMeta.tsx          | 43 ++++++++++++
 .../ai-log/src/AIChatMessageMetaItem.tsx      | 47 +++++++++++++
 .../components/ai-log/src/index.tsx           | 15 +++++
 .../components/ai-log/src/useAIChatLogger.tsx | 39 +++++++++++
 .../ai-log/stories/index.stories.tsx          | 66 +++++++++++++++++++
 .../components/ai-log/tsconfig.json           | 12 ++++
 yarn.lock                                     | 55 +++++++++++++++-
 14 files changed, 520 insertions(+), 1 deletion(-)
 create mode 100644 packages/paste-core/components/ai-log/__tests__/index.spec.tsx
 create mode 100644 packages/paste-core/components/ai-log/build.js
 create mode 100644 packages/paste-core/components/ai-log/package.json
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatLog.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatLogger.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatMessage.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/index.tsx
 create mode 100644 packages/paste-core/components/ai-log/src/useAIChatLogger.tsx
 create mode 100644 packages/paste-core/components/ai-log/stories/index.stories.tsx
 create mode 100644 packages/paste-core/components/ai-log/tsconfig.json

diff --git a/packages/paste-core/components/ai-log/__tests__/index.spec.tsx b/packages/paste-core/components/ai-log/__tests__/index.spec.tsx
new file mode 100644
index 0000000000..3383edf6bd
--- /dev/null
+++ b/packages/paste-core/components/ai-log/__tests__/index.spec.tsx
@@ -0,0 +1,11 @@
+import * as React from 'react';
+import {render} from '@testing-library/react';
+
+import {AiLog} from '../src';
+
+describe('AiLog', () => {
+  it('should render', () => {
+    const {getByText} = render(<AiLog>test</AiLog>);
+    expect(getByText('test')).toBeDefined();
+  });
+});
diff --git a/packages/paste-core/components/ai-log/build.js b/packages/paste-core/components/ai-log/build.js
new file mode 100644
index 0000000000..a4edeab49b
--- /dev/null
+++ b/packages/paste-core/components/ai-log/build.js
@@ -0,0 +1,3 @@
+const {build} = require('../../../../tools/build/esbuild');
+
+build(require('./package.json'));
diff --git a/packages/paste-core/components/ai-log/package.json b/packages/paste-core/components/ai-log/package.json
new file mode 100644
index 0000000000..8b487c5aef
--- /dev/null
+++ b/packages/paste-core/components/ai-log/package.json
@@ -0,0 +1,59 @@
+{
+  "name": "@twilio-paste/ai-log",
+  "version": "0.0.0",
+  "category": "data display",
+  "status": "production",
+  "description": "Ai chat log.",
+  "author": "Twilio Inc.",
+  "license": "MIT",
+  "main:dev": "src/index.tsx",
+  "main": "dist/index.js",
+  "module": "dist/index.es.js",
+  "types": "dist/index.d.ts",
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "yarn clean && NODE_ENV=production node build.js && tsc",
+    "build:js": "NODE_ENV=development node build.js",
+    "build:typedocs": "tsx ../../../../tools/build/generate-type-docs",
+    "clean": "rm -rf ./dist",
+    "tsc": "tsc"
+  },
+  "peerDependencies": {
+    "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/box": "^10.2.0",
+    "@twilio-paste/color-contrast-utils": "^5.0.0",
+    "@twilio-paste/customization": "^8.1.1",
+    "@twilio-paste/design-tokens": "^10.3.0",
+    "@twilio-paste/style-props": "^9.1.1",
+    "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/theme": "^11.0.1",
+    "@twilio-paste/types": "^6.0.0",
+    "@types/react": "^16.8.6 || ^17.0.2 || ^18.0.27",
+    "@types/react-dom": "^16.8.6 || ^17.0.2 || ^18.0.10",
+    "react": "^16.8.6 || ^17.0.2 || ^18.0.0",
+    "react-dom": "^16.8.6 || ^17.0.2 || ^18.0.0"
+  },
+  "devDependencies": {
+    "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/box": "^10.2.0",
+    "@twilio-paste/color-contrast-utils": "^5.0.0",
+    "@twilio-paste/customization": "^8.1.1",
+    "@twilio-paste/design-tokens": "^10.3.0",
+    "@twilio-paste/style-props": "^9.1.1",
+    "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/theme": "^11.0.1",
+    "@twilio-paste/types": "^6.0.0",
+    "@types/react": "^18.0.27",
+    "@types/react-dom": "^18.0.10",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "tsx": "^3.12.10",
+    "typescript": "^4.9.4"
+  }
+}
diff --git a/packages/paste-core/components/ai-log/src/AIChatLog.tsx b/packages/paste-core/components/ai-log/src/AIChatLog.tsx
new file mode 100644
index 0000000000..23a31253a9
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatLog.tsx
@@ -0,0 +1,37 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatLogProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   * @default '{constantCase component-name}'
+   * @type {BoxProps['element']}
+   * @memberof AIChatLogProps
+   */
+  element?: BoxProps["element"];
+}
+
+export const AIChatLog = React.forwardRef<HTMLDivElement, AIChatLogProps>(
+  ({ element = "AI_LOG", children, ...props }, ref) => {
+    return (
+      <Box role="log" padding="space70" element={element} ref={ref} {...safelySpreadBoxProps(props)}>
+        <Box
+          as="div"
+          role="list"
+          margin="space0"
+          padding="space0"
+          display="flex"
+          flexDirection="column"
+          rowGap="space130"
+        >
+          {children}
+        </Box>
+      </Box>
+    );
+  },
+);
+
+AIChatLog.displayName = "AIChatLog";
diff --git a/packages/paste-core/components/ai-log/src/AIChatLogger.tsx b/packages/paste-core/components/ai-log/src/AIChatLogger.tsx
new file mode 100644
index 0000000000..8424516062
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatLogger.tsx
@@ -0,0 +1,58 @@
+import { animated, useReducedMotion, useTransition } from "@twilio-paste/animation-library";
+import { Box } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+import { AIChatLog } from "./AIChatLog";
+import type { AIChat } from "./useAIChatLogger";
+
+const AnimatedAI = animated(Box);
+type StyleProps = React.ComponentProps<typeof AnimatedAI>["style"];
+
+export interface AIChatLoggerProps extends HTMLPasteProps<"div"> {
+  /**
+   * Array of AIs in the log. Use with useAIChatLogger()
+   *
+   * @default 'AI_ATTACHMENT'
+   * @type {BoxProps['element']}
+   * @memberof AIAttachmentProps
+   */
+  AIs: AIChat[];
+  children?: never;
+}
+
+const buildTransitionX = (AIChat: AIChat): number => {
+  if (AIChat.variant === "ai") return -100;
+  if (AIChat.variant === "user") return 100;
+  return 0;
+};
+
+export const AIChatLogger = React.forwardRef<HTMLDivElement, AIChatLoggerProps>(({ AIs, ...props }, ref) => {
+  const transitions = useTransition(AIs, {
+    keys: (AIChat: AIChat) => AIChat.id,
+    from: (AIChat: AIChat): StyleProps => ({ opacity: 0, x: buildTransitionX(AIChat) }),
+    enter: { opacity: 1, x: 0 },
+    leave: (AIChat: AIChat): StyleProps => ({ opacity: 0, x: buildTransitionX(AIChat) }),
+    config: {
+      mass: 0.7,
+      tension: 190,
+      friction: 16,
+    },
+  });
+
+  const animatedAIs = useReducedMotion()
+    ? AIs.map((AIChat) => React.cloneElement(AIChat.content, { key: AIChat.id }))
+    : transitions((styles: StyleProps, AIChat: AIChat, { key }: { key: string }) => (
+        <AnimatedAI as="div" style={styles} key={key}>
+          {AIChat.content}
+        </AnimatedAI>
+      ));
+
+  return (
+    <AIChatLog {...props} ref={ref}>
+      {animatedAIs}
+    </AIChatLog>
+  );
+});
+
+AIChatLogger.displayName = "AIChatLogger";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-log/src/AIChatMessage.tsx
new file mode 100644
index 0000000000..9f4b56e970
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatMessage.tsx
@@ -0,0 +1,36 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps, BoxStyleProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE"
+   * @type {BoxProps["element"]}
+   * @memberof ChatMessageProps
+   */
+  element?: BoxElementProps["element"];
+}
+
+export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
+  ({ children, element = "CHAT_MESSAGE", ...props }, ref) => {
+    return (
+      <Box
+        role="listitem"
+        display="flex"
+        flexDirection="column"
+        rowGap="space40"
+        ref={ref}
+        element={element}
+        {...safelySpreadBoxProps(props)}
+      >
+        {children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessage.displayName = "AIChatMessage";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx b/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
new file mode 100644
index 0000000000..0958389f62
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
@@ -0,0 +1,40 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps, BoxStyleProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageContentProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatBubbleProps
+   */
+  element?: BoxElementProps["element"];
+}
+
+export const AIChatMessageContent = React.forwardRef<HTMLDivElement, AIChatMessageContentProps>(
+  ({ children, element = "CHAT_MESSAGE_CONTENT", ...props }, ref) => {
+    return (
+      <Box
+        display="inline-block"
+        color="colorText"
+        fontSize="fontSize30"
+        lineHeight="lineHeight20"
+        wordWrap="break-word"
+        maxWidth="100%"
+        minWidth={0}
+        element={element}
+        ref={ref}
+        whiteSpace="pre-wrap"
+        {...safelySpreadBoxProps(props)}
+      >
+        {children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageContent.displayName = "AIChatMessageContent";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx b/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
new file mode 100644
index 0000000000..dd19c55fcc
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
@@ -0,0 +1,43 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageMetaProps extends HTMLPasteProps<"div"> {
+  /**
+   *
+   * @default null
+   * @type {string}
+   * @memberof AIChatMessageMetaProps
+   */
+  "aria-label": string;
+  children: NonNullable<React.ReactNode>;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE_META"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageMetaProps
+   */
+  element?: BoxElementProps["element"];
+}
+
+export const AIChatMessageMeta = React.forwardRef<HTMLDivElement, AIChatMessageMetaProps>(
+  ({ children, element = "CHAT_MESSAGE_META", ...props }, ref) => {
+    return (
+      <Box
+        {...safelySpreadBoxProps(props)}
+        ref={ref}
+        element={element}
+        display="flex"
+        alignItems="center"
+        columnGap="space30"
+        fontWeight="fontWeightMedium"
+      >
+        {children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageMeta.displayName = "AIChatMessageMeta";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx b/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
new file mode 100644
index 0000000000..72b7e033d2
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
@@ -0,0 +1,47 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageMetaItemProps extends HTMLPasteProps<"div"> {
+  children: NonNullable<React.ReactNode>;
+  variant: "author" | "timestamp";
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE_META_ITEM"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageMetaItemProps
+   */
+  element?: BoxElementProps["element"];
+}
+
+const variantStyles = {
+  author: {
+    color: "colorText",
+    lineHeight: "lineHeight50",
+    fontSize: "fontSize40",
+  },
+  timestamp: {},
+};
+
+export const AIChatMessageMetaItem = React.forwardRef<HTMLDivElement, AIChatMessageMetaItemProps>(
+  ({ children, element = "CHAT_MESSAGE_META_ITEM", ...props }, ref) => (
+    <Box
+      ref={ref}
+      element={element}
+      display="flex"
+      alignItems="flex-start"
+      columnGap="space30"
+      color="colorText"
+      lineHeight="lineHeight50"
+      fontSize="fontSize40"
+      {...variantStyles[props.variant]}
+      {...safelySpreadBoxProps(props)}
+    >
+      {children}
+    </Box>
+  ),
+);
+
+AIChatMessageMetaItem.displayName = "AIChatMessageMetaItem";
diff --git a/packages/paste-core/components/ai-log/src/index.tsx b/packages/paste-core/components/ai-log/src/index.tsx
new file mode 100644
index 0000000000..65e31ebf04
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/index.tsx
@@ -0,0 +1,15 @@
+export { AIChatMessage } from "./AIChatMessage";
+export type { AIChatMessageProps } from "./AIChatMessage";
+export { AIChatMessageMeta } from "./AIChatMessageMeta";
+export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
+export { AIChatMessageMetaItem } from "./AIChatMessageMetaItem";
+export type { AIChatMessageMetaItemProps } from "./AIChatMessageMetaItem";
+export { AIChatMessageContent } from "./AIChatMessageContent";
+export type { AIChatMessageContentProps } from "./AIChatMessageContent";
+
+export { AIChatLog } from "./AIChatLog";
+export type { AIChatLogProps } from "./AIChatLog";
+export { useAIChatLogger } from "./useAIChatLogger";
+export type { UseAIChatLogger } from "./useAIChatLogger";
+export { AIChatLogger } from "./AIChatLogger";
+export type { AIChatLoggerProps } from "./AIChatLogger";
diff --git a/packages/paste-core/components/ai-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-log/src/useAIChatLogger.tsx
new file mode 100644
index 0000000000..6d785d5f6b
--- /dev/null
+++ b/packages/paste-core/components/ai-log/src/useAIChatLogger.tsx
@@ -0,0 +1,39 @@
+import { uid } from "@twilio-paste/uid-library";
+import * as React from "react";
+
+export type AIChat = {
+  id: string;
+  content: React.ReactElement;
+};
+
+export type PartialIDChat = Omit<AIChat, "id"> & Partial<Pick<AIChat, "id">>;
+
+type PushAIChat = (chat: PartialIDChat) => void;
+type PopAIChat = (id?: string) => void;
+
+export type UseAIChatLogger = (...initialChats: PartialIDChat[]) => {
+  aiChats: AIChat[];
+  push: PushAIChat;
+  pop: PopAIChat;
+  clear: () => void;
+};
+
+const aiChatWithId = (chat: PartialIDChat): AIChat => ({ ...chat, id: chat.id || uid(chat.content) });
+
+export const useAIChatLogger: UseAIChatLogger = (...initialChats) => {
+  const parsedInitialChats = React.useMemo(() => initialChats.map(aiChatWithId), [initialChats]);
+
+  const [aiChats, setAIChats] = React.useState<AIChat[]>(parsedInitialChats);
+
+  const push: PushAIChat = React.useCallback((next) => {
+    setAIChats((prev) => prev.concat(aiChatWithId(next)));
+  }, []);
+
+  const pop: PopAIChat = React.useCallback((id) => {
+    setAIChats((prev) => (id ? prev.filter((chat) => chat.id !== id) : prev.slice(0, -1)));
+  }, []);
+
+  const clear: () => void = React.useCallback(() => setAIChats([]), []);
+
+  return { push, pop, aiChats, clear };
+};
diff --git a/packages/paste-core/components/ai-log/stories/index.stories.tsx b/packages/paste-core/components/ai-log/stories/index.stories.tsx
new file mode 100644
index 0000000000..2f9fc10400
--- /dev/null
+++ b/packages/paste-core/components/ai-log/stories/index.stories.tsx
@@ -0,0 +1,66 @@
+import * as React from "react";
+
+import { Avatar } from "@twilio-paste/avatar";
+import { Box } from "@twilio-paste/box";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { useUID } from "@twilio-paste/uid-library";
+import { AIChatLog, AIChatMessage, AIChatMessageContent, AIChatMessageMeta, AIChatMessageMetaItem } from "../src";
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Log",
+  component: AIChatLog,
+};
+
+export const Default = (): React.ReactNode => {
+  const [showButton, setShowButton] = React.useState(true);
+  const chatBoxUniqueID = useUID();
+  return (
+    <Box maxHeight="size40" overflowY="scroll" id={chatBoxUniqueID}>
+      <AIChatLog>
+        <AIChatMessage>
+          <AIChatMessageMeta aria-label="You said">
+            <AIChatMessageMetaItem variant="author">
+              <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
+              You
+            </AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+          <AIChatMessageContent>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageContent>
+          <AIChatMessageMeta aria-label="Quick actions available:">
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+          <AIChatMessageMeta aria-label="Feedback form">
+            <AIChatMessageMetaItem>Was this helpful?</AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+        </AIChatMessage>
+        <AIChatMessage variant="ai">
+          <AIChatMessageMeta aria-label="You said">
+            <AIChatMessageMetaItem>
+              <Avatar name="A" icon={ArtificialIntelligenceIcon} size="sizeIcon20" />
+              AI Bot
+            </AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+          <AIChatMessageContent>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageContent>
+          <AIChatMessageMeta aria-label="Quick actions available:">
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+          <AIChatMessageMeta aria-label="Feedback form">
+            <AIChatMessageMetaItem>Was this helpful?</AIChatMessageMetaItem>
+          </AIChatMessageMeta>
+        </AIChatMessage>
+      </AIChatLog>
+    </Box>
+  );
+};
diff --git a/packages/paste-core/components/ai-log/tsconfig.json b/packages/paste-core/components/ai-log/tsconfig.json
new file mode 100644
index 0000000000..b5daed7034
--- /dev/null
+++ b/packages/paste-core/components/ai-log/tsconfig.json
@@ -0,0 +1,12 @@
+{
+  "extends": "../../../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "dist/",
+  },
+  "include": [
+    "src/**/*",
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}
diff --git a/yarn.lock b/yarn.lock
index a6ea28b470..5b34e00e52 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11216,6 +11216,42 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"@twilio-paste/ai-log@workspace:packages/paste-core/components/ai-log":
+  version: 0.0.0-use.local
+  resolution: "@twilio-paste/ai-log@workspace:packages/paste-core/components/ai-log"
+  dependencies:
+    "@twilio-paste/animation-library": ^2.0.0
+    "@twilio-paste/box": ^10.2.0
+    "@twilio-paste/color-contrast-utils": ^5.0.0
+    "@twilio-paste/customization": ^8.1.1
+    "@twilio-paste/design-tokens": ^10.3.0
+    "@twilio-paste/style-props": ^9.1.1
+    "@twilio-paste/styling-library": ^3.0.0
+    "@twilio-paste/theme": ^11.0.1
+    "@twilio-paste/types": ^6.0.0
+    "@types/react": ^18.0.27
+    "@types/react-dom": ^18.0.10
+    react: ^18.0.0
+    react-dom: ^18.0.0
+    tsx: ^3.12.10
+    typescript: ^4.9.4
+  peerDependencies:
+    "@twilio-paste/animation-library": ^2.0.0
+    "@twilio-paste/box": ^10.2.0
+    "@twilio-paste/color-contrast-utils": ^5.0.0
+    "@twilio-paste/customization": ^8.1.1
+    "@twilio-paste/design-tokens": ^10.3.0
+    "@twilio-paste/style-props": ^9.1.1
+    "@twilio-paste/styling-library": ^3.0.0
+    "@twilio-paste/theme": ^11.0.1
+    "@twilio-paste/types": ^6.0.0
+    "@types/react": ^16.8.6 || ^17.0.2 || ^18.0.27
+    "@types/react-dom": ^16.8.6 || ^17.0.2 || ^18.0.10
+    react: ^16.8.6 || ^17.0.2 || ^18.0.0
+    react-dom: ^16.8.6 || ^17.0.2 || ^18.0.0
+  languageName: unknown
+  linkType: soft
+
 "@twilio-paste/alert-dialog@^9.2.0, @twilio-paste/alert-dialog@workspace:packages/paste-core/components/alert-dialog":
   version: 0.0.0-use.local
   resolution: "@twilio-paste/alert-dialog@workspace:packages/paste-core/components/alert-dialog"
@@ -41710,7 +41746,7 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
-"source-map-support@npm:^0.5.16, source-map-support@npm:~0.5.12, source-map-support@npm:~0.5.19, source-map-support@npm:~0.5.20":
+"source-map-support@npm:^0.5.16, source-map-support@npm:^0.5.21, source-map-support@npm:~0.5.12, source-map-support@npm:~0.5.19, source-map-support@npm:~0.5.20":
   version: 0.5.21
   resolution: "source-map-support@npm:0.5.21"
   dependencies:
@@ -43722,6 +43758,23 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
+"tsx@npm:^3.12.10":
+  version: 3.14.0
+  resolution: "tsx@npm:3.14.0"
+  dependencies:
+    esbuild: ~0.18.20
+    fsevents: ~2.3.3
+    get-tsconfig: ^4.7.2
+    source-map-support: ^0.5.21
+  dependenciesMeta:
+    fsevents:
+      optional: true
+  bin:
+    tsx: dist/cli.mjs
+  checksum: afcef5d9b90b5800cf1ffb749e943f63042d78a4c0d9eef6e13e43f4ecab465d45e2c9812a2c515cbdc2ee913ff1cd01bf5c606a48013dd3ce2214a631b45557
+  languageName: node
+  linkType: hard
+
 "tsx@npm:^4.0.0":
   version: 4.6.2
   resolution: "tsx@npm:4.6.2"

From 90310f23910bbf103d66299d2b9c908d5bfe2b23 Mon Sep 17 00:00:00 2001
From: TheSisb <shadiisber@gmail.com>
Date: Thu, 9 May 2024 16:58:01 -0500
Subject: [PATCH 25/55] chore: checkpoint

---
 .codesandbox/ci.json                          |   1 +
 .../paste-codemods/tools/.cache/mappings.json |   7 ++
 .../__tests__/index.spec.tsx                  |   0
 .../{ai-log => ai-chat-log}/build.js          |   0
 .../{ai-log => ai-chat-log}/package.json      |   4 +-
 .../{ai-log => ai-chat-log}/src/AIChatLog.tsx |   2 +-
 .../src/AIChatLogger.tsx                      |   0
 .../src/AIChatMessage.tsx                     |   2 +-
 .../src/AIChatMessageActions.tsx}             |  21 +---
 .../ai-chat-log/src/AIChatMessageBody.tsx     |  59 ++++++++++
 .../ai-chat-log/src/AIChatMessageFeedback.tsx |  67 +++++++++++
 .../ai-chat-log/src/AIChatMessageLoading.tsx  |  56 +++++++++
 .../src/AIChatMessageMeta.tsx                 |   2 +-
 .../{ai-log => ai-chat-log}/src/index.tsx     |  12 +-
 .../src/useAIChatLogger.tsx                   |   0
 .../ai-chat-log/stories/index.stories.tsx     |  93 +++++++++++++++
 .../ai-chat-log/stories/parts.stories.tsx     | 106 ++++++++++++++++++
 .../{ai-log => ai-chat-log}/tsconfig.json     |   0
 .../ai-log/src/AIChatMessageContent.tsx       |  40 -------
 .../ai-log/stories/index.stories.tsx          |  66 -----------
 .../chat-log/stories/index.stories.tsx        |   2 -
 packages/paste-core/core-bundle/.gitignore    |   1 +
 packages/paste-core/core-bundle/package.json  |   1 +
 .../core-bundle/src/ai-chat-log.tsx           |   1 +
 packages/paste-core/core-bundle/src/index.tsx |   1 +
 yarn.lock                                     |  26 +----
 26 files changed, 416 insertions(+), 154 deletions(-)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/__tests__/index.spec.tsx (100%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/build.js (100%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/package.json (96%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/AIChatLog.tsx (94%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/AIChatLogger.tsx (100%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/AIChatMessage.tsx (93%)
 rename packages/paste-core/components/{ai-log/src/AIChatMessageMetaItem.tsx => ai-chat-log/src/AIChatMessageActions.tsx} (60%)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/AIChatMessageMeta.tsx (94%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/index.tsx (50%)
 rename packages/paste-core/components/{ai-log => ai-chat-log}/src/useAIChatLogger.tsx (100%)
 create mode 100644 packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
 rename packages/paste-core/components/{ai-log => ai-chat-log}/tsconfig.json (100%)
 delete mode 100644 packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
 delete mode 100644 packages/paste-core/components/ai-log/stories/index.stories.tsx
 create mode 100644 packages/paste-core/core-bundle/src/ai-chat-log.tsx

diff --git a/.codesandbox/ci.json b/.codesandbox/ci.json
index 60e2907c9f..7d87a66b7f 100644
--- a/.codesandbox/ci.json
+++ b/.codesandbox/ci.json
@@ -5,6 +5,7 @@
     "/packages/paste-icons",
     "/packages/paste-core/core-bundle",
     "/packages/paste-core/components/account-switcher",
+    "/packages/paste-core/components/ai-chat-log",
     "/packages/paste-core/components/alert",
     "/packages/paste-core/components/alert-dialog",
     "/packages/paste-core/components/anchor",
diff --git a/packages/paste-codemods/tools/.cache/mappings.json b/packages/paste-codemods/tools/.cache/mappings.json
index 4f44b5ffb3..6450f6294e 100644
--- a/packages/paste-codemods/tools/.cache/mappings.json
+++ b/packages/paste-codemods/tools/.cache/mappings.json
@@ -6,6 +6,13 @@
   "AccountSwitcherItemRadio": "@twilio-paste/core/account-switcher",
   "AccountSwitcherSeparator": "@twilio-paste/core/account-switcher",
   "useAccountSwitcherState": "@twilio-paste/core/account-switcher",
+  "AIChatLog": "@twilio-paste/core/ai-chat-log",
+  "AIChatLogger": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessage": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageContent": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageMeta": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageMetaItem": "@twilio-paste/core/ai-chat-log",
+  "useAIChatLogger": "@twilio-paste/core/ai-chat-log",
   "Alert": "@twilio-paste/core/alert",
   "AlertDialog": "@twilio-paste/core/alert-dialog",
   "Anchor": "@twilio-paste/core/anchor",
diff --git a/packages/paste-core/components/ai-log/__tests__/index.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
similarity index 100%
rename from packages/paste-core/components/ai-log/__tests__/index.spec.tsx
rename to packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
diff --git a/packages/paste-core/components/ai-log/build.js b/packages/paste-core/components/ai-chat-log/build.js
similarity index 100%
rename from packages/paste-core/components/ai-log/build.js
rename to packages/paste-core/components/ai-chat-log/build.js
diff --git a/packages/paste-core/components/ai-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
similarity index 96%
rename from packages/paste-core/components/ai-log/package.json
rename to packages/paste-core/components/ai-chat-log/package.json
index 8b487c5aef..1f34742229 100644
--- a/packages/paste-core/components/ai-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "@twilio-paste/ai-log",
+  "name": "@twilio-paste/ai-chat-log",
   "version": "0.0.0",
   "category": "data display",
   "status": "production",
@@ -53,7 +53,7 @@
     "@types/react-dom": "^18.0.10",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
-    "tsx": "^3.12.10",
+    "tsx": "^4.0.0",
     "typescript": "^4.9.4"
   }
 }
diff --git a/packages/paste-core/components/ai-log/src/AIChatLog.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
similarity index 94%
rename from packages/paste-core/components/ai-log/src/AIChatLog.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
index 23a31253a9..baf90b4e59 100644
--- a/packages/paste-core/components/ai-log/src/AIChatLog.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
@@ -15,7 +15,7 @@ export interface AIChatLogProps extends HTMLPasteProps<"div"> {
 }
 
 export const AIChatLog = React.forwardRef<HTMLDivElement, AIChatLogProps>(
-  ({ element = "AI_LOG", children, ...props }, ref) => {
+  ({ element = "AI_CHAT_LOG", children, ...props }, ref) => {
     return (
       <Box role="log" padding="space70" element={element} ref={ref} {...safelySpreadBoxProps(props)}>
         <Box
diff --git a/packages/paste-core/components/ai-log/src/AIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
similarity index 100%
rename from packages/paste-core/components/ai-log/src/AIChatLogger.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
similarity index 93%
rename from packages/paste-core/components/ai-log/src/AIChatMessage.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index 9f4b56e970..f576b8f0d5 100644
--- a/packages/paste-core/components/ai-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -16,7 +16,7 @@ export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
 }
 
 export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
-  ({ children, element = "CHAT_MESSAGE", ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE", ...props }, ref) => {
     return (
       <Box
         role="listitem"
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
similarity index 60%
rename from packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
index 72b7e033d2..f30ebfbc9c 100644
--- a/packages/paste-core/components/ai-log/src/AIChatMessageMetaItem.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
@@ -3,9 +3,8 @@ import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-export interface AIChatMessageMetaItemProps extends HTMLPasteProps<"div"> {
+export interface AIChatMessageActionsProps extends HTMLPasteProps<"div"> {
   children: NonNullable<React.ReactNode>;
-  variant: "author" | "timestamp";
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
@@ -16,18 +15,10 @@ export interface AIChatMessageMetaItemProps extends HTMLPasteProps<"div"> {
   element?: BoxElementProps["element"];
 }
 
-const variantStyles = {
-  author: {
-    color: "colorText",
-    lineHeight: "lineHeight50",
-    fontSize: "fontSize40",
-  },
-  timestamp: {},
-};
-
-export const AIChatMessageMetaItem = React.forwardRef<HTMLDivElement, AIChatMessageMetaItemProps>(
-  ({ children, element = "CHAT_MESSAGE_META_ITEM", ...props }, ref) => (
+export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessageActionsProps>(
+  ({ children, element = "AI_CHAT_MESSAGE_ACTIONS", ...props }, ref) => (
     <Box
+      {...safelySpreadBoxProps(props)}
       ref={ref}
       element={element}
       display="flex"
@@ -36,12 +27,10 @@ export const AIChatMessageMetaItem = React.forwardRef<HTMLDivElement, AIChatMess
       color="colorText"
       lineHeight="lineHeight50"
       fontSize="fontSize40"
-      {...variantStyles[props.variant]}
-      {...safelySpreadBoxProps(props)}
     >
       {children}
     </Box>
   ),
 );
 
-AIChatMessageMetaItem.displayName = "AIChatMessageMetaItem";
+AIChatMessageActions.displayName = "AIChatMessageActions";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
new file mode 100644
index 0000000000..1ed4a4244f
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
@@ -0,0 +1,59 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import type { ThemeShape } from "@twilio-paste/theme";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+const Variants = {
+  default: {
+    fontSize: "fontSize30" as ThemeShape["fontSizes"],
+    lineHeight: "lineHeight30" as ThemeShape["lineHeights"],
+  },
+  fullScreen: {
+    fontSize: "fontSize40" as ThemeShape["fontSizes"],
+    lineHeight: "lineHeight40" as ThemeShape["lineHeights"],
+  },
+};
+
+export interface AIChatMessageBodyProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatBubbleProps
+   */
+  element?: BoxElementProps["element"];
+  /**
+   * Override the font size for full screen experiences.
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {"default" | "fullScreen"}
+   * @memberof AIChatBubbleProps
+   */
+  variant?: "default" | "fullScreen";
+}
+
+export const AIChatMessageBody = React.forwardRef<HTMLDivElement, AIChatMessageBodyProps>(
+  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY", ...props }, ref) => {
+    return (
+      <Box
+        {...safelySpreadBoxProps(props)}
+        {...Variants[variant]}
+        display="inline-block"
+        color="colorText"
+        wordWrap="break-word"
+        maxWidth="100%"
+        minWidth={0}
+        element={element}
+        ref={ref}
+        whiteSpace="pre-wrap"
+      >
+        {children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageBody.displayName = "AIChatMessageBody";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
new file mode 100644
index 0000000000..035406ce6a
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
@@ -0,0 +1,67 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
+import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageFeedbackProps extends HTMLPasteProps<"div"> {
+  children?: never;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE_META_ITEM"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageMetaItemProps
+   */
+  element?: BoxElementProps["element"];
+  label?: string;
+  i18nLikeLabel?: string;
+  i18nDislikeLabel?: string;
+  onLike: () => void;
+  onDislike: () => void;
+}
+
+export const AIChatMessageFeedback = React.forwardRef<HTMLDivElement, AIChatMessageFeedbackProps>(
+  (
+    {
+      label = "Is this helpful?",
+      i18nLikeLabel = "Like result",
+      i18nDislikeLabel = "Dislike result",
+      onLike,
+      onDislike,
+      element = "AI_CHAT_MESSAGE_FEEDBACK",
+      ...props
+    },
+    ref,
+  ) => (
+    <Box
+      {...safelySpreadBoxProps(props)}
+      ref={ref}
+      element={element}
+      display="inline-flex"
+      alignItems="flex-start"
+      columnGap="space30"
+      marginTop="space40"
+      color="colorTextIcon"
+      lineHeight="lineHeight20"
+      fontSize="fontSize20"
+      backgroundColor="colorBackgroundBody"
+      boxShadow="shadowBorderWeaker"
+      borderRadius="borderRadius30"
+      paddingX="space30"
+      paddingY="space20"
+    >
+      <span>{label}</span>
+      <Button variant="reset" size="reset" onClick={onLike}>
+        <ThumbsUpIcon decorative={false} title={i18nLikeLabel} />
+      </Button>
+      <Button variant="reset" size="reset" onClick={onDislike}>
+        <ThumbsDownIcon decorative={false} title={i18nDislikeLabel} />
+      </Button>
+    </Box>
+  ),
+);
+
+AIChatMessageFeedback.displayName = "AIChatMessageFeedback";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
new file mode 100644
index 0000000000..67d468ae9e
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
@@ -0,0 +1,56 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { StopIcon } from "@twilio-paste/icons/esm/StopIcon";
+import { ScreenReaderOnly } from "@twilio-paste/screen-reader-only";
+import { SkeletonLoader } from "@twilio-paste/skeleton-loader";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+const clampedRandom = (min: number, max: number): number => {
+  return Math.min(Math.max(min, Math.random() * max), max);
+};
+export interface AIChatMessageLoadingProps extends HTMLPasteProps<"div"> {
+  children?: never;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_MESSAGE"
+   * @type {BoxProps["element"]}
+   * @memberof ChatMessageProps
+   */
+  element?: BoxElementProps["element"];
+  onStopLoading?: () => void;
+}
+
+export const AIChatMessageLoading = React.forwardRef<HTMLDivElement, AIChatMessageLoadingProps>(
+  ({ onStopLoading, element = "AI_CHAT_MESSAGE_LOADING", ...props }, ref) => {
+    const widths = React.useRef([clampedRandom(40, 75), clampedRandom(65, 100), clampedRandom(55, 80)]).current;
+
+    return (
+      <Box
+        {...safelySpreadBoxProps(props)}
+        ref={ref}
+        element={element}
+        role="listitem"
+        display="flex"
+        flexDirection="column"
+        rowGap="space40"
+      >
+        <SkeletonLoader width={`${widths[0]}%`} height="20px" />
+        <SkeletonLoader width={`${widths[1]}%`} height="20px" />
+        <SkeletonLoader width={`${widths[2]}%`} height="20px" />
+        {onStopLoading ? (
+          <Box display="flex" justifyContent="center">
+            <Button variant="secondary" size="rounded_small" onClick={onStopLoading}>
+              <StopIcon decorative={true} />
+              Stop generating <ScreenReaderOnly>AI response</ScreenReaderOnly>
+            </Button>
+          </Box>
+        ) : null}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageLoading.displayName = "AIChatMessageLoading";
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
similarity index 94%
rename from packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
index dd19c55fcc..188a865be7 100644
--- a/packages/paste-core/components/ai-log/src/AIChatMessageMeta.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
@@ -23,7 +23,7 @@ export interface AIChatMessageMetaProps extends HTMLPasteProps<"div"> {
 }
 
 export const AIChatMessageMeta = React.forwardRef<HTMLDivElement, AIChatMessageMetaProps>(
-  ({ children, element = "CHAT_MESSAGE_META", ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE_META", ...props }, ref) => {
     return (
       <Box
         {...safelySpreadBoxProps(props)}
diff --git a/packages/paste-core/components/ai-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
similarity index 50%
rename from packages/paste-core/components/ai-log/src/index.tsx
rename to packages/paste-core/components/ai-chat-log/src/index.tsx
index 65e31ebf04..4bccb2475e 100644
--- a/packages/paste-core/components/ai-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -2,10 +2,14 @@ export { AIChatMessage } from "./AIChatMessage";
 export type { AIChatMessageProps } from "./AIChatMessage";
 export { AIChatMessageMeta } from "./AIChatMessageMeta";
 export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
-export { AIChatMessageMetaItem } from "./AIChatMessageMetaItem";
-export type { AIChatMessageMetaItemProps } from "./AIChatMessageMetaItem";
-export { AIChatMessageContent } from "./AIChatMessageContent";
-export type { AIChatMessageContentProps } from "./AIChatMessageContent";
+export { AIChatMessageBody } from "./AIChatMessageBody";
+export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
+export { AIChatMessageActions } from "./AIChatMessageActions";
+export type { AIChatMessageActionsProps } from "./AIChatMessageActions";
+export { AIChatMessageFeedback } from "./AIChatMessageFeedback";
+export type { AIChatMessageFeedbackProps } from "./AIChatMessageFeedback";
+export { AIChatMessageLoading } from "./AIChatMessageLoading";
+export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 
 export { AIChatLog } from "./AIChatLog";
 export type { AIChatLogProps } from "./AIChatLog";
diff --git a/packages/paste-core/components/ai-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
similarity index 100%
rename from packages/paste-core/components/ai-log/src/useAIChatLogger.tsx
rename to packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
new file mode 100644
index 0000000000..5dce71eb83
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -0,0 +1,93 @@
+import * as React from "react";
+
+import { Avatar } from "@twilio-paste/avatar";
+import { Box } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { useUID } from "@twilio-paste/uid-library";
+
+import { Text } from "@twilio-paste/text";
+
+import {
+  AIChatLog,
+  AIChatMessage,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+} from "../src";
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Chat Log",
+  component: AIChatLog,
+};
+
+export const StandardUsage = (): React.ReactNode => {
+  return (
+    <AIChatLog>
+      <AIChatMessage>
+        <AIChatMessageMeta aria-label="You said">
+          <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
+          You
+        </AIChatMessageMeta>
+        <AIChatMessageBody variant="default">
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+      </AIChatMessage>
+
+      <AIChatMessage>
+        <AIChatMessageMeta aria-label="AI said">
+          <Avatar name="AI" size="sizeIcon50" icon={ArtificialIntelligenceIcon} />
+          AI Bot
+        </AIChatMessageMeta>
+        <AIChatMessageBody variant="default">
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+        <AIChatMessageMeta aria-label="Quick actions available:">
+          <ButtonGroup>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30007
+            </Button>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30007
+            </Button>
+            <Button variant="secondary" onClick={() => {}} size="small">
+              30009
+            </Button>
+          </ButtonGroup>
+        </AIChatMessageMeta>
+        <AIChatMessageMeta aria-label="Feedback form">
+          <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
+        </AIChatMessageMeta>
+      </AIChatMessage>
+
+      <AIChatMessage>
+        <AIChatMessageMeta aria-label="You said">
+          <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
+          You
+        </AIChatMessageMeta>
+        <AIChatMessageBody>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+          impedit repellat assumenda.
+        </AIChatMessageBody>
+      </AIChatMessage>
+
+      <AIChatMessage>
+        <AIChatMessageMeta aria-label="AI said">
+          <Avatar name="AI" size="sizeIcon50" icon={ArtificialIntelligenceIcon} />
+          AI Bot
+        </AIChatMessageMeta>
+        <AIChatMessageBody>
+          <AIChatMessageLoading onStopLoading={() => {}} />
+        </AIChatMessageBody>
+      </AIChatMessage>
+    </AIChatLog>
+  );
+};
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
new file mode 100644
index 0000000000..ad436df8d4
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -0,0 +1,106 @@
+import * as React from "react";
+
+import { Avatar } from "@twilio-paste/avatar";
+import { Box } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { InlineCode } from "@twilio-paste/inline-code";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { useUID } from "@twilio-paste/uid-library";
+
+import { Text } from "@twilio-paste/text";
+
+import {
+  AIChatLog,
+  AIChatMessage,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+} from "../src";
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Chat Log/Parts",
+  component: AIChatLog,
+};
+
+
+
+export const MessageBody = (): React.ReactNode => {
+  return (
+    <AIChatLog>
+      <AIChatMessageBody variant="default">Use <InlineCode>variant="default"</InlineCode> when the AI Chat Log is inside a small container.</AIChatMessageBody>
+      <AIChatMessageBody variant="fullScreen">Use <InlineCode>variant="fullSCreen"</InlineCode> when the AI Chat Log is a full screen experience.</AIChatMessageBody>
+    </AIChatLog>
+  );
+};
+
+
+export const MessageBodyWithParagraphs = (): React.ReactNode => {
+  return (
+    <AIChatLog>
+      <AIChatMessageBody variant="default">
+        <p>Test</p>
+        <p>Test</p>
+      </AIChatMessageBody>
+
+      <AIChatMessageBody variant="fullScreen">
+        <p>Test</p>
+        <p>Test</p>
+      </AIChatMessageBody>
+    </AIChatLog>
+  );
+};
+
+
+
+
+
+
+export const Loading = (): React.ReactNode => {
+  return (
+    <div>
+      <p>Pssst! The three rows have dynamic widths. Refresh to see it in action!</p>
+      <AIChatMessageLoading />
+    </div>
+  );
+};
+
+export const LoadingStopLoading = (): React.ReactNode => {
+  const [loading, setLoading] = React.useState(true);
+  return (
+    <div>
+      {loading ? (
+        <AIChatMessageLoading
+          onStopLoading={() => {
+            setLoading(false);
+          }}
+        />
+      ) : (
+        "Aborted loading!"
+      )}
+    </div>
+  );
+};
+LoadingStopLoading.storyName = "Loading with stop button";
+
+export const Feedback = (): React.ReactNode => {
+  /* eslint-disable no-alert */
+  return (
+    <AIChatMessageMeta aria-label="Feedback form">
+      <AIChatMessageFeedback onLike={() => alert("Like + 1")} onDislike={() => alert("Like - 1")} />
+    </AIChatMessageMeta>
+  );
+  /* eslint-enable no-alert */
+};
+
+export const FeedbackCustomLabels = (): React.ReactNode => {
+  /* eslint-disable no-alert */
+  return (
+    <AIChatMessageMeta aria-label="Feedback form">
+      <AIChatMessageFeedback label="Est-ce utile?" i18nDislikeLabel="pas aimer" i18nLikeLabel="aimer" onLike={() => alert("Like + 1")} onDislike={() => alert("Like - 1")} />
+    </AIChatMessageMeta>
+  );
+  /* eslint-enable no-alert */
+};
diff --git a/packages/paste-core/components/ai-log/tsconfig.json b/packages/paste-core/components/ai-chat-log/tsconfig.json
similarity index 100%
rename from packages/paste-core/components/ai-log/tsconfig.json
rename to packages/paste-core/components/ai-chat-log/tsconfig.json
diff --git a/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx b/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
deleted file mode 100644
index 0958389f62..0000000000
--- a/packages/paste-core/components/ai-log/src/AIChatMessageContent.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps, BoxStyleProps } from "@twilio-paste/box";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import * as React from "react";
-
-export interface AIChatMessageContentProps extends HTMLPasteProps<"div"> {
-  children?: React.ReactNode;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "CHAT_BUBBLE"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatBubbleProps
-   */
-  element?: BoxElementProps["element"];
-}
-
-export const AIChatMessageContent = React.forwardRef<HTMLDivElement, AIChatMessageContentProps>(
-  ({ children, element = "CHAT_MESSAGE_CONTENT", ...props }, ref) => {
-    return (
-      <Box
-        display="inline-block"
-        color="colorText"
-        fontSize="fontSize30"
-        lineHeight="lineHeight20"
-        wordWrap="break-word"
-        maxWidth="100%"
-        minWidth={0}
-        element={element}
-        ref={ref}
-        whiteSpace="pre-wrap"
-        {...safelySpreadBoxProps(props)}
-      >
-        {children}
-      </Box>
-    );
-  },
-);
-
-AIChatMessageContent.displayName = "AIChatMessageContent";
diff --git a/packages/paste-core/components/ai-log/stories/index.stories.tsx b/packages/paste-core/components/ai-log/stories/index.stories.tsx
deleted file mode 100644
index 2f9fc10400..0000000000
--- a/packages/paste-core/components/ai-log/stories/index.stories.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import * as React from "react";
-
-import { Avatar } from "@twilio-paste/avatar";
-import { Box } from "@twilio-paste/box";
-import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
-import { useUID } from "@twilio-paste/uid-library";
-import { AIChatLog, AIChatMessage, AIChatMessageContent, AIChatMessageMeta, AIChatMessageMetaItem } from "../src";
-
-// eslint-disable-next-line import/no-default-export
-export default {
-  title: "Components/AI Log",
-  component: AIChatLog,
-};
-
-export const Default = (): React.ReactNode => {
-  const [showButton, setShowButton] = React.useState(true);
-  const chatBoxUniqueID = useUID();
-  return (
-    <Box maxHeight="size40" overflowY="scroll" id={chatBoxUniqueID}>
-      <AIChatLog>
-        <AIChatMessage>
-          <AIChatMessageMeta aria-label="You said">
-            <AIChatMessageMetaItem variant="author">
-              <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
-              You
-            </AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-          <AIChatMessageContent>
-            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
-            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-            impedit repellat assumenda.
-          </AIChatMessageContent>
-          <AIChatMessageMeta aria-label="Quick actions available:">
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-          <AIChatMessageMeta aria-label="Feedback form">
-            <AIChatMessageMetaItem>Was this helpful?</AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-        </AIChatMessage>
-        <AIChatMessage variant="ai">
-          <AIChatMessageMeta aria-label="You said">
-            <AIChatMessageMetaItem>
-              <Avatar name="A" icon={ArtificialIntelligenceIcon} size="sizeIcon20" />
-              AI Bot
-            </AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-          <AIChatMessageContent>
-            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
-            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-            impedit repellat assumenda.
-          </AIChatMessageContent>
-          <AIChatMessageMeta aria-label="Quick actions available:">
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-            <AIChatMessageMetaItem>30007</AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-          <AIChatMessageMeta aria-label="Feedback form">
-            <AIChatMessageMetaItem>Was this helpful?</AIChatMessageMetaItem>
-          </AIChatMessageMeta>
-        </AIChatMessage>
-      </AIChatLog>
-    </Box>
-  );
-};
diff --git a/packages/paste-core/components/chat-log/stories/index.stories.tsx b/packages/paste-core/components/chat-log/stories/index.stories.tsx
index a591fa21dc..f2a9688dd2 100644
--- a/packages/paste-core/components/chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/chat-log/stories/index.stories.tsx
@@ -125,8 +125,6 @@ export const ScrollingChatLog: StoryFn = () => {
               <HelpText variant="error" marginTop="space0">
                 Message failed
               </HelpText>
-            </ChatMessageMetaItem>
-            <ChatMessageMetaItem>
               <Button variant="link" onClick={() => {}}>
                 Resend
               </Button>
diff --git a/packages/paste-core/core-bundle/.gitignore b/packages/paste-core/core-bundle/.gitignore
index 79a07a43be..45317993e4 100644
--- a/packages/paste-core/core-bundle/.gitignore
+++ b/packages/paste-core/core-bundle/.gitignore
@@ -1,6 +1,7 @@
 # Automatically generated from "yarn generate-packages"
 /dist
 /account-switcher
+/ai-chat-log
 /alert
 /alert-dialog
 /anchor
diff --git a/packages/paste-core/core-bundle/package.json b/packages/paste-core/core-bundle/package.json
index 42a97712ca..c04d67626d 100644
--- a/packages/paste-core/core-bundle/package.json
+++ b/packages/paste-core/core-bundle/package.json
@@ -72,6 +72,7 @@
   },
   "dependencies": {
     "@twilio-paste/account-switcher": "^3.0.1",
+    "@twilio-paste/ai-chat-log": "^0.0.0",
     "@twilio-paste/alert": "^14.1.0",
     "@twilio-paste/alert-dialog": "^9.2.0",
     "@twilio-paste/anchor": "^12.1.0",
diff --git a/packages/paste-core/core-bundle/src/ai-chat-log.tsx b/packages/paste-core/core-bundle/src/ai-chat-log.tsx
new file mode 100644
index 0000000000..4904080312
--- /dev/null
+++ b/packages/paste-core/core-bundle/src/ai-chat-log.tsx
@@ -0,0 +1 @@
+export * from "@twilio-paste/ai-chat-log";
diff --git a/packages/paste-core/core-bundle/src/index.tsx b/packages/paste-core/core-bundle/src/index.tsx
index c4f2053738..7f29ad41b1 100644
--- a/packages/paste-core/core-bundle/src/index.tsx
+++ b/packages/paste-core/core-bundle/src/index.tsx
@@ -1,4 +1,5 @@
 export * from "@twilio-paste/account-switcher";
+export * from "@twilio-paste/ai-chat-log";
 export * from "@twilio-paste/alert";
 export * from "@twilio-paste/alert-dialog";
 export * from "@twilio-paste/anchor";
diff --git a/yarn.lock b/yarn.lock
index 5b34e00e52..dd1dbdf26e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11216,9 +11216,9 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@twilio-paste/ai-log@workspace:packages/paste-core/components/ai-log":
+"@twilio-paste/ai-chat-log@^0.0.0, @twilio-paste/ai-chat-log@workspace:packages/paste-core/components/ai-chat-log":
   version: 0.0.0-use.local
-  resolution: "@twilio-paste/ai-log@workspace:packages/paste-core/components/ai-log"
+  resolution: "@twilio-paste/ai-chat-log@workspace:packages/paste-core/components/ai-chat-log"
   dependencies:
     "@twilio-paste/animation-library": ^2.0.0
     "@twilio-paste/box": ^10.2.0
@@ -11233,7 +11233,7 @@ __metadata:
     "@types/react-dom": ^18.0.10
     react: ^18.0.0
     react-dom: ^18.0.0
-    tsx: ^3.12.10
+    tsx: ^4.0.0
     typescript: ^4.9.4
   peerDependencies:
     "@twilio-paste/animation-library": ^2.0.0
@@ -12231,6 +12231,7 @@ __metadata:
   resolution: "@twilio-paste/core@workspace:packages/paste-core/core-bundle"
   dependencies:
     "@twilio-paste/account-switcher": ^3.0.1
+    "@twilio-paste/ai-chat-log": ^0.0.0
     "@twilio-paste/alert": ^14.1.0
     "@twilio-paste/alert-dialog": ^9.2.0
     "@twilio-paste/anchor": ^12.1.0
@@ -41746,7 +41747,7 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
-"source-map-support@npm:^0.5.16, source-map-support@npm:^0.5.21, source-map-support@npm:~0.5.12, source-map-support@npm:~0.5.19, source-map-support@npm:~0.5.20":
+"source-map-support@npm:^0.5.16, source-map-support@npm:~0.5.12, source-map-support@npm:~0.5.19, source-map-support@npm:~0.5.20":
   version: 0.5.21
   resolution: "source-map-support@npm:0.5.21"
   dependencies:
@@ -43758,23 +43759,6 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
-"tsx@npm:^3.12.10":
-  version: 3.14.0
-  resolution: "tsx@npm:3.14.0"
-  dependencies:
-    esbuild: ~0.18.20
-    fsevents: ~2.3.3
-    get-tsconfig: ^4.7.2
-    source-map-support: ^0.5.21
-  dependenciesMeta:
-    fsevents:
-      optional: true
-  bin:
-    tsx: dist/cli.mjs
-  checksum: afcef5d9b90b5800cf1ffb749e943f63042d78a4c0d9eef6e13e43f4ecab465d45e2c9812a2c515cbdc2ee913ff1cd01bf5c606a48013dd3ce2214a631b45557
-  languageName: node
-  linkType: hard
-
 "tsx@npm:^4.0.0":
   version: 4.6.2
   resolution: "tsx@npm:4.6.2"

From fe3e6bb21cf8f6fb143a7c62b4859143493b50ea Mon Sep 17 00:00:00 2001
From: TheSisb <shadiisber@gmail.com>
Date: Fri, 17 May 2024 14:12:44 -0500
Subject: [PATCH 26/55] chore: checkpoint more progress

---
 .../ai-chat-log/src/AIChatMessageActions.tsx  |  36 ----
 .../ai-chat-log/src/AIChatMessageAuthor.tsx   |  57 ++++++
 .../components/ai-chat-log/src/index.tsx      |   4 +-
 .../ai-chat-log/src/useAIChatLogger.tsx       |   2 +-
 .../ai-chat-log/stories/index.stories.tsx     |  28 +--
 .../stories/useAIChatLogger.storides.tsx      | 167 ++++++++++++++++++
 6 files changed, 236 insertions(+), 58 deletions(-)
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
deleted file mode 100644
index f30ebfbc9c..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps } from "@twilio-paste/box";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import * as React from "react";
-
-export interface AIChatMessageActionsProps extends HTMLPasteProps<"div"> {
-  children: NonNullable<React.ReactNode>;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "CHAT_MESSAGE_META_ITEM"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatMessageMetaItemProps
-   */
-  element?: BoxElementProps["element"];
-}
-
-export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessageActionsProps>(
-  ({ children, element = "AI_CHAT_MESSAGE_ACTIONS", ...props }, ref) => (
-    <Box
-      {...safelySpreadBoxProps(props)}
-      ref={ref}
-      element={element}
-      display="flex"
-      alignItems="flex-start"
-      columnGap="space30"
-      color="colorText"
-      lineHeight="lineHeight50"
-      fontSize="fontSize40"
-    >
-      {children}
-    </Box>
-  ),
-);
-
-AIChatMessageActions.displayName = "AIChatMessageActions";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
new file mode 100644
index 0000000000..ddbea84667
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -0,0 +1,57 @@
+import { Avatar } from "@twilio-paste/avatar";
+import type { BoxElementProps } from "@twilio-paste/box";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import type { ThemeShape } from "@twilio-paste/theme";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+import { AIChatMessageMeta } from "./AIChatMessageMeta";
+
+export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
+  /**
+   * The name of the author of the chat message
+   *
+   * @type {string}
+   * @memberof AIChatMessageAuthorProps
+   */
+  children: string;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "AI_CHAT_MESSAGE_AUTHOR"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageAuthorProps
+   */
+  element?: BoxElementProps["element"];
+  /**
+   * Screen reader label for the author
+   *
+   * @type {string}
+   * @memberof AIChatMessageAuthorProps
+   */
+  "aria-label": string;
+  /**
+   * Whether the author is a bot or not
+   *
+   * @default false
+   * @type {boolean}
+   * @memberof AIChatMessageAuthorProps
+   */
+  bot?: boolean;
+}
+
+export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
+  ({ children, bot = false, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
+    return (
+      <AIChatMessageMeta {...props} ref={ref} aria-label={props["aria-label"]} element={element}>
+        {bot ? (
+          <Avatar name={children} size="sizeIcon50" icon={ArtificialIntelligenceIcon} element={`${element}_AVATAR}`} />
+        ) : (
+          <Avatar name={children} size="sizeIcon50" color="decorative30" element={`${element}_AVATAR}`} />
+        )}
+        {children}
+      </AIChatMessageMeta>
+    );
+  },
+);
+
+AIChatMessageAuthor.displayName = "AIChatMessageAuthor";
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 4bccb2475e..06700fe480 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -4,8 +4,8 @@ export { AIChatMessageMeta } from "./AIChatMessageMeta";
 export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
 export { AIChatMessageBody } from "./AIChatMessageBody";
 export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
-export { AIChatMessageActions } from "./AIChatMessageActions";
-export type { AIChatMessageActionsProps } from "./AIChatMessageActions";
+export { AIChatMessageAuthor } from "./AIChatMessageAuthor";
+export type { AIChatMessageAuthorProps } from "./AIChatMessageAuthor";
 export { AIChatMessageFeedback } from "./AIChatMessageFeedback";
 export type { AIChatMessageFeedbackProps } from "./AIChatMessageFeedback";
 export { AIChatMessageLoading } from "./AIChatMessageLoading";
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index 6d785d5f6b..b94e034b74 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -12,7 +12,7 @@ type PushAIChat = (chat: PartialIDChat) => void;
 type PopAIChat = (id?: string) => void;
 
 export type UseAIChatLogger = (...initialChats: PartialIDChat[]) => {
-  aiChats: AIChat[];
+  chats: AIChat[];
   push: PushAIChat;
   pop: PopAIChat;
   clear: () => void;
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 5dce71eb83..8ebf1d4168 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -12,6 +12,7 @@ import { Text } from "@twilio-paste/text";
 import {
   AIChatLog,
   AIChatMessage,
+  AIChatMessageAuthor,
   AIChatMessageBody,
   AIChatMessageFeedback,
   AIChatMessageLoading,
@@ -28,22 +29,17 @@ export const StandardUsage = (): React.ReactNode => {
   return (
     <AIChatLog>
       <AIChatMessage>
-        <AIChatMessageMeta aria-label="You said">
-          <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
-          You
-        </AIChatMessageMeta>
+        <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
         <AIChatMessageBody variant="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
           impedit repellat assumenda.
         </AIChatMessageBody>
       </AIChatMessage>
-
       <AIChatMessage>
-        <AIChatMessageMeta aria-label="AI said">
-          <Avatar name="AI" size="sizeIcon50" icon={ArtificialIntelligenceIcon} />
-          AI Bot
-        </AIChatMessageMeta>
+        <AIChatMessageAuthor aria-label="AI said" bot>
+          Good Bot
+        </AIChatMessageAuthor>
         <AIChatMessageBody variant="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
@@ -66,24 +62,18 @@ export const StandardUsage = (): React.ReactNode => {
           <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
         </AIChatMessageMeta>
       </AIChatMessage>
-
       <AIChatMessage>
-        <AIChatMessageMeta aria-label="You said">
-          <Avatar name="Gibby Radki" size="sizeIcon50" color="decorative30" />
-          You
-        </AIChatMessageMeta>
+        <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
         <AIChatMessageBody>
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
           impedit repellat assumenda.
         </AIChatMessageBody>
       </AIChatMessage>
-
       <AIChatMessage>
-        <AIChatMessageMeta aria-label="AI said">
-          <Avatar name="AI" size="sizeIcon50" icon={ArtificialIntelligenceIcon} />
-          AI Bot
-        </AIChatMessageMeta>
+        <AIChatMessageAuthor aria-label="AI said" bot>
+          Good Bot
+        </AIChatMessageAuthor>
         <AIChatMessageBody>
           <AIChatMessageLoading onStopLoading={() => {}} />
         </AIChatMessageBody>
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx
new file mode 100644
index 0000000000..6b9a331d81
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx
@@ -0,0 +1,167 @@
+import type { StoryFn } from "@storybook/react";
+import { Box } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { Input } from "@twilio-paste/input";
+import { Label } from "@twilio-paste/label";
+import { ListItem, OrderedList } from "@twilio-paste/list";
+import { RadioButton, RadioButtonGroup } from "@twilio-paste/radio-button-group";
+import { Stack } from "@twilio-paste/stack";
+import { useUID } from "@twilio-paste/uid-library";
+import * as React from "react";
+
+
+
+import { Avatar } from "@twilio-paste/avatar";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+
+
+import {
+  AIChatLog
+  AIChatLoggergerger,
+  AIChatMessage,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+  useAIChatLogger
+} from "../src";
+
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Chat Log/useAIChatLogger",
+};
+
+
+
+
+
+
+export const UseChatLogger: StoryFn = () => {
+  const pushID = useUID();
+  const popID = useUID();
+  const messageID = useUID();
+  const variantId = useUID();
+
+  const { chats, push, pop, clear } = useAIChatLogger(
+    {
+      content: (
+        <AIChatMessage>
+          <AIChatMessageBody>Hi my name is Jane Doe how can I help you?</AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    },
+    {
+      content: (
+        <AIChatMessage>
+          <AIChatMessageBody>I need some help with the Twilio API</AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    },
+    {
+      content: (
+        <AIChatMessage>
+          <AIChatMessageBody>Of course! Can you provide more detail?</AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    },
+  );
+  console.log(chats, push, pop);
+
+  const handlePushSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
+    e.preventDefault();
+    const form = e.currentTarget;
+    const data = new FormData(form);
+    const message = data.get("message");
+    const variant = (data.get("variant") || "inbound") as MessageVariants;
+    const id = data.get("id");
+
+    const chat: PartialIDChat = {
+      variant,
+      content: (
+        <AIChatMessage variant={variant}>
+          <AIChatMessageBody>{message}</AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    };
+
+    if (id) {
+      chat.id = id?.toString();
+    }
+
+    push(chat);
+    form.reset();
+  };
+
+  const handlePopSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
+    e.preventDefault();
+    const form = e.currentTarget;
+    const data = new FormData(form);
+    const id = data.get("id")?.toString();
+
+    pop(id);
+    form.reset();
+  };
+
+  return (
+    <Stack orientation="vertical" spacing="space80">
+      <Box display="flex" columnGap="space80" alignItems="flex-start">
+        <form onSubmit={handlePushSubmit}>
+          <Stack orientation="vertical" spacing="space40">
+            <legend>Push</legend>
+            <div>
+              <Label required htmlFor={messageID}>
+                Message
+              </Label>
+              <Input required name="message" id={messageID} type="text" />
+            </div>
+            <div>
+              <Label htmlFor={pushID}>Push ID</Label>
+              <Input name="id" id={pushID} type="text" />
+            </div>
+            <RadioButtonGroup required id={variantId} attached name="variant" legend="variant">
+              <RadioButton value="inbound">inbound</RadioButton>
+              <RadioButton value="outbound">outbound</RadioButton>
+            </RadioButtonGroup>
+            <Button type="submit" variant="secondary">
+              Submit Push
+            </Button>
+          </Stack>
+        </form>
+        <form onSubmit={handlePopSubmit}>
+          <Stack orientation="vertical" spacing="space40">
+            <legend>Pop</legend>
+            <div>
+              <Label htmlFor={popID}>Pop ID</Label>
+              <Input name="id" id={popID} type="text" />
+            </div>
+            <Button type="submit" variant="secondary">
+              Submit Pop
+            </Button>
+          </Stack>
+        </form>
+        <Stack orientation="vertical" spacing="space40">
+          <legend>Clear</legend>
+          <Button type="submit" variant="secondary" onClick={clear}>
+            Clear All History
+          </Button>
+        </Stack>
+        <OrderedList aria-label="ordered list">
+          {chats.map(({ id }) => (
+            <ListItem key={id}>
+              <code>{id}</code>
+            </ListItem>
+          ))}
+        </OrderedList>
+      </Box>
+      <AIChatLogger chats={chats} />
+    </Stack>
+  );
+};
+UseChatLogger.parameters = {
+  a11y: {
+    // no need to a11y check composition of a11y checked components
+    disable: true,
+  },
+};

From 26de7936804072fd4af2c7e7117d11968dd08a12 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Wed, 29 May 2024 15:54:15 -0500
Subject: [PATCH 27/55] chore: typo fix

---
 .../ai-chat-log/stories/parts.stories.tsx     | 26 ++++++++++---------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index ad436df8d4..8ed5adbe19 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -4,8 +4,8 @@ import { Avatar } from "@twilio-paste/avatar";
 import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
-import { InlineCode } from "@twilio-paste/inline-code";
 import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { InlineCode } from "@twilio-paste/inline-code";
 import { useUID } from "@twilio-paste/uid-library";
 
 import { Text } from "@twilio-paste/text";
@@ -25,18 +25,19 @@ export default {
   component: AIChatLog,
 };
 
-
-
 export const MessageBody = (): React.ReactNode => {
   return (
     <AIChatLog>
-      <AIChatMessageBody variant="default">Use <InlineCode>variant="default"</InlineCode> when the AI Chat Log is inside a small container.</AIChatMessageBody>
-      <AIChatMessageBody variant="fullScreen">Use <InlineCode>variant="fullSCreen"</InlineCode> when the AI Chat Log is a full screen experience.</AIChatMessageBody>
+      <AIChatMessageBody variant="default">
+        Use <InlineCode>variant="default"</InlineCode> when the AI Chat Log is inside a small container.
+      </AIChatMessageBody>
+      <AIChatMessageBody variant="fullScreen">
+        Use <InlineCode>variant="fullScreen"</InlineCode> when the AI Chat Log is a full screen experience.
+      </AIChatMessageBody>
     </AIChatLog>
   );
 };
 
-
 export const MessageBodyWithParagraphs = (): React.ReactNode => {
   return (
     <AIChatLog>
@@ -53,11 +54,6 @@ export const MessageBodyWithParagraphs = (): React.ReactNode => {
   );
 };
 
-
-
-
-
-
 export const Loading = (): React.ReactNode => {
   return (
     <div>
@@ -99,7 +95,13 @@ export const FeedbackCustomLabels = (): React.ReactNode => {
   /* eslint-disable no-alert */
   return (
     <AIChatMessageMeta aria-label="Feedback form">
-      <AIChatMessageFeedback label="Est-ce utile?" i18nDislikeLabel="pas aimer" i18nLikeLabel="aimer" onLike={() => alert("Like + 1")} onDislike={() => alert("Like - 1")} />
+      <AIChatMessageFeedback
+        label="Est-ce utile?"
+        i18nDislikeLabel="pas aimer"
+        i18nLikeLabel="aimer"
+        onLike={() => alert("Like + 1")}
+        onDislike={() => alert("Like - 1")}
+      />
     </AIChatMessageMeta>
   );
   /* eslint-enable no-alert */

From 0f27f00cacd606a810a9973b79bd446d7575551f Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 09:58:09 -0500
Subject: [PATCH 28/55] chore: wip working useAILogger

---
 .../ai-chat-log/src/AIChatLogger.tsx          |   2 +-
 .../ai-chat-log/src/AIChatMessage.tsx         |  36 ++--
 .../ai-chat-log/src/AIChatMessageAuthor.tsx   |   6 +-
 .../ai-chat-log/src/MessageVariantContext.tsx |   4 +
 .../components/ai-chat-log/src/index.tsx      |   4 +-
 .../ai-chat-log/src/useAIChatLogger.tsx       |   4 +-
 .../ai-chat-log/stories/index.stories.tsx     |  18 +-
 .../stories/useAIChatLogger.storides.tsx      | 167 ------------------
 8 files changed, 43 insertions(+), 198 deletions(-)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
index 8424516062..6f763de617 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
@@ -22,7 +22,7 @@ export interface AIChatLoggerProps extends HTMLPasteProps<"div"> {
 }
 
 const buildTransitionX = (AIChat: AIChat): number => {
-  if (AIChat.variant === "ai") return -100;
+  if (AIChat.variant === "bot") return -100;
   if (AIChat.variant === "user") return 100;
   return 0;
 };
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index f576b8f0d5..b22978a3ba 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -1,7 +1,8 @@
 import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps, BoxStyleProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
+import { MessageVariantContext, MessageVariants } from "./MessageVariantContext";
 
 export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
@@ -13,22 +14,31 @@ export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
    * @memberof ChatMessageProps
    */
   element?: BoxElementProps["element"];
+  /**
+   *
+   * @default null
+   * @type {MessageVariants}
+   * @memberof ChatMessageProps
+   */
+  variant: MessageVariants;
 }
 
 export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
-  ({ children, element = "AI_CHAT_MESSAGE", ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE", variant, ...props }, ref) => {
     return (
-      <Box
-        role="listitem"
-        display="flex"
-        flexDirection="column"
-        rowGap="space40"
-        ref={ref}
-        element={element}
-        {...safelySpreadBoxProps(props)}
-      >
-        {children}
-      </Box>
+      <MessageVariantContext.Provider value={variant}>
+        <Box
+          role="listitem"
+          display="flex"
+          flexDirection="column"
+          rowGap="space40"
+          ref={ref}
+          element={element}
+          {...safelySpreadBoxProps(props)}
+        >
+          {children}
+        </Box>
+      </MessageVariantContext.Provider>
     );
   },
 );
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
index ddbea84667..72fe6722b4 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -1,10 +1,10 @@
 import { Avatar } from "@twilio-paste/avatar";
 import type { BoxElementProps } from "@twilio-paste/box";
 import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
-import type { ThemeShape } from "@twilio-paste/theme";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 import { AIChatMessageMeta } from "./AIChatMessageMeta";
+import { MessageVariantContext } from "./MessageVariantContext";
 
 export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
   /**
@@ -41,9 +41,11 @@ export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
 
 export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
   ({ children, bot = false, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
+    const messageVariant = React.useContext(MessageVariantContext);
+
     return (
       <AIChatMessageMeta {...props} ref={ref} aria-label={props["aria-label"]} element={element}>
-        {bot ? (
+        {messageVariant === "bot" ? (
           <Avatar name={children} size="sizeIcon50" icon={ArtificialIntelligenceIcon} element={`${element}_AVATAR}`} />
         ) : (
           <Avatar name={children} size="sizeIcon50" color="decorative30" element={`${element}_AVATAR}`} />
diff --git a/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx b/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
new file mode 100644
index 0000000000..844228bc89
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
@@ -0,0 +1,4 @@
+import * as React from "react";
+
+export type MessageVariants = "bot" | "user";
+export const MessageVariantContext = React.createContext<MessageVariants>("bot");
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 06700fe480..317c3cf0f4 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -14,6 +14,8 @@ export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 export { AIChatLog } from "./AIChatLog";
 export type { AIChatLogProps } from "./AIChatLog";
 export { useAIChatLogger } from "./useAIChatLogger";
-export type { UseAIChatLogger } from "./useAIChatLogger";
+export type { UseAIChatLogger, PartialIDChat as PartialIdChatAI } from "./useAIChatLogger";
 export { AIChatLogger } from "./AIChatLogger";
 export type { AIChatLoggerProps } from "./AIChatLogger";
+
+export type { MessageVariants } from "./MessageVariantContext";
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index b94e034b74..d1ab4c4e64 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -1,8 +1,10 @@
 import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
+import { MessageVariants } from "./MessageVariantContext";
 
 export type AIChat = {
   id: string;
+  variant: MessageVariants;
   content: React.ReactElement;
 };
 
@@ -12,7 +14,7 @@ type PushAIChat = (chat: PartialIDChat) => void;
 type PopAIChat = (id?: string) => void;
 
 export type UseAIChatLogger = (...initialChats: PartialIDChat[]) => {
-  chats: AIChat[];
+  aiChats: AIChat[];
   push: PushAIChat;
   pop: PopAIChat;
   clear: () => void;
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 8ebf1d4168..28d902432c 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -1,13 +1,7 @@
 import * as React from "react";
 
-import { Avatar } from "@twilio-paste/avatar";
-import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
-import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
-import { useUID } from "@twilio-paste/uid-library";
-
-import { Text } from "@twilio-paste/text";
 
 import {
   AIChatLog,
@@ -28,7 +22,7 @@ export default {
 export const StandardUsage = (): React.ReactNode => {
   return (
     <AIChatLog>
-      <AIChatMessage>
+      <AIChatMessage variant="user">
         <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
         <AIChatMessageBody variant="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
@@ -36,10 +30,8 @@ export const StandardUsage = (): React.ReactNode => {
           impedit repellat assumenda.
         </AIChatMessageBody>
       </AIChatMessage>
-      <AIChatMessage>
-        <AIChatMessageAuthor aria-label="AI said" bot>
-          Good Bot
-        </AIChatMessageAuthor>
+      <AIChatMessage variant="bot">
+        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
         <AIChatMessageBody variant="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
@@ -62,7 +54,7 @@ export const StandardUsage = (): React.ReactNode => {
           <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
         </AIChatMessageMeta>
       </AIChatMessage>
-      <AIChatMessage>
+      <AIChatMessage variant="user">
         <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
         <AIChatMessageBody>
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
@@ -70,7 +62,7 @@ export const StandardUsage = (): React.ReactNode => {
           impedit repellat assumenda.
         </AIChatMessageBody>
       </AIChatMessage>
-      <AIChatMessage>
+      <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said" bot>
           Good Bot
         </AIChatMessageAuthor>
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx
deleted file mode 100644
index 6b9a331d81..0000000000
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.storides.tsx
+++ /dev/null
@@ -1,167 +0,0 @@
-import type { StoryFn } from "@storybook/react";
-import { Box } from "@twilio-paste/box";
-import { Button } from "@twilio-paste/button";
-import { Input } from "@twilio-paste/input";
-import { Label } from "@twilio-paste/label";
-import { ListItem, OrderedList } from "@twilio-paste/list";
-import { RadioButton, RadioButtonGroup } from "@twilio-paste/radio-button-group";
-import { Stack } from "@twilio-paste/stack";
-import { useUID } from "@twilio-paste/uid-library";
-import * as React from "react";
-
-
-
-import { Avatar } from "@twilio-paste/avatar";
-import { ButtonGroup } from "@twilio-paste/button-group";
-import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
-
-
-import {
-  AIChatLog
-  AIChatLoggergerger,
-  AIChatMessage,
-  AIChatMessageBody,
-  AIChatMessageFeedback,
-  AIChatMessageLoading,
-  AIChatMessageMeta,
-  useAIChatLogger
-} from "../src";
-
-
-// eslint-disable-next-line import/no-default-export
-export default {
-  title: "Components/AI Chat Log/useAIChatLogger",
-};
-
-
-
-
-
-
-export const UseChatLogger: StoryFn = () => {
-  const pushID = useUID();
-  const popID = useUID();
-  const messageID = useUID();
-  const variantId = useUID();
-
-  const { chats, push, pop, clear } = useAIChatLogger(
-    {
-      content: (
-        <AIChatMessage>
-          <AIChatMessageBody>Hi my name is Jane Doe how can I help you?</AIChatMessageBody>
-        </AIChatMessage>
-      ),
-    },
-    {
-      content: (
-        <AIChatMessage>
-          <AIChatMessageBody>I need some help with the Twilio API</AIChatMessageBody>
-        </AIChatMessage>
-      ),
-    },
-    {
-      content: (
-        <AIChatMessage>
-          <AIChatMessageBody>Of course! Can you provide more detail?</AIChatMessageBody>
-        </AIChatMessage>
-      ),
-    },
-  );
-  console.log(chats, push, pop);
-
-  const handlePushSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
-    e.preventDefault();
-    const form = e.currentTarget;
-    const data = new FormData(form);
-    const message = data.get("message");
-    const variant = (data.get("variant") || "inbound") as MessageVariants;
-    const id = data.get("id");
-
-    const chat: PartialIDChat = {
-      variant,
-      content: (
-        <AIChatMessage variant={variant}>
-          <AIChatMessageBody>{message}</AIChatMessageBody>
-        </AIChatMessage>
-      ),
-    };
-
-    if (id) {
-      chat.id = id?.toString();
-    }
-
-    push(chat);
-    form.reset();
-  };
-
-  const handlePopSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
-    e.preventDefault();
-    const form = e.currentTarget;
-    const data = new FormData(form);
-    const id = data.get("id")?.toString();
-
-    pop(id);
-    form.reset();
-  };
-
-  return (
-    <Stack orientation="vertical" spacing="space80">
-      <Box display="flex" columnGap="space80" alignItems="flex-start">
-        <form onSubmit={handlePushSubmit}>
-          <Stack orientation="vertical" spacing="space40">
-            <legend>Push</legend>
-            <div>
-              <Label required htmlFor={messageID}>
-                Message
-              </Label>
-              <Input required name="message" id={messageID} type="text" />
-            </div>
-            <div>
-              <Label htmlFor={pushID}>Push ID</Label>
-              <Input name="id" id={pushID} type="text" />
-            </div>
-            <RadioButtonGroup required id={variantId} attached name="variant" legend="variant">
-              <RadioButton value="inbound">inbound</RadioButton>
-              <RadioButton value="outbound">outbound</RadioButton>
-            </RadioButtonGroup>
-            <Button type="submit" variant="secondary">
-              Submit Push
-            </Button>
-          </Stack>
-        </form>
-        <form onSubmit={handlePopSubmit}>
-          <Stack orientation="vertical" spacing="space40">
-            <legend>Pop</legend>
-            <div>
-              <Label htmlFor={popID}>Pop ID</Label>
-              <Input name="id" id={popID} type="text" />
-            </div>
-            <Button type="submit" variant="secondary">
-              Submit Pop
-            </Button>
-          </Stack>
-        </form>
-        <Stack orientation="vertical" spacing="space40">
-          <legend>Clear</legend>
-          <Button type="submit" variant="secondary" onClick={clear}>
-            Clear All History
-          </Button>
-        </Stack>
-        <OrderedList aria-label="ordered list">
-          {chats.map(({ id }) => (
-            <ListItem key={id}>
-              <code>{id}</code>
-            </ListItem>
-          ))}
-        </OrderedList>
-      </Box>
-      <AIChatLogger chats={chats} />
-    </Stack>
-  );
-};
-UseChatLogger.parameters = {
-  a11y: {
-    // no need to a11y check composition of a11y checked components
-    disable: true,
-  },
-};

From 3f6fff41c7bb30f2b0fd8c51ea90fa711f040d91 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 11:45:10 -0500
Subject: [PATCH 29/55] feat: message typewriter component

---
 .../src/AIChatMessageBodyTypeWriter.tsx       | 117 ++++++++++
 .../ai-chat-log/stories/parts.stories.tsx     |  12 ++
 .../stories/useAIChatLogger.stories.tsx       | 204 ++++++++++++++++++
 3 files changed, 333 insertions(+)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
new file mode 100644
index 0000000000..0311f086dc
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
@@ -0,0 +1,117 @@
+import { animated } from "@twilio-paste/animation-library";
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import type { ThemeShape } from "@twilio-paste/theme";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import { set } from "lodash";
+import * as React from "react";
+import { text } from "stream/consumers";
+
+const Variants = {
+  default: {
+    fontSize: "fontSize30" as ThemeShape["fontSizes"],
+    lineHeight: "lineHeight30" as ThemeShape["lineHeights"],
+  },
+  fullScreen: {
+    fontSize: "fontSize40" as ThemeShape["fontSizes"],
+    lineHeight: "lineHeight40" as ThemeShape["lineHeights"],
+  },
+};
+
+export interface AIChatMessageBodyTypeWriterProps extends HTMLPasteProps<"div"> {
+  children?: React.ReactNode;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatBubbleProps
+   */
+  element?: BoxElementProps["element"];
+  /**
+   * Override the font size for full screen experiences.
+   *
+   * @default "CHAT_BUBBLE"
+   * @type {"default" | "fullScreen"}
+   * @memberof AIChatBubbleProps
+   */
+  variant?: "default" | "fullScreen";
+  /**
+   * Whether the text should be animated with type writer effect
+   *
+   * @default false
+   * @type {boolean}
+   * @memberof AIChatMessageBodyTypeWriterProps
+   */
+  animated?: boolean;
+}
+
+export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AIChatMessageBodyTypeWriterProps>(
+  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY", animated, ...props }, ref) => {
+    const [animatedText, setAnimatedText] = React.useState("");
+    const [textOfChild, setTextOfChild] = React.useState("");
+
+    const findNestedElementText = (children: React.ReactNode): string => {
+      let text = "";
+
+      React.Children.forEach(children, (child) => {
+        if (typeof child === "string") {
+          text += child;
+        } else if (React.isValidElement(child)) {
+          text += findNestedElementText(child.props.children);
+        }
+      });
+
+      return text;
+    };
+
+    React.useEffect(() => {
+      let text=  "";
+      React.Children.forEach(children, (child) => {
+        if (typeof child === "string") {
+          text += child;
+        } else if (React.isValidElement(child)) {
+          text += findNestedElementText(child.props.children);
+        }
+      });
+
+      setTextOfChild(text);
+
+    }, []);
+
+    React.useEffect(() => {
+      let interval: NodeJS.Timeout;
+
+      if (animated) {
+        interval = setInterval(() => {
+          if (textOfChild.length > animatedText.length) {
+            setAnimatedText((prevText) => prevText + textOfChild[prevText.length]);
+          } else {
+            clearInterval(interval);
+          }
+        }, 25);
+      }
+
+      return () => clearInterval(interval);
+    }, [textOfChild, animatedText, animated]);
+
+    return (
+      <Box
+        {...safelySpreadBoxProps(props)}
+        {...Variants[variant]}
+        display="inline-block"
+        color="colorText"
+        wordWrap="break-word"
+        maxWidth="100%"
+        minWidth={0}
+        element={element}
+        ref={ref}
+        whiteSpace="pre-wrap"
+      >
+        {animated ? animatedText : children}
+      </Box>
+    );
+  },
+);
+
+AIChatMessageBodyTypeWriter.displayName = "AIChatMessageBodyTypeWriter";
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index 8ed5adbe19..3b5953d741 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -18,6 +18,7 @@ import {
   AIChatMessageLoading,
   AIChatMessageMeta,
 } from "../src";
+import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
 
 // eslint-disable-next-line import/no-default-export
 export default {
@@ -106,3 +107,14 @@ export const FeedbackCustomLabels = (): React.ReactNode => {
   );
   /* eslint-enable no-alert */
 };
+
+export const MessageBodyTypeWriter = (): React.ReactNode => {
+  return (
+    <AIChatMessageBodyTypeWriter animated={true}>
+      <span style={{ fontWeight: 600 }}>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</span> Deserunt
+      delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex
+      fugiat quisquam itaque, earum sit <a href="https://google.com">nesciunt impedit repellat assumenda.</a>
+    </AIChatMessageBodyTypeWriter>
+  );
+};
+LoadingStopLoading.storyName = "Message Body Type Writer";
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
new file mode 100644
index 0000000000..630e114b5f
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -0,0 +1,204 @@
+import type { StoryFn } from "@storybook/react";
+import { Box } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { Input } from "@twilio-paste/input";
+import { Label } from "@twilio-paste/label";
+import { ListItem, OrderedList } from "@twilio-paste/list";
+import { RadioButton, RadioButtonGroup } from "@twilio-paste/radio-button-group";
+import { Stack } from "@twilio-paste/stack";
+import { uid, useUID } from "@twilio-paste/uid-library";
+import * as React from "react";
+
+import {
+  AIChatLogger,
+  AIChatMessage,
+  AIChatMessageAuthor,
+  AIChatMessageBody,
+  AIChatMessageFeedback,
+  AIChatMessageLoading,
+  AIChatMessageMeta,
+  MessageVariants,
+  PartialIdChatAI,
+  useAIChatLogger,
+} from "../src";
+import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
+
+// eslint-disable-next-line import/no-default-export
+export default {
+  title: "Components/AI Chat Log/useAIChatLogger",
+};
+
+export const UseChatLogger: StoryFn = () => {
+  const pushID = useUID();
+  const popID = useUID();
+  const messageID = useUID();
+  const variantId = useUID();
+
+  const { aiChats, push, pop, clear } = useAIChatLogger(
+    {
+      variant: "user",
+      content: (
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    },
+    {
+      variant: "bot",
+      content: (
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt
+            delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex
+            fugiat quisquam itaque, earum sit nesciunt impedit repellat assumenda.
+          </AIChatMessageBody>
+          <AIChatMessageMeta aria-label="Quick actions available:">
+            <ButtonGroup>
+              <Button variant="secondary" onClick={() => {}} size="small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="small">
+                30009
+              </Button>
+            </ButtonGroup>
+          </AIChatMessageMeta>
+          <AIChatMessageMeta aria-label="Feedback form">
+            <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
+          </AIChatMessageMeta>{" "}
+        </AIChatMessage>
+      ),
+    },
+  );
+
+  const handlePushSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
+    e.preventDefault();
+    const form = e.currentTarget;
+    const data = new FormData(form);
+    const message = data.get("message") as string;
+    const variant = (data.get("variant") || "ai") as MessageVariants;
+    const id = data.get("id");
+    const isBot = variant === "bot";
+
+    const chat: PartialIdChatAI = {
+      variant,
+      content: (
+        <AIChatMessage variant={variant}>
+          <AIChatMessageAuthor aria-label={isBot ? "AI said" : "You said"}>
+            {isBot ? "Good Bot" : "Gibby Radki"}
+          </AIChatMessageAuthor>
+          <AIChatMessageBodyTypeWriter text={message}>{message}</AIChatMessageBodyTypeWriter>
+        </AIChatMessage>
+      ),
+    };
+
+    if (id || isBot) {
+      chat.id = id?.toString() || uid(chat.content);
+    }
+
+    if (isBot) {
+      push({
+        id: uid(chat.content),
+        variant,
+        content: (
+          <AIChatMessage variant="bot">
+            <AIChatMessageAuthor aria-label="AI said" bot>
+              Good Bot
+            </AIChatMessageAuthor>
+            <AIChatMessageBody>
+              <AIChatMessageLoading />
+            </AIChatMessageBody>
+          </AIChatMessage>
+        ),
+      });
+      setTimeout(() => {
+        pop(chat.id);
+        push(chat);
+      }, 1000);
+    } else {
+      push(chat);
+    }
+
+    form.reset();
+  };
+
+  const handlePopSubmit: React.FormEventHandler<HTMLFormElement> = (e) => {
+    e.preventDefault();
+    const form = e.currentTarget;
+    const data = new FormData(form);
+    const id = data.get("id")?.toString();
+
+    pop(id);
+    form.reset();
+  };
+
+  return (
+    <Stack orientation="vertical" spacing="space80">
+      <Box display="flex" columnGap="space80" alignItems="flex-start">
+        <form onSubmit={handlePushSubmit}>
+          <Stack orientation="vertical" spacing="space40">
+            <legend>Push</legend>
+            <div>
+              <Label required htmlFor={messageID}>
+                Message
+              </Label>
+              <Input required name="message" id={messageID} type="text" />
+            </div>
+            <div>
+              <Label htmlFor={pushID}>Push ID</Label>
+              <Input name="id" id={pushID} type="text" />
+            </div>
+            <RadioButtonGroup required id={variantId} attached name="variant" legend="variant">
+              <RadioButton value="bot">bot</RadioButton>
+              <RadioButton value="user">user</RadioButton>
+            </RadioButtonGroup>
+            <Button type="submit" variant="secondary">
+              Submit Push
+            </Button>
+          </Stack>
+        </form>
+        <form onSubmit={handlePopSubmit}>
+          <Stack orientation="vertical" spacing="space40">
+            <legend>Pop</legend>
+            <div>
+              <Label htmlFor={popID}>Pop ID</Label>
+              <Input name="id" id={popID} type="text" />
+            </div>
+            <Button type="submit" variant="secondary">
+              Submit Pop
+            </Button>
+          </Stack>
+        </form>
+        <Stack orientation="vertical" spacing="space40">
+          <legend>Clear</legend>
+          <Button type="submit" variant="secondary" onClick={clear}>
+            Clear All History
+          </Button>
+        </Stack>
+        <OrderedList aria-label="ordered list">
+          {aiChats.map(({ id }) => (
+            <ListItem key={id}>
+              <code>{id}</code>
+            </ListItem>
+          ))}
+        </OrderedList>
+      </Box>
+      <AIChatLogger AIs={aiChats} />
+    </Stack>
+  );
+};
+UseChatLogger.parameters = {
+  a11y: {
+    // no need to a11y check composition of a11y checked components
+    disable: true,
+  },
+};

From b1b8bed46bcd9351f8dba1030f078f40c93597dd Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 13:07:17 -0500
Subject: [PATCH 30/55] chore: working typewriter

---
 .../ai-chat-log/__tests__/index.spec.tsx      |  14 +-
 .../src/AIChatMessageBodyTypeWriter.tsx       | 140 ++++++++++++++----
 .../components/ai-chat-log/src/index.tsx      |   2 +
 .../ai-chat-log/stories/index.stories.tsx     |   3 +-
 .../ai-chat-log/stories/parts.stories.tsx     |  51 ++++---
 .../stories/useAIChatLogger.stories.tsx       |   8 +-
 6 files changed, 159 insertions(+), 59 deletions(-)

diff --git a/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
index 3383edf6bd..213832ca50 100644
--- a/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
+++ b/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
@@ -1,11 +1,11 @@
-import * as React from 'react';
-import {render} from '@testing-library/react';
+import { render } from "@testing-library/react";
+import * as React from "react";
 
-import {AiLog} from '../src';
+import { AIChatLog } from "../src";
 
-describe('AiLog', () => {
-  it('should render', () => {
-    const {getByText} = render(<AiLog>test</AiLog>);
-    expect(getByText('test')).toBeDefined();
+describe("AiLog", () => {
+  it("should render", () => {
+    const { getByText } = render(<AIChatLog>test</AIChatLog>);
+    expect(getByText("test")).toBeDefined();
   });
 });
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
index 0311f086dc..4bebf1c9d3 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
@@ -1,11 +1,9 @@
-import { animated } from "@twilio-paste/animation-library";
 import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { ThemeShape } from "@twilio-paste/theme";
 import type { HTMLPasteProps } from "@twilio-paste/types";
-import { set } from "lodash";
 import * as React from "react";
-import { text } from "stream/consumers";
+import { uid } from "react-uid";
 
 const Variants = {
   default: {
@@ -23,23 +21,23 @@ export interface AIChatMessageBodyTypeWriterProps extends HTMLPasteProps<"div">
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_BUBBLE"
+   * @default "AI_CHAT_MESSAGE_BODY_TYPE_WRITER"
    * @type {BoxProps["element"]}
-   * @memberof AIChatBubbleProps
+   * @memberof AIChatMessageBodyTypeWriterProps
    */
   element?: BoxElementProps["element"];
   /**
    * Override the font size for full screen experiences.
    *
-   * @default "CHAT_BUBBLE"
+   * @default "default"
    * @type {"default" | "fullScreen"}
-   * @memberof AIChatBubbleProps
+   * @memberof AIChatMessageBodyTypeWriterProps
    */
   variant?: "default" | "fullScreen";
   /**
    * Whether the text should be animated with type writer effect
    *
-   * @default false
+   * @default true
    * @type {boolean}
    * @memberof AIChatMessageBodyTypeWriterProps
    */
@@ -47,9 +45,28 @@ export interface AIChatMessageBodyTypeWriterProps extends HTMLPasteProps<"div">
 }
 
 export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AIChatMessageBodyTypeWriterProps>(
-  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY", animated, ...props }, ref) => {
-    const [animatedText, setAnimatedText] = React.useState("");
-    const [textOfChild, setTextOfChild] = React.useState("");
+  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY_TYPE_WRITER", animated = true, ...props }, ref) => {
+    const [textLessChildren, setTextLessChildren] = React.useState<React.ReactNode[]>([]);
+    const [animatedChildren, setAnimatedChildren] = React.useState<React.ReactNode[]>([]);
+    const [childrenText, setChildrenText] = React.useState<string[]>([]);
+
+    // Initially split all children from text and elements
+    React.useEffect(() => {
+      if (textLessChildren.length === 0 && childrenText.length === 0 && animated) {
+        React.Children.forEach(children, (child) => {
+          // Strings dn onot neet to copy props
+          if (typeof child === "string") {
+            setChildrenText((prevState) => [...prevState, child]);
+            setTextLessChildren((prevState) => [...prevState, ""]);
+          } else if (React.isValidElement(child)) {
+            setChildrenText((prevState) => [...prevState, findNestedElementText(child.props.children)]);
+            const { children, ...rest } = child.props;
+            // by using {...rest} we take all props except children (the text inside the element )
+            setTextLessChildren((prevState) => [...prevState, <child.type {...rest} />]);
+          }
+        });
+      }
+    }, []);
 
     const findNestedElementText = (children: React.ReactNode): string => {
       let text = "";
@@ -58,6 +75,7 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
         if (typeof child === "string") {
           text += child;
         } else if (React.isValidElement(child)) {
+          // Recursively find text in nested elements
           text += findNestedElementText(child.props.children);
         }
       });
@@ -65,35 +83,95 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
       return text;
     };
 
-    React.useEffect(() => {
-      let text=  "";
-      React.Children.forEach(children, (child) => {
-        if (typeof child === "string") {
-          text += child;
-        } else if (React.isValidElement(child)) {
-          text += findNestedElementText(child.props.children);
-        }
-      });
+    const handleAnimationChangeForChild = (index: number) => {
+      const animationChild = animatedChildren[index];
+      const textForChild = childrenText[index];
 
-      setTextOfChild(text);
+      let currentText = "";
 
-    }, []);
+      if (React.isValidElement(animationChild)) {
+        currentText += findNestedElementText(animationChild.props.children);
+        setAnimatedChildren((prev) =>
+          prev.map((el, i) => {
+            if (i === index) {
+              return (
+                <animationChild.type {...animationChild.props}>
+                  {findNestedElementText(animationChild.props.children) + textForChild[currentText.length]}
+                </animationChild.type>
+              );
+            }
+            return el;
+          }),
+        );
+      } else {
+        currentText += animationChild;
+        setAnimatedChildren((prev) =>
+          prev.map((el, i) => {
+            if (i === index) {
+              return currentText + textForChild[currentText.length];
+            }
+            return el;
+          }),
+        );
+      }
+    };
+
+    const handleAddNewAnimatedElWithFirstChar = (index: number) => {
+      const textForChild = childrenText[index];
+      const child = React.Children.toArray(children)[index];
+
+      if (React.isValidElement(child)) {
+        setAnimatedChildren((prevState) => [...prevState, <child.type {...child.props}>{textForChild[0]}</child.type>]);
+      } else {
+        setAnimatedChildren((prevState) => [...prevState, textForChild[0]]);
+      }
+    };
 
     React.useEffect(() => {
       let interval: NodeJS.Timeout;
 
       if (animated) {
         interval = setInterval(() => {
-          if (textOfChild.length > animatedText.length) {
-            setAnimatedText((prevText) => prevText + textOfChild[prevText.length]);
-          } else {
-            clearInterval(interval);
+          if (textLessChildren.length > 0 && childrenText.length > 0) {
+            if (animatedChildren.length === 0) {
+              handleAddNewAnimatedElWithFirstChar(0);
+            } else {
+              /**
+               * Find the index of an element in the animated children array where the text content does not
+               * match the text length passed in
+               */
+              const indexOfElementToUpdate = animatedChildren.findIndex((child, i) => {
+                let currentText = "";
+
+                if (React.isValidElement(child)) {
+                  currentText += findNestedElementText(child.props.children);
+                } else {
+                  currentText += child;
+                }
+                if (currentText.length < childrenText[i].length) {
+                  return true;
+                }
+                return false;
+              });
+
+              if (indexOfElementToUpdate >= 0) {
+                handleAnimationChangeForChild(indexOfElementToUpdate);
+              }
+              // If text content matches another check is needed to add the next element that is missing
+              if (indexOfElementToUpdate === -1 && animatedChildren.length < textLessChildren.length) {
+                handleAddNewAnimatedElWithFirstChar(animatedChildren.length);
+              }
+              // If no element is missing and all text is the stop the interval
+              else {
+                clearInterval(interval);
+              }
+            }
           }
         }, 25);
       }
 
       return () => clearInterval(interval);
-    }, [textOfChild, animatedText, animated]);
+    }, [textLessChildren, childrenText, animatedChildren]);
 
     return (
       <Box
@@ -108,7 +186,13 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
         ref={ref}
         whiteSpace="pre-wrap"
       >
-        {animated ? animatedText : children}
+        {animated
+          ? animatedChildren.map((el, idx) => (
+              <Box as="span" key={uid(idx)}>
+                {el}
+              </Box>
+            ))
+          : children}
       </Box>
     );
   },
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 317c3cf0f4..0d551188f5 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -4,6 +4,8 @@ export { AIChatMessageMeta } from "./AIChatMessageMeta";
 export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
 export { AIChatMessageBody } from "./AIChatMessageBody";
 export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
+export { AIChatMessageBodyTypeWriter } from "./AIChatMessageBodyTypeWriter";
+export type { AIChatMessageBodyTypeWriterProps } from "./AIChatMessageBodyTypeWriter";
 export { AIChatMessageAuthor } from "./AIChatMessageAuthor";
 export type { AIChatMessageAuthorProps } from "./AIChatMessageAuthor";
 export { AIChatMessageFeedback } from "./AIChatMessageFeedback";
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 28d902432c..84cb5c6a91 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -1,7 +1,6 @@
-import * as React from "react";
-
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
+import * as React from "react";
 
 import {
   AIChatLog,
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index 3b5953d741..10640140be 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -1,24 +1,18 @@
-import * as React from "react";
-
-import { Avatar } from "@twilio-paste/avatar";
+import { Anchor } from "@twilio-paste/anchor";
 import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
-import { ButtonGroup } from "@twilio-paste/button-group";
-import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import { Heading } from "@twilio-paste/heading";
 import { InlineCode } from "@twilio-paste/inline-code";
-import { useUID } from "@twilio-paste/uid-library";
-
-import { Text } from "@twilio-paste/text";
+import * as React from "react";
 
 import {
   AIChatLog,
-  AIChatMessage,
   AIChatMessageBody,
+  AIChatMessageBodyTypeWriter,
   AIChatMessageFeedback,
   AIChatMessageLoading,
   AIChatMessageMeta,
 } from "../src";
-import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
 
 // eslint-disable-next-line import/no-default-export
 export default {
@@ -30,10 +24,10 @@ export const MessageBody = (): React.ReactNode => {
   return (
     <AIChatLog>
       <AIChatMessageBody variant="default">
-        Use <InlineCode>variant="default"</InlineCode> when the AI Chat Log is inside a small container.
+        Use <InlineCode>variant=&quot;default&quot;</InlineCode> when the AI Chat Log is inside a small container.
       </AIChatMessageBody>
       <AIChatMessageBody variant="fullScreen">
-        Use <InlineCode>variant="fullScreen"</InlineCode> when the AI Chat Log is a full screen experience.
+        Use <InlineCode>variant=&quot;fullScreen&quot;</InlineCode> when the AI Chat Log is a full screen experience.
       </AIChatMessageBody>
     </AIChatLog>
   );
@@ -110,11 +104,32 @@ export const FeedbackCustomLabels = (): React.ReactNode => {
 
 export const MessageBodyTypeWriter = (): React.ReactNode => {
   return (
-    <AIChatMessageBodyTypeWriter animated={true}>
-      <span style={{ fontWeight: 600 }}>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</span> Deserunt
-      delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex
-      fugiat quisquam itaque, earum sit <a href="https://google.com">nesciunt impedit repellat assumenda.</a>
-    </AIChatMessageBodyTypeWriter>
+    <Box>
+      <Heading as="h2" variant="heading20">
+        With enriched text
+      </Heading>
+      <Box marginBottom="space60">
+        <AIChatMessageBodyTypeWriter animated={true}>
+          <span style={{ fontWeight: 600 }}>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</span> Deserunt
+          delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat
+          quisquam itaque, earum sit <a href="https://google.com">nesciunt impedit repellat assumenda.</a> new text,{" "}
+          <Anchor showExternal href="https://google.com">
+            434324
+          </Anchor>
+          <Button variant="secondary">30007</Button>
+        </AIChatMessageBodyTypeWriter>
+      </Box>
+      <Heading as="h2" variant="heading20">
+        Without enriched text:
+      </Heading>
+
+      <Box>
+        <AIChatMessageBodyTypeWriter animated={true}>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendiiure
+          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
+        </AIChatMessageBodyTypeWriter>
+      </Box>
+    </Box>
   );
 };
-LoadingStopLoading.storyName = "Message Body Type Writer";
+MessageBodyTypeWriter.storyName = "Message Body Type Writer";
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index 630e114b5f..28969c6e07 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -55,9 +55,9 @@ export const UseChatLogger: StoryFn = () => {
         <AIChatMessage variant="bot">
           <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
           <AIChatMessageBody>
-            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt
-            delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex
-            fugiat quisquam itaque, earum sit nesciunt impedit repellat assumenda.
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus
+            eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
+            nesciunt impedit repellat assumenda.
           </AIChatMessageBody>
           <AIChatMessageMeta aria-label="Quick actions available:">
             <ButtonGroup>
@@ -96,7 +96,7 @@ export const UseChatLogger: StoryFn = () => {
           <AIChatMessageAuthor aria-label={isBot ? "AI said" : "You said"}>
             {isBot ? "Good Bot" : "Gibby Radki"}
           </AIChatMessageAuthor>
-          <AIChatMessageBodyTypeWriter text={message}>{message}</AIChatMessageBodyTypeWriter>
+          <AIChatMessageBodyTypeWriter>{message}</AIChatMessageBodyTypeWriter>
         </AIChatMessage>
       ),
     };

From 2da7c1a503e77fc57bfd8e88a64c64fb6aa22a05 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 13:45:05 -0500
Subject: [PATCH 31/55] chore: name cleanup and JSDoc

---
 .../components/ai-chat-log/src/AIChatLog.tsx    |  2 +-
 .../components/ai-chat-log/src/AIChatLogger.tsx | 14 +++++++-------
 .../ai-chat-log/src/AIChatMessage.tsx           | 17 +++++++++--------
 .../ai-chat-log/src/AIChatMessageAuthor.tsx     |  4 ++--
 .../ai-chat-log/src/AIChatMessageBody.tsx       |  8 ++++----
 .../ai-chat-log/src/AIChatMessageFeedback.tsx   |  4 ++--
 .../ai-chat-log/src/AIChatMessageLoading.tsx    |  4 ++--
 .../ai-chat-log/src/AIChatMessageMeta.tsx       |  2 +-
 .../ai-chat-log/src/AIMessageVariantContext.tsx |  4 ++++
 .../ai-chat-log/src/MessageVariantContext.tsx   |  4 ----
 .../components/ai-chat-log/src/index.tsx        |  4 ++--
 .../ai-chat-log/src/useAIChatLogger.tsx         | 12 ++++++------
 .../ai-chat-log/stories/parts.stories.tsx       |  4 ++--
 .../stories/useAIChatLogger.stories.tsx         | 10 +++++-----
 14 files changed, 47 insertions(+), 46 deletions(-)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
index baf90b4e59..c1db631fc2 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
@@ -7,7 +7,7 @@ export interface AIChatLogProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
-   * @default '{constantCase component-name}'
+   * @default 'AI_CHAT_LOG'
    * @type {BoxProps['element']}
    * @memberof AIChatLogProps
    */
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
index 6f763de617..723a6e4791 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
@@ -13,11 +13,11 @@ export interface AIChatLoggerProps extends HTMLPasteProps<"div"> {
   /**
    * Array of AIs in the log. Use with useAIChatLogger()
    *
-   * @default 'AI_ATTACHMENT'
-   * @type {BoxProps['element']}
-   * @memberof AIAttachmentProps
+   * @default null
+   * @type {AIChat[]}
+   * @memberof AIChatLoggerProps
    */
-  AIs: AIChat[];
+  aiChats: AIChat[];
   children?: never;
 }
 
@@ -27,8 +27,8 @@ const buildTransitionX = (AIChat: AIChat): number => {
   return 0;
 };
 
-export const AIChatLogger = React.forwardRef<HTMLDivElement, AIChatLoggerProps>(({ AIs, ...props }, ref) => {
-  const transitions = useTransition(AIs, {
+export const AIChatLogger = React.forwardRef<HTMLDivElement, AIChatLoggerProps>(({ aiChats, ...props }, ref) => {
+  const transitions = useTransition(aiChats, {
     keys: (AIChat: AIChat) => AIChat.id,
     from: (AIChat: AIChat): StyleProps => ({ opacity: 0, x: buildTransitionX(AIChat) }),
     enter: { opacity: 1, x: 0 },
@@ -41,7 +41,7 @@ export const AIChatLogger = React.forwardRef<HTMLDivElement, AIChatLoggerProps>(
   });
 
   const animatedAIs = useReducedMotion()
-    ? AIs.map((AIChat) => React.cloneElement(AIChat.content, { key: AIChat.id }))
+    ? aiChats.map((AIChat) => React.cloneElement(AIChat.content, { key: AIChat.id }))
     : transitions((styles: StyleProps, AIChat: AIChat, { key }: { key: string }) => (
         <AnimatedAI as="div" style={styles} key={key}>
           {AIChat.content}
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index b22978a3ba..4c5cac61e5 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -2,31 +2,32 @@ import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
-import { MessageVariantContext, MessageVariants } from "./MessageVariantContext";
+import { AIMessageVariantContext, AIMessageVariants } from "./AIMessageVariantContext";
 
 export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_MESSAGE"
+   * @default "AI_CHAT_MESSAGE"
    * @type {BoxProps["element"]}
-   * @memberof ChatMessageProps
+   * @memberof AIChatMessageProps
    */
   element?: BoxElementProps["element"];
   /**
+   * The variant of the message to distiguish between user and bot messages
    *
    * @default null
-   * @type {MessageVariants}
-   * @memberof ChatMessageProps
+   * @type {AIMessageVariants}
+   * @memberof AIChatMessageProps
    */
-  variant: MessageVariants;
+  variant: AIMessageVariants;
 }
 
 export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
   ({ children, element = "AI_CHAT_MESSAGE", variant, ...props }, ref) => {
     return (
-      <MessageVariantContext.Provider value={variant}>
+      <AIMessageVariantContext.Provider value={variant}>
         <Box
           role="listitem"
           display="flex"
@@ -38,7 +39,7 @@ export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps
         >
           {children}
         </Box>
-      </MessageVariantContext.Provider>
+      </AIMessageVariantContext.Provider>
     );
   },
 );
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
index 72fe6722b4..fb3fc3df5d 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -4,7 +4,7 @@ import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIn
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 import { AIChatMessageMeta } from "./AIChatMessageMeta";
-import { MessageVariantContext } from "./MessageVariantContext";
+import { AIMessageVariantContext } from "./AIMessageVariantContext";
 
 export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
   /**
@@ -41,7 +41,7 @@ export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
 
 export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
   ({ children, bot = false, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
-    const messageVariant = React.useContext(MessageVariantContext);
+    const messageVariant = React.useContext(AIMessageVariantContext);
 
     return (
       <AIChatMessageMeta {...props} ref={ref} aria-label={props["aria-label"]} element={element}>
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
index 1ed4a4244f..cd826d1cf1 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
@@ -20,17 +20,17 @@ export interface AIChatMessageBodyProps extends HTMLPasteProps<"div"> {
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_BUBBLE"
+   * @default "AI_CHAT_MESSAGE_BODY"
    * @type {BoxProps["element"]}
-   * @memberof AIChatBubbleProps
+   * @memberof AIChatMessageBodyProps
    */
   element?: BoxElementProps["element"];
   /**
    * Override the font size for full screen experiences.
    *
-   * @default "CHAT_BUBBLE"
+   * @default "default"
    * @type {"default" | "fullScreen"}
-   * @memberof AIChatBubbleProps
+   * @memberof AIChatMessageBodyProps
    */
   variant?: "default" | "fullScreen";
 }
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
index 035406ce6a..90cecd703e 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
@@ -11,9 +11,9 @@ export interface AIChatMessageFeedbackProps extends HTMLPasteProps<"div"> {
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_MESSAGE_META_ITEM"
+   * @default "AI_CHAT_MESSAGE_FEEDBACK"
    * @type {BoxProps["element"]}
-   * @memberof AIChatMessageMetaItemProps
+   * @memberof AIChatMessageFeedbackProps
    */
   element?: BoxElementProps["element"];
   label?: string;
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
index 67d468ae9e..6758a04436 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
@@ -15,9 +15,9 @@ export interface AIChatMessageLoadingProps extends HTMLPasteProps<"div"> {
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_MESSAGE"
+   * @default "AI_CHAT_MESSAGE_LOADING"
    * @type {BoxProps["element"]}
-   * @memberof ChatMessageProps
+   * @memberof AIChatMessageLoadingProps
    */
   element?: BoxElementProps["element"];
   onStopLoading?: () => void;
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
index 188a865be7..714357a84a 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
@@ -15,7 +15,7 @@ export interface AIChatMessageMetaProps extends HTMLPasteProps<"div"> {
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "CHAT_MESSAGE_META"
+   * @default "AI_CHAT_MESSAGE_META"
    * @type {BoxProps["element"]}
    * @memberof AIChatMessageMetaProps
    */
diff --git a/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx b/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
new file mode 100644
index 0000000000..24f10cc224
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
@@ -0,0 +1,4 @@
+import * as React from "react";
+
+export type AIMessageVariants = "bot" | "user";
+export const AIMessageVariantContext = React.createContext<AIMessageVariants>("bot");
diff --git a/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx b/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
deleted file mode 100644
index 844228bc89..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/MessageVariantContext.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-import * as React from "react";
-
-export type MessageVariants = "bot" | "user";
-export const MessageVariantContext = React.createContext<MessageVariants>("bot");
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 0d551188f5..024fb0f2b0 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -16,8 +16,8 @@ export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 export { AIChatLog } from "./AIChatLog";
 export type { AIChatLogProps } from "./AIChatLog";
 export { useAIChatLogger } from "./useAIChatLogger";
-export type { UseAIChatLogger, PartialIDChat as PartialIdChatAI } from "./useAIChatLogger";
+export type { UseAIChatLogger, AIPartialIDChat } from "./useAIChatLogger";
 export { AIChatLogger } from "./AIChatLogger";
 export type { AIChatLoggerProps } from "./AIChatLogger";
 
-export type { MessageVariants } from "./MessageVariantContext";
+export type { AIMessageVariants } from "./AIMessageVariantContext";
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index d1ab4c4e64..1ff2cf2b6a 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -1,26 +1,26 @@
 import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
-import { MessageVariants } from "./MessageVariantContext";
+import { AIMessageVariants } from "./AIMessageVariantContext";
 
 export type AIChat = {
   id: string;
-  variant: MessageVariants;
+  variant: AIMessageVariants;
   content: React.ReactElement;
 };
 
-export type PartialIDChat = Omit<AIChat, "id"> & Partial<Pick<AIChat, "id">>;
+export type AIPartialIDChat = Omit<AIChat, "id"> & Partial<Pick<AIChat, "id">>;
 
-type PushAIChat = (chat: PartialIDChat) => void;
+type PushAIChat = (chat: AIPartialIDChat) => void;
 type PopAIChat = (id?: string) => void;
 
-export type UseAIChatLogger = (...initialChats: PartialIDChat[]) => {
+export type UseAIChatLogger = (...initialChats: AIPartialIDChat[]) => {
   aiChats: AIChat[];
   push: PushAIChat;
   pop: PopAIChat;
   clear: () => void;
 };
 
-const aiChatWithId = (chat: PartialIDChat): AIChat => ({ ...chat, id: chat.id || uid(chat.content) });
+const aiChatWithId = (chat: AIPartialIDChat): AIChat => ({ ...chat, id: chat.id || uid(chat.content) });
 
 export const useAIChatLogger: UseAIChatLogger = (...initialChats) => {
   const parsedInitialChats = React.useMemo(() => initialChats.map(aiChatWithId), [initialChats]);
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index 10640140be..e84fbe392a 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -120,11 +120,11 @@ export const MessageBodyTypeWriter = (): React.ReactNode => {
         </AIChatMessageBodyTypeWriter>
       </Box>
       <Heading as="h2" variant="heading20">
-        Without enriched text:
+        Without enriched text [fullscreen variant]:
       </Heading>
 
       <Box>
-        <AIChatMessageBodyTypeWriter animated={true}>
+        <AIChatMessageBodyTypeWriter animated={true} variant="fullScreen">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendiiure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
         </AIChatMessageBodyTypeWriter>
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index 28969c6e07..fe4268b651 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -18,8 +18,8 @@ import {
   AIChatMessageFeedback,
   AIChatMessageLoading,
   AIChatMessageMeta,
-  MessageVariants,
-  PartialIdChatAI,
+  AIMessageVariants,
+  AIPartialIDChat,
   useAIChatLogger,
 } from "../src";
 import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
@@ -85,11 +85,11 @@ export const UseChatLogger: StoryFn = () => {
     const form = e.currentTarget;
     const data = new FormData(form);
     const message = data.get("message") as string;
-    const variant = (data.get("variant") || "ai") as MessageVariants;
+    const variant = (data.get("variant") || "ai") as AIMessageVariants;
     const id = data.get("id");
     const isBot = variant === "bot";
 
-    const chat: PartialIdChatAI = {
+    const chat: AIPartialIDChat = {
       variant,
       content: (
         <AIChatMessage variant={variant}>
@@ -192,7 +192,7 @@ export const UseChatLogger: StoryFn = () => {
           ))}
         </OrderedList>
       </Box>
-      <AIChatLogger AIs={aiChats} />
+      <AIChatLogger aiChats={aiChats} />
     </Stack>
   );
 };

From 86c31f387ca8ea57bf397293c4681ed318bf7a4e Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 15:37:52 -0500
Subject: [PATCH 32/55] chore: lint updates

---
 .../components/ai-chat-log/build.js           |  4 +-
 .../components/ai-chat-log/package.json       | 12 +++++
 .../ai-chat-log/src/AIChatMessage.tsx         |  4 +-
 .../ai-chat-log/src/AIChatMessageAuthor.tsx   | 11 +----
 .../src/AIChatMessageBodyTypeWriter.tsx       | 47 ++++++++++---------
 .../ai-chat-log/src/useAIChatLogger.tsx       |  1 +
 .../ai-chat-log/stories/parts.stories.tsx     | 22 +++++++--
 .../stories/useAIChatLogger.stories.tsx       |  6 +--
 yarn.lock                                     | 12 +++++
 9 files changed, 79 insertions(+), 40 deletions(-)

diff --git a/packages/paste-core/components/ai-chat-log/build.js b/packages/paste-core/components/ai-chat-log/build.js
index a4edeab49b..27dd98f98e 100644
--- a/packages/paste-core/components/ai-chat-log/build.js
+++ b/packages/paste-core/components/ai-chat-log/build.js
@@ -1,3 +1,3 @@
-const {build} = require('../../../../tools/build/esbuild');
+const { build } = require("../../../../tools/build/esbuild");
 
-build(require('./package.json'));
+build(require("./package.json"));
diff --git a/packages/paste-core/components/ai-chat-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
index 1f34742229..c3d4346c84 100644
--- a/packages/paste-core/components/ai-chat-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -26,14 +26,20 @@
   },
   "peerDependencies": {
     "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/avatar": "^9.0.0",
     "@twilio-paste/box": "^10.2.0",
+    "@twilio-paste/button": "^14.0.0",
     "@twilio-paste/color-contrast-utils": "^5.0.0",
     "@twilio-paste/customization": "^8.1.1",
     "@twilio-paste/design-tokens": "^10.3.0",
+    "@twilio-paste/icons": "^12.0.0",
+    "@twilio-paste/screen-reader-only": "^13.0.0",
+    "@twilio-paste/skeleton-loader": "^6.1.0",
     "@twilio-paste/style-props": "^9.1.1",
     "@twilio-paste/styling-library": "^3.0.0",
     "@twilio-paste/theme": "^11.0.1",
     "@twilio-paste/types": "^6.0.0",
+    "@twilio-paste/uid-library": "^2.0.0",
     "@types/react": "^16.8.6 || ^17.0.2 || ^18.0.27",
     "@types/react-dom": "^16.8.6 || ^17.0.2 || ^18.0.10",
     "react": "^16.8.6 || ^17.0.2 || ^18.0.0",
@@ -41,14 +47,20 @@
   },
   "devDependencies": {
     "@twilio-paste/animation-library": "^2.0.0",
+    "@twilio-paste/avatar": "^9.1.0",
     "@twilio-paste/box": "^10.2.0",
+    "@twilio-paste/button": "^14.1.0",
     "@twilio-paste/color-contrast-utils": "^5.0.0",
     "@twilio-paste/customization": "^8.1.1",
     "@twilio-paste/design-tokens": "^10.3.0",
+    "@twilio-paste/icons": "^12.2.1",
+    "@twilio-paste/screen-reader-only": "^13.1.1",
+    "@twilio-paste/skeleton-loader": "^6.1.0",
     "@twilio-paste/style-props": "^9.1.1",
     "@twilio-paste/styling-library": "^3.0.0",
     "@twilio-paste/theme": "^11.0.1",
     "@twilio-paste/types": "^6.0.0",
+    "@twilio-paste/uid-library": "^2.0.0",
     "@types/react": "^18.0.27",
     "@types/react-dom": "^18.0.10",
     "react": "^18.0.0",
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index 4c5cac61e5..612f4debf7 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -2,7 +2,9 @@ import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
-import { AIMessageVariantContext, AIMessageVariants } from "./AIMessageVariantContext";
+
+import { AIMessageVariantContext } from "./AIMessageVariantContext";
+import type { AIMessageVariants } from "./AIMessageVariantContext";
 
 export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
index fb3fc3df5d..05e522ce32 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -3,6 +3,7 @@ import type { BoxElementProps } from "@twilio-paste/box";
 import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
+
 import { AIChatMessageMeta } from "./AIChatMessageMeta";
 import { AIMessageVariantContext } from "./AIMessageVariantContext";
 
@@ -29,18 +30,10 @@ export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
    * @memberof AIChatMessageAuthorProps
    */
   "aria-label": string;
-  /**
-   * Whether the author is a bot or not
-   *
-   * @default false
-   * @type {boolean}
-   * @memberof AIChatMessageAuthorProps
-   */
-  bot?: boolean;
 }
 
 export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
-  ({ children, bot = false, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
     const messageVariant = React.useContext(AIMessageVariantContext);
 
     return (
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
index 4bebf1c9d3..e4a9f4f2e2 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
@@ -2,8 +2,8 @@ import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { ThemeShape } from "@twilio-paste/theme";
 import type { HTMLPasteProps } from "@twilio-paste/types";
+import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
-import { uid } from "react-uid";
 
 const Variants = {
   default: {
@@ -50,6 +50,21 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
     const [animatedChildren, setAnimatedChildren] = React.useState<React.ReactNode[]>([]);
     const [childrenText, setChildrenText] = React.useState<string[]>([]);
 
+    const findNestedElementText = (elementNode: React.ReactNode): string => {
+      let text = "";
+
+      React.Children.forEach(elementNode, (child) => {
+        if (typeof child === "string") {
+          text += child;
+        } else if (React.isValidElement(child)) {
+          // Recursively find text in nested elements
+          text += findNestedElementText(child.props.children);
+        }
+      });
+
+      return text;
+    };
+
     // Initially split all children from text and elements
     React.useEffect(() => {
       if (textLessChildren.length === 0 && childrenText.length === 0 && animated) {
@@ -60,30 +75,15 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
             setTextLessChildren((prevState) => [...prevState, ""]);
           } else if (React.isValidElement(child)) {
             setChildrenText((prevState) => [...prevState, findNestedElementText(child.props.children)]);
-            const { children, ...rest } = child.props;
+            const { children: elementChildren, ...rest } = child.props;
             // by using {...rest} we take all props except children (the text inside the element )
-            setTextLessChildren((prevState) => [...prevState, <child.type {...rest} />]);
+            setTextLessChildren((prevState) => [...prevState, <child.type key={rest.key} {...rest} />]);
           }
         });
       }
     }, []);
 
-    const findNestedElementText = (children: React.ReactNode): string => {
-      let text = "";
-
-      React.Children.forEach(children, (child) => {
-        if (typeof child === "string") {
-          text += child;
-        } else if (React.isValidElement(child)) {
-          // Recursively find text in nested elements
-          text += findNestedElementText(child.props.children);
-        }
-      });
-
-      return text;
-    };
-
-    const handleAnimationChangeForChild = (index: number) => {
+    const handleAnimationChangeForChild = (index: number): void => {
       const animationChild = animatedChildren[index];
       const textForChild = childrenText[index];
 
@@ -116,12 +116,17 @@ export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AICh
       }
     };
 
-    const handleAddNewAnimatedElWithFirstChar = (index: number) => {
+    const handleAddNewAnimatedElWithFirstChar = (index: number): void => {
       const textForChild = childrenText[index];
       const child = React.Children.toArray(children)[index];
 
       if (React.isValidElement(child)) {
-        setAnimatedChildren((prevState) => [...prevState, <child.type {...child.props}>{textForChild[0]}</child.type>]);
+        setAnimatedChildren((prevState) => [
+          ...prevState,
+          <child.type key={child.props.key} {...child.props}>
+            {textForChild[0]}
+          </child.type>,
+        ]);
       } else {
         setAnimatedChildren((prevState) => [...prevState, textForChild[0]]);
       }
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index 1ff2cf2b6a..5d319afab2 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -1,5 +1,6 @@
 import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
+
 import { AIMessageVariants } from "./AIMessageVariantContext";
 
 export type AIChat = {
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index e84fbe392a..d7e3a32c55 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -1,6 +1,7 @@
 import { Anchor } from "@twilio-paste/anchor";
 import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
+import { Disclosure, DisclosureContent, DisclosureHeading } from "@twilio-paste/disclosure";
 import { Heading } from "@twilio-paste/heading";
 import { InlineCode } from "@twilio-paste/inline-code";
 import * as React from "react";
@@ -109,22 +110,37 @@ export const MessageBodyTypeWriter = (): React.ReactNode => {
         With enriched text
       </Heading>
       <Box marginBottom="space60">
-        <AIChatMessageBodyTypeWriter animated={true}>
+        <AIChatMessageBodyTypeWriter>
           <span style={{ fontWeight: 600 }}>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</span> Deserunt
           delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat
           quisquam itaque, earum sit <a href="https://google.com">nesciunt impedit repellat assumenda.</a> new text,{" "}
           <Anchor showExternal href="https://google.com">
             434324
           </Anchor>
-          <Button variant="secondary">30007</Button>
         </AIChatMessageBodyTypeWriter>
+        <br />
+        <AIChatMessageBody>
+          <Disclosure>
+            <DisclosureHeading as="h4" variant="heading40">
+              Between the World and Me by Ta-Nehisi Coates
+            </DisclosureHeading>
+            <DisclosureContent>
+              But race is the child of racism, not the father. And the process of naming “the people” has never been a
+              matter of genealogy and physiognomy so much as one of hierarchy. Difference in hue and hair is old. But
+              the belief in the preeminence of hue and hair, the notion that these factors can correctly organize a
+              society and that they signify deeper attributes, which are indelible—this is the new idea at the heart of
+              these new people who have been brought up hopelessly, tragically, deceitfully, to believe that they are
+              white.
+            </DisclosureContent>
+          </Disclosure>
+        </AIChatMessageBody>
       </Box>
       <Heading as="h2" variant="heading20">
         Without enriched text [fullscreen variant]:
       </Heading>
 
       <Box>
-        <AIChatMessageBodyTypeWriter animated={true} variant="fullScreen">
+        <AIChatMessageBodyTypeWriter variant="fullScreen">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendiiure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
         </AIChatMessageBodyTypeWriter>
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index fe4268b651..e0b9e544eb 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -96,7 +96,7 @@ export const UseChatLogger: StoryFn = () => {
           <AIChatMessageAuthor aria-label={isBot ? "AI said" : "You said"}>
             {isBot ? "Good Bot" : "Gibby Radki"}
           </AIChatMessageAuthor>
-          <AIChatMessageBodyTypeWriter>{message}</AIChatMessageBodyTypeWriter>
+          <AIChatMessageBodyTypeWriter animated={isBot}>{message}</AIChatMessageBodyTypeWriter>
         </AIChatMessage>
       ),
     };
@@ -111,9 +111,7 @@ export const UseChatLogger: StoryFn = () => {
         variant,
         content: (
           <AIChatMessage variant="bot">
-            <AIChatMessageAuthor aria-label="AI said" bot>
-              Good Bot
-            </AIChatMessageAuthor>
+            <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
             <AIChatMessageBody>
               <AIChatMessageLoading />
             </AIChatMessageBody>
diff --git a/yarn.lock b/yarn.lock
index dd1dbdf26e..66a5c8ab42 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11221,14 +11221,20 @@ __metadata:
   resolution: "@twilio-paste/ai-chat-log@workspace:packages/paste-core/components/ai-chat-log"
   dependencies:
     "@twilio-paste/animation-library": ^2.0.0
+    "@twilio-paste/avatar": ^9.1.0
     "@twilio-paste/box": ^10.2.0
+    "@twilio-paste/button": ^14.1.0
     "@twilio-paste/color-contrast-utils": ^5.0.0
     "@twilio-paste/customization": ^8.1.1
     "@twilio-paste/design-tokens": ^10.3.0
+    "@twilio-paste/icons": ^12.2.1
+    "@twilio-paste/screen-reader-only": ^13.1.1
+    "@twilio-paste/skeleton-loader": ^6.1.0
     "@twilio-paste/style-props": ^9.1.1
     "@twilio-paste/styling-library": ^3.0.0
     "@twilio-paste/theme": ^11.0.1
     "@twilio-paste/types": ^6.0.0
+    "@twilio-paste/uid-library": ^2.0.0
     "@types/react": ^18.0.27
     "@types/react-dom": ^18.0.10
     react: ^18.0.0
@@ -11237,14 +11243,20 @@ __metadata:
     typescript: ^4.9.4
   peerDependencies:
     "@twilio-paste/animation-library": ^2.0.0
+    "@twilio-paste/avatar": ^9.0.0
     "@twilio-paste/box": ^10.2.0
+    "@twilio-paste/button": ^14.0.0
     "@twilio-paste/color-contrast-utils": ^5.0.0
     "@twilio-paste/customization": ^8.1.1
     "@twilio-paste/design-tokens": ^10.3.0
+    "@twilio-paste/icons": ^12.0.0
+    "@twilio-paste/screen-reader-only": ^13.0.0
+    "@twilio-paste/skeleton-loader": ^6.1.0
     "@twilio-paste/style-props": ^9.1.1
     "@twilio-paste/styling-library": ^3.0.0
     "@twilio-paste/theme": ^11.0.1
     "@twilio-paste/types": ^6.0.0
+    "@twilio-paste/uid-library": ^2.0.0
     "@types/react": ^16.8.6 || ^17.0.2 || ^18.0.27
     "@types/react-dom": ^16.8.6 || ^17.0.2 || ^18.0.10
     react: ^16.8.6 || ^17.0.2 || ^18.0.0

From 2d05ede76a5910bd425c3ead2f95ad3541099e7b Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 15:42:08 -0500
Subject: [PATCH 33/55] chore: chageset

---
 .changeset/eighty-seas-sit.md | 6 ++++++
 1 file changed, 6 insertions(+)
 create mode 100644 .changeset/eighty-seas-sit.md

diff --git a/.changeset/eighty-seas-sit.md b/.changeset/eighty-seas-sit.md
new file mode 100644
index 0000000000..774fd01d3f
--- /dev/null
+++ b/.changeset/eighty-seas-sit.md
@@ -0,0 +1,6 @@
+---
+"@twilio-paste/ai-chat-log": major
+"@twilio-paste/core": minor
+---
+
+[AIChatLog]: Added a new AIChatLog compoennt to the library to display interactions between AI entities

From 954b8a89cb5db7fc89b3069953b93263eb3e6f1d Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 15:50:55 -0500
Subject: [PATCH 34/55] chore: fix lint & build

---
 packages/paste-core/components/ai-chat-log/package.json | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/packages/paste-core/components/ai-chat-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
index c3d4346c84..bef2f140bd 100644
--- a/packages/paste-core/components/ai-chat-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -25,6 +25,7 @@
     "tsc": "tsc"
   },
   "peerDependencies": {
+    "@twilio-paste/anchor": "^12.1.0",
     "@twilio-paste/animation-library": "^2.0.0",
     "@twilio-paste/avatar": "^9.0.0",
     "@twilio-paste/box": "^10.2.0",
@@ -35,8 +36,11 @@
     "@twilio-paste/icons": "^12.0.0",
     "@twilio-paste/screen-reader-only": "^13.0.0",
     "@twilio-paste/skeleton-loader": "^6.1.0",
+    "@twilio-paste/spinner": "^14.0.0",
+    "@twilio-paste/stack": "^8.0.0",
     "@twilio-paste/style-props": "^9.1.1",
     "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/text": "^10.0.0",
     "@twilio-paste/theme": "^11.0.1",
     "@twilio-paste/types": "^6.0.0",
     "@twilio-paste/uid-library": "^2.0.0",
@@ -46,6 +50,7 @@
     "react-dom": "^16.8.6 || ^17.0.2 || ^18.0.0"
   },
   "devDependencies": {
+    "@twilio-paste/anchor": "^12.1.0",
     "@twilio-paste/animation-library": "^2.0.0",
     "@twilio-paste/avatar": "^9.1.0",
     "@twilio-paste/box": "^10.2.0",
@@ -56,8 +61,11 @@
     "@twilio-paste/icons": "^12.2.1",
     "@twilio-paste/screen-reader-only": "^13.1.1",
     "@twilio-paste/skeleton-loader": "^6.1.0",
+    "@twilio-paste/spinner": "^14.1.1",
+    "@twilio-paste/stack": "^8.1.0",
     "@twilio-paste/style-props": "^9.1.1",
     "@twilio-paste/styling-library": "^3.0.0",
+    "@twilio-paste/text": "^10.1.0",
     "@twilio-paste/theme": "^11.0.1",
     "@twilio-paste/types": "^6.0.0",
     "@twilio-paste/uid-library": "^2.0.0",

From 9f642665944a79a610e8b35afd132e376eace12d Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 15:51:12 -0500
Subject: [PATCH 35/55] chore: build update

---
 packages/paste-codemods/tools/.cache/mappings.json | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/paste-codemods/tools/.cache/mappings.json b/packages/paste-codemods/tools/.cache/mappings.json
index 6450f6294e..7cb8ee1f68 100644
--- a/packages/paste-codemods/tools/.cache/mappings.json
+++ b/packages/paste-codemods/tools/.cache/mappings.json
@@ -9,9 +9,12 @@
   "AIChatLog": "@twilio-paste/core/ai-chat-log",
   "AIChatLogger": "@twilio-paste/core/ai-chat-log",
   "AIChatMessage": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageContent": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageAuthor": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageBody": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageBodyTypeWriter": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageFeedback": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageLoading": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageMeta": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageMetaItem": "@twilio-paste/core/ai-chat-log",
   "useAIChatLogger": "@twilio-paste/core/ai-chat-log",
   "Alert": "@twilio-paste/core/alert",
   "AlertDialog": "@twilio-paste/core/alert-dialog",

From ccaa288cedc7267848ada63df1d06175800d2e0f Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 31 May 2024 16:06:51 -0500
Subject: [PATCH 36/55] chore: yarn update

---
 yarn.lock | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/yarn.lock b/yarn.lock
index 66a5c8ab42..ef6f733466 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11220,6 +11220,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@twilio-paste/ai-chat-log@workspace:packages/paste-core/components/ai-chat-log"
   dependencies:
+    "@twilio-paste/anchor": ^12.1.0
     "@twilio-paste/animation-library": ^2.0.0
     "@twilio-paste/avatar": ^9.1.0
     "@twilio-paste/box": ^10.2.0
@@ -11230,8 +11231,11 @@ __metadata:
     "@twilio-paste/icons": ^12.2.1
     "@twilio-paste/screen-reader-only": ^13.1.1
     "@twilio-paste/skeleton-loader": ^6.1.0
+    "@twilio-paste/spinner": ^14.1.1
+    "@twilio-paste/stack": ^8.1.0
     "@twilio-paste/style-props": ^9.1.1
     "@twilio-paste/styling-library": ^3.0.0
+    "@twilio-paste/text": ^10.1.0
     "@twilio-paste/theme": ^11.0.1
     "@twilio-paste/types": ^6.0.0
     "@twilio-paste/uid-library": ^2.0.0
@@ -11242,6 +11246,7 @@ __metadata:
     tsx: ^4.0.0
     typescript: ^4.9.4
   peerDependencies:
+    "@twilio-paste/anchor": ^12.1.0
     "@twilio-paste/animation-library": ^2.0.0
     "@twilio-paste/avatar": ^9.0.0
     "@twilio-paste/box": ^10.2.0
@@ -11252,8 +11257,11 @@ __metadata:
     "@twilio-paste/icons": ^12.0.0
     "@twilio-paste/screen-reader-only": ^13.0.0
     "@twilio-paste/skeleton-loader": ^6.1.0
+    "@twilio-paste/spinner": ^14.0.0
+    "@twilio-paste/stack": ^8.0.0
     "@twilio-paste/style-props": ^9.1.1
     "@twilio-paste/styling-library": ^3.0.0
+    "@twilio-paste/text": ^10.0.0
     "@twilio-paste/theme": ^11.0.1
     "@twilio-paste/types": ^6.0.0
     "@twilio-paste/uid-library": ^2.0.0

From dcf1a75191c7fc55bf11b23355492841deae5c84 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Mon, 10 Jun 2024 15:44:49 -0400
Subject: [PATCH 37/55] chore: cleanup, renaming, small refactors

---
 .../paste-codemods/tools/.cache/mappings.json |     3 +-
 .../ai-chat-log/src/AIChatMessage.tsx         |    21 +-
 ...ssageMeta.tsx => AIChatMessageActions.tsx} |    14 +-
 .../ai-chat-log/src/AIChatMessageAuthor.tsx   |    56 +-
 .../ai-chat-log/src/AIChatMessageBody.tsx     |    16 +-
 .../ai-chat-log/src/AIChatMessageFeedback.tsx |    40 +-
 .../ai-chat-log/src/AIChatMessageRewrite.tsx  |    70 +
 .../ai-chat-log/src/AIMessageContext.tsx      |     9 +
 .../src/AIMessageVariantContext.tsx           |     4 -
 .../components/ai-chat-log/src/index.tsx      |     8 +-
 .../ai-chat-log/src/useAIChatLogger.tsx       |     2 +-
 .../ai-chat-log/stories/index.stories.tsx     |    36 +-
 .../ai-chat-log/stories/parts.stories.tsx     |    63 +-
 .../stories/useAIChatLogger.stories.tsx       |    16 +-
 .../components/ai-chat-log/tsconfig.json      |    10 +-
 .../components/ai-chat-log/type-docs.json     | 16003 ++++++++++++++++
 16 files changed, 16276 insertions(+), 95 deletions(-)
 rename packages/paste-core/components/ai-chat-log/src/{AIChatMessageMeta.tsx => AIChatMessageActions.tsx} (65%)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIMessageContext.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/type-docs.json

diff --git a/packages/paste-codemods/tools/.cache/mappings.json b/packages/paste-codemods/tools/.cache/mappings.json
index 7cb8ee1f68..65c3039a3f 100644
--- a/packages/paste-codemods/tools/.cache/mappings.json
+++ b/packages/paste-codemods/tools/.cache/mappings.json
@@ -9,12 +9,13 @@
   "AIChatLog": "@twilio-paste/core/ai-chat-log",
   "AIChatLogger": "@twilio-paste/core/ai-chat-log",
   "AIChatMessage": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageActions": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageAuthor": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageBody": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageBodyTypeWriter": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageFeedback": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageLoading": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageMeta": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageRewrite": "@twilio-paste/core/ai-chat-log",
   "useAIChatLogger": "@twilio-paste/core/ai-chat-log",
   "Alert": "@twilio-paste/core/alert",
   "AlertDialog": "@twilio-paste/core/alert-dialog",
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
index 612f4debf7..ac87899cec 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessage.tsx
@@ -1,10 +1,11 @@
 import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
+import { useUID } from "@twilio-paste/uid-library";
 import * as React from "react";
 
-import { AIMessageVariantContext } from "./AIMessageVariantContext";
-import type { AIMessageVariants } from "./AIMessageVariantContext";
+import { AIMessageContext } from "./AIMessageContext";
+import type { AIMessageVariants } from "./AIMessageContext";
 
 export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   children?: React.ReactNode;
@@ -19,17 +20,25 @@ export interface AIChatMessageProps extends HTMLPasteProps<"div"> {
   /**
    * The variant of the message to distiguish between user and bot messages
    *
-   * @default null
    * @type {AIMessageVariants}
    * @memberof AIChatMessageProps
    */
   variant: AIMessageVariants;
+  /**
+   * Custom id for the message body
+   *
+   * @default unique ID
+   * @type {string}
+   * @memberof AIChatMessageProps
+   */
+  id?: string;
 }
 
 export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps>(
-  ({ children, element = "AI_CHAT_MESSAGE", variant, ...props }, ref) => {
+  ({ children, element = "AI_CHAT_MESSAGE", variant, id, ...props }, ref) => {
+    const AIChatMessageId = id || useUID();
     return (
-      <AIMessageVariantContext.Provider value={variant}>
+      <AIMessageContext.Provider value={{ variant, id: AIChatMessageId }}>
         <Box
           role="listitem"
           display="flex"
@@ -41,7 +50,7 @@ export const AIChatMessage = React.forwardRef<HTMLDivElement, AIChatMessageProps
         >
           {children}
         </Box>
-      </AIMessageVariantContext.Provider>
+      </AIMessageContext.Provider>
     );
   },
 );
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
similarity index 65%
rename from packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
index 714357a84a..c0df6f20b8 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageMeta.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
@@ -3,27 +3,27 @@ import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-export interface AIChatMessageMetaProps extends HTMLPasteProps<"div"> {
+export interface AIChatMessageActionsProps extends HTMLPasteProps<"div"> {
   /**
    *
    * @default null
    * @type {string}
-   * @memberof AIChatMessageMetaProps
+   * @memberof AIChatMessageActionsProps
    */
   "aria-label": string;
   children: NonNullable<React.ReactNode>;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "AI_CHAT_MESSAGE_META"
+   * @default "AI_CHAT_MESSAGE_ACTIONS"
    * @type {BoxProps["element"]}
-   * @memberof AIChatMessageMetaProps
+   * @memberof AIChatMessageActionsProps
    */
   element?: BoxElementProps["element"];
 }
 
-export const AIChatMessageMeta = React.forwardRef<HTMLDivElement, AIChatMessageMetaProps>(
-  ({ children, element = "AI_CHAT_MESSAGE_META", ...props }, ref) => {
+export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessageActionsProps>(
+  ({ children, element = "AI_CHAT_MESSAGE_ACTIONS", ...props }, ref) => {
     return (
       <Box
         {...safelySpreadBoxProps(props)}
@@ -40,4 +40,4 @@ export const AIChatMessageMeta = React.forwardRef<HTMLDivElement, AIChatMessageM
   },
 );
 
-AIChatMessageMeta.displayName = "AIChatMessageMeta";
+AIChatMessageActions.displayName = "AIChatMessageActions";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
index 05e522ce32..fec52c0682 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -1,11 +1,12 @@
 import { Avatar } from "@twilio-paste/avatar";
 import type { BoxElementProps } from "@twilio-paste/box";
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
 import { ArtificialIntelligenceIcon } from "@twilio-paste/icons/esm/ArtificialIntelligenceIcon";
+import type { GenericIconProps } from "@twilio-paste/icons/esm/types";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-import { AIChatMessageMeta } from "./AIChatMessageMeta";
-import { AIMessageVariantContext } from "./AIMessageVariantContext";
+import { AIMessageContext } from "./AIMessageContext";
 
 export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
   /**
@@ -30,21 +31,58 @@ export interface AIChatMessageAuthorProps extends HTMLPasteProps<"div"> {
    * @memberof AIChatMessageAuthorProps
    */
   "aria-label": string;
+  /**
+   * Custom name for the user Avatar's initials to override the default Avatar content. See Avatar API documentation for more information.
+   *
+   * @type {string}
+   * @memberof AIChatMessageAuthorProps
+   */
+  avatarName?: string;
+  /**
+   * Custom src path for the user Avatar's image to override the default Avatar content. See Avatar API documentation for more information.
+   *
+   * @type {string}
+   * @memberof AIChatMessageAuthorProps
+   */
+  avatarSrc?: string;
+  /**
+   * Custom svg for the user Avatar's icon to override the default Avatar content. See Avatar API documentation for more information.
+   *
+   * @type {React.FC<React.PropsWithChildren<GenericIconProps>>}
+   * @memberof AIChatMessageAuthorProps
+   */
+  avatarIcon?: React.FC<React.PropsWithChildren<GenericIconProps>>;
 }
 
 export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessageAuthorProps>(
-  ({ children, element = "AI_CHAT_MESSAGE_AUTHOR", ...props }, ref) => {
-    const messageVariant = React.useContext(AIMessageVariantContext);
+  ({ children, element = "AI_CHAT_MESSAGE_AUTHOR", avatarName, avatarIcon, avatarSrc, ...props }, ref) => {
+    const { variant } = React.useContext(AIMessageContext);
 
     return (
-      <AIChatMessageMeta {...props} ref={ref} aria-label={props["aria-label"]} element={element}>
-        {messageVariant === "bot" ? (
-          <Avatar name={children} size="sizeIcon50" icon={ArtificialIntelligenceIcon} element={`${element}_AVATAR}`} />
+      <Box
+        {...safelySpreadBoxProps(props)}
+        ref={ref}
+        aria-label={props["aria-label"]}
+        element={element}
+        display="flex"
+        alignItems="center"
+        columnGap="space30"
+        fontWeight="fontWeightMedium"
+      >
+        {variant === "bot" ? (
+          <Avatar name={children} size="sizeIcon50" icon={ArtificialIntelligenceIcon} element={`${element}_AVATAR`} />
         ) : (
-          <Avatar name={children} size="sizeIcon50" color="decorative30" element={`${element}_AVATAR}`} />
+          <Avatar
+            size="sizeIcon50"
+            color="decorative30"
+            element={`${element}_AVATAR`}
+            name={avatarName || children}
+            icon={avatarIcon}
+            src={avatarSrc}
+          />
         )}
         {children}
-      </AIChatMessageMeta>
+      </Box>
     );
   },
 );
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
index cd826d1cf1..d81589c611 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
@@ -4,7 +4,9 @@ import type { ThemeShape } from "@twilio-paste/theme";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-const Variants = {
+import { AIMessageContext } from "./AIMessageContext";
+
+const Sizes = {
   default: {
     fontSize: "fontSize30" as ThemeShape["fontSizes"],
     lineHeight: "lineHeight30" as ThemeShape["lineHeights"],
@@ -16,6 +18,7 @@ const Variants = {
 };
 
 export interface AIChatMessageBodyProps extends HTMLPasteProps<"div"> {
+  id?: never; // id is passed down through the context from AIChatMessage for a11y (aria-controls on the rewrite button)
   children?: React.ReactNode;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
@@ -26,21 +29,23 @@ export interface AIChatMessageBodyProps extends HTMLPasteProps<"div"> {
    */
   element?: BoxElementProps["element"];
   /**
-   * Override the font size for full screen experiences.
+   * Use a larger font size and line height for fullscreen experiences.
    *
    * @default "default"
    * @type {"default" | "fullScreen"}
    * @memberof AIChatMessageBodyProps
    */
-  variant?: "default" | "fullScreen";
+  size?: "default" | "fullScreen";
 }
 
 export const AIChatMessageBody = React.forwardRef<HTMLDivElement, AIChatMessageBodyProps>(
-  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY", ...props }, ref) => {
+  ({ children, size = "default", element = "AI_CHAT_MESSAGE_BODY", ...props }, ref) => {
+    const { id } = React.useContext(AIMessageContext);
+
     return (
       <Box
         {...safelySpreadBoxProps(props)}
-        {...Variants[variant]}
+        {...Sizes[size]}
         display="inline-block"
         color="colorText"
         wordWrap="break-word"
@@ -49,6 +54,7 @@ export const AIChatMessageBody = React.forwardRef<HTMLDivElement, AIChatMessageB
         element={element}
         ref={ref}
         whiteSpace="pre-wrap"
+        id={id}
       >
         {children}
       </Box>
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
index 90cecd703e..ba62b7e038 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
@@ -16,10 +16,43 @@ export interface AIChatMessageFeedbackProps extends HTMLPasteProps<"div"> {
    * @memberof AIChatMessageFeedbackProps
    */
   element?: BoxElementProps["element"];
+  /**
+   * Custom label text for the message feedback component
+   *
+   * @default "Is this helpful?"
+   * @type {string}
+   * @memberof AIChatMessageFeedbackProps
+   */
   label?: string;
+  /**
+   * Custom accessible label for the "Like result" button for non-English languages
+   *
+   * @default "Like result"
+   * @type {string}
+   * @memberof AIChatMessageFeedbackProps
+   */
   i18nLikeLabel?: string;
+  /**
+   * Custom accessible label for the "Dislike result" button for non-English languages
+   *
+   * @default "Dislike result"
+   * @type {string}
+   * @memberof AIChatMessageFeedbackProps
+   */
   i18nDislikeLabel?: string;
+  /**
+   * Function to call on click of "Like result" button
+   *
+   * @type {() => void}
+   * @memberof AIChatMessageFeedbackProps
+   */
   onLike: () => void;
+  /**
+   * Function to call on click of "Disike result" button
+   *
+   * @type {() => void}
+   * @memberof AIChatMessageFeedbackProps
+   */
   onDislike: () => void;
 }
 
@@ -43,7 +76,6 @@ export const AIChatMessageFeedback = React.forwardRef<HTMLDivElement, AIChatMess
       display="inline-flex"
       alignItems="flex-start"
       columnGap="space30"
-      marginTop="space40"
       color="colorTextIcon"
       lineHeight="lineHeight20"
       fontSize="fontSize20"
@@ -53,11 +85,11 @@ export const AIChatMessageFeedback = React.forwardRef<HTMLDivElement, AIChatMess
       paddingX="space30"
       paddingY="space20"
     >
-      <span>{label}</span>
-      <Button variant="reset" size="reset" onClick={onLike}>
+      <Box as="span">{label}</Box>
+      <Button variant="reset" size="reset" onClick={onLike} element={`${element}_LIKE_BUTTON`}>
         <ThumbsUpIcon decorative={false} title={i18nLikeLabel} />
       </Button>
-      <Button variant="reset" size="reset" onClick={onDislike}>
+      <Button variant="reset" size="reset" onClick={onDislike} element={`${element}_DISLIKE_BUTTON`}>
         <ThumbsDownIcon decorative={false} title={i18nDislikeLabel} />
       </Button>
     </Box>
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
new file mode 100644
index 0000000000..380d248b45
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
@@ -0,0 +1,70 @@
+import { safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { RefreshIcon } from "@twilio-paste/icons/esm/RefreshIcon";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+import { AIMessageContext } from "./AIMessageContext";
+
+export interface AIChatMessageRewriteProps extends HTMLPasteProps<"button"> {
+  children?: never;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "AI_CHAT_MESSAGE_REWRITE"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageRewriteProps
+   */
+  element?: BoxElementProps["element"];
+  /**
+   * Custom label text for the message rewrite component
+   *
+   * @default "Rewrite"
+   * @type {string}
+   * @memberof AIChatMessageRewriteProps
+   */
+  label?: string;
+  /**
+   * Function to call on click of message rewrite button
+   *
+   * @type {() => void}
+   * @memberof AIChatMessageRewriteProps
+   */
+  onRewrite: () => void;
+}
+
+export const AIChatMessageRewrite = React.forwardRef<HTMLButtonElement, AIChatMessageRewriteProps>(
+  ({ label = "Rewrite", onRewrite, element = "AI_CHAT_MESSAGE_REWRITE", ...props }, ref) => {
+    const { id: messageBodyId } = React.useContext(AIMessageContext);
+
+    return (
+      <Button
+        {...safelySpreadBoxProps(props)}
+        variant="reset"
+        size="reset"
+        ref={ref}
+        element={element}
+        display="inline-flex"
+        alignItems="flex-start"
+        columnGap="space30"
+        color="colorTextIcon"
+        lineHeight="lineHeight30"
+        fontSize="fontSize30"
+        fontWeight="fontWeightSemibold"
+        backgroundColor="colorBackgroundBody"
+        boxShadow="shadowBorderWeaker"
+        borderRadius="borderRadius30"
+        paddingX="space30"
+        paddingY="space20"
+        onClick={onRewrite}
+        aria-controls={messageBodyId}
+      >
+        <RefreshIcon decorative />
+        {label}
+      </Button>
+    );
+  },
+);
+
+AIChatMessageRewrite.displayName = "AIChatMessageRewrite";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIMessageContext.tsx b/packages/paste-core/components/ai-chat-log/src/AIMessageContext.tsx
new file mode 100644
index 0000000000..8eea8b72d0
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIMessageContext.tsx
@@ -0,0 +1,9 @@
+import * as React from "react";
+
+export type AIMessageVariants = "bot" | "user";
+
+export interface AIMessageContextProps {
+  variant: AIMessageVariants;
+  id: string;
+}
+export const AIMessageContext = React.createContext<AIMessageContextProps>({} as any);
diff --git a/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx b/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
deleted file mode 100644
index 24f10cc224..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIMessageVariantContext.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-import * as React from "react";
-
-export type AIMessageVariants = "bot" | "user";
-export const AIMessageVariantContext = React.createContext<AIMessageVariants>("bot");
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 024fb0f2b0..02b24da180 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -1,7 +1,7 @@
 export { AIChatMessage } from "./AIChatMessage";
 export type { AIChatMessageProps } from "./AIChatMessage";
-export { AIChatMessageMeta } from "./AIChatMessageMeta";
-export type { AIChatMessageMetaProps } from "./AIChatMessageMeta";
+export { AIChatMessageActions } from "./AIChatMessageActions";
+export type { AIChatMessageActionsProps } from "./AIChatMessageActions";
 export { AIChatMessageBody } from "./AIChatMessageBody";
 export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
 export { AIChatMessageBodyTypeWriter } from "./AIChatMessageBodyTypeWriter";
@@ -10,6 +10,8 @@ export { AIChatMessageAuthor } from "./AIChatMessageAuthor";
 export type { AIChatMessageAuthorProps } from "./AIChatMessageAuthor";
 export { AIChatMessageFeedback } from "./AIChatMessageFeedback";
 export type { AIChatMessageFeedbackProps } from "./AIChatMessageFeedback";
+export { AIChatMessageRewrite } from "./AIChatMessageRewrite";
+export type { AIChatMessageRewriteProps } from "./AIChatMessageRewrite";
 export { AIChatMessageLoading } from "./AIChatMessageLoading";
 export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 
@@ -20,4 +22,4 @@ export type { UseAIChatLogger, AIPartialIDChat } from "./useAIChatLogger";
 export { AIChatLogger } from "./AIChatLogger";
 export type { AIChatLoggerProps } from "./AIChatLogger";
 
-export type { AIMessageVariants } from "./AIMessageVariantContext";
+export type { AIMessageVariants } from "./AIMessageContext";
diff --git a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
index 5d319afab2..b13aa99184 100644
--- a/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/useAIChatLogger.tsx
@@ -1,7 +1,7 @@
 import { uid } from "@twilio-paste/uid-library";
 import * as React from "react";
 
-import { AIMessageVariants } from "./AIMessageVariantContext";
+import type { AIMessageVariants } from "./AIMessageContext";
 
 export type AIChat = {
   id: string;
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 84cb5c6a91..0147ba40d6 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -1,29 +1,34 @@
+// eslint-disable-next-line eslint-comments/disable-enable-pair
+/* eslint-disable import/no-extraneous-dependencies */
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
+import { UserIcon } from "@twilio-paste/icons/esm/UserIcon";
 import * as React from "react";
 
 import {
   AIChatLog,
   AIChatMessage,
+  AIChatMessageActions,
   AIChatMessageAuthor,
   AIChatMessageBody,
   AIChatMessageFeedback,
   AIChatMessageLoading,
-  AIChatMessageMeta,
+  AIChatMessageRewrite,
 } from "../src";
 
-// eslint-disable-next-line import/no-default-export
 export default {
   title: "Components/AI Chat Log",
   component: AIChatLog,
 };
 
-export const StandardUsage = (): React.ReactNode => {
+export const ExampleAIChatLog = (): React.ReactNode => {
   return (
     <AIChatLog>
       <AIChatMessage variant="user">
-        <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
-        <AIChatMessageBody variant="default">
+        <AIChatMessageAuthor avatarName="Gibby Ridki" avatarIcon={UserIcon} aria-label="You said at 2:36pm">
+          You
+        </AIChatMessageAuthor>
+        <AIChatMessageBody size="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
           impedit repellat assumenda.
@@ -31,27 +36,28 @@ export const StandardUsage = (): React.ReactNode => {
       </AIChatMessage>
       <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
-        <AIChatMessageBody variant="default">
+        <AIChatMessageBody size="default">
           Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
           adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
           impedit repellat assumenda.
         </AIChatMessageBody>
-        <AIChatMessageMeta aria-label="Quick actions available:">
+        <AIChatMessageActions aria-label="Quick actions available:">
           <ButtonGroup>
-            <Button variant="secondary" onClick={() => {}} size="small">
+            <Button variant="secondary" onClick={() => {}} size="rounded_small">
               30007
             </Button>
-            <Button variant="secondary" onClick={() => {}} size="small">
+            <Button variant="secondary" onClick={() => {}} size="rounded_small">
               30007
             </Button>
-            <Button variant="secondary" onClick={() => {}} size="small">
+            <Button variant="secondary" onClick={() => {}} size="rounded_small">
               30009
             </Button>
           </ButtonGroup>
-        </AIChatMessageMeta>
-        <AIChatMessageMeta aria-label="Feedback form">
+        </AIChatMessageActions>
+        <AIChatMessageActions aria-label="Feedback form">
           <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-        </AIChatMessageMeta>
+          <AIChatMessageRewrite onRewrite={() => {}} />
+        </AIChatMessageActions>
       </AIChatMessage>
       <AIChatMessage variant="user">
         <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
@@ -62,9 +68,7 @@ export const StandardUsage = (): React.ReactNode => {
         </AIChatMessageBody>
       </AIChatMessage>
       <AIChatMessage variant="bot">
-        <AIChatMessageAuthor aria-label="AI said" bot>
-          Good Bot
-        </AIChatMessageAuthor>
+        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
         <AIChatMessageBody>
           <AIChatMessageLoading onStopLoading={() => {}} />
         </AIChatMessageBody>
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index d7e3a32c55..fb5ad4f55e 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -1,6 +1,7 @@
+// eslint-disable-next-line eslint-comments/disable-enable-pair
+/* eslint-disable import/no-extraneous-dependencies */
 import { Anchor } from "@twilio-paste/anchor";
 import { Box } from "@twilio-paste/box";
-import { Button } from "@twilio-paste/button";
 import { Disclosure, DisclosureContent, DisclosureHeading } from "@twilio-paste/disclosure";
 import { Heading } from "@twilio-paste/heading";
 import { InlineCode } from "@twilio-paste/inline-code";
@@ -8,11 +9,12 @@ import * as React from "react";
 
 import {
   AIChatLog,
+  AIChatMessageActions,
   AIChatMessageBody,
   AIChatMessageBodyTypeWriter,
   AIChatMessageFeedback,
   AIChatMessageLoading,
-  AIChatMessageMeta,
+  AIChatMessageRewrite,
 } from "../src";
 
 // eslint-disable-next-line import/no-default-export
@@ -21,36 +23,40 @@ export default {
   component: AIChatLog,
 };
 
-export const MessageBody = (): React.ReactNode => {
+export const AIMessageBody = (): React.ReactNode => {
   return (
     <AIChatLog>
-      <AIChatMessageBody variant="default">
-        Use <InlineCode>variant=&quot;default&quot;</InlineCode> when the AI Chat Log is inside a small container.
+      <AIChatMessageBody size="default">
+        Use <InlineCode>size=&quot;default&quot;</InlineCode> when the AI Chat Log is inside a small container.
       </AIChatMessageBody>
-      <AIChatMessageBody variant="fullScreen">
-        Use <InlineCode>variant=&quot;fullScreen&quot;</InlineCode> when the AI Chat Log is a full screen experience.
+      <AIChatMessageBody size="fullScreen">
+        Use <InlineCode>size=&quot;fullScreen&quot;</InlineCode> when the AI Chat Log is a full screen experience.
       </AIChatMessageBody>
     </AIChatLog>
   );
 };
 
-export const MessageBodyWithParagraphs = (): React.ReactNode => {
+export const AIMessageBodyWithParagraphs = (): React.ReactNode => {
   return (
     <AIChatLog>
-      <AIChatMessageBody variant="default">
-        <p>Test</p>
-        <p>Test</p>
+      <AIChatMessageBody size="default">
+        <p>
+          Use <InlineCode>size=&quot;default&quot;</InlineCode> when the AI Chat Log is inside a small container.
+        </p>
+        <p>Second paragraph within AI Chat Message Body.</p>
       </AIChatMessageBody>
 
-      <AIChatMessageBody variant="fullScreen">
-        <p>Test</p>
-        <p>Test</p>
+      <AIChatMessageBody size="fullScreen">
+        <p>
+          Use <InlineCode>size=&quot;fullScreen&quot;</InlineCode> when the AI Chat Log is a full screen experience.
+        </p>
+        <p>Second paragraph within AI Chat Message Body.</p>
       </AIChatMessageBody>
     </AIChatLog>
   );
 };
 
-export const Loading = (): React.ReactNode => {
+export const AIMessageLoading = (): React.ReactNode => {
   return (
     <div>
       <p>Pssst! The three rows have dynamic widths. Refresh to see it in action!</p>
@@ -58,8 +64,9 @@ export const Loading = (): React.ReactNode => {
     </div>
   );
 };
+AIMessageLoading.storyName = "AI Message (Loading)";
 
-export const LoadingStopLoading = (): React.ReactNode => {
+export const AIMessageLoadingStopLoading = (): React.ReactNode => {
   const [loading, setLoading] = React.useState(true);
   return (
     <div>
@@ -75,22 +82,22 @@ export const LoadingStopLoading = (): React.ReactNode => {
     </div>
   );
 };
-LoadingStopLoading.storyName = "Loading with stop button";
+AIMessageLoadingStopLoading.storyName = "AI Message (Loading - with Stop button)";
 
-export const Feedback = (): React.ReactNode => {
+export const AIMessageFeedback = (): React.ReactNode => {
   /* eslint-disable no-alert */
   return (
-    <AIChatMessageMeta aria-label="Feedback form">
+    <AIChatMessageActions aria-label="Feedback form">
       <AIChatMessageFeedback onLike={() => alert("Like + 1")} onDislike={() => alert("Like - 1")} />
-    </AIChatMessageMeta>
+    </AIChatMessageActions>
   );
   /* eslint-enable no-alert */
 };
 
-export const FeedbackCustomLabels = (): React.ReactNode => {
+export const AIMessageFeedbackI18nLabels = (): React.ReactNode => {
   /* eslint-disable no-alert */
   return (
-    <AIChatMessageMeta aria-label="Feedback form">
+    <AIChatMessageActions aria-label="Feedback form">
       <AIChatMessageFeedback
         label="Est-ce utile?"
         i18nDislikeLabel="pas aimer"
@@ -98,10 +105,19 @@ export const FeedbackCustomLabels = (): React.ReactNode => {
         onLike={() => alert("Like + 1")}
         onDislike={() => alert("Like - 1")}
       />
-    </AIChatMessageMeta>
+    </AIChatMessageActions>
   );
   /* eslint-enable no-alert */
 };
+AIMessageFeedbackI18nLabels.storyName = "AI Message Feedback (i18n)";
+
+export const AIMessageRewrite = (): React.ReactNode => {
+  return (
+    <AIChatMessageActions aria-label="message actions">
+      <AIChatMessageRewrite onRewrite={() => {}} />
+    </AIChatMessageActions>
+  );
+};
 
 export const MessageBodyTypeWriter = (): React.ReactNode => {
   return (
@@ -148,4 +164,3 @@ export const MessageBodyTypeWriter = (): React.ReactNode => {
     </Box>
   );
 };
-MessageBodyTypeWriter.storyName = "Message Body Type Writer";
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index e0b9e544eb..f016c6150b 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -1,3 +1,5 @@
+// eslint-disable-next-line eslint-comments/disable-enable-pair
+/* eslint-disable import/no-extraneous-dependencies */
 import type { StoryFn } from "@storybook/react";
 import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
@@ -13,18 +15,16 @@ import * as React from "react";
 import {
   AIChatLogger,
   AIChatMessage,
+  AIChatMessageActions,
   AIChatMessageAuthor,
   AIChatMessageBody,
   AIChatMessageFeedback,
   AIChatMessageLoading,
-  AIChatMessageMeta,
-  AIMessageVariants,
-  AIPartialIDChat,
   useAIChatLogger,
 } from "../src";
+import type { AIMessageVariants, AIPartialIDChat } from "../src";
 import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
 
-// eslint-disable-next-line import/no-default-export
 export default {
   title: "Components/AI Chat Log/useAIChatLogger",
 };
@@ -59,7 +59,7 @@ export const UseChatLogger: StoryFn = () => {
             eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
             nesciunt impedit repellat assumenda.
           </AIChatMessageBody>
-          <AIChatMessageMeta aria-label="Quick actions available:">
+          <AIChatMessageActions aria-label="Quick actions available:">
             <ButtonGroup>
               <Button variant="secondary" onClick={() => {}} size="small">
                 30007
@@ -71,10 +71,10 @@ export const UseChatLogger: StoryFn = () => {
                 30009
               </Button>
             </ButtonGroup>
-          </AIChatMessageMeta>
-          <AIChatMessageMeta aria-label="Feedback form">
+          </AIChatMessageActions>
+          <AIChatMessageActions aria-label="Feedback form">
             <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-          </AIChatMessageMeta>{" "}
+          </AIChatMessageActions>{" "}
         </AIChatMessage>
       ),
     },
diff --git a/packages/paste-core/components/ai-chat-log/tsconfig.json b/packages/paste-core/components/ai-chat-log/tsconfig.json
index b5daed7034..5e8a3b17a2 100644
--- a/packages/paste-core/components/ai-chat-log/tsconfig.json
+++ b/packages/paste-core/components/ai-chat-log/tsconfig.json
@@ -1,12 +1,8 @@
 {
   "extends": "../../../../tsconfig.json",
   "compilerOptions": {
-    "outDir": "dist/",
+    "outDir": "dist/"
   },
-  "include": [
-    "src/**/*",
-  ],
-  "exclude": [
-    "node_modules"
-  ]
+  "include": ["src/**/*"],
+  "exclude": ["node_modules"]
 }
diff --git a/packages/paste-core/components/ai-chat-log/type-docs.json b/packages/paste-core/components/ai-chat-log/type-docs.json
new file mode 100644
index 0000000000..5dd589f00c
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/type-docs.json
@@ -0,0 +1,16003 @@
+{
+  "AIChatMessage": {
+    "variant": {
+      "type": "AIMessageVariants",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "The variant of the message to distiguish between user and bot messages"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": "unique ID",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom id for the message body"
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageActions": {
+    "aria-label": {
+      "type": "string",
+      "defaultValue": "null",
+      "required": true,
+      "externalProp": false,
+      "description": "Defines a string value that labels the current element."
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_ACTIONS",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageBody": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_BODY",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "never",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "size": {
+      "type": "\"default\" | \"fullScreen\"",
+      "defaultValue": "default",
+      "required": false,
+      "externalProp": false,
+      "description": "Use a larger font size and line height for fullscreen experiences."
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageBodyTypeWriter": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "animated": {
+      "type": "boolean",
+      "defaultValue": true,
+      "required": false,
+      "externalProp": false,
+      "description": "Whether the text should be animated with type writer effect"
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_BODY_TYPE_WRITER",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "variant": {
+      "type": "\"default\" | \"fullScreen\"",
+      "defaultValue": "default",
+      "required": false,
+      "externalProp": false,
+      "description": "Override the font size for full screen experiences."
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageAuthor": {
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Screen reader label for the author"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "avatarIcon": {
+      "type": "FC<PropsWithChildren<GenericIconProps>>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false,
+      "description": "Custom svg for the user Avatar's icon to override the default Avatar content. See Avatar API documentation for more information."
+    },
+    "avatarName": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false,
+      "description": "Custom name for the user Avatar's initials to override the default Avatar content. See Avatar API documentation for more information."
+    },
+    "avatarSrc": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false,
+      "description": "Custom src path for the user Avatar's image to override the default Avatar content. See Avatar API documentation for more information."
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_AUTHOR",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageFeedback": {
+    "onDislike": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Function to call on click of \"Disike result\" button"
+    },
+    "onLike": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Function to call on click of \"Like result\" button"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_FEEDBACK",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "i18nDislikeLabel": {
+      "type": "string",
+      "defaultValue": "Dislike result",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom accessible label for the \"Dislike result\" button for non-English languages"
+    },
+    "i18nLikeLabel": {
+      "type": "string",
+      "defaultValue": "Like result",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom accessible label for the \"Like result\" button for non-English languages"
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "label": {
+      "type": "string",
+      "defaultValue": "Is this helpful?",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom label text for the message feedback component"
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageRewrite": {
+    "onRewrite": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Function to call on click of message rewrite button"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoFocus": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "disabled": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_REWRITE",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "form": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formAction": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formEncType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formMethod": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formNoValidate": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "formTarget": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "label": {
+      "type": "string",
+      "defaultValue": "Rewrite",
+      "required": false,
+      "externalProp": false,
+      "description": "Custom label text for the message rewrite component"
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "name": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLButtonElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "type": {
+      "type": "\"button\" | \"submit\" | \"reset\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "value": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatMessageLoading": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "AI_CHAT_MESSAGE_LOADING",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStopLoading": {
+      "type": "() => void",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatLog": {
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "element": {
+      "type": "string",
+      "defaultValue": "'AI_CHAT_LOG'",
+      "required": false,
+      "externalProp": false,
+      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  },
+  "AIChatLogger": {
+    "aiChats": {
+      "type": "AIChat[]",
+      "defaultValue": "null",
+      "required": true,
+      "externalProp": false,
+      "description": "Array of AIs in the log. Use with useAIChatLogger()"
+    },
+    "about": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "accessKey": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "aria-activedescendant": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
+    },
+    "aria-atomic": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
+    },
+    "aria-autocomplete": {
+      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
+    },
+    "aria-busy": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
+    },
+    "aria-checked": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
+    },
+    "aria-colcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of columns in a table, grid, or treegrid."
+    },
+    "aria-colindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
+    },
+    "aria-colspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-controls": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
+    },
+    "aria-current": {
+      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the element that represents the current item within a container or set of related elements."
+    },
+    "aria-describedby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that describes the object."
+    },
+    "aria-details": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides a detailed, extended description for the object."
+    },
+    "aria-disabled": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
+    },
+    "aria-dropeffect": {
+      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
+    },
+    "aria-errormessage": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element that provides an error message for the object."
+    },
+    "aria-expanded": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
+    },
+    "aria-flowto": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
+    },
+    "aria-grabbed": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
+    },
+    "aria-haspopup": {
+      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
+    },
+    "aria-hidden": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element is exposed to an accessibility API."
+    },
+    "aria-invalid": {
+      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the entered value does not conform to the format expected by the application."
+    },
+    "aria-keyshortcuts": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
+    },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
+    "aria-labelledby": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies the element (or elements) that labels the current element."
+    },
+    "aria-level": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the hierarchical level of an element within a structure."
+    },
+    "aria-live": {
+      "type": "\"off\" | \"assertive\" | \"polite\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
+    },
+    "aria-modal": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether an element is modal when displayed."
+    },
+    "aria-multiline": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
+    },
+    "aria-multiselectable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the user may select more than one item from the current selectable descendants."
+    },
+    "aria-orientation": {
+      "type": "\"horizontal\" | \"vertical\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
+    },
+    "aria-owns": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
+    },
+    "aria-placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
+    },
+    "aria-posinset": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-pressed": {
+      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"pressed\" state of toggle buttons."
+    },
+    "aria-readonly": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that the element is not editable, but is otherwise operable."
+    },
+    "aria-relevant": {
+      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
+    },
+    "aria-required": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates that user input is required on the element before a form may be submitted."
+    },
+    "aria-roledescription": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a human-readable, author-localized description for the role of an element."
+    },
+    "aria-rowcount": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the total number of rows in a table, grid, or treegrid."
+    },
+    "aria-rowindex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
+    },
+    "aria-rowspan": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
+    },
+    "aria-selected": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates the current \"selected\" state of various widgets."
+    },
+    "aria-setsize": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
+    },
+    "aria-sort": {
+      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
+    },
+    "aria-valuemax": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the maximum allowed value for a range widget."
+    },
+    "aria-valuemin": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the minimum allowed value for a range widget."
+    },
+    "aria-valuenow": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the current value for a range widget."
+    },
+    "aria-valuetext": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
+    },
+    "autoCapitalize": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoCorrect": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "autoSave": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contentEditable": {
+      "type": "Booleanish | \"inherit\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "contextMenu": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dangerouslySetInnerHTML": {
+      "type": "{ __html: string }",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "datatype": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultChecked": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "defaultValue": {
+      "type": "string | number | readonly string[]",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "dir": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "draggable": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "hidden": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "id": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inlist": {
+      "type": "any",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "inputMode": {
+      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+    },
+    "is": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+    },
+    "itemID": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemProp": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemRef": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemScope": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "itemType": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "key": {
+      "type": "Key",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "lang": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "nonce": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbort": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAbortCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEnd": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationEndCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIteration": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationIterationCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStart": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAnimationStartCapture": {
+      "type": "AnimationEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onAuxClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBeforeInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlur": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onBlurCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThrough": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCanPlayThroughCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChange": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onChangeCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEnd": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionEndCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStart": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionStartCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdate": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCompositionUpdateCapture": {
+      "type": "CompositionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenu": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onContextMenuCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopy": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCopyCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCut": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onCutCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClick": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDoubleClickCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrag": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnd": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEndCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnter": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragEnterCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExit": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragExitCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeave": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragLeaveCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOver": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragOverCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStart": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDragStartCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDrop": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDropCapture": {
+      "type": "DragEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onDurationChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptied": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEmptiedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncrypted": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEncryptedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEnded": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onEndedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onError": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onErrorCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocus": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onFocusCapture": {
+      "type": "FocusEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onGotPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInput": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInputCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalid": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onInvalidCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDown": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyDownCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPress": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyPressCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUp": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onKeyUpCapture": {
+      "type": "KeyboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoad": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedData": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedDataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadata": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadedMetadataCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStart": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLoadStartCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onLostPointerCaptureCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDown": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseDownCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseEnter": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseLeave": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMove": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseMoveCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOut": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOutCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOver": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseOverCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUp": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onMouseUpCapture": {
+      "type": "MouseEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPaste": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPasteCapture": {
+      "type": "ClipboardEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPause": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPauseCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlay": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlaying": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPlayingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancel": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerCancelCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDown": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerDownCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnter": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerEnterCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeave": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerLeaveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMove": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerMoveCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOut": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOutCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOver": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerOverCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUp": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onPointerUpCapture": {
+      "type": "PointerEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgress": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onProgressCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onRateChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onReset": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResetCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResize": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onResizeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScroll": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onScrollCapture": {
+      "type": "UIEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeked": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekedCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeeking": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSeekingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelect": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSelectCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalled": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onStalledCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmit": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSubmitCapture": {
+      "type": "FormEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspend": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onSuspendCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdate": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTimeUpdateCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancel": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchCancelCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEnd": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchEndCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMove": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchMoveCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStart": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTouchStartCapture": {
+      "type": "TouchEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEnd": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onTransitionEndCapture": {
+      "type": "TransitionEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChange": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onVolumeChangeCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaiting": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWaitingCapture": {
+      "type": "ReactEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheel": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "onWheelCapture": {
+      "type": "WheelEventHandler<HTMLDivElement>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "placeholder": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "prefix": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "property": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "radioGroup": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "resource": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "results": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "role": {
+      "type": "AriaRole",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "security": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "slot": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "spellCheck": {
+      "type": "Booleanish",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressContentEditableWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "suppressHydrationWarning": {
+      "type": "boolean",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "tabIndex": {
+      "type": "number",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "title": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "translate": {
+      "type": "\"yes\" | \"no\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "typeof": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "unselectable": {
+      "type": "\"on\" | \"off\"",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    },
+    "vocab": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true
+    }
+  }
+}

From 3346998cce2eef439bd6a30671339ac0383a7ae8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Tue, 11 Jun 2024 17:08:29 -0400
Subject: [PATCH 38/55] chore: animations

---
 .../ai-chat-log/src/AIChatLogger.tsx          | 10 +----
 .../ai-chat-log/src/AIChatMessageLoading.tsx  | 41 +++++++++++++++++--
 .../stories/useAIChatLogger.stories.tsx       |  3 +-
 3 files changed, 42 insertions(+), 12 deletions(-)

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
index 723a6e4791..e755818c26 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLogger.tsx
@@ -21,18 +21,12 @@ export interface AIChatLoggerProps extends HTMLPasteProps<"div"> {
   children?: never;
 }
 
-const buildTransitionX = (AIChat: AIChat): number => {
-  if (AIChat.variant === "bot") return -100;
-  if (AIChat.variant === "user") return 100;
-  return 0;
-};
-
 export const AIChatLogger = React.forwardRef<HTMLDivElement, AIChatLoggerProps>(({ aiChats, ...props }, ref) => {
   const transitions = useTransition(aiChats, {
     keys: (AIChat: AIChat) => AIChat.id,
-    from: (AIChat: AIChat): StyleProps => ({ opacity: 0, x: buildTransitionX(AIChat) }),
+    from: (): StyleProps => ({ opacity: 0, x: 0 }),
     enter: { opacity: 1, x: 0 },
-    leave: (AIChat: AIChat): StyleProps => ({ opacity: 0, x: buildTransitionX(AIChat) }),
+    leave: (): StyleProps => ({ opacity: 0, x: 0 }),
     config: {
       mass: 0.7,
       tension: 190,
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
index 6758a04436..a0481987e5 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
@@ -7,6 +7,8 @@ import { SkeletonLoader } from "@twilio-paste/skeleton-loader";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
+import { AIMessageContext } from "./AIMessageContext";
+
 const clampedRandom = (min: number, max: number): number => {
   return Math.min(Math.max(min, Math.random() * max), max);
 };
@@ -20,13 +22,46 @@ export interface AIChatMessageLoadingProps extends HTMLPasteProps<"div"> {
    * @memberof AIChatMessageLoadingProps
    */
   element?: BoxElementProps["element"];
+  /**
+   * Function to call when "Stop generating AI response" button is clicked. If not provided, the button will not be rendered.
+   *
+   * @type {() => void}
+   * @memberof AIChatMessageLoadingProps
+   */
   onStopLoading?: () => void;
+  /**
+   * I18n label text for the "Stop generating" button when `onStopLoading` is passed for non-english languages.
+   *
+   * @default "Stop generating"
+   * @type {string}
+   * @memberof AIChatMessageLoadingProps
+   */
+  i18nStopGeneratingLabel?: string;
+  /**
+   * I18n accessible screen reader text to give context to the "Stop generating" button when `onStopLoading` is passed for non-english languages. Should read as a sentence, e.g. "Stop generating AI response".
+   *
+   * @default "AI response"
+   * @type {string}
+   * @memberof AIChatMessageLoadingProps
+   */
+  i18nAIScreenReaderText?: string;
 }
 
 export const AIChatMessageLoading = React.forwardRef<HTMLDivElement, AIChatMessageLoadingProps>(
-  ({ onStopLoading, element = "AI_CHAT_MESSAGE_LOADING", ...props }, ref) => {
+  (
+    {
+      onStopLoading,
+      i18nStopGeneratingLabel = "Stop generating",
+      i18nAIScreenReaderText = "AI response",
+      element = "AI_CHAT_MESSAGE_LOADING",
+      ...props
+    },
+    ref,
+  ) => {
     const widths = React.useRef([clampedRandom(40, 75), clampedRandom(65, 100), clampedRandom(55, 80)]).current;
 
+    const { id: messageBodyID } = React.useContext(AIMessageContext);
+
     return (
       <Box
         {...safelySpreadBoxProps(props)}
@@ -42,9 +77,9 @@ export const AIChatMessageLoading = React.forwardRef<HTMLDivElement, AIChatMessa
         <SkeletonLoader width={`${widths[2]}%`} height="20px" />
         {onStopLoading ? (
           <Box display="flex" justifyContent="center">
-            <Button variant="secondary" size="rounded_small" onClick={onStopLoading}>
+            <Button variant="secondary" size="rounded_small" onClick={onStopLoading} aria-controls={messageBodyID}>
               <StopIcon decorative={true} />
-              Stop generating <ScreenReaderOnly>AI response</ScreenReaderOnly>
+              {i18nStopGeneratingLabel} <ScreenReaderOnly>{i18nAIScreenReaderText}</ScreenReaderOnly>
             </Button>
           </Box>
         ) : null}
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index f016c6150b..98a6f6d56f 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -96,7 +96,8 @@ export const UseChatLogger: StoryFn = () => {
           <AIChatMessageAuthor aria-label={isBot ? "AI said" : "You said"}>
             {isBot ? "Good Bot" : "Gibby Radki"}
           </AIChatMessageAuthor>
-          <AIChatMessageBodyTypeWriter animated={isBot}>{message}</AIChatMessageBodyTypeWriter>
+          <AIChatMessageBody>{message}</AIChatMessageBody>
+          {/* <AIChatMessageBodyTypeWriter animated={isBot}>{message}</AIChatMessageBodyTypeWriter> */}
         </AIChatMessage>
       ),
     };

From 3b07554b542ff88c93357067de5c87f998825ce3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Wed, 12 Jun 2024 23:29:05 -0400
Subject: [PATCH 39/55] chore: refactors renaming and composer story

---
 .../paste-codemods/tools/.cache/mappings.json |   6 +-
 .../ai-chat-log/src/AIChatMessageAction.tsx   |  41 +++
 ...tions.tsx => AIChatMessageActionGroup.tsx} |  15 +-
 .../src/AIChatMessageBodyTypeWriter.tsx       | 206 ---------------
 .../ai-chat-log/src/AIChatMessageFeedback.tsx |  99 --------
 .../ai-chat-log/src/AIChatMessageRewrite.tsx  |  70 -----
 .../components/ai-chat-log/src/index.tsx      |  14 +-
 .../ai-chat-log/stories/composer.stories.tsx  | 240 ++++++++++++++++++
 .../ai-chat-log/stories/index.stories.tsx     | 137 ++++++----
 .../ai-chat-log/stories/parts.stories.tsx     | 164 ++++++------
 .../stories/useAIChatLogger.stories.tsx       |  32 ++-
 11 files changed, 489 insertions(+), 535 deletions(-)
 create mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageAction.tsx
 rename packages/paste-core/components/ai-chat-log/src/{AIChatMessageActions.tsx => AIChatMessageActionGroup.tsx} (61%)
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx

diff --git a/packages/paste-codemods/tools/.cache/mappings.json b/packages/paste-codemods/tools/.cache/mappings.json
index 65c3039a3f..354027dd9c 100644
--- a/packages/paste-codemods/tools/.cache/mappings.json
+++ b/packages/paste-codemods/tools/.cache/mappings.json
@@ -9,13 +9,11 @@
   "AIChatLog": "@twilio-paste/core/ai-chat-log",
   "AIChatLogger": "@twilio-paste/core/ai-chat-log",
   "AIChatMessage": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageActions": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageAction": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageActionGroup": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageAuthor": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageBody": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageBodyTypeWriter": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageFeedback": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageLoading": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageRewrite": "@twilio-paste/core/ai-chat-log",
   "useAIChatLogger": "@twilio-paste/core/ai-chat-log",
   "Alert": "@twilio-paste/core/alert",
   "AlertDialog": "@twilio-paste/core/alert-dialog",
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAction.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAction.tsx
new file mode 100644
index 0000000000..16c5c38a6a
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAction.tsx
@@ -0,0 +1,41 @@
+import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
+import type { BoxElementProps } from "@twilio-paste/box";
+import type { HTMLPasteProps } from "@twilio-paste/types";
+import * as React from "react";
+
+export interface AIChatMessageActionProps extends HTMLPasteProps<"div"> {
+  children?: NonNullable<React.ReactNode>;
+  /**
+   * Overrides the default element name to apply unique styles with the Customization Provider
+   *
+   * @default "AI_CHAT_MESSAGE_ACTION"
+   * @type {BoxProps["element"]}
+   * @memberof AIChatMessageActionProps
+   */
+  element?: BoxElementProps["element"];
+}
+
+export const AIChatMessageAction = React.forwardRef<HTMLDivElement, AIChatMessageActionProps>(
+  ({ children, element = "AI_CHAT_MESSAGE_ACTION", ...props }, ref) => (
+    <Box
+      {...safelySpreadBoxProps(props)}
+      ref={ref}
+      element={element}
+      display="inline-flex"
+      alignItems="flex-start"
+      columnGap="space30"
+      color="colorTextIcon"
+      lineHeight="lineHeight20"
+      fontSize="fontSize20"
+      backgroundColor="colorBackgroundBody"
+      boxShadow="shadowBorderWeaker"
+      borderRadius="borderRadius30"
+      paddingX="space30"
+      paddingY="space20"
+    >
+      {children}
+    </Box>
+  ),
+);
+
+AIChatMessageAction.displayName = "AIChatMessageAction";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActionGroup.tsx
similarity index 61%
rename from packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessageActionGroup.tsx
index c0df6f20b8..2d69d949a5 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActionGroup.tsx
@@ -3,27 +3,27 @@ import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-export interface AIChatMessageActionsProps extends HTMLPasteProps<"div"> {
+export interface AIChatMessageActionGroupProps extends HTMLPasteProps<"div"> {
   /**
    *
    * @default null
    * @type {string}
-   * @memberof AIChatMessageActionsProps
+   * @memberof AIChatMessageActionGroupProps
    */
   "aria-label": string;
   children: NonNullable<React.ReactNode>;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "AI_CHAT_MESSAGE_ACTIONS"
+   * @default "AI_CHAT_MESSAGE_ACTION_GROUP"
    * @type {BoxProps["element"]}
-   * @memberof AIChatMessageActionsProps
+   * @memberof AIChatMessageActionGroupProps
    */
   element?: BoxElementProps["element"];
 }
 
-export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessageActionsProps>(
-  ({ children, element = "AI_CHAT_MESSAGE_ACTIONS", ...props }, ref) => {
+export const AIChatMessageActionGroup = React.forwardRef<HTMLDivElement, AIChatMessageActionGroupProps>(
+  ({ children, element = "AI_CHAT_MESSAGE_ACTION_GROUP", ...props }, ref) => {
     return (
       <Box
         {...safelySpreadBoxProps(props)}
@@ -33,6 +33,7 @@ export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessa
         alignItems="center"
         columnGap="space30"
         fontWeight="fontWeightMedium"
+        paddingTop="space40"
       >
         {children}
       </Box>
@@ -40,4 +41,4 @@ export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessa
   },
 );
 
-AIChatMessageActions.displayName = "AIChatMessageActions";
+AIChatMessageActionGroup.displayName = "AIChatMessageActionGroup";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
deleted file mode 100644
index e4a9f4f2e2..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
+++ /dev/null
@@ -1,206 +0,0 @@
-import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps } from "@twilio-paste/box";
-import type { ThemeShape } from "@twilio-paste/theme";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import { uid } from "@twilio-paste/uid-library";
-import * as React from "react";
-
-const Variants = {
-  default: {
-    fontSize: "fontSize30" as ThemeShape["fontSizes"],
-    lineHeight: "lineHeight30" as ThemeShape["lineHeights"],
-  },
-  fullScreen: {
-    fontSize: "fontSize40" as ThemeShape["fontSizes"],
-    lineHeight: "lineHeight40" as ThemeShape["lineHeights"],
-  },
-};
-
-export interface AIChatMessageBodyTypeWriterProps extends HTMLPasteProps<"div"> {
-  children?: React.ReactNode;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "AI_CHAT_MESSAGE_BODY_TYPE_WRITER"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatMessageBodyTypeWriterProps
-   */
-  element?: BoxElementProps["element"];
-  /**
-   * Override the font size for full screen experiences.
-   *
-   * @default "default"
-   * @type {"default" | "fullScreen"}
-   * @memberof AIChatMessageBodyTypeWriterProps
-   */
-  variant?: "default" | "fullScreen";
-  /**
-   * Whether the text should be animated with type writer effect
-   *
-   * @default true
-   * @type {boolean}
-   * @memberof AIChatMessageBodyTypeWriterProps
-   */
-  animated?: boolean;
-}
-
-export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AIChatMessageBodyTypeWriterProps>(
-  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY_TYPE_WRITER", animated = true, ...props }, ref) => {
-    const [textLessChildren, setTextLessChildren] = React.useState<React.ReactNode[]>([]);
-    const [animatedChildren, setAnimatedChildren] = React.useState<React.ReactNode[]>([]);
-    const [childrenText, setChildrenText] = React.useState<string[]>([]);
-
-    const findNestedElementText = (elementNode: React.ReactNode): string => {
-      let text = "";
-
-      React.Children.forEach(elementNode, (child) => {
-        if (typeof child === "string") {
-          text += child;
-        } else if (React.isValidElement(child)) {
-          // Recursively find text in nested elements
-          text += findNestedElementText(child.props.children);
-        }
-      });
-
-      return text;
-    };
-
-    // Initially split all children from text and elements
-    React.useEffect(() => {
-      if (textLessChildren.length === 0 && childrenText.length === 0 && animated) {
-        React.Children.forEach(children, (child) => {
-          // Strings dn onot neet to copy props
-          if (typeof child === "string") {
-            setChildrenText((prevState) => [...prevState, child]);
-            setTextLessChildren((prevState) => [...prevState, ""]);
-          } else if (React.isValidElement(child)) {
-            setChildrenText((prevState) => [...prevState, findNestedElementText(child.props.children)]);
-            const { children: elementChildren, ...rest } = child.props;
-            // by using {...rest} we take all props except children (the text inside the element )
-            setTextLessChildren((prevState) => [...prevState, <child.type key={rest.key} {...rest} />]);
-          }
-        });
-      }
-    }, []);
-
-    const handleAnimationChangeForChild = (index: number): void => {
-      const animationChild = animatedChildren[index];
-      const textForChild = childrenText[index];
-
-      let currentText = "";
-
-      if (React.isValidElement(animationChild)) {
-        currentText += findNestedElementText(animationChild.props.children);
-        setAnimatedChildren((prev) =>
-          prev.map((el, i) => {
-            if (i === index) {
-              return (
-                <animationChild.type {...animationChild.props}>
-                  {findNestedElementText(animationChild.props.children) + textForChild[currentText.length]}
-                </animationChild.type>
-              );
-            }
-            return el;
-          }),
-        );
-      } else {
-        currentText += animationChild;
-        setAnimatedChildren((prev) =>
-          prev.map((el, i) => {
-            if (i === index) {
-              return currentText + textForChild[currentText.length];
-            }
-            return el;
-          }),
-        );
-      }
-    };
-
-    const handleAddNewAnimatedElWithFirstChar = (index: number): void => {
-      const textForChild = childrenText[index];
-      const child = React.Children.toArray(children)[index];
-
-      if (React.isValidElement(child)) {
-        setAnimatedChildren((prevState) => [
-          ...prevState,
-          <child.type key={child.props.key} {...child.props}>
-            {textForChild[0]}
-          </child.type>,
-        ]);
-      } else {
-        setAnimatedChildren((prevState) => [...prevState, textForChild[0]]);
-      }
-    };
-
-    React.useEffect(() => {
-      let interval: NodeJS.Timeout;
-
-      if (animated) {
-        interval = setInterval(() => {
-          if (textLessChildren.length > 0 && childrenText.length > 0) {
-            if (animatedChildren.length === 0) {
-              handleAddNewAnimatedElWithFirstChar(0);
-            } else {
-              /**
-               * Find the index of an element in the animated children array where the text content does not
-               * match the text length passed in
-               */
-              const indexOfElementToUpdate = animatedChildren.findIndex((child, i) => {
-                let currentText = "";
-
-                if (React.isValidElement(child)) {
-                  currentText += findNestedElementText(child.props.children);
-                } else {
-                  currentText += child;
-                }
-                if (currentText.length < childrenText[i].length) {
-                  return true;
-                }
-                return false;
-              });
-
-              if (indexOfElementToUpdate >= 0) {
-                handleAnimationChangeForChild(indexOfElementToUpdate);
-              }
-              // If text content matches another check is needed to add the next element that is missing
-              if (indexOfElementToUpdate === -1 && animatedChildren.length < textLessChildren.length) {
-                handleAddNewAnimatedElWithFirstChar(animatedChildren.length);
-              }
-              // If no element is missing and all text is the stop the interval
-              else {
-                clearInterval(interval);
-              }
-            }
-          }
-        }, 25);
-      }
-
-      return () => clearInterval(interval);
-    }, [textLessChildren, childrenText, animatedChildren]);
-
-    return (
-      <Box
-        {...safelySpreadBoxProps(props)}
-        {...Variants[variant]}
-        display="inline-block"
-        color="colorText"
-        wordWrap="break-word"
-        maxWidth="100%"
-        minWidth={0}
-        element={element}
-        ref={ref}
-        whiteSpace="pre-wrap"
-      >
-        {animated
-          ? animatedChildren.map((el, idx) => (
-              <Box as="span" key={uid(idx)}>
-                {el}
-              </Box>
-            ))
-          : children}
-      </Box>
-    );
-  },
-);
-
-AIChatMessageBodyTypeWriter.displayName = "AIChatMessageBodyTypeWriter";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
deleted file mode 100644
index ba62b7e038..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps } from "@twilio-paste/box";
-import { Button } from "@twilio-paste/button";
-import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
-import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import * as React from "react";
-
-export interface AIChatMessageFeedbackProps extends HTMLPasteProps<"div"> {
-  children?: never;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "AI_CHAT_MESSAGE_FEEDBACK"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  element?: BoxElementProps["element"];
-  /**
-   * Custom label text for the message feedback component
-   *
-   * @default "Is this helpful?"
-   * @type {string}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  label?: string;
-  /**
-   * Custom accessible label for the "Like result" button for non-English languages
-   *
-   * @default "Like result"
-   * @type {string}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  i18nLikeLabel?: string;
-  /**
-   * Custom accessible label for the "Dislike result" button for non-English languages
-   *
-   * @default "Dislike result"
-   * @type {string}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  i18nDislikeLabel?: string;
-  /**
-   * Function to call on click of "Like result" button
-   *
-   * @type {() => void}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  onLike: () => void;
-  /**
-   * Function to call on click of "Disike result" button
-   *
-   * @type {() => void}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  onDislike: () => void;
-}
-
-export const AIChatMessageFeedback = React.forwardRef<HTMLDivElement, AIChatMessageFeedbackProps>(
-  (
-    {
-      label = "Is this helpful?",
-      i18nLikeLabel = "Like result",
-      i18nDislikeLabel = "Dislike result",
-      onLike,
-      onDislike,
-      element = "AI_CHAT_MESSAGE_FEEDBACK",
-      ...props
-    },
-    ref,
-  ) => (
-    <Box
-      {...safelySpreadBoxProps(props)}
-      ref={ref}
-      element={element}
-      display="inline-flex"
-      alignItems="flex-start"
-      columnGap="space30"
-      color="colorTextIcon"
-      lineHeight="lineHeight20"
-      fontSize="fontSize20"
-      backgroundColor="colorBackgroundBody"
-      boxShadow="shadowBorderWeaker"
-      borderRadius="borderRadius30"
-      paddingX="space30"
-      paddingY="space20"
-    >
-      <Box as="span">{label}</Box>
-      <Button variant="reset" size="reset" onClick={onLike} element={`${element}_LIKE_BUTTON`}>
-        <ThumbsUpIcon decorative={false} title={i18nLikeLabel} />
-      </Button>
-      <Button variant="reset" size="reset" onClick={onDislike} element={`${element}_DISLIKE_BUTTON`}>
-        <ThumbsDownIcon decorative={false} title={i18nDislikeLabel} />
-      </Button>
-    </Box>
-  ),
-);
-
-AIChatMessageFeedback.displayName = "AIChatMessageFeedback";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
deleted file mode 100644
index 380d248b45..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
+++ /dev/null
@@ -1,70 +0,0 @@
-import { safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps } from "@twilio-paste/box";
-import { Button } from "@twilio-paste/button";
-import { RefreshIcon } from "@twilio-paste/icons/esm/RefreshIcon";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import * as React from "react";
-
-import { AIMessageContext } from "./AIMessageContext";
-
-export interface AIChatMessageRewriteProps extends HTMLPasteProps<"button"> {
-  children?: never;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "AI_CHAT_MESSAGE_REWRITE"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatMessageRewriteProps
-   */
-  element?: BoxElementProps["element"];
-  /**
-   * Custom label text for the message rewrite component
-   *
-   * @default "Rewrite"
-   * @type {string}
-   * @memberof AIChatMessageRewriteProps
-   */
-  label?: string;
-  /**
-   * Function to call on click of message rewrite button
-   *
-   * @type {() => void}
-   * @memberof AIChatMessageRewriteProps
-   */
-  onRewrite: () => void;
-}
-
-export const AIChatMessageRewrite = React.forwardRef<HTMLButtonElement, AIChatMessageRewriteProps>(
-  ({ label = "Rewrite", onRewrite, element = "AI_CHAT_MESSAGE_REWRITE", ...props }, ref) => {
-    const { id: messageBodyId } = React.useContext(AIMessageContext);
-
-    return (
-      <Button
-        {...safelySpreadBoxProps(props)}
-        variant="reset"
-        size="reset"
-        ref={ref}
-        element={element}
-        display="inline-flex"
-        alignItems="flex-start"
-        columnGap="space30"
-        color="colorTextIcon"
-        lineHeight="lineHeight30"
-        fontSize="fontSize30"
-        fontWeight="fontWeightSemibold"
-        backgroundColor="colorBackgroundBody"
-        boxShadow="shadowBorderWeaker"
-        borderRadius="borderRadius30"
-        paddingX="space30"
-        paddingY="space20"
-        onClick={onRewrite}
-        aria-controls={messageBodyId}
-      >
-        <RefreshIcon decorative />
-        {label}
-      </Button>
-    );
-  },
-);
-
-AIChatMessageRewrite.displayName = "AIChatMessageRewrite";
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index 02b24da180..c0efe62ba3 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -1,24 +1,20 @@
 export { AIChatMessage } from "./AIChatMessage";
 export type { AIChatMessageProps } from "./AIChatMessage";
-export { AIChatMessageActions } from "./AIChatMessageActions";
-export type { AIChatMessageActionsProps } from "./AIChatMessageActions";
+export { AIChatMessageActionGroup } from "./AIChatMessageActionGroup";
+export type { AIChatMessageActionGroupProps } from "./AIChatMessageActionGroup";
 export { AIChatMessageBody } from "./AIChatMessageBody";
 export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
-export { AIChatMessageBodyTypeWriter } from "./AIChatMessageBodyTypeWriter";
-export type { AIChatMessageBodyTypeWriterProps } from "./AIChatMessageBodyTypeWriter";
 export { AIChatMessageAuthor } from "./AIChatMessageAuthor";
 export type { AIChatMessageAuthorProps } from "./AIChatMessageAuthor";
-export { AIChatMessageFeedback } from "./AIChatMessageFeedback";
-export type { AIChatMessageFeedbackProps } from "./AIChatMessageFeedback";
-export { AIChatMessageRewrite } from "./AIChatMessageRewrite";
-export type { AIChatMessageRewriteProps } from "./AIChatMessageRewrite";
+export { AIChatMessageAction } from "./AIChatMessageAction";
+export type { AIChatMessageActionProps } from "./AIChatMessageAction";
 export { AIChatMessageLoading } from "./AIChatMessageLoading";
 export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 
 export { AIChatLog } from "./AIChatLog";
 export type { AIChatLogProps } from "./AIChatLog";
 export { useAIChatLogger } from "./useAIChatLogger";
-export type { UseAIChatLogger, AIPartialIDChat } from "./useAIChatLogger";
+export type { UseAIChatLogger, AIPartialIDChat, AIChat } from "./useAIChatLogger";
 export { AIChatLogger } from "./AIChatLogger";
 export type { AIChatLoggerProps } from "./AIChatLogger";
 
diff --git a/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx
new file mode 100644
index 0000000000..732e35db86
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx
@@ -0,0 +1,240 @@
+// eslint-disable-next-line eslint-comments/disable-enable-pair
+/* eslint-disable import/no-extraneous-dependencies */
+import type { AIChat } from "@twilio-paste/ai-chat-log";
+import { Box } from "@twilio-paste/box";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { ChatComposer } from "@twilio-paste/chat-composer";
+import { SendIcon } from "@twilio-paste/icons/esm/SendIcon";
+import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
+import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
+import {
+  $getRoot,
+  CLEAR_EDITOR_COMMAND,
+  COMMAND_PRIORITY_HIGH,
+  ClearEditorPlugin,
+  KEY_ENTER_COMMAND,
+  useLexicalComposerContext,
+} from "@twilio-paste/lexical-library";
+import * as React from "react";
+
+import {
+  AIChatLog,
+  AIChatLogger,
+  AIChatMessage,
+  AIChatMessageAction,
+  AIChatMessageActionGroup,
+  AIChatMessageAuthor,
+  AIChatMessageBody,
+  AIChatMessageLoading,
+  useAIChatLogger,
+} from "../src";
+
+export default {
+  title: "Components/AI Chat Log",
+  component: AIChatLog,
+};
+
+function getRandomInt(max: number): number {
+  return Math.floor(Math.random() * max);
+}
+
+const BotMessage = (props): JSX.Element => {
+  const [isLoading, setIsLoading] = React.useState(true);
+
+  setTimeout(() => {
+    setIsLoading(false);
+  }, 3000);
+  return isLoading ? (
+    <AIChatMessage variant="bot">
+      <AIChatMessageAuthor aria-label="Bot said">Good Bot</AIChatMessageAuthor>
+      <AIChatMessageLoading
+        onStopLoading={() => {
+          setIsLoading(false);
+        }}
+      />
+    </AIChatMessage>
+  ) : (
+    <AIChatMessage variant="bot">
+      <AIChatMessageAuthor aria-label="Bot said">Good Bot</AIChatMessageAuthor>
+      <AIChatMessageBody>{props.message as string}</AIChatMessageBody>
+    </AIChatMessage>
+  );
+};
+
+// eslint-disable-next-line storybook/prefer-pascal-case
+export const createNewMessage = (message: string): Omit<AIChat, "id"> => {
+  const messageDirection = getRandomInt(2) === 1 ? "user" : "bot";
+
+  return {
+    variant: messageDirection,
+    content:
+      messageDirection === "user" ? (
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor aria-label="You said at 2:39pm">Gibby Radki</AIChatMessageAuthor>
+          <AIChatMessageBody>{message}</AIChatMessageBody>
+        </AIChatMessage>
+      ) : (
+        <AIChatMessage variant="bot">
+          <BotMessage message={message} />
+        </AIChatMessage>
+      ),
+  };
+};
+
+export const SendButtonPlugin = ({ onClick }: { onClick: () => void }): JSX.Element => {
+  const [editor] = useLexicalComposerContext();
+
+  const handleSend = (): void => {
+    onClick();
+    editor.dispatchCommand(CLEAR_EDITOR_COMMAND, undefined);
+  };
+
+  return (
+    <Box position="absolute" top="space30" right="space30">
+      <Button variant="primary_icon" size="reset" onClick={handleSend}>
+        <SendIcon decorative={false} title="Send message" />
+      </Button>
+    </Box>
+  );
+};
+
+export const EnterKeySubmitPlugin = ({ onKeyDown }: { onKeyDown: () => void }): null => {
+  const [editor] = useLexicalComposerContext();
+
+  const handleEnterKey = React.useCallback(
+    (event: KeyboardEvent) => {
+      const { shiftKey, ctrlKey } = event;
+      if (shiftKey || ctrlKey) return false;
+      event.preventDefault();
+      event.stopPropagation();
+      onKeyDown();
+      editor.dispatchCommand(CLEAR_EDITOR_COMMAND, undefined);
+      return true;
+    },
+    [editor, onKeyDown],
+  );
+
+  React.useEffect(() => {
+    return editor.registerCommand(KEY_ENTER_COMMAND, handleEnterKey, COMMAND_PRIORITY_HIGH);
+  }, [editor, handleEnterKey]);
+  return null;
+};
+
+export const AIChatLogComposer = (): React.ReactNode => {
+  const { aiChats, push } = useAIChatLogger(
+    {
+      variant: "user",
+      content: (
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+        </AIChatMessage>
+      ),
+    },
+    {
+      variant: "bot",
+      content: (
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus
+            eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
+            nesciunt impedit repellat assumenda.
+          </AIChatMessageBody>
+          <AIChatMessageActionGroup aria-label="Quick actions available:">
+            <ButtonGroup>
+              <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                30009
+              </Button>
+            </ButtonGroup>
+          </AIChatMessageActionGroup>
+          <AIChatMessageActionGroup aria-label="Feedback form">
+            <AIChatMessageAction>
+              Is this helpful?
+              <Button variant="reset" size="reset">
+                <ThumbsUpIcon decorative={false} title="like result" />
+              </Button>
+              <Button variant="reset" size="reset">
+                <ThumbsDownIcon decorative={false} title="dislike result" />
+              </Button>
+            </AIChatMessageAction>
+          </AIChatMessageActionGroup>{" "}
+        </AIChatMessage>
+      ),
+    },
+  );
+  const [message, setMessage] = React.useState("");
+
+  const [mounted, setMounted] = React.useState(false);
+  const loggerRef = React.useRef(null);
+  const scrollerRef = React.useRef(null);
+
+  React.useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  React.useEffect(() => {
+    if (!mounted || !loggerRef.current) return;
+    const scrollPosition: any = scrollerRef.current;
+    const scrollHeight: any = loggerRef.current;
+    scrollPosition?.scrollTo({ top: scrollHeight.scrollHeight, behavior: "smooth" });
+  }, [aiChats, mounted]);
+
+  const handleComposerChange = (editorState): void => {
+    editorState.read(() => {
+      const text = $getRoot().getTextContent();
+      setMessage(text);
+    });
+  };
+
+  const submitMessage = (): void => {
+    if (message === "") return;
+    push(createNewMessage(message));
+  };
+  return (
+    <Box>
+      <Box ref={scrollerRef} overflowX="hidden" overflowY="auto" maxHeight="size50" tabIndex={0}>
+        <AIChatLogger ref={loggerRef} aiChats={aiChats} />
+      </Box>
+      <Box
+        borderStyle="solid"
+        borderWidth="borderWidth0"
+        borderTopWidth="borderWidth10"
+        borderColor="colorBorderWeak"
+        display="flex"
+        flexDirection="row"
+        columnGap="space30"
+        paddingX="space70"
+        paddingTop="space50"
+      >
+        <ChatComposer
+          maxHeight="size10"
+          config={{
+            namespace: "foo",
+            onError: (error) => {
+              throw error;
+            },
+          }}
+          ariaLabel="Message"
+          placeholder="Type here..."
+          onChange={handleComposerChange}
+        >
+          <ClearEditorPlugin />
+          <SendButtonPlugin onClick={submitMessage} />
+          <EnterKeySubmitPlugin onKeyDown={submitMessage} />
+        </ChatComposer>
+      </Box>
+    </Box>
+  );
+};
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 0147ba40d6..affe5255c0 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -1,19 +1,23 @@
 // eslint-disable-next-line eslint-comments/disable-enable-pair
 /* eslint-disable import/no-extraneous-dependencies */
+import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
+import { ChatComposer } from "@twilio-paste/chat-composer";
+import { SendIcon } from "@twilio-paste/icons/esm/SendIcon";
+import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
+import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
 import { UserIcon } from "@twilio-paste/icons/esm/UserIcon";
 import * as React from "react";
 
 import {
   AIChatLog,
   AIChatMessage,
-  AIChatMessageActions,
+  AIChatMessageAction,
+  AIChatMessageActionGroup,
   AIChatMessageAuthor,
   AIChatMessageBody,
-  AIChatMessageFeedback,
   AIChatMessageLoading,
-  AIChatMessageRewrite,
 } from "../src";
 
 export default {
@@ -23,56 +27,81 @@ export default {
 
 export const ExampleAIChatLog = (): React.ReactNode => {
   return (
-    <AIChatLog>
-      <AIChatMessage variant="user">
-        <AIChatMessageAuthor avatarName="Gibby Ridki" avatarIcon={UserIcon} aria-label="You said at 2:36pm">
-          You
-        </AIChatMessageAuthor>
-        <AIChatMessageBody size="default">
-          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
-          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-          impedit repellat assumenda.
-        </AIChatMessageBody>
-      </AIChatMessage>
-      <AIChatMessage variant="bot">
-        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
-        <AIChatMessageBody size="default">
-          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
-          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-          impedit repellat assumenda.
-        </AIChatMessageBody>
-        <AIChatMessageActions aria-label="Quick actions available:">
-          <ButtonGroup>
-            <Button variant="secondary" onClick={() => {}} size="rounded_small">
-              30007
-            </Button>
-            <Button variant="secondary" onClick={() => {}} size="rounded_small">
-              30007
-            </Button>
-            <Button variant="secondary" onClick={() => {}} size="rounded_small">
-              30009
-            </Button>
-          </ButtonGroup>
-        </AIChatMessageActions>
-        <AIChatMessageActions aria-label="Feedback form">
-          <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-          <AIChatMessageRewrite onRewrite={() => {}} />
-        </AIChatMessageActions>
-      </AIChatMessage>
-      <AIChatMessage variant="user">
-        <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
-        <AIChatMessageBody>
-          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi iure
-          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
-          impedit repellat assumenda.
-        </AIChatMessageBody>
-      </AIChatMessage>
-      <AIChatMessage variant="bot">
-        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
-        <AIChatMessageBody>
-          <AIChatMessageLoading onStopLoading={() => {}} />
-        </AIChatMessageBody>
-      </AIChatMessage>
-    </AIChatLog>
+    <>
+      <AIChatLog>
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor avatarName="Gibby Ridki" avatarIcon={UserIcon} aria-label="You said at 2:36pm">
+            You
+          </AIChatMessageAuthor>
+          <AIChatMessageBody size="default">
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+        </AIChatMessage>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody size="default">
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+          <AIChatMessageActionGroup aria-label="Quick actions available:">
+            <ButtonGroup>
+              <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                30007
+              </Button>
+              <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                30009
+              </Button>
+            </ButtonGroup>
+          </AIChatMessageActionGroup>
+          <AIChatMessageActionGroup aria-label="Feedback form">
+            <AIChatMessageAction>
+              Is this helpful?
+              <Button variant="reset" size="reset">
+                <ThumbsUpIcon decorative={false} title="like result" />
+              </Button>
+              <Button variant="reset" size="reset">
+                <ThumbsDownIcon decorative={false} title="dislike result" />
+              </Button>
+            </AIChatMessageAction>
+          </AIChatMessageActionGroup>
+        </AIChatMessage>
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+        </AIChatMessage>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            <AIChatMessageLoading onStopLoading={() => {}} />
+          </AIChatMessageBody>
+        </AIChatMessage>
+      </AIChatLog>
+      <ChatComposer
+        config={{
+          namespace: "customer-chat",
+          onError: (e) => {
+            throw e;
+          },
+        }}
+        placeholder="Chat text"
+        ariaLabel="A placeholder chat composer"
+      >
+        <Box position="absolute" top="space30" right="space30">
+          <Button variant="primary_icon" size="reset">
+            <SendIcon decorative={false} title="Send message" />
+          </Button>
+        </Box>
+      </ChatComposer>
+    </>
   );
 };
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index fb5ad4f55e..b895fda128 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -1,20 +1,22 @@
 // eslint-disable-next-line eslint-comments/disable-enable-pair
 /* eslint-disable import/no-extraneous-dependencies */
-import { Anchor } from "@twilio-paste/anchor";
 import { Box } from "@twilio-paste/box";
-import { Disclosure, DisclosureContent, DisclosureHeading } from "@twilio-paste/disclosure";
-import { Heading } from "@twilio-paste/heading";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
+import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
+import { UserIcon } from "@twilio-paste/icons/esm/UserIcon";
 import { InlineCode } from "@twilio-paste/inline-code";
 import * as React from "react";
 
 import {
   AIChatLog,
-  AIChatMessageActions,
+  AIChatMessage,
+  AIChatMessageAction,
+  AIChatMessageActionGroup,
+  AIChatMessageAuthor,
   AIChatMessageBody,
-  AIChatMessageBodyTypeWriter,
-  AIChatMessageFeedback,
   AIChatMessageLoading,
-  AIChatMessageRewrite,
 } from "../src";
 
 // eslint-disable-next-line import/no-default-export
@@ -84,83 +86,97 @@ export const AIMessageLoadingStopLoading = (): React.ReactNode => {
 };
 AIMessageLoadingStopLoading.storyName = "AI Message (Loading - with Stop button)";
 
-export const AIMessageFeedback = (): React.ReactNode => {
-  /* eslint-disable no-alert */
+export const AIMessageAuthor = (): React.ReactNode => {
   return (
-    <AIChatMessageActions aria-label="Feedback form">
-      <AIChatMessageFeedback onLike={() => alert("Like + 1")} onDislike={() => alert("Like - 1")} />
-    </AIChatMessageActions>
+    <Box display="flex" flexDirection="column" rowGap="space60">
+      <AIChatMessage variant="user">
+        <AIChatMessageAuthor aria-label="you said">Nora Krantz</AIChatMessageAuthor>
+      </AIChatMessage>
+      <AIChatMessage variant="user">
+        <AIChatMessageAuthor aria-label="you said" avatarIcon={UserIcon}>
+          Nora Krantz (custom icon)
+        </AIChatMessageAuthor>
+      </AIChatMessage>
+      <AIChatMessage variant="bot">
+        <AIChatMessageAuthor aria-label="bot said">NoraBot</AIChatMessageAuthor>
+      </AIChatMessage>
+    </Box>
   );
-  /* eslint-enable no-alert */
 };
 
-export const AIMessageFeedbackI18nLabels = (): React.ReactNode => {
+export const AIMessageActionGroup = (): React.ReactNode => {
   /* eslint-disable no-alert */
   return (
-    <AIChatMessageActions aria-label="Feedback form">
-      <AIChatMessageFeedback
-        label="Est-ce utile?"
-        i18nDislikeLabel="pas aimer"
-        i18nLikeLabel="aimer"
-        onLike={() => alert("Like + 1")}
-        onDislike={() => alert("Like - 1")}
-      />
-    </AIChatMessageActions>
+    <AIChatMessageActionGroup aria-label="Feedback form">
+      <AIChatMessageAction>
+        Is this helpful?
+        <Button variant="reset" size="reset">
+          <ThumbsUpIcon decorative={false} title="like result" />
+        </Button>
+        <Button variant="reset" size="reset">
+          <ThumbsDownIcon decorative={false} title="dislike result" />
+        </Button>
+      </AIChatMessageAction>
+    </AIChatMessageActionGroup>
   );
   /* eslint-enable no-alert */
 };
-AIMessageFeedbackI18nLabels.storyName = "AI Message Feedback (i18n)";
-
-export const AIMessageRewrite = (): React.ReactNode => {
-  return (
-    <AIChatMessageActions aria-label="message actions">
-      <AIChatMessageRewrite onRewrite={() => {}} />
-    </AIChatMessageActions>
-  );
-};
 
-export const MessageBodyTypeWriter = (): React.ReactNode => {
+export const FullAIMessage = (): React.ReactNode => {
+  const [liked, setLiked] = React.useState(false);
+  const [disliked, setDisliked] = React.useState(false);
   return (
-    <Box>
-      <Heading as="h2" variant="heading20">
-        With enriched text
-      </Heading>
-      <Box marginBottom="space60">
-        <AIChatMessageBodyTypeWriter>
-          <span style={{ fontWeight: 600 }}>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</span> Deserunt
-          delectus fuga, necessitatibus eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat
-          quisquam itaque, earum sit <a href="https://google.com">nesciunt impedit repellat assumenda.</a> new text,{" "}
-          <Anchor showExternal href="https://google.com">
-            434324
-          </Anchor>
-        </AIChatMessageBodyTypeWriter>
-        <br />
-        <AIChatMessageBody>
-          <Disclosure>
-            <DisclosureHeading as="h4" variant="heading40">
-              Between the World and Me by Ta-Nehisi Coates
-            </DisclosureHeading>
-            <DisclosureContent>
-              But race is the child of racism, not the father. And the process of naming “the people” has never been a
-              matter of genealogy and physiognomy so much as one of hierarchy. Difference in hue and hair is old. But
-              the belief in the preeminence of hue and hair, the notion that these factors can correctly organize a
-              society and that they signify deeper attributes, which are indelible—this is the new idea at the heart of
-              these new people who have been brought up hopelessly, tragically, deceitfully, to believe that they are
-              white.
-            </DisclosureContent>
-          </Disclosure>
-        </AIChatMessageBody>
-      </Box>
-      <Heading as="h2" variant="heading20">
-        Without enriched text [fullscreen variant]:
-      </Heading>
-
-      <Box>
-        <AIChatMessageBodyTypeWriter variant="fullScreen">
-          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendiiure
-          adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
-        </AIChatMessageBodyTypeWriter>
-      </Box>
-    </Box>
+    <AIChatMessage variant="bot">
+      <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+      <AIChatMessageBody>
+        Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendiiure
+        adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt impedit
+        repellat assumenda.
+        <Box paddingTop="space70">
+          <ButtonGroup>
+            <Button variant="secondary" size="rounded_small">
+              30007
+            </Button>
+            <Button variant="secondary" size="rounded_small">
+              30007
+            </Button>
+            <Button variant="secondary" size="rounded_small">
+              30009
+            </Button>
+          </ButtonGroup>
+        </Box>
+      </AIChatMessageBody>
+      <AIChatMessageActionGroup aria-label="Feedback form">
+        <AIChatMessageAction>
+          Is this helpful?
+          <Button
+            variant="reset"
+            size="reset"
+            pressed={liked}
+            onClick={() => {
+              setLiked(!liked);
+            }}
+            _hover={{ color: "colorTextPrimaryStronger" }}
+            _pressed={{ color: "colorTextPrimary" }}
+            _pressed_hover={{ color: "colorTextPrimaryStronger" }}
+          >
+            <ThumbsUpIcon decorative={false} title="like result" />
+          </Button>
+          <Button
+            variant="reset"
+            size="reset"
+            pressed={disliked}
+            onClick={() => {
+              setDisliked(!disliked);
+            }}
+            _hover={{ color: "colorTextPrimaryStronger" }}
+            _pressed={{ color: "colorTextPrimary" }}
+            _pressed_hover={{ color: "colorTextPrimaryStronger" }}
+          >
+            <ThumbsDownIcon decorative={disliked} title="dislike result" />
+          </Button>
+        </AIChatMessageAction>
+      </AIChatMessageActionGroup>
+    </AIChatMessage>
   );
 };
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index 98a6f6d56f..62bc361943 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -4,6 +4,8 @@ import type { StoryFn } from "@storybook/react";
 import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
+import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
+import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
 import { Input } from "@twilio-paste/input";
 import { Label } from "@twilio-paste/label";
 import { ListItem, OrderedList } from "@twilio-paste/list";
@@ -15,15 +17,14 @@ import * as React from "react";
 import {
   AIChatLogger,
   AIChatMessage,
-  AIChatMessageActions,
+  AIChatMessageAction,
+  AIChatMessageActionGroup,
   AIChatMessageAuthor,
   AIChatMessageBody,
-  AIChatMessageFeedback,
   AIChatMessageLoading,
   useAIChatLogger,
 } from "../src";
 import type { AIMessageVariants, AIPartialIDChat } from "../src";
-import { AIChatMessageBodyTypeWriter } from "../src/AIChatMessageBodyTypeWriter";
 
 export default {
   title: "Components/AI Chat Log/useAIChatLogger",
@@ -59,22 +60,30 @@ export const UseChatLogger: StoryFn = () => {
             eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
             nesciunt impedit repellat assumenda.
           </AIChatMessageBody>
-          <AIChatMessageActions aria-label="Quick actions available:">
+          <AIChatMessageActionGroup aria-label="Quick actions available:">
             <ButtonGroup>
-              <Button variant="secondary" onClick={() => {}} size="small">
+              <Button variant="secondary" onClick={() => {}} size="rounded_small">
                 30007
               </Button>
-              <Button variant="secondary" onClick={() => {}} size="small">
+              <Button variant="secondary" onClick={() => {}} size="rounded_small">
                 30007
               </Button>
-              <Button variant="secondary" onClick={() => {}} size="small">
+              <Button variant="secondary" onClick={() => {}} size="rounded_small">
                 30009
               </Button>
             </ButtonGroup>
-          </AIChatMessageActions>
-          <AIChatMessageActions aria-label="Feedback form">
-            <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-          </AIChatMessageActions>{" "}
+          </AIChatMessageActionGroup>
+          <AIChatMessageActionGroup aria-label="Feedback form">
+            <AIChatMessageAction>
+              Is this helpful?
+              <Button variant="reset" size="reset">
+                <ThumbsUpIcon decorative={false} title="like result" />
+              </Button>
+              <Button variant="reset" size="reset">
+                <ThumbsDownIcon decorative={false} title="dislike result" />
+              </Button>
+            </AIChatMessageAction>
+          </AIChatMessageActionGroup>{" "}
         </AIChatMessage>
       ),
     },
@@ -97,7 +106,6 @@ export const UseChatLogger: StoryFn = () => {
             {isBot ? "Good Bot" : "Gibby Radki"}
           </AIChatMessageAuthor>
           <AIChatMessageBody>{message}</AIChatMessageBody>
-          {/* <AIChatMessageBodyTypeWriter animated={isBot}>{message}</AIChatMessageBodyTypeWriter> */}
         </AIChatMessage>
       ),
     };

From 9baedf461cd9bbc636e4fcfed72e2aaa83f2f152 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Wed, 12 Jun 2024 23:32:22 -0400
Subject: [PATCH 40/55] feat(button): allow `pressed` on reset buttons

---
 .changeset/pretty-melons-punch.md              |  6 ++++++
 .../components/button/src/Button.tsx           | 18 +++++++++++++-----
 .../components/button/src/ResetButton.tsx      |  3 ++-
 3 files changed, 21 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/pretty-melons-punch.md

diff --git a/.changeset/pretty-melons-punch.md b/.changeset/pretty-melons-punch.md
new file mode 100644
index 0000000000..57ce8abeda
--- /dev/null
+++ b/.changeset/pretty-melons-punch.md
@@ -0,0 +1,6 @@
+---
+"@twilio-paste/button": minor
+"@twilio-paste/core": minor
+---
+
+[Button] Add `pressed` prop to `variant="reset"` buttons in order to use toggle buttons in AI Chat Message Action buttons.
diff --git a/packages/paste-core/components/button/src/Button.tsx b/packages/paste-core/components/button/src/Button.tsx
index 32dc9345b9..7e26a52640 100644
--- a/packages/paste-core/components/button/src/Button.tsx
+++ b/packages/paste-core/components/button/src/Button.tsx
@@ -100,10 +100,10 @@ const handlePropValidation = ({
   }
   if (as === "a") {
     if (!hasHref) {
-      throw new Error(`[Paste: Button] Missing href prop for link button.`);
+      throw new Error("[Paste: Button] Missing href prop for link button.");
     }
     if (variant === "link" || variant === "inverse_link") {
-      throw new Error(`[Paste: Button] Using Button component as an Anchor. Use the Paste Anchor component instead.`);
+      throw new Error("[Paste: Button] Using Button component as an Anchor. Use the Paste Anchor component instead.");
     }
     if (variant !== "primary" && variant !== "secondary" && variant !== "reset" && variant !== "inverse") {
       throw new Error(`[Paste: Button] <Button as="a"> only works with the following variants: primary and secondary.`);
@@ -125,14 +125,22 @@ const handlePropValidation = ({
 
   // Button validation
   if (children == null) {
-    throw new Error(`[Paste: Button] Must have non-null children.`);
+    throw new Error("[Paste: Button] Must have non-null children.");
   }
   if (hasTabIndex && !(tabIndex === 0 || tabIndex === -1)) {
-    throw new Error(`[Paste: Button] tabIndex must be 0 or -1.`);
+    throw new Error("[Paste: Button] tabIndex must be 0 or -1.");
   }
 
   // Toggle button validaton
-  if (pressed && !(variant === "secondary" || variant === "secondary_icon" || variant === "destructive_secondary")) {
+  if (
+    pressed &&
+    !(
+      variant === "secondary" ||
+      variant === "secondary_icon" ||
+      variant === "destructive_secondary" ||
+      variant === "reset"
+    )
+  ) {
     throw new Error(
       `[Paste: Button] pressed can only be used with "secondary" and "secondary_icon" and "destructive_secondary" variants.`,
     );
diff --git a/packages/paste-core/components/button/src/ResetButton.tsx b/packages/paste-core/components/button/src/ResetButton.tsx
index b2354e8958..26db8dabab 100644
--- a/packages/paste-core/components/button/src/ResetButton.tsx
+++ b/packages/paste-core/components/button/src/ResetButton.tsx
@@ -22,12 +22,13 @@ const ButtonStyleMapping = {
 };
 
 const ResetButton = React.forwardRef<HTMLButtonElement, DirectButtonProps>(
-  ({ size, buttonState, fullWidth, ...props }, ref) => {
+  ({ size, buttonState, fullWidth, pressed, ...props }, ref) => {
     // Must spread size styles after button styles
     return (
       <Box
         ref={ref}
         width={fullWidth ? "100%" : "auto"}
+        aria-pressed={pressed}
         {...ButtonStyleMapping[buttonState]}
         {...SizeStyles[size]}
         {...(props as any)}

From 7584fde68b87a4a157747f0957ae149daf26cefd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Thu, 13 Jun 2024 17:33:17 -0400
Subject: [PATCH 41/55] test: add tests and update stories

---
 .../__tests__/AIChatLogger.spec.tsx           |  35 ++++++
 .../ai-chat-log/__tests__/aiChatLog.spec.tsx  | 116 ++++++++++++++++++
 .../ai-chat-log/__tests__/index.spec.tsx      |  11 --
 .../__tests__/useAIChatLogger.spec.tsx        |  88 +++++++++++++
 .../components/ai-chat-log/src/AIChatLog.tsx  |   1 +
 .../ai-chat-log/src/AIChatMessageAuthor.tsx   |   9 +-
 .../ai-chat-log/src/AIChatMessageLoading.tsx  |  16 ++-
 .../ai-chat-log/stories/index.stories.tsx     |  93 +++++++++++++-
 8 files changed, 346 insertions(+), 23 deletions(-)
 create mode 100644 packages/paste-core/components/ai-chat-log/__tests__/AIChatLogger.spec.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/__tests__/aiChatLog.spec.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
 create mode 100644 packages/paste-core/components/ai-chat-log/__tests__/useAIChatLogger.spec.tsx

diff --git a/packages/paste-core/components/ai-chat-log/__tests__/AIChatLogger.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/AIChatLogger.spec.tsx
new file mode 100644
index 0000000000..1db387ecbb
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/__tests__/AIChatLogger.spec.tsx
@@ -0,0 +1,35 @@
+import { render, screen } from "@testing-library/react";
+import * as React from "react";
+
+import { AIChatLogger, AIChatMessage, AIChatMessageBody } from "../src";
+import type { AIChat } from "../src/useAIChatLogger";
+
+const chats: AIChat[] = [
+  {
+    id: "uid1",
+    variant: "bot",
+    content: (
+      <AIChatMessage variant="bot">
+        <AIChatMessageBody>hi</AIChatMessageBody>
+      </AIChatMessage>
+    ),
+  },
+  {
+    id: "uid2",
+    variant: "user",
+    content: (
+      <AIChatMessage variant="user">
+        <AIChatMessageBody>hello</AIChatMessageBody>
+      </AIChatMessage>
+    ),
+  },
+];
+
+describe("ChatLogger", () => {
+  it("should render", () => {
+    render(<AIChatLogger aiChats={chats} />);
+    expect(screen.getByRole("log")).toBeDefined();
+    expect(screen.getByRole("list")).toBeDefined();
+    expect(screen.getAllByRole("listitem")).toHaveLength(2);
+  });
+});
diff --git a/packages/paste-core/components/ai-chat-log/__tests__/aiChatLog.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/aiChatLog.spec.tsx
new file mode 100644
index 0000000000..a47d184812
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/__tests__/aiChatLog.spec.tsx
@@ -0,0 +1,116 @@
+import { render, screen } from "@testing-library/react";
+import * as React from "react";
+
+import {
+  AIChatLog,
+  AIChatMessage,
+  AIChatMessageAction,
+  AIChatMessageActionGroup,
+  AIChatMessageAuthor,
+  AIChatMessageBody,
+  AIChatMessageLoading,
+} from "../src";
+
+const ExampleAIChatLog: React.FC<React.PropsWithChildren> = () => (
+  <AIChatLog>
+    <AIChatMessage variant="bot">
+      <AIChatMessageAuthor aria-label="AI said" data-testid="author">
+        Good Bot
+      </AIChatMessageAuthor>
+      <AIChatMessageBody size="default">Lorem ipsum dolor.</AIChatMessageBody>
+      <AIChatMessageActionGroup aria-label="Feedback form" data-testid="action_group">
+        <AIChatMessageAction data-testid="action">Is this helpful?</AIChatMessageAction>
+      </AIChatMessageActionGroup>
+      <AIChatMessageLoading onStopLoading={() => {}} data-testid="loading" />
+    </AIChatMessage>
+  </AIChatLog>
+);
+
+const CustomExampleAIChatLog: React.FC<React.PropsWithChildren> = () => (
+  <AIChatLog element="FOO_AI_LOG">
+    <AIChatMessage variant="bot" element="FOO_AI_CHAT_MESSAGE">
+      <AIChatMessageAuthor aria-label="AI said" data-testid="author" element="FOO_AI_CHAT_MESSAGE_AUTHOR">
+        Good Bot
+      </AIChatMessageAuthor>
+      <AIChatMessageBody size="default" element="FOO_AI_CHAT_MESSAGE_BODY">
+        Lorem ipsum dolor.
+      </AIChatMessageBody>
+      <AIChatMessageActionGroup
+        aria-label="Feedback form"
+        data-testid="action_group"
+        element="FOO_AI_CHAT_MESSAGE_ACTION_GROUP"
+      >
+        <AIChatMessageAction data-testid="action" element="FOO_AI_CHAT_MESSAGE_ACTION">
+          Is this helpful?
+        </AIChatMessageAction>
+      </AIChatMessageActionGroup>
+      <AIChatMessageLoading onStopLoading={() => {}} data-testid="loading" element="FOO_AI_CHAT_MESSAGE_LOADING" />
+    </AIChatMessage>
+  </AIChatLog>
+);
+
+describe("AIChatLog", () => {
+  it("should render", () => {
+    render(<ExampleAIChatLog />);
+    expect(screen.getByRole("log")).toBeDefined();
+    expect(screen.getByRole("list")).toBeDefined();
+  });
+});
+
+describe("Customization", () => {
+  it("should set element data attribute", () => {
+    render(<ExampleAIChatLog />);
+
+    expect(screen.getByRole("log").getAttribute("data-paste-element")).toEqual("AI_CHAT_LOG");
+    expect(screen.getByRole("list").getAttribute("data-paste-element")).toEqual("AI_CHAT_LOG_LIST");
+    expect(screen.getAllByRole("listitem")[0].getAttribute("data-paste-element")).toEqual("AI_CHAT_MESSAGE");
+    expect(screen.getByTestId("author").getAttribute("data-paste-element")).toEqual("AI_CHAT_MESSAGE_AUTHOR");
+    expect(screen.getByTestId("author").firstElementChild?.getAttribute("data-paste-element")).toEqual(
+      "AI_CHAT_MESSAGE_AUTHOR_BOT_AVATAR",
+    );
+    expect(screen.getByText("Lorem ipsum dolor.").getAttribute("data-paste-element")).toEqual("AI_CHAT_MESSAGE_BODY");
+    expect(screen.getByTestId("action_group").getAttribute("data-paste-element")).toEqual(
+      "AI_CHAT_MESSAGE_ACTION_GROUP",
+    );
+    expect(screen.getByTestId("action").getAttribute("data-paste-element")).toEqual("AI_CHAT_MESSAGE_ACTION");
+    expect(screen.getByTestId("loading").getAttribute("data-paste-element")).toEqual("AI_CHAT_MESSAGE_LOADING");
+    expect(screen.getByTestId("loading").firstElementChild?.getAttribute("data-paste-element")).toEqual(
+      "AI_CHAT_MESSAGE_LOADING_SKELETON",
+    );
+    expect(screen.getByTestId("loading").lastElementChild?.getAttribute("data-paste-element")).toEqual(
+      "AI_CHAT_MESSAGE_LOADING_STOP_LOADING",
+    );
+    expect(
+      screen.getByTestId("loading").lastElementChild?.firstElementChild?.getAttribute("data-paste-element"),
+    ).toEqual("AI_CHAT_MESSAGE_LOADING_STOP_BUTTON");
+  });
+
+  it("should set custom element data attribute", () => {
+    render(<CustomExampleAIChatLog />);
+
+    expect(screen.getByRole("log").getAttribute("data-paste-element")).toEqual("FOO_AI_LOG");
+    expect(screen.getByRole("list").getAttribute("data-paste-element")).toEqual("FOO_AI_LOG_LIST");
+    expect(screen.getAllByRole("listitem")[0].getAttribute("data-paste-element")).toEqual("FOO_AI_CHAT_MESSAGE");
+    expect(screen.getByTestId("author").getAttribute("data-paste-element")).toEqual("FOO_AI_CHAT_MESSAGE_AUTHOR");
+    expect(screen.getByTestId("author").firstElementChild?.getAttribute("data-paste-element")).toEqual(
+      "FOO_AI_CHAT_MESSAGE_AUTHOR_BOT_AVATAR",
+    );
+    expect(screen.getByText("Lorem ipsum dolor.").getAttribute("data-paste-element")).toEqual(
+      "FOO_AI_CHAT_MESSAGE_BODY",
+    );
+    expect(screen.getByTestId("action_group").getAttribute("data-paste-element")).toEqual(
+      "FOO_AI_CHAT_MESSAGE_ACTION_GROUP",
+    );
+    expect(screen.getByTestId("action").getAttribute("data-paste-element")).toEqual("FOO_AI_CHAT_MESSAGE_ACTION");
+    expect(screen.getByTestId("loading").getAttribute("data-paste-element")).toEqual("FOO_AI_CHAT_MESSAGE_LOADING");
+    expect(screen.getByTestId("loading").firstElementChild?.getAttribute("data-paste-element")).toEqual(
+      "FOO_AI_CHAT_MESSAGE_LOADING_SKELETON",
+    );
+    expect(screen.getByTestId("loading").lastElementChild?.getAttribute("data-paste-element")).toEqual(
+      "FOO_AI_CHAT_MESSAGE_LOADING_STOP_LOADING",
+    );
+    expect(
+      screen.getByTestId("loading").lastElementChild?.firstElementChild?.getAttribute("data-paste-element"),
+    ).toEqual("FOO_AI_CHAT_MESSAGE_LOADING_STOP_BUTTON");
+  });
+});
diff --git a/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
deleted file mode 100644
index 213832ca50..0000000000
--- a/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { render } from "@testing-library/react";
-import * as React from "react";
-
-import { AIChatLog } from "../src";
-
-describe("AiLog", () => {
-  it("should render", () => {
-    const { getByText } = render(<AIChatLog>test</AIChatLog>);
-    expect(getByText("test")).toBeDefined();
-  });
-});
diff --git a/packages/paste-core/components/ai-chat-log/__tests__/useAIChatLogger.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/useAIChatLogger.spec.tsx
new file mode 100644
index 0000000000..7a125fed74
--- /dev/null
+++ b/packages/paste-core/components/ai-chat-log/__tests__/useAIChatLogger.spec.tsx
@@ -0,0 +1,88 @@
+import { act, renderHook } from "@testing-library/react";
+import * as React from "react";
+
+import { AIChatMessage, AIChatMessageBody, useAIChatLogger } from "../src";
+
+const aiChat = {
+  id: "custom-id-123",
+  variant: "bot",
+  content: (
+    <AIChatMessage variant="bot">
+      <AIChatMessageBody>hi</AIChatMessageBody>
+    </AIChatMessage>
+  ),
+} as const;
+
+describe("useAIChatLogger", () => {
+  it("returns expected result with defaults", () => {
+    const { result } = renderHook(() => useAIChatLogger());
+
+    expect(result.current).toMatchObject({
+      aiChats: [],
+      pop: expect.any(Function),
+      push: expect.any(Function),
+    });
+  });
+
+  it("returns expected result with initialization", () => {
+    const { result } = renderHook(() => useAIChatLogger(aiChat));
+
+    expect(result.current.aiChats).toHaveLength(1);
+    expect(result.current.pop).toBeInstanceOf(Function);
+    expect(result.current.push).toBeInstanceOf(Function);
+    expect(result.current.aiChats[0]).toMatchObject(aiChat);
+  });
+
+  describe("push", () => {
+    it("pushes new aiChats with an id", () => {
+      const { result } = renderHook(() => useAIChatLogger());
+      expect(result.current.aiChats).toHaveLength(0);
+
+      act(() => {
+        result.current.push(aiChat);
+      });
+
+      expect(result.current.aiChats).toHaveLength(1);
+      expect(result.current.aiChats[0]).toMatchObject(aiChat);
+    });
+
+    it("pushes new aiChats without an id", () => {
+      const { result } = renderHook(() => useAIChatLogger());
+      expect(result.current.aiChats).toHaveLength(0);
+
+      act(() => {
+        const chatWithoutCustomId = { ...aiChat, id: undefined };
+        result.current.push(chatWithoutCustomId);
+      });
+
+      expect(result.current.aiChats).toHaveLength(1);
+      expect(result.current.aiChats[0]).toMatchObject({
+        id: expect.stringMatching(/^uid/),
+      });
+    });
+  });
+
+  describe("pop", () => {
+    it("pops aiChats with an id", () => {
+      const { result } = renderHook(() => useAIChatLogger(aiChat));
+      expect(result.current.aiChats).toHaveLength(1);
+
+      act(() => {
+        result.current.pop(aiChat.id);
+      });
+
+      expect(result.current.aiChats).toHaveLength(0);
+    });
+
+    it("pops aiChats without an id", () => {
+      const { result } = renderHook(() => useAIChatLogger(aiChat));
+      expect(result.current.aiChats).toHaveLength(1);
+
+      act(() => {
+        result.current.pop();
+      });
+
+      expect(result.current.aiChats).toHaveLength(0);
+    });
+  });
+});
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
index c1db631fc2..d799912690 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatLog.tsx
@@ -26,6 +26,7 @@ export const AIChatLog = React.forwardRef<HTMLDivElement, AIChatLogProps>(
           display="flex"
           flexDirection="column"
           rowGap="space130"
+          element={`${element}_LIST`}
         >
           {children}
         </Box>
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
index fec52c0682..45d686d830 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageAuthor.tsx
@@ -70,12 +70,17 @@ export const AIChatMessageAuthor = React.forwardRef<HTMLDivElement, AIChatMessag
         fontWeight="fontWeightMedium"
       >
         {variant === "bot" ? (
-          <Avatar name={children} size="sizeIcon50" icon={ArtificialIntelligenceIcon} element={`${element}_AVATAR`} />
+          <Avatar
+            name={children}
+            size="sizeIcon50"
+            icon={ArtificialIntelligenceIcon}
+            element={`${element}_BOT_AVATAR`}
+          />
         ) : (
           <Avatar
             size="sizeIcon50"
             color="decorative30"
-            element={`${element}_AVATAR`}
+            element={`${element}_USER_AVATAR`}
             name={avatarName || children}
             icon={avatarIcon}
             src={avatarSrc}
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
index a0481987e5..2ad636b63c 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageLoading.tsx
@@ -72,12 +72,18 @@ export const AIChatMessageLoading = React.forwardRef<HTMLDivElement, AIChatMessa
         flexDirection="column"
         rowGap="space40"
       >
-        <SkeletonLoader width={`${widths[0]}%`} height="20px" />
-        <SkeletonLoader width={`${widths[1]}%`} height="20px" />
-        <SkeletonLoader width={`${widths[2]}%`} height="20px" />
+        <SkeletonLoader width={`${widths[0]}%`} height="20px" element={`${element}_SKELETON`} />
+        <SkeletonLoader width={`${widths[1]}%`} height="20px" element={`${element}_SKELETON`} />
+        <SkeletonLoader width={`${widths[2]}%`} height="20px" element={`${element}_SKELETON`} />
         {onStopLoading ? (
-          <Box display="flex" justifyContent="center">
-            <Button variant="secondary" size="rounded_small" onClick={onStopLoading} aria-controls={messageBodyID}>
+          <Box display="flex" justifyContent="center" element={`${element}_STOP_LOADING`}>
+            <Button
+              variant="secondary"
+              size="rounded_small"
+              onClick={onStopLoading}
+              aria-controls={messageBodyID}
+              element={`${element}_STOP_BUTTON`}
+            >
               <StopIcon decorative={true} />
               {i18nStopGeneratingLabel} <ScreenReaderOnly>{i18nAIScreenReaderText}</ScreenReaderOnly>
             </Button>
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index affe5255c0..83f6fa4a42 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -4,10 +4,12 @@ import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
 import { ChatComposer } from "@twilio-paste/chat-composer";
+import { CustomizationProvider } from "@twilio-paste/customization";
 import { SendIcon } from "@twilio-paste/icons/esm/SendIcon";
 import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
 import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
 import { UserIcon } from "@twilio-paste/icons/esm/UserIcon";
+import { useTheme } from "@twilio-paste/theme";
 import * as React from "react";
 
 import {
@@ -45,9 +47,7 @@ export const ExampleAIChatLog = (): React.ReactNode => {
             Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
             iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
             impedit repellat assumenda.
-          </AIChatMessageBody>
-          <AIChatMessageActionGroup aria-label="Quick actions available:">
-            <ButtonGroup>
+            <Box paddingTop="space70">
               <Button variant="secondary" onClick={() => {}} size="rounded_small">
                 30007
               </Button>
@@ -57,8 +57,8 @@ export const ExampleAIChatLog = (): React.ReactNode => {
               <Button variant="secondary" onClick={() => {}} size="rounded_small">
                 30009
               </Button>
-            </ButtonGroup>
-          </AIChatMessageActionGroup>
+            </Box>
+          </AIChatMessageBody>
           <AIChatMessageActionGroup aria-label="Feedback form">
             <AIChatMessageAction>
               Is this helpful?
@@ -105,3 +105,86 @@ export const ExampleAIChatLog = (): React.ReactNode => {
     </>
   );
 };
+
+export const CustomizedExampleAIChatLog = (): React.ReactNode => {
+  const theme = useTheme();
+  return (
+    <CustomizationProvider
+      theme={theme}
+      elements={{
+        AI_CHAT_LOG: { borderStyle: "solid", borderColor: "colorBorderDecorative10Weaker" },
+        AI_CHAT_LOG_LIST: { rowGap: "space50" },
+        AI_CHAT_MESSAGE: { rowGap: "space30" },
+        AI_CHAT_MESSAGE_AUTHOR: { columnGap: "space60" },
+        AI_CHAT_MESSAGE_AUTHOR_BOT_AVATAR: { backgroundColor: "colorBackgroundDecorative10Weakest" },
+        AI_CHAT_MESSAGE_AUTHOR_USER_AVATAR: { backgroundColor: "colorBackgroundDecorative40Weakest" },
+        AI_CHAT_MESSAGE_BODY: { color: "colorTextPrimaryStrong" },
+        AI_CHAT_MESSAGE_ACTION_GROUP: { backgroundColor: "colorBackgroundDecorative10Weakest" },
+        AI_CHAT_MESSAGE_ACTION: { backgroundColor: "colorBackgroundDecorative20Weakest" },
+        AI_CHAT_MESSAGE_LOADING: { rowGap: "space0" },
+        AI_CHAT_MESSAGE_LOADING_SKELETON: { height: "40px" },
+        AI_CHAT_MESSAGE_LOADING_STOP_LOADING: { paddingY: "space60" },
+        AI_CHAT_MESSAGE_LOADING_STOP_BUTTON: { fontWeight: "fontWeightLight" },
+      }}
+    >
+      <AIChatLog>
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor avatarName="Gibby Ridki" avatarIcon={UserIcon} aria-label="You said at 2:36pm">
+            You
+          </AIChatMessageAuthor>
+          <AIChatMessageBody size="default">
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+        </AIChatMessage>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody size="default">
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+            <Box paddingTop="space70">
+              <ButtonGroup>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30009
+                </Button>
+              </ButtonGroup>
+            </Box>
+          </AIChatMessageBody>
+          <AIChatMessageActionGroup aria-label="Feedback form">
+            <AIChatMessageAction>
+              Is this helpful?
+              <Button variant="reset" size="reset">
+                <ThumbsUpIcon decorative={false} title="like result" />
+              </Button>
+              <Button variant="reset" size="reset">
+                <ThumbsDownIcon decorative={false} title="dislike result" />
+              </Button>
+            </AIChatMessageAction>
+          </AIChatMessageActionGroup>
+        </AIChatMessage>
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+        </AIChatMessage>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            <AIChatMessageLoading onStopLoading={() => {}} />
+          </AIChatMessageBody>
+        </AIChatMessage>
+      </AIChatLog>
+    </CustomizationProvider>
+  );
+};

From c7c914ed5227ef4e64641e2ffe50b465bbe6bd85 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Thu, 13 Jun 2024 17:36:41 -0400
Subject: [PATCH 42/55] chore: type docs

---
 .changeset/eighty-seas-sit.md                 |    2 +-
 .../components/ai-chat-log/type-docs.json     | 3384 +----------------
 2 files changed, 53 insertions(+), 3333 deletions(-)

diff --git a/.changeset/eighty-seas-sit.md b/.changeset/eighty-seas-sit.md
index 774fd01d3f..31a7290024 100644
--- a/.changeset/eighty-seas-sit.md
+++ b/.changeset/eighty-seas-sit.md
@@ -3,4 +3,4 @@
 "@twilio-paste/core": minor
 ---
 
-[AIChatLog]: Added a new AIChatLog compoennt to the library to display interactions between AI entities
+[AIChatLog]: Added a new AIChatLog component to the library to display interactions between AI entities
diff --git a/packages/paste-core/components/ai-chat-log/type-docs.json b/packages/paste-core/components/ai-chat-log/type-docs.json
index 5dd589f00c..931f22bb86 100644
--- a/packages/paste-core/components/ai-chat-log/type-docs.json
+++ b/packages/paste-core/components/ai-chat-log/type-docs.json
@@ -1590,7 +1590,7 @@
       "externalProp": true
     }
   },
-  "AIChatMessageActions": {
+  "AIChatMessageActionGroup": {
     "aria-label": {
       "type": "string",
       "defaultValue": "null",
@@ -2007,7 +2007,7 @@
     },
     "element": {
       "type": "string",
-      "defaultValue": "AI_CHAT_MESSAGE_ACTIONS",
+      "defaultValue": "AI_CHAT_MESSAGE_ACTION_GROUP",
       "required": false,
       "externalProp": false,
       "description": "Overrides the default element name to apply unique styles with the Customization Provider"
@@ -4763,7 +4763,14 @@
       "externalProp": true
     }
   },
-  "AIChatMessageBodyTypeWriter": {
+  "AIChatMessageAuthor": {
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Screen reader label for the author"
+    },
     "about": {
       "type": "string",
       "defaultValue": null,
@@ -4776,13 +4783,6 @@
       "required": false,
       "externalProp": true
     },
-    "animated": {
-      "type": "boolean",
-      "defaultValue": true,
-      "required": false,
-      "externalProp": false,
-      "description": "Whether the text should be animated with type writer effect"
-    },
     "aria-activedescendant": {
       "type": "string",
       "defaultValue": null,
@@ -4937,13 +4937,6 @@
       "externalProp": true,
       "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
     },
-    "aria-label": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines a string value that labels the current element."
-    },
     "aria-labelledby": {
       "type": "string",
       "defaultValue": null,
@@ -5137,6 +5130,27 @@
       "required": false,
       "externalProp": true
     },
+    "avatarIcon": {
+      "type": "FC<PropsWithChildren<GenericIconProps>>",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false,
+      "description": "Custom svg for the user Avatar's icon to override the default Avatar content. See Avatar API documentation for more information."
+    },
+    "avatarName": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false,
+      "description": "Custom name for the user Avatar's initials to override the default Avatar content. See Avatar API documentation for more information."
+    },
+    "avatarSrc": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": false,
+      "description": "Custom src path for the user Avatar's image to override the default Avatar content. See Avatar API documentation for more information."
+    },
     "contentEditable": {
       "type": "Booleanish | \"inherit\"",
       "defaultValue": null,
@@ -5187,7 +5201,7 @@
     },
     "element": {
       "type": "string",
-      "defaultValue": "AI_CHAT_MESSAGE_BODY_TYPE_WRITER",
+      "defaultValue": "AI_CHAT_MESSAGE_AUTHOR",
       "required": false,
       "externalProp": false,
       "description": "Overrides the default element name to apply unique styles with the Customization Provider"
@@ -6346,13 +6360,6 @@
       "required": false,
       "externalProp": true
     },
-    "variant": {
-      "type": "\"default\" | \"fullScreen\"",
-      "defaultValue": "default",
-      "required": false,
-      "externalProp": false,
-      "description": "Override the font size for full screen experiences."
-    },
     "vocab": {
       "type": "string",
       "defaultValue": null,
@@ -6360,14 +6367,7 @@
       "externalProp": true
     }
   },
-  "AIChatMessageAuthor": {
-    "aria-label": {
-      "type": "string",
-      "defaultValue": null,
-      "required": true,
-      "externalProp": false,
-      "description": "Screen reader label for the author"
-    },
+  "AIChatMessageAction": {
     "about": {
       "type": "string",
       "defaultValue": null,
@@ -6534,6 +6534,13 @@
       "externalProp": true,
       "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
     },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
     "aria-labelledby": {
       "type": "string",
       "defaultValue": null,
@@ -6727,27 +6734,6 @@
       "required": false,
       "externalProp": true
     },
-    "avatarIcon": {
-      "type": "FC<PropsWithChildren<GenericIconProps>>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": false,
-      "description": "Custom svg for the user Avatar's icon to override the default Avatar content. See Avatar API documentation for more information."
-    },
-    "avatarName": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": false,
-      "description": "Custom name for the user Avatar's initials to override the default Avatar content. See Avatar API documentation for more information."
-    },
-    "avatarSrc": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": false,
-      "description": "Custom src path for the user Avatar's image to override the default Avatar content. See Avatar API documentation for more information."
-    },
     "contentEditable": {
       "type": "Booleanish | \"inherit\"",
       "defaultValue": null,
@@ -6798,7 +6784,7 @@
     },
     "element": {
       "type": "string",
-      "defaultValue": "AI_CHAT_MESSAGE_AUTHOR",
+      "defaultValue": "AI_CHAT_MESSAGE_ACTION",
       "required": false,
       "externalProp": false,
       "description": "Overrides the default element name to apply unique styles with the Customization Provider"
@@ -7964,21 +7950,7 @@
       "externalProp": true
     }
   },
-  "AIChatMessageFeedback": {
-    "onDislike": {
-      "type": "() => void",
-      "defaultValue": null,
-      "required": true,
-      "externalProp": false,
-      "description": "Function to call on click of \"Disike result\" button"
-    },
-    "onLike": {
-      "type": "() => void",
-      "defaultValue": null,
-      "required": true,
-      "externalProp": false,
-      "description": "Function to call on click of \"Like result\" button"
-    },
+  "AIChatMessageLoading": {
     "about": {
       "type": "string",
       "defaultValue": null,
@@ -8395,7 +8367,7 @@
     },
     "element": {
       "type": "string",
-      "defaultValue": "AI_CHAT_MESSAGE_FEEDBACK",
+      "defaultValue": "AI_CHAT_MESSAGE_LOADING",
       "required": false,
       "externalProp": false,
       "description": "Overrides the default element name to apply unique styles with the Customization Provider"
@@ -8406,19 +8378,19 @@
       "required": false,
       "externalProp": true
     },
-    "i18nDislikeLabel": {
+    "i18nAIScreenReaderText": {
       "type": "string",
-      "defaultValue": "Dislike result",
+      "defaultValue": "AI response",
       "required": false,
       "externalProp": false,
-      "description": "Custom accessible label for the \"Dislike result\" button for non-English languages"
+      "description": "I18n accessible screen reader text to give context to the \"Stop generating\" button when `onStopLoading` is passed for non-english languages. Should read as a sentence, e.g. \"Stop generating AI response\"."
     },
-    "i18nLikeLabel": {
+    "i18nStopGeneratingLabel": {
       "type": "string",
-      "defaultValue": "Like result",
+      "defaultValue": "Stop generating",
       "required": false,
       "externalProp": false,
-      "description": "Custom accessible label for the \"Like result\" button for non-English languages"
+      "description": "I18n label text for the \"Stop generating\" button when `onStopLoading` is passed for non-english languages."
     },
     "id": {
       "type": "string",
@@ -8482,13 +8454,6 @@
       "required": false,
       "externalProp": true
     },
-    "label": {
-      "type": "string",
-      "defaultValue": "Is this helpful?",
-      "required": false,
-      "externalProp": false,
-      "description": "Custom label text for the message feedback component"
-    },
     "lang": {
       "type": "string",
       "defaultValue": null,
@@ -9341,3257 +9306,12 @@
       "required": false,
       "externalProp": true
     },
-    "onSubmit": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSubmitCapture": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSuspend": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSuspendCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTimeUpdate": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTimeUpdateCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchCancel": {
-      "type": "TouchEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchCancelCapture": {
-      "type": "TouchEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchEnd": {
-      "type": "TouchEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchEndCapture": {
-      "type": "TouchEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchMove": {
-      "type": "TouchEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchMoveCapture": {
-      "type": "TouchEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchStart": {
-      "type": "TouchEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchStartCapture": {
-      "type": "TouchEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTransitionEnd": {
-      "type": "TransitionEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTransitionEndCapture": {
-      "type": "TransitionEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onVolumeChange": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onVolumeChangeCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onWaiting": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onWaitingCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onWheel": {
-      "type": "WheelEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onWheelCapture": {
-      "type": "WheelEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "placeholder": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "prefix": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "property": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "radioGroup": {
-      "type": "string",
+    "onStopLoading": {
+      "type": "() => void",
       "defaultValue": null,
       "required": false,
-      "externalProp": true
-    },
-    "resource": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "results": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "role": {
-      "type": "AriaRole",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "security": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "slot": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "spellCheck": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "suppressContentEditableWarning": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "suppressHydrationWarning": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "tabIndex": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "title": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "translate": {
-      "type": "\"yes\" | \"no\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "typeof": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "unselectable": {
-      "type": "\"on\" | \"off\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "vocab": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    }
-  },
-  "AIChatMessageRewrite": {
-    "onRewrite": {
-      "type": "() => void",
-      "defaultValue": null,
-      "required": true,
       "externalProp": false,
-      "description": "Function to call on click of message rewrite button"
-    },
-    "about": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "accessKey": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "aria-activedescendant": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
-    },
-    "aria-atomic": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
-    },
-    "aria-autocomplete": {
-      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
-    },
-    "aria-busy": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
-    },
-    "aria-checked": {
-      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
-    },
-    "aria-colcount": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the total number of columns in a table, grid, or treegrid."
-    },
-    "aria-colindex": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
-    },
-    "aria-colspan": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
-    },
-    "aria-controls": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
-    },
-    "aria-current": {
-      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the element that represents the current item within a container or set of related elements."
-    },
-    "aria-describedby": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element (or elements) that describes the object."
-    },
-    "aria-details": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element that provides a detailed, extended description for the object."
-    },
-    "aria-disabled": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
-    },
-    "aria-dropeffect": {
-      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
-    },
-    "aria-errormessage": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element that provides an error message for the object."
-    },
-    "aria-expanded": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
-    },
-    "aria-flowto": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
-    },
-    "aria-grabbed": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
-    },
-    "aria-haspopup": {
-      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
-    },
-    "aria-hidden": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether the element is exposed to an accessibility API."
-    },
-    "aria-invalid": {
-      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the entered value does not conform to the format expected by the application."
-    },
-    "aria-keyshortcuts": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
-    },
-    "aria-label": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines a string value that labels the current element."
-    },
-    "aria-labelledby": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element (or elements) that labels the current element."
-    },
-    "aria-level": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the hierarchical level of an element within a structure."
-    },
-    "aria-live": {
-      "type": "\"off\" | \"assertive\" | \"polite\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
-    },
-    "aria-modal": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether an element is modal when displayed."
-    },
-    "aria-multiline": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
-    },
-    "aria-multiselectable": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that the user may select more than one item from the current selectable descendants."
-    },
-    "aria-orientation": {
-      "type": "\"horizontal\" | \"vertical\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
-    },
-    "aria-owns": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
-    },
-    "aria-placeholder": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
-    },
-    "aria-posinset": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
-    },
-    "aria-pressed": {
-      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the current \"pressed\" state of toggle buttons."
-    },
-    "aria-readonly": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that the element is not editable, but is otherwise operable."
-    },
-    "aria-relevant": {
-      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
-    },
-    "aria-required": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that user input is required on the element before a form may be submitted."
-    },
-    "aria-roledescription": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines a human-readable, author-localized description for the role of an element."
-    },
-    "aria-rowcount": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the total number of rows in a table, grid, or treegrid."
-    },
-    "aria-rowindex": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
-    },
-    "aria-rowspan": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
-    },
-    "aria-selected": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the current \"selected\" state of various widgets."
-    },
-    "aria-setsize": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
-    },
-    "aria-sort": {
-      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
-    },
-    "aria-valuemax": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the maximum allowed value for a range widget."
-    },
-    "aria-valuemin": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the minimum allowed value for a range widget."
-    },
-    "aria-valuenow": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the current value for a range widget."
-    },
-    "aria-valuetext": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
-    },
-    "autoCapitalize": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "autoCorrect": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "autoFocus": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "autoSave": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "contentEditable": {
-      "type": "Booleanish | \"inherit\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "contextMenu": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "dangerouslySetInnerHTML": {
-      "type": "{ __html: string }",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "datatype": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "defaultChecked": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "defaultValue": {
-      "type": "string | number | readonly string[]",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "dir": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "disabled": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "draggable": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "element": {
-      "type": "string",
-      "defaultValue": "AI_CHAT_MESSAGE_REWRITE",
-      "required": false,
-      "externalProp": false,
-      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
-    },
-    "form": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "formAction": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "formEncType": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "formMethod": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "formNoValidate": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "formTarget": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "hidden": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "id": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "inlist": {
-      "type": "any",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "inputMode": {
-      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
-    },
-    "is": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
-    },
-    "itemID": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "itemProp": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "itemRef": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "itemScope": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "itemType": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "key": {
-      "type": "Key",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "label": {
-      "type": "string",
-      "defaultValue": "Rewrite",
-      "required": false,
-      "externalProp": false,
-      "description": "Custom label text for the message rewrite component"
-    },
-    "lang": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "name": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "nonce": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAbort": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAbortCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationEnd": {
-      "type": "AnimationEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationEndCapture": {
-      "type": "AnimationEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationIteration": {
-      "type": "AnimationEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationIterationCapture": {
-      "type": "AnimationEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationStart": {
-      "type": "AnimationEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationStartCapture": {
-      "type": "AnimationEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAuxClick": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAuxClickCapture": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onBeforeInput": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onBeforeInputCapture": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onBlur": {
-      "type": "FocusEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onBlurCapture": {
-      "type": "FocusEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCanPlay": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCanPlayCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCanPlayThrough": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCanPlayThroughCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onChange": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onChangeCapture": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onClick": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onClickCapture": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionEnd": {
-      "type": "CompositionEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionEndCapture": {
-      "type": "CompositionEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionStart": {
-      "type": "CompositionEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionStartCapture": {
-      "type": "CompositionEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionUpdate": {
-      "type": "CompositionEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionUpdateCapture": {
-      "type": "CompositionEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onContextMenu": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onContextMenuCapture": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCopy": {
-      "type": "ClipboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCopyCapture": {
-      "type": "ClipboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCut": {
-      "type": "ClipboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCutCapture": {
-      "type": "ClipboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDoubleClick": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDoubleClickCapture": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDrag": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragCapture": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragEnd": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragEndCapture": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragEnter": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragEnterCapture": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragExit": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragExitCapture": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragLeave": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragLeaveCapture": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragOver": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragOverCapture": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragStart": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragStartCapture": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDrop": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDropCapture": {
-      "type": "DragEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDurationChange": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDurationChangeCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEmptied": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEmptiedCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEncrypted": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEncryptedCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEnded": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEndedCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onError": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onErrorCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onFocus": {
-      "type": "FocusEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onFocusCapture": {
-      "type": "FocusEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onGotPointerCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onGotPointerCaptureCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onInput": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onInputCapture": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onInvalid": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onInvalidCapture": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyDown": {
-      "type": "KeyboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyDownCapture": {
-      "type": "KeyboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyPress": {
-      "type": "KeyboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyPressCapture": {
-      "type": "KeyboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyUp": {
-      "type": "KeyboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyUpCapture": {
-      "type": "KeyboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoad": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadedData": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadedDataCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadedMetadata": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadedMetadataCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadStart": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadStartCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLostPointerCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLostPointerCaptureCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseDown": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseDownCapture": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseEnter": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseLeave": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseMove": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseMoveCapture": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseOut": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseOutCapture": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseOver": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseOverCapture": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseUp": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseUpCapture": {
-      "type": "MouseEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPaste": {
-      "type": "ClipboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPasteCapture": {
-      "type": "ClipboardEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPause": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPauseCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPlay": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPlayCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPlaying": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPlayingCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerCancel": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerCancelCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerDown": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerDownCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerEnter": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerEnterCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerLeave": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerLeaveCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerMove": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerMoveCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerOut": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerOutCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerOver": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerOverCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerUp": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerUpCapture": {
-      "type": "PointerEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onProgress": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onProgressCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onRateChange": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onRateChangeCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onReset": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onResetCapture": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onResize": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onResizeCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onScroll": {
-      "type": "UIEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onScrollCapture": {
-      "type": "UIEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSeeked": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSeekedCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSeeking": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSeekingCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSelect": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSelectCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onStalled": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onStalledCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSubmit": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSubmitCapture": {
-      "type": "FormEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSuspend": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSuspendCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTimeUpdate": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTimeUpdateCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchCancel": {
-      "type": "TouchEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchCancelCapture": {
-      "type": "TouchEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchEnd": {
-      "type": "TouchEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchEndCapture": {
-      "type": "TouchEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchMove": {
-      "type": "TouchEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchMoveCapture": {
-      "type": "TouchEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchStart": {
-      "type": "TouchEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTouchStartCapture": {
-      "type": "TouchEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTransitionEnd": {
-      "type": "TransitionEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onTransitionEndCapture": {
-      "type": "TransitionEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onVolumeChange": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onVolumeChangeCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onWaiting": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onWaitingCapture": {
-      "type": "ReactEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onWheel": {
-      "type": "WheelEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onWheelCapture": {
-      "type": "WheelEventHandler<HTMLButtonElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "placeholder": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "prefix": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "property": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "radioGroup": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "resource": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "results": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "role": {
-      "type": "AriaRole",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "security": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "slot": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "spellCheck": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "suppressContentEditableWarning": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "suppressHydrationWarning": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "tabIndex": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "title": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "translate": {
-      "type": "\"yes\" | \"no\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "type": {
-      "type": "\"button\" | \"submit\" | \"reset\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "typeof": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "unselectable": {
-      "type": "\"on\" | \"off\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "value": {
-      "type": "string | number | readonly string[]",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "vocab": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    }
-  },
-  "AIChatMessageLoading": {
-    "about": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "accessKey": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "aria-activedescendant": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application."
-    },
-    "aria-atomic": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute."
-    },
-    "aria-autocomplete": {
-      "type": "\"list\" | \"none\" | \"inline\" | \"both\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be\npresented if they are made."
-    },
-    "aria-busy": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user."
-    },
-    "aria-checked": {
-      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets."
-    },
-    "aria-colcount": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the total number of columns in a table, grid, or treegrid."
-    },
-    "aria-colindex": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid."
-    },
-    "aria-colspan": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid."
-    },
-    "aria-controls": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element (or elements) whose contents or presence are controlled by the current element."
-    },
-    "aria-current": {
-      "type": "| boolean\n  | \"time\"\n  | \"true\"\n  | \"false\"\n  | \"page\"\n  | \"step\"\n  | \"location\"\n  | \"date\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the element that represents the current item within a container or set of related elements."
-    },
-    "aria-describedby": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element (or elements) that describes the object."
-    },
-    "aria-details": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element that provides a detailed, extended description for the object."
-    },
-    "aria-disabled": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable."
-    },
-    "aria-dropeffect": {
-      "type": "\"link\" | \"none\" | \"copy\" | \"execute\" | \"move\" | \"popup\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates what functions can be performed when a dragged object is released on the drop target."
-    },
-    "aria-errormessage": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element that provides an error message for the object."
-    },
-    "aria-expanded": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed."
-    },
-    "aria-flowto": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,\nallows assistive technology to override the general default of reading in document source order."
-    },
-    "aria-grabbed": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates an element's \"grabbed\" state in a drag-and-drop operation."
-    },
-    "aria-haspopup": {
-      "type": "| boolean\n  | \"dialog\"\n  | \"menu\"\n  | \"true\"\n  | \"false\"\n  | \"grid\"\n  | \"listbox\"\n  | \"tree\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element."
-    },
-    "aria-hidden": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether the element is exposed to an accessibility API."
-    },
-    "aria-invalid": {
-      "type": "boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the entered value does not conform to the format expected by the application."
-    },
-    "aria-keyshortcuts": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
-    },
-    "aria-label": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines a string value that labels the current element."
-    },
-    "aria-labelledby": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies the element (or elements) that labels the current element."
-    },
-    "aria-level": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the hierarchical level of an element within a structure."
-    },
-    "aria-live": {
-      "type": "\"off\" | \"assertive\" | \"polite\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region."
-    },
-    "aria-modal": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether an element is modal when displayed."
-    },
-    "aria-multiline": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether a text box accepts multiple lines of input or only a single line."
-    },
-    "aria-multiselectable": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that the user may select more than one item from the current selectable descendants."
-    },
-    "aria-orientation": {
-      "type": "\"horizontal\" | \"vertical\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous."
-    },
-    "aria-owns": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship\nbetween DOM elements where the DOM hierarchy cannot be used to represent the relationship."
-    },
-    "aria-placeholder": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.\nA hint could be a sample value or a brief description of the expected format."
-    },
-    "aria-posinset": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
-    },
-    "aria-pressed": {
-      "type": "boolean | \"true\" | \"false\" | \"mixed\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the current \"pressed\" state of toggle buttons."
-    },
-    "aria-readonly": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that the element is not editable, but is otherwise operable."
-    },
-    "aria-relevant": {
-      "type": "| \"text\"\n  | \"additions\"\n  | \"additions removals\"\n  | \"additions text\"\n  | \"all\"\n  | \"removals\"\n  | \"removals additions\"\n  | \"removals text\"\n  | \"text additions\"\n  | \"text removals\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified."
-    },
-    "aria-required": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates that user input is required on the element before a form may be submitted."
-    },
-    "aria-roledescription": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines a human-readable, author-localized description for the role of an element."
-    },
-    "aria-rowcount": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the total number of rows in a table, grid, or treegrid."
-    },
-    "aria-rowindex": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid."
-    },
-    "aria-rowspan": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid."
-    },
-    "aria-selected": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates the current \"selected\" state of various widgets."
-    },
-    "aria-setsize": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM."
-    },
-    "aria-sort": {
-      "type": "\"none\" | \"ascending\" | \"descending\" | \"other\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Indicates if items in a table or grid are sorted in ascending or descending order."
-    },
-    "aria-valuemax": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the maximum allowed value for a range widget."
-    },
-    "aria-valuemin": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the minimum allowed value for a range widget."
-    },
-    "aria-valuenow": {
-      "type": "number",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the current value for a range widget."
-    },
-    "aria-valuetext": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines the human readable text alternative of aria-valuenow for a range widget."
-    },
-    "autoCapitalize": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "autoCorrect": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "autoSave": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "contentEditable": {
-      "type": "Booleanish | \"inherit\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "contextMenu": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "dangerouslySetInnerHTML": {
-      "type": "{ __html: string }",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "datatype": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "defaultChecked": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "defaultValue": {
-      "type": "string | number | readonly string[]",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "dir": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "draggable": {
-      "type": "Booleanish",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "element": {
-      "type": "string",
-      "defaultValue": "AI_CHAT_MESSAGE_LOADING",
-      "required": false,
-      "externalProp": false,
-      "description": "Overrides the default element name to apply unique styles with the Customization Provider"
-    },
-    "hidden": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "id": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "inlist": {
-      "type": "any",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "inputMode": {
-      "type": "| \"text\"\n  | \"none\"\n  | \"search\"\n  | \"tel\"\n  | \"url\"\n  | \"email\"\n  | \"numeric\"\n  | \"decimal\"",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
-    },
-    "is": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
-    },
-    "itemID": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "itemProp": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "itemRef": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "itemScope": {
-      "type": "boolean",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "itemType": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "key": {
-      "type": "Key",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "lang": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "nonce": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAbort": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAbortCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationEnd": {
-      "type": "AnimationEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationEndCapture": {
-      "type": "AnimationEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationIteration": {
-      "type": "AnimationEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationIterationCapture": {
-      "type": "AnimationEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationStart": {
-      "type": "AnimationEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAnimationStartCapture": {
-      "type": "AnimationEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAuxClick": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onAuxClickCapture": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onBeforeInput": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onBeforeInputCapture": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onBlur": {
-      "type": "FocusEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onBlurCapture": {
-      "type": "FocusEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCanPlay": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCanPlayCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCanPlayThrough": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCanPlayThroughCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onChange": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onChangeCapture": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onClick": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onClickCapture": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionEnd": {
-      "type": "CompositionEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionEndCapture": {
-      "type": "CompositionEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionStart": {
-      "type": "CompositionEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionStartCapture": {
-      "type": "CompositionEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionUpdate": {
-      "type": "CompositionEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCompositionUpdateCapture": {
-      "type": "CompositionEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onContextMenu": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onContextMenuCapture": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCopy": {
-      "type": "ClipboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCopyCapture": {
-      "type": "ClipboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCut": {
-      "type": "ClipboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onCutCapture": {
-      "type": "ClipboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDoubleClick": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDoubleClickCapture": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDrag": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragCapture": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragEnd": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragEndCapture": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragEnter": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragEnterCapture": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragExit": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragExitCapture": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragLeave": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragLeaveCapture": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragOver": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragOverCapture": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragStart": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDragStartCapture": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDrop": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDropCapture": {
-      "type": "DragEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDurationChange": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onDurationChangeCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEmptied": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEmptiedCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEncrypted": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEncryptedCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEnded": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onEndedCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onError": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onErrorCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onFocus": {
-      "type": "FocusEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onFocusCapture": {
-      "type": "FocusEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onGotPointerCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onGotPointerCaptureCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onInput": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onInputCapture": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onInvalid": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onInvalidCapture": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyDown": {
-      "type": "KeyboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyDownCapture": {
-      "type": "KeyboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyPress": {
-      "type": "KeyboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyPressCapture": {
-      "type": "KeyboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyUp": {
-      "type": "KeyboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onKeyUpCapture": {
-      "type": "KeyboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoad": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadedData": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadedDataCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadedMetadata": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadedMetadataCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadStart": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLoadStartCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLostPointerCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onLostPointerCaptureCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseDown": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseDownCapture": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseEnter": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseLeave": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseMove": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseMoveCapture": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseOut": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseOutCapture": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseOver": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseOverCapture": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseUp": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onMouseUpCapture": {
-      "type": "MouseEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPaste": {
-      "type": "ClipboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPasteCapture": {
-      "type": "ClipboardEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPause": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPauseCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPlay": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPlayCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPlaying": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPlayingCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerCancel": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerCancelCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerDown": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerDownCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerEnter": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerEnterCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerLeave": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerLeaveCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerMove": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerMoveCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerOut": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerOutCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerOver": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerOverCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerUp": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onPointerUpCapture": {
-      "type": "PointerEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onProgress": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onProgressCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onRateChange": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onRateChangeCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onReset": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onResetCapture": {
-      "type": "FormEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onResize": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onResizeCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onScroll": {
-      "type": "UIEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onScrollCapture": {
-      "type": "UIEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSeeked": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSeekedCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSeeking": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSeekingCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSelect": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onSelectCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onStalled": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onStalledCapture": {
-      "type": "ReactEventHandler<HTMLDivElement>",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true
-    },
-    "onStopLoading": {
-      "type": "() => void",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": false
+      "description": "Function to call when \"Stop generating AI response\" button is clicked. If not provided, the button will not be rendered."
     },
     "onSubmit": {
       "type": "FormEventHandler<HTMLDivElement>",

From dab49e1c6927e2fb28ffbd703e7ebd1a45ec2725 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Thu, 13 Jun 2024 17:49:31 -0400
Subject: [PATCH 43/55] chore: codemods changeset

---
 .changeset/seven-otters-boil.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/seven-otters-boil.md

diff --git a/.changeset/seven-otters-boil.md b/.changeset/seven-otters-boil.md
new file mode 100644
index 0000000000..6db1272ce3
--- /dev/null
+++ b/.changeset/seven-otters-boil.md
@@ -0,0 +1,5 @@
+---
+"@twilio-paste/codemods": minor
+---
+
+[Codemods] new export (ai-chat-log)

From f1b742ccff4b80139bbcfb25c15c361fb432dd0d Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 14 Jun 2024 09:57:57 -0500
Subject: [PATCH 44/55] chore(docs): ai logs update

---
 .../component-examples/AIChatLogExamples.ts   | 36 +++++---
 .../pages/components/ai-chat-log/index.mdx    | 90 +++++++++++--------
 2 files changed, 75 insertions(+), 51 deletions(-)

diff --git a/packages/paste-website/src/component-examples/AIChatLogExamples.ts b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
index 7a34e0f97c..e9cb326eed 100644
--- a/packages/paste-website/src/component-examples/AIChatLogExamples.ts
+++ b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
@@ -36,15 +36,23 @@ export const botWithFeedback = `
 const MessageWithFeedback = () => {
   return (
     <AIChatLog>
-        <AIChatMessage variant="bot">
-          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
-          <AIChatMessageBody>
-            Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
-          </AIChatMessageBody>
-          <AIChatMessageActions aria-label="Feedback form">
-            <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-          </AIChatMessageActions>
-        </AIChatMessage>
+      <AIChatMessage variant="bot">
+        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+        <AIChatMessageBody>
+          Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
+        </AIChatMessageBody>
+        <AIChatMessageActionGroup aria-label="Feedback form">
+          <AIChatMessageAction>
+            Is this helpful?
+            <Button variant="reset" size="reset">
+              <ThumbsUpIcon decorative={false} title="like result" />
+            </Button>
+            <Button variant="reset" size="reset">
+              <ThumbsDownIcon decorative={false} title="dislike result" />
+            </Button>
+          </AIChatMessageAction>
+        </AIChatMessageActionGroup>
+      </AIChatMessage>
     </AIChatLog>
   );
 };
@@ -105,7 +113,7 @@ const AIChatLogExample = () => {
         <AIChatMessageBody>
           Error codes can be returned from various parts of the process. What error codes are you encountering?
         </AIChatMessageBody>
-        <AIChatMessageActions aria-label="Quick actions available:">
+        <AIChatMessageActionGroup aria-label="Quick actions available:">
           <ButtonGroup>
             <Button variant="secondary" onClick={() => {}} size="small">
               21608
@@ -117,16 +125,16 @@ const AIChatLogExample = () => {
               30009
             </Button>
           </ButtonGroup>
-        </AIChatMessageActions>
+        </AIChatMessageActionGroup>
       </AIChatMessage>
       <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
         <AIChatMessageBody>
           Error 21608 means you're trying to send a message from an unverified number. Is your number verified in your Twilio account?
         </AIChatMessageBody>
-        <AIChatMessageActions aria-label="Feedback form">
-          <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-        </AIChatMessageActions>
+        <AIChatMessageActionGroup aria-label="Feedback form">
+          IMPLEMENT FEEDBACK FORM HERE
+        </AIChatMessageActionGroup>
       </AIChatMessage>
       <AIChatMessage variant="user">
         <AIChatMessageAuthor aria-label="You said" bot>
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index 4a63ccf142..f515bee40f 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -31,12 +31,15 @@ import {
   AIChatMessage,
   AIChatMessageAuthor,
   AIChatMessageBody,
-  AIChatMessageFeedback,
   AIChatMessageLoading,
   AIChatLogger,
   useAIChatLogger,
-  AIChatMessageActions
+  AIChatMessageAction,
+  AIChatMessageActionGroup
 } from "@twilio-paste/core/ai-chat-log";
+import {ThumbsUpIcon} from "@twilio-paste/icons/esm/ThumbsUpIcon";
+import {ThumbsDownIcon} from "@twilio-paste/icons/esm/ThumbsDownIcon";
+
 
 import Changelog from "@twilio-paste/ai-chat-log/CHANGELOG.md";
 import { DownloadIcon } from "@twilio-paste/icons/esm/DownloadIcon";
@@ -57,6 +60,7 @@ import {
   basicChatEvent,
   basicChatBookend,
   chatLoggerExample,
+  botWithActionButton
 } from "../../../component-examples/ChatLogExamples.ts";
 
 import {
@@ -131,23 +135,23 @@ The AI Chat Log package includes these main components:
 - AIChatMessage
 - AIChatMessageAuthor
 - AIChatMessageBody
-- AIChatMessageActions
-- AIChatMessageFeedback
+- AIChatMessageAction
+- AIChatMessageActionGroup
 - AIChatMessageLoading
 
 ### Accessibility
 
-To ensure the chat is accessible, only use the AI Chat components within an AIChatLog component and use AIChatMessage to wrap AIChatMessageBody, AIChatMessageActions and AIChatMessageFeedback components together.
+To ensure the chat is accessible, only use the AI Chat components within an AIChatLog component and use AIChatMessage to wrap AIChatMessageBody, AIChatMessageAction and components together.
 
-The only other accessibility requirement is providing the AIChatMessageActions a descriptive label via the `aria-label` React prop.
+The only other accessibility requirement is providing the AIChatMessageAction a descriptive label via the `aria-label` React prop.
 
-The AIChatLog component has `role=”log”` which means that any new messages added to it are announced by assistive technology.
+The AIChatLog component has `role="log"` which means that any new messages added to it are announced by assistive technology.
 
 ## Examples
 
 ### Basic Message
 
-A message must include the author and body. Any message text from a user or a bot must be contained within the AIChatMessageBody component. Due to lengthy AI responses, the chat layout is now top-down
+A message must include the author and body. Any message text from a user or a bot must be contained within the AIChatMessageBody component. Due to lengthy AI responses, the chat layout is now top-down.
 
 #### Bot
 
@@ -188,7 +192,7 @@ The AIChatMessageBody component has two sizes, `default` and `fullScreen`. The `
     AIChatLog,
     AIChatMessage,
     AIChatMessageAuthor,
-    AIChatMessageBody,
+    AIChatMessageBody
   }}
   language="jsx"
 >
@@ -210,9 +214,11 @@ The AIChatMessageBody component has two sizes, `default` and `fullScreen`. The `
 
 ### Message with Actions
 
-Use AIChatMessageActions to append additional information to a message such as AIChatMessageFeedback or custom action buttons .
+Use AIChatMessageAction to append additional information or custom action buttons.
+
+AIChatMessageActionGroup should be a child of AIChatMessage so that the text and meta information are correctly grouped together for assistive technologies. It also needs a readable `aria-label` that summarizes what the meta information says.
 
-AIChatMessageActions should be a child of AIChatMessage so that the text and meta information are correctly grouped together for assistive technologies. It also needs a readable `aria-label` that summarizes what the meta information says.
+Each item within `AIChatMessageActionGroup` should be wrapped with `AIChatMessageAction`. It is recommended to use reset button variants for content within `AIChatMessageAction`.
 
 #### Feedback
 
@@ -222,8 +228,11 @@ AIChatMessageActions should be a child of AIChatMessage so that the text and met
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageFeedback,
-    AIChatMessageActions,
+    AIChatMessageAction,
+    AIChatMessageActionGroup,
+    Button,
+    ThumbsUpIcon,
+    ThumbsDownIcon
   }}
   language="jsx"
   noInline
@@ -231,28 +240,39 @@ AIChatMessageActions should be a child of AIChatMessage so that the text and met
   {botWithFeedback}
 </LivePreview>
 
-#### Feedback Internationalization
-The labels on feedback can be internationalized by passing using the `i18nDislikeLabel` and `i18nLikeLabel` to describe the feedback options.
+#### Action
 
 <LivePreview
   scope={{
-    AIChatMessageFeedback,
-    AIChatMessageActions
+    AIChatLog,
+    AIChatMessage,
+    AIChatMessageAuthor,
+    AIChatMessageBody,
+    AIChatMessageAction,
+    AIChatMessageActionGroup,
+    Button,
+    ThumbsUpIcon,
+    ThumbsDownIcon
   }}
   language="jsx"
 >
-  {`<AIChatMessageActions aria-label="Feedback form">
-  <AIChatMessageFeedback
-    label="Est-ce utile?"
-    i18nDislikeLabel="pas aimer"
-    i18nLikeLabel="aimer"
-    onLike={() => {}}
-    onDislike={() => {}}
-  />
-</AIChatMessageActions>`}
+  {`<AIChatLog>
+  <AIChatMessage variant="bot">
+    <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+    <AIChatMessageBody>
+      Below is an action with a reset button
+    </AIChatMessageBody>
+    <AIChatMessageActionGroup aria-label="Feedback form">
+      <AIChatMessageAction>
+        <Button variant="reset" size="reset">
+          Perform some action
+        </Button>
+      </AIChatMessageAction>
+    </AIChatMessageActionGroup>
+  </AIChatMessage>
+</AIChatLog>`}
 </LivePreview>
 
-
 ### Loading States
 
 Use the AIChatMessageLoading component to indicate that the bot is typing or processing a response. During this time **no user input should be accepted**. No new messages should be added to a chat until the AI operation is finished processing.
@@ -267,7 +287,6 @@ The SkeletonLoader lengths vary on each render to give a more natural pending me
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageActions,
     AIChatMessageLoading,
   }}
   language="jsx"
@@ -284,7 +303,6 @@ The SkeletonLoader lengths vary on each render to give a more natural pending me
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageActions,
     AIChatMessageLoading,
   }}
   language="jsx"
@@ -303,9 +321,9 @@ This example combines all the separate features displayed previously into one ex
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageFeedback,
     AIChatMessageLoading,
-    AIChatMessageActions,
+    AIChatMessageAction,
+    AIChatMessageActionGroup,
     Button,
     ButtonGroup,
   }}
@@ -317,12 +335,12 @@ This example combines all the separate features displayed previously into one ex
 
 ### useAIChatLogger hook
 
-The `useAIChatLogger` hook provides a hook based approach to managing AI chat state. It is best used with the `<AIChatLogger />` component.
+The `useAIChatLogger` hook provides a hook-based approach to managing AI chat state. It is best used with the `<AIChatLogger />` component.
 
 `useAIChatLogger` returns 4 things:
 
 - An array of `aiChats`.
-- A `push` method used to add a chat, optionally with a custom ID
+- A `push` method used to add a chat, optionally with a custom ID.
 - A `pop` method used to remove a chat, optionally via its ID.
 - A `clear` method used to remove all chats.
 
@@ -331,7 +349,7 @@ The `useAIChatLogger` hook provides a hook based approach to managing AI chat st
 The `<AIChatLogger />` component handles rendering the chats it is passed via props. It handles how chats enter and leave the UI.
 
 ```
-const { aiChats }= useAIChatLogger();
+const { aiChats } = useAIChatLogger();
 return <AIChatLogger aiChats={aiChats} />;
 ```
 
@@ -344,9 +362,7 @@ You can push or pop a chat based on an action or event. In this example it's bas
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageFeedback,
     AIChatMessageLoading,
-    AIChatMessageActions,
     Button,
     ButtonGroup,
     useAIChatLogger,
@@ -362,4 +378,4 @@ You can push or pop a chat based on an action or event. In this example it's bas
 
 ## Composition Notes
 
-Keep content as concise as possible given the space constraints.
\ No newline at end of file
+Keep content as concise as possible given the space constraints.

From 53bae022c79a9c29fd9e862cbc5803a507112ac3 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 14 Jun 2024 10:13:44 -0500
Subject: [PATCH 45/55] chore(docs): ui logs update

---
 .../component-examples/AIChatLogExamples.ts   | 84 +++++++++++++++++--
 .../src/pages/components/ai-chat-log/api.mdx  | 31 +++++--
 .../pages/components/ai-chat-log/index.mdx    |  2 +
 3 files changed, 103 insertions(+), 14 deletions(-)

diff --git a/packages/paste-website/src/component-examples/AIChatLogExamples.ts b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
index e9cb326eed..4fb8d15c47 100644
--- a/packages/paste-website/src/component-examples/AIChatLogExamples.ts
+++ b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
@@ -114,17 +114,81 @@ const AIChatLogExample = () => {
           Error codes can be returned from various parts of the process. What error codes are you encountering?
         </AIChatMessageBody>
         <AIChatMessageActionGroup aria-label="Quick actions available:">
-          <ButtonGroup>
-            <Button variant="secondary" onClick={() => {}} size="small">
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}} >
+              21608
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30007
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30009
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}} >
+              21608
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30007
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30009
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}} >
               21608
             </Button>
-            <Button variant="secondary" onClick={() => {}} size="small">
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
               30007
             </Button>
-            <Button variant="secondary" onClick={() => {}} size="small">
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
               30009
             </Button>
-          </ButtonGroup>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}} >
+              21608
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30007
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30009
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}} >
+              21608
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30007
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30009
+            </Button>
+          </AIChatMessageAction>
         </AIChatMessageActionGroup>
       </AIChatMessage>
       <AIChatMessage variant="bot">
@@ -133,7 +197,15 @@ const AIChatLogExample = () => {
           Error 21608 means you're trying to send a message from an unverified number. Is your number verified in your Twilio account?
         </AIChatMessageBody>
         <AIChatMessageActionGroup aria-label="Feedback form">
-          IMPLEMENT FEEDBACK FORM HERE
+          <AIChatMessageAction>
+            Is this helpful?
+            <Button variant="reset" size="reset">
+              <ThumbsUpIcon decorative={false} title="like result" />
+            </Button>
+            <Button variant="reset" size="reset">
+              <ThumbsDownIcon decorative={false} title="dislike result" />
+            </Button>
+          </AIChatMessageAction>
         </AIChatMessageActionGroup>
       </AIChatMessage>
       <AIChatMessage variant="user">
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/api.mdx b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
index 16d7912c1b..1445008ce3 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
@@ -60,18 +60,33 @@ export const Basic = () => {
   return (
     <AIChatLog>
       <AIChatMessage variant="user">
-        <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
-        <AIChatMessageBody variant="default">What does the SMS delivery error code 30003 mean?</AIChatMessageBody>
+        <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
+        <AIChatMessageBody>
+          Hi, I'm getting errors codes when sending an SMS.
+        </AIChatMessageBody>
       </AIChatMessage>
       <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
-        <AIChatMessageBody variant="default">
-          Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be
-          a landline or phone that doesn't support SMS.
+        <AIChatMessageBody>
+          Error codes can be returned from various parts of the process. What error codes are you encountering?
         </AIChatMessageBody>
-        <AIChatMessageMeta aria-label="Feedback form">
-          <AIChatMessageFeedback onLike={() => {}} onDislike={() => {}} />
-        </AIChatMessageMeta>
+        <AIChatMessageActionGroup aria-label="Quick actions available:">
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}} >
+              21608
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30007
+            </Button>
+          </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset" onClick={() => {}}>
+              30009
+            </Button>
+          </AIChatMessageAction>
+        </AIChatMessageActionGroup>
       </AIChatMessage>
     </AIChatLog>
   );
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index f515bee40f..7c7d5921a5 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -326,6 +326,8 @@ This example combines all the separate features displayed previously into one ex
     AIChatMessageActionGroup,
     Button,
     ButtonGroup,
+    ThumbsDownIcon,
+    ThumbsUpIcon
   }}
   language="jsx"
   noInline

From a670e5fab6a89d25f2f555ce0cb435bf01d9ec84 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 14 Jun 2024 10:14:19 -0500
Subject: [PATCH 46/55] chore(docs): revert flex test

---
 .../component-examples/AIChatLogExamples.ts   | 60 -------------------
 1 file changed, 60 deletions(-)

diff --git a/packages/paste-website/src/component-examples/AIChatLogExamples.ts b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
index 4fb8d15c47..3d79876835 100644
--- a/packages/paste-website/src/component-examples/AIChatLogExamples.ts
+++ b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
@@ -129,66 +129,6 @@ const AIChatLogExample = () => {
               30009
             </Button>
           </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}} >
-              21608
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30007
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30009
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}} >
-              21608
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30007
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30009
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}} >
-              21608
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30007
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30009
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}} >
-              21608
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30007
-            </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30009
-            </Button>
-          </AIChatMessageAction>
         </AIChatMessageActionGroup>
       </AIChatMessage>
       <AIChatMessage variant="bot">

From 4d91f51b46f734b684688daabcf3b4fffe7d28ab Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Fri, 14 Jun 2024 15:04:10 -0500
Subject: [PATCH 47/55] chore(docs): ia logs update

---
 .../components/ai-chat-log/package.json       |   2 +-
 .../component-examples/AIChatLogExamples.ts   |  63 +++++++++--
 .../src/pages/components/ai-chat-log/api.mdx  |  20 ++--
 .../pages/components/ai-chat-log/index.mdx    | 107 ++++++------------
 4 files changed, 95 insertions(+), 97 deletions(-)

diff --git a/packages/paste-core/components/ai-chat-log/package.json b/packages/paste-core/components/ai-chat-log/package.json
index bef2f140bd..9e6c788a0a 100644
--- a/packages/paste-core/components/ai-chat-log/package.json
+++ b/packages/paste-core/components/ai-chat-log/package.json
@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "category": "data display",
   "status": "production",
-  "description": "Ai chat log.",
+  "description": "An AI Chat Log is a collection of AI Chat components for displaying conversations between a human and an AI bot.",
   "author": "Twilio Inc.",
   "license": "MIT",
   "main:dev": "src/index.tsx",
diff --git a/packages/paste-website/src/component-examples/AIChatLogExamples.ts b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
index 3d79876835..4ceda36895 100644
--- a/packages/paste-website/src/component-examples/AIChatLogExamples.ts
+++ b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
@@ -51,12 +51,57 @@ const MessageWithFeedback = () => {
               <ThumbsDownIcon decorative={false} title="dislike result" />
             </Button>
           </AIChatMessageAction>
+          <AIChatMessageAction>
+            <Button variant="reset" size="reset">
+              <RefreshIcon decorative={true}/> Rewrite
+            </Button>
+            <Button variant="reset" size="reset">
+              <CopyIcon decorative={true}/> Copy
+            </Button>
+          </AIChatMessageAction>
         </AIChatMessageActionGroup>
       </AIChatMessage>
     </AIChatLog>
   );
 };
 
+render(
+  <MessageWithFeedback />
+)`.trim();
+export const botWithBodyActions = `
+const MessageWithFeedback = () => {
+  return (
+    <AIChatLog>
+      <AIChatMessage variant="bot">
+        <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+        <AIChatMessageBody>
+          Below is a list of actions that can be taken with flex wrapping supported:
+          <ButtonGroup>  
+            <Button variant="secondary" size="rounded_small" onClick={() => {}} >
+              View Logs
+            </Button>
+            <Button variant="secondary" size="rounded_small" onClick={() => {}}>
+              Run Diagnostics
+            </Button>
+            <Button variant="secondary" size="rounded_small" onClick={() => {}}>
+              Submit Bug Report
+            </Button>
+            <Button variant="secondary" size="rounded_small" onClick={() => {}}>
+              Access Documentation
+            </Button>
+            <Button variant="secondary" size="rounded_small" onClick={() => {}}>
+              Contact Support
+            </Button>
+            <Button variant="secondary" size="rounded_small" onClick={() => {}}>
+              Enable Debug Mode
+            </Button>
+          </ButtonGroup>
+        </AIChatMessageBody>
+      </AIChatMessage>
+    </AIChatLog>
+  );
+};
+
 render(
   <MessageWithFeedback />
 )`.trim();
@@ -112,24 +157,18 @@ const AIChatLogExample = () => {
         <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
         <AIChatMessageBody>
           Error codes can be returned from various parts of the process. What error codes are you encountering?
-        </AIChatMessageBody>
-        <AIChatMessageActionGroup aria-label="Quick actions available:">
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}} >
+          <ButtonGroup>
+            <Button variant="secondary" size="rounded_small" onClick={() => {}} >
               21608
             </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
+            <Button variant="secondary" size="rounded_small" onClick={() => {}}>
               30007
             </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
+            <Button variant="secondary" size="rounded_small" onClick={() => {}}>
               30009
             </Button>
-          </AIChatMessageAction>
-        </AIChatMessageActionGroup>
+          </ButtonGroup>
+        </AIChatMessageBody>
       </AIChatMessage>
       <AIChatMessage variant="bot">
         <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/api.mdx b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
index 1445008ce3..06d8a5efe2 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/api.mdx
@@ -70,20 +70,22 @@ export const Basic = () => {
         <AIChatMessageBody>
           Error codes can be returned from various parts of the process. What error codes are you encountering?
         </AIChatMessageBody>
-        <AIChatMessageActionGroup aria-label="Quick actions available:">
+         <AIChatMessageActionGroup aria-label="Feedback form">
           <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}} >
-              21608
+            Is this helpful?
+            <Button variant="reset" size="reset">
+              <ThumbsUpIcon decorative={false} title="like result" />
             </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30007
+            <Button variant="reset" size="reset">
+              <ThumbsDownIcon decorative={false} title="dislike result" />
             </Button>
           </AIChatMessageAction>
           <AIChatMessageAction>
-            <Button variant="reset" size="reset" onClick={() => {}}>
-              30009
+            <Button variant="reset" size="reset">
+              <RefreshIcon decorative={true}/> Rewrite
+            </Button>
+            <Button variant="reset" size="reset">
+              <CopyIcon decorative={true}/> Copy
             </Button>
           </AIChatMessageAction>
         </AIChatMessageActionGroup>
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index 7c7d5921a5..0cd951d982 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -6,26 +6,11 @@ export const meta = {
   slug: "/components/ai-chat-log/",
 };
 
-import { Anchor } from "@twilio-paste/anchor";
-import { Avatar } from "@twilio-paste/avatar";
-import { Box } from "@twilio-paste/box";
 import { uid } from "@twilio-paste/uid-library";
-import {Paragraph} from "@twilio-paste/paragraph";
-import {
-  ChatAttachment,
-  ChatAttachmentDescription,
-  ChatAttachmentLink,
-  ChatBookend,
-  ChatBookendItem,
-  ChatBubble,
-  ChatEvent,
-  ChatLog,
-  ChatMessage,
-  ChatMessageMeta,
-  ChatMessageMetaItem,
-  useChatLogger,
-  ChatLogger,
-} from "@twilio-paste/chat-log";
+import { HelpText } from "@twilio-paste/help-text";
+import { Button } from "@twilio-paste/button";
+import { ButtonGroup } from "@twilio-paste/button-group";
+import { Stack } from "@twilio-paste/stack";
 import {
   AIChatLog,
   AIChatMessage,
@@ -35,33 +20,16 @@ import {
   AIChatLogger,
   useAIChatLogger,
   AIChatMessageAction,
-  AIChatMessageActionGroup
+  AIChatMessageActionGroup,
 } from "@twilio-paste/core/ai-chat-log";
-import {ThumbsUpIcon} from "@twilio-paste/icons/esm/ThumbsUpIcon";
-import {ThumbsDownIcon} from "@twilio-paste/icons/esm/ThumbsDownIcon";
-
+import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
+import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
+import { RefreshIcon } from "@twilio-paste/icons/esm/RefreshIcon";
+import { CopyIcon } from "@twilio-paste/icons/esm/CopyIcon";
 
 import Changelog from "@twilio-paste/ai-chat-log/CHANGELOG.md";
-import { DownloadIcon } from "@twilio-paste/icons/esm/DownloadIcon";
-import { HelpText } from "@twilio-paste/help-text";
-import { Callout, CalloutHeading, CalloutText } from "@twilio-paste/callout";
-import { Button } from "@twilio-paste/button";
-import { ButtonGroup } from "@twilio-paste/button-group";
-import { Stack } from "@twilio-paste/stack";
 
 import { SidebarCategoryRoutes } from "../../../constants";
-import {
-  inboundMessageMeta,
-  outboundMessageMeta,
-  inboundMessageAttachment,
-  outboundMessageAttachment,
-  inboundComplexMessage,
-  outboundComplexMessage,
-  basicChatEvent,
-  basicChatBookend,
-  chatLoggerExample,
-  botWithActionButton
-} from "../../../component-examples/ChatLogExamples.ts";
 
 import {
   basicBotMessage,
@@ -71,6 +39,7 @@ import {
   botWithLoading,
   kitchenSink,
   aiChatLoggerExample,
+  botWithBodyActions,
 } from "../../../component-examples/AIChatLogExamples";
 import packageJson from "@twilio-paste/ai-chat-log/package.json";
 import ComponentPageLayout from "../../../layouts/ComponentPageLayout";
@@ -135,15 +104,15 @@ The AI Chat Log package includes these main components:
 - AIChatMessage
 - AIChatMessageAuthor
 - AIChatMessageBody
-- AIChatMessageAction
 - AIChatMessageActionGroup
+- AIChatMessageActionCard
 - AIChatMessageLoading
 
 ### Accessibility
 
-To ensure the chat is accessible, only use the AI Chat components within an AIChatLog component and use AIChatMessage to wrap AIChatMessageBody, AIChatMessageAction and components together.
+To ensure the chat is accessible, only use the AI Chat components within an `AIChatLog` component and use `AIChatMessage` to wrap `AIChatMessageBody`, `AIChatMessageActionGroup` and components together.
 
-The only other accessibility requirement is providing the AIChatMessageAction a descriptive label via the `aria-label` React prop.
+The only other accessibility requirement is providing the `AIChatMessageActionCard` a descriptive label via the `aria-label` React prop.
 
 The AIChatLog component has `role="log"` which means that any new messages added to it are announced by assistive technology.
 
@@ -151,7 +120,7 @@ The AIChatLog component has `role="log"` which means that any new messages added
 
 ### Basic Message
 
-A message must include the author and body. Any message text from a user or a bot must be contained within the AIChatMessageBody component. Due to lengthy AI responses, the chat layout is now top-down.
+A message must include the author and body. Any message text from a user or a bot must be contained within the `AIChatMessageBody` component. Due to lengthy AI responses, the chat layout is now top-down.
 
 #### Bot
 
@@ -185,14 +154,14 @@ A message must include the author and body. Any message text from a user or a bo
 
 ### Message Body Sizes
 
-The AIChatMessageBody component has two sizes, `default` and `fullScreen`. The `fullScreen` size is used where the ChatLog is displayed in the full width of the page where larger font size is needed.
+The `AIChatMessageBody` component has two sizes, `size="default"` and `size="fullScreen"`. The fullScreen size is used where the ChatLog is displayed in the full width of the page where larger font size is needed.
 
 <LivePreview
   scope={{
     AIChatLog,
     AIChatMessage,
     AIChatMessageAuthor,
-    AIChatMessageBody
+    AIChatMessageBody,
   }}
   language="jsx"
 >
@@ -214,13 +183,15 @@ The AIChatMessageBody component has two sizes, `default` and `fullScreen`. The `
 
 ### Message with Actions
 
-Use AIChatMessageAction to append additional information or custom action buttons.
+Message actions can be used to provide quick responses or actions to the user.
 
-AIChatMessageActionGroup should be a child of AIChatMessage so that the text and meta information are correctly grouped together for assistive technologies. It also needs a readable `aria-label` that summarizes what the meta information says.
+`AIChatMessageActionGroup` should be a child of `AIChatMessage` so that the text and meta information are correctly grouped together for assistive technologies. `AIChatMessageActionCard` also needs a readable `aria-label` that summarizes what the meta information says.
 
 Each item within `AIChatMessageActionGroup` should be wrapped with `AIChatMessageAction`. It is recommended to use reset button variants for content within `AIChatMessageAction`.
 
-#### Feedback
+Actions can still be added in `AIChatMessageBody` which are returned from the AI response.
+
+#### Feedback in AIChatMessageAction
 
 <LivePreview
   scope={{
@@ -232,7 +203,9 @@ Each item within `AIChatMessageActionGroup` should be wrapped with `AIChatMessag
     AIChatMessageActionGroup,
     Button,
     ThumbsUpIcon,
-    ThumbsDownIcon
+    ThumbsDownIcon,
+    CopyIcon,
+    RefreshIcon,
   }}
   language="jsx"
   noInline
@@ -240,7 +213,7 @@ Each item within `AIChatMessageActionGroup` should be wrapped with `AIChatMessag
   {botWithFeedback}
 </LivePreview>
 
-#### Action
+#### Buttons in AIChatMessageBody from AI Response
 
 <LivePreview
   scope={{
@@ -248,34 +221,18 @@ Each item within `AIChatMessageActionGroup` should be wrapped with `AIChatMessag
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageAction,
-    AIChatMessageActionGroup,
     Button,
-    ThumbsUpIcon,
-    ThumbsDownIcon
+    ButtonGroup,
   }}
   language="jsx"
+  noInline
 >
-  {`<AIChatLog>
-  <AIChatMessage variant="bot">
-    <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
-    <AIChatMessageBody>
-      Below is an action with a reset button
-    </AIChatMessageBody>
-    <AIChatMessageActionGroup aria-label="Feedback form">
-      <AIChatMessageAction>
-        <Button variant="reset" size="reset">
-          Perform some action
-        </Button>
-      </AIChatMessageAction>
-    </AIChatMessageActionGroup>
-  </AIChatMessage>
-</AIChatLog>`}
+  {botWithBodyActions}
 </LivePreview>
 
 ### Loading States
 
-Use the AIChatMessageLoading component to indicate that the bot is typing or processing a response. During this time **no user input should be accepted**. No new messages should be added to a chat until the AI operation is finished processing.
+Use the `AIChatMessageLoading` component to indicate that the bot is typing or processing a response. During this time **no user input should be accepted**. No new messages should be added to a chat until the AI operation is finished processing.
 
 The SkeletonLoader lengths vary on each render to give a more natural pending message body interaction.
 
@@ -327,7 +284,7 @@ This example combines all the separate features displayed previously into one ex
     Button,
     ButtonGroup,
     ThumbsDownIcon,
-    ThumbsUpIcon
+    ThumbsUpIcon,
   }}
   language="jsx"
   noInline
@@ -370,7 +327,7 @@ You can push or pop a chat based on an action or event. In this example it's bas
     useAIChatLogger,
     AIChatLogger,
     Stack,
-    uid
+    uid,
   }}
   language="jsx"
   noInline
@@ -380,4 +337,4 @@ You can push or pop a chat based on an action or event. In this example it's bas
 
 ## Composition Notes
 
-Keep content as concise as possible given the space constraints.
+Keep any generated responses from the AI contained in the `AIChatMessageBody` component. Each chat message shouls only have one `AIChatMessageBody` component.

From 3b9fa3f58e199a227b5eead5c9ab8227b59640be Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Fri, 14 Jun 2024 21:32:09 -0400
Subject: [PATCH 48/55] chore(button): undo toggle reset change and add border
 radius to reset

---
 .changeset/pretty-melons-punch.md                      |  6 +++---
 packages/paste-core/components/button/src/Button.tsx   | 10 +---------
 .../paste-core/components/button/src/ResetButton.tsx   |  3 +--
 packages/paste-core/components/button/src/styles.ts    |  1 +
 .../components/button/stories/index.stories.tsx        |  3 +++
 5 files changed, 9 insertions(+), 14 deletions(-)

diff --git a/.changeset/pretty-melons-punch.md b/.changeset/pretty-melons-punch.md
index 57ce8abeda..ef34b5ad4b 100644
--- a/.changeset/pretty-melons-punch.md
+++ b/.changeset/pretty-melons-punch.md
@@ -1,6 +1,6 @@
 ---
-"@twilio-paste/button": minor
-"@twilio-paste/core": minor
+"@twilio-paste/button": patch
+"@twilio-paste/core": patch
 ---
 
-[Button] Add `pressed` prop to `variant="reset"` buttons in order to use toggle buttons in AI Chat Message Action buttons.
+[Button] Add border radius 20 to size="reset" buttons which can be overriden by passing a border radius token to variant="reset" and size="reset" buttons
\ No newline at end of file
diff --git a/packages/paste-core/components/button/src/Button.tsx b/packages/paste-core/components/button/src/Button.tsx
index 7e26a52640..9a6f6b7af6 100644
--- a/packages/paste-core/components/button/src/Button.tsx
+++ b/packages/paste-core/components/button/src/Button.tsx
@@ -132,15 +132,7 @@ const handlePropValidation = ({
   }
 
   // Toggle button validaton
-  if (
-    pressed &&
-    !(
-      variant === "secondary" ||
-      variant === "secondary_icon" ||
-      variant === "destructive_secondary" ||
-      variant === "reset"
-    )
-  ) {
+  if (pressed && !(variant === "secondary" || variant === "secondary_icon" || variant === "destructive_secondary")) {
     throw new Error(
       `[Paste: Button] pressed can only be used with "secondary" and "secondary_icon" and "destructive_secondary" variants.`,
     );
diff --git a/packages/paste-core/components/button/src/ResetButton.tsx b/packages/paste-core/components/button/src/ResetButton.tsx
index 26db8dabab..b2354e8958 100644
--- a/packages/paste-core/components/button/src/ResetButton.tsx
+++ b/packages/paste-core/components/button/src/ResetButton.tsx
@@ -22,13 +22,12 @@ const ButtonStyleMapping = {
 };
 
 const ResetButton = React.forwardRef<HTMLButtonElement, DirectButtonProps>(
-  ({ size, buttonState, fullWidth, pressed, ...props }, ref) => {
+  ({ size, buttonState, fullWidth, ...props }, ref) => {
     // Must spread size styles after button styles
     return (
       <Box
         ref={ref}
         width={fullWidth ? "100%" : "auto"}
-        aria-pressed={pressed}
         {...ButtonStyleMapping[buttonState]}
         {...SizeStyles[size]}
         {...(props as any)}
diff --git a/packages/paste-core/components/button/src/styles.ts b/packages/paste-core/components/button/src/styles.ts
index 307b833895..ed8a628e65 100644
--- a/packages/paste-core/components/button/src/styles.ts
+++ b/packages/paste-core/components/button/src/styles.ts
@@ -15,6 +15,7 @@ const ResetStyles: BoxStyleProps = {
   textDecoration: "none",
   position: "relative",
   margin: "space0",
+  borderRadius: "borderRadius20",
   /*
    * defensively resetting from over zealous legacy global
    * styles "a {...}" when button is set as an anchor
diff --git a/packages/paste-core/components/button/stories/index.stories.tsx b/packages/paste-core/components/button/stories/index.stories.tsx
index 7abef81b05..f015be64e4 100644
--- a/packages/paste-core/components/button/stories/index.stories.tsx
+++ b/packages/paste-core/components/button/stories/index.stories.tsx
@@ -168,6 +168,9 @@ export const Reset = (): React.ReactNode => (
         Example using reset button in composition
       </Button>
     </Heading>
+    <Button variant="reset" size="reset" borderRadius="borderRadius0">
+      0 border radius
+    </Button>
   </>
 );
 export const ButtonAsAnchor = (): React.ReactNode => {

From 755d8d9e5fe394b9b485da98a0f4c3931401c6f9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Fri, 14 Jun 2024 21:34:45 -0400
Subject: [PATCH 49/55] chore(button-group): flex unattached groups

---
 .changeset/forty-clouds-clean.md              |  6 +++++
 .../button-group/src/ButtonGroup.tsx          |  2 ++
 .../button-group/stories/index.stories.tsx    | 24 +++++++++++++------
 3 files changed, 25 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/forty-clouds-clean.md

diff --git a/.changeset/forty-clouds-clean.md b/.changeset/forty-clouds-clean.md
new file mode 100644
index 0000000000..eccc865ab1
--- /dev/null
+++ b/.changeset/forty-clouds-clean.md
@@ -0,0 +1,6 @@
+---
+"@twilio-paste/button-group": patch
+"@twilio-paste/core": patch
+---
+
+[Button Group] allow unattached button groups to wrap to another line
diff --git a/packages/paste-core/components/button-group/src/ButtonGroup.tsx b/packages/paste-core/components/button-group/src/ButtonGroup.tsx
index eec1efdf93..b865cb6dbd 100644
--- a/packages/paste-core/components/button-group/src/ButtonGroup.tsx
+++ b/packages/paste-core/components/button-group/src/ButtonGroup.tsx
@@ -79,6 +79,8 @@ export const ButtonGroup = React.forwardRef<HTMLDivElement, ButtonGroupProps>(
         ref={ref}
         element={element}
         display="inline-flex"
+        flexWrap={attached ? "nowrap" : "wrap"}
+        rowGap="space40"
         role="group"
       >
         {children}
diff --git a/packages/paste-core/components/button-group/stories/index.stories.tsx b/packages/paste-core/components/button-group/stories/index.stories.tsx
index 809dc60ccb..d5ddc1218c 100644
--- a/packages/paste-core/components/button-group/stories/index.stories.tsx
+++ b/packages/paste-core/components/button-group/stories/index.stories.tsx
@@ -1,4 +1,5 @@
 import type { StoryFn } from "@storybook/react";
+import { Box } from "@twilio-paste/box";
 import { Button } from "@twilio-paste/button";
 import { CustomizationProvider } from "@twilio-paste/customization";
 import { Popover, PopoverButton, PopoverContainer } from "@twilio-paste/popover";
@@ -42,13 +43,22 @@ export const FewButtons: StoryFn = () => (
 );
 
 export const ManyButtons: StoryFn = () => (
-  <ButtonGroup attached aria-label="An alphabetical group of buttons">
-    {[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ"].map((letter) => (
-      <Button key={letter} variant="secondary">
-        {letter}
-      </Button>
-    ))}
-  </ButtonGroup>
+  <Box display="flex" flexDirection="column" rowGap="space60" maxWidth="size60" borderStyle="solid">
+    <ButtonGroup attached aria-label="An alphabetical group of buttons">
+      {[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ"].map((letter) => (
+        <Button key={letter} variant="secondary">
+          {letter}
+        </Button>
+      ))}
+    </ButtonGroup>
+    <ButtonGroup aria-label="An alphabetical group of buttons">
+      {[..."ABCDEFGHIJKLMNOPQRSTUVWXYZ"].map((letter) => (
+        <Button key={letter} variant="secondary">
+          {letter}
+        </Button>
+      ))}
+    </ButtonGroup>
+  </Box>
 );
 
 export const PopoverButtons: StoryFn = () => {

From e61f9180f63b55d1d5a4b97c9df8e52b21bd8e06 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Fri, 14 Jun 2024 21:36:39 -0400
Subject: [PATCH 50/55] chore: actioin card changes from huddle

---
 .../ai-chat-log/__tests__/aiChatLog.spec.tsx  | 26 +++++++-------
 ...Action.tsx => AIChatMessageActionCard.tsx} | 24 ++++++++-----
 .../src/AIChatMessageActionGroup.tsx          |  8 +----
 .../ai-chat-log/src/AIChatMessageBody.tsx     |  4 ++-
 .../components/ai-chat-log/src/index.tsx      |  4 +--
 .../ai-chat-log/stories/composer.stories.tsx  | 14 ++++----
 .../ai-chat-log/stories/index.stories.tsx     | 34 ++++++++++++------
 .../ai-chat-log/stories/parts.stories.tsx     | 36 ++++++++++---------
 .../stories/useAIChatLogger.stories.tsx       |  8 ++---
 9 files changed, 89 insertions(+), 69 deletions(-)
 rename packages/paste-core/components/ai-chat-log/src/{AIChatMessageAction.tsx => AIChatMessageActionCard.tsx} (56%)

diff --git a/packages/paste-core/components/ai-chat-log/__tests__/aiChatLog.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/aiChatLog.spec.tsx
index a47d184812..fc37751beb 100644
--- a/packages/paste-core/components/ai-chat-log/__tests__/aiChatLog.spec.tsx
+++ b/packages/paste-core/components/ai-chat-log/__tests__/aiChatLog.spec.tsx
@@ -4,7 +4,7 @@ import * as React from "react";
 import {
   AIChatLog,
   AIChatMessage,
-  AIChatMessageAction,
+  AIChatMessageActionCard,
   AIChatMessageActionGroup,
   AIChatMessageAuthor,
   AIChatMessageBody,
@@ -18,8 +18,10 @@ const ExampleAIChatLog: React.FC<React.PropsWithChildren> = () => (
         Good Bot
       </AIChatMessageAuthor>
       <AIChatMessageBody size="default">Lorem ipsum dolor.</AIChatMessageBody>
-      <AIChatMessageActionGroup aria-label="Feedback form" data-testid="action_group">
-        <AIChatMessageAction data-testid="action">Is this helpful?</AIChatMessageAction>
+      <AIChatMessageActionGroup data-testid="action_group">
+        <AIChatMessageActionCard aria-label="action" data-testid="action">
+          Is this helpful?
+        </AIChatMessageActionCard>
       </AIChatMessageActionGroup>
       <AIChatMessageLoading onStopLoading={() => {}} data-testid="loading" />
     </AIChatMessage>
@@ -35,14 +37,14 @@ const CustomExampleAIChatLog: React.FC<React.PropsWithChildren> = () => (
       <AIChatMessageBody size="default" element="FOO_AI_CHAT_MESSAGE_BODY">
         Lorem ipsum dolor.
       </AIChatMessageBody>
-      <AIChatMessageActionGroup
-        aria-label="Feedback form"
-        data-testid="action_group"
-        element="FOO_AI_CHAT_MESSAGE_ACTION_GROUP"
-      >
-        <AIChatMessageAction data-testid="action" element="FOO_AI_CHAT_MESSAGE_ACTION">
+      <AIChatMessageActionGroup data-testid="action_group" element="FOO_AI_CHAT_MESSAGE_ACTION_GROUP">
+        <AIChatMessageActionCard
+          aria-label="Feedback form"
+          data-testid="action"
+          element="FOO_AI_CHAT_MESSAGE_ACTION_CARD"
+        >
           Is this helpful?
-        </AIChatMessageAction>
+        </AIChatMessageActionCard>
       </AIChatMessageActionGroup>
       <AIChatMessageLoading onStopLoading={() => {}} data-testid="loading" element="FOO_AI_CHAT_MESSAGE_LOADING" />
     </AIChatMessage>
@@ -72,7 +74,7 @@ describe("Customization", () => {
     expect(screen.getByTestId("action_group").getAttribute("data-paste-element")).toEqual(
       "AI_CHAT_MESSAGE_ACTION_GROUP",
     );
-    expect(screen.getByTestId("action").getAttribute("data-paste-element")).toEqual("AI_CHAT_MESSAGE_ACTION");
+    expect(screen.getByTestId("action").getAttribute("data-paste-element")).toEqual("AI_CHAT_MESSAGE_ACTION_CARD");
     expect(screen.getByTestId("loading").getAttribute("data-paste-element")).toEqual("AI_CHAT_MESSAGE_LOADING");
     expect(screen.getByTestId("loading").firstElementChild?.getAttribute("data-paste-element")).toEqual(
       "AI_CHAT_MESSAGE_LOADING_SKELETON",
@@ -101,7 +103,7 @@ describe("Customization", () => {
     expect(screen.getByTestId("action_group").getAttribute("data-paste-element")).toEqual(
       "FOO_AI_CHAT_MESSAGE_ACTION_GROUP",
     );
-    expect(screen.getByTestId("action").getAttribute("data-paste-element")).toEqual("FOO_AI_CHAT_MESSAGE_ACTION");
+    expect(screen.getByTestId("action").getAttribute("data-paste-element")).toEqual("FOO_AI_CHAT_MESSAGE_ACTION_CARD");
     expect(screen.getByTestId("loading").getAttribute("data-paste-element")).toEqual("FOO_AI_CHAT_MESSAGE_LOADING");
     expect(screen.getByTestId("loading").firstElementChild?.getAttribute("data-paste-element")).toEqual(
       "FOO_AI_CHAT_MESSAGE_LOADING_SKELETON",
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAction.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActionCard.tsx
similarity index 56%
rename from packages/paste-core/components/ai-chat-log/src/AIChatMessageAction.tsx
rename to packages/paste-core/components/ai-chat-log/src/AIChatMessageActionCard.tsx
index 16c5c38a6a..c037abc73e 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageAction.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActionCard.tsx
@@ -3,20 +3,27 @@ import type { BoxElementProps } from "@twilio-paste/box";
 import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
-export interface AIChatMessageActionProps extends HTMLPasteProps<"div"> {
+export interface AIChatMessageActionCardProps extends HTMLPasteProps<"div"> {
   children?: NonNullable<React.ReactNode>;
+  /**
+   * Label for the action card for screen readers
+   *
+   * @type {string}
+   * @memberof AIChatMessageActionGroupProps
+   */
+  "aria-label": string;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
    *
-   * @default "AI_CHAT_MESSAGE_ACTION"
+   * @default "AI_CHAT_MESSAGE_ACTION_CARD"
    * @type {BoxProps["element"]}
-   * @memberof AIChatMessageActionProps
+   * @memberof AIChatMessageActionCardProps
    */
   element?: BoxElementProps["element"];
 }
 
-export const AIChatMessageAction = React.forwardRef<HTMLDivElement, AIChatMessageActionProps>(
-  ({ children, element = "AI_CHAT_MESSAGE_ACTION", ...props }, ref) => (
+export const AIChatMessageActionCard = React.forwardRef<HTMLDivElement, AIChatMessageActionCardProps>(
+  ({ children, element = "AI_CHAT_MESSAGE_ACTION_CARD", ...props }, ref) => (
     <Box
       {...safelySpreadBoxProps(props)}
       ref={ref}
@@ -25,8 +32,9 @@ export const AIChatMessageAction = React.forwardRef<HTMLDivElement, AIChatMessag
       alignItems="flex-start"
       columnGap="space30"
       color="colorTextIcon"
-      lineHeight="lineHeight20"
-      fontSize="fontSize20"
+      lineHeight="lineHeight30"
+      fontSize="fontSize30"
+      fontWeight="fontWeightMedium"
       backgroundColor="colorBackgroundBody"
       boxShadow="shadowBorderWeaker"
       borderRadius="borderRadius30"
@@ -38,4 +46,4 @@ export const AIChatMessageAction = React.forwardRef<HTMLDivElement, AIChatMessag
   ),
 );
 
-AIChatMessageAction.displayName = "AIChatMessageAction";
+AIChatMessageActionCard.displayName = "AIChatMessageActionCard";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActionGroup.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActionGroup.tsx
index 2d69d949a5..919a3036f6 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActionGroup.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActionGroup.tsx
@@ -4,13 +4,6 @@ import type { HTMLPasteProps } from "@twilio-paste/types";
 import * as React from "react";
 
 export interface AIChatMessageActionGroupProps extends HTMLPasteProps<"div"> {
-  /**
-   *
-   * @default null
-   * @type {string}
-   * @memberof AIChatMessageActionGroupProps
-   */
-  "aria-label": string;
   children: NonNullable<React.ReactNode>;
   /**
    * Overrides the default element name to apply unique styles with the Customization Provider
@@ -30,6 +23,7 @@ export const AIChatMessageActionGroup = React.forwardRef<HTMLDivElement, AIChatM
         ref={ref}
         element={element}
         display="flex"
+        flexWrap="wrap"
         alignItems="center"
         columnGap="space30"
         fontWeight="fontWeightMedium"
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
index d81589c611..1337fa036f 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
@@ -46,7 +46,9 @@ export const AIChatMessageBody = React.forwardRef<HTMLDivElement, AIChatMessageB
       <Box
         {...safelySpreadBoxProps(props)}
         {...Sizes[size]}
-        display="inline-block"
+        display="inline-flex"
+        flexDirection="column"
+        rowGap="space50"
         color="colorText"
         wordWrap="break-word"
         maxWidth="100%"
diff --git a/packages/paste-core/components/ai-chat-log/src/index.tsx b/packages/paste-core/components/ai-chat-log/src/index.tsx
index c0efe62ba3..cf8f5b65eb 100644
--- a/packages/paste-core/components/ai-chat-log/src/index.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/index.tsx
@@ -6,8 +6,8 @@ export { AIChatMessageBody } from "./AIChatMessageBody";
 export type { AIChatMessageBodyProps } from "./AIChatMessageBody";
 export { AIChatMessageAuthor } from "./AIChatMessageAuthor";
 export type { AIChatMessageAuthorProps } from "./AIChatMessageAuthor";
-export { AIChatMessageAction } from "./AIChatMessageAction";
-export type { AIChatMessageActionProps } from "./AIChatMessageAction";
+export { AIChatMessageActionCard } from "./AIChatMessageActionCard";
+export type { AIChatMessageActionCardProps } from "./AIChatMessageActionCard";
 export { AIChatMessageLoading } from "./AIChatMessageLoading";
 export type { AIChatMessageLoadingProps } from "./AIChatMessageLoading";
 
diff --git a/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx
index 732e35db86..48e47aa657 100644
--- a/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx
@@ -22,7 +22,7 @@ import {
   AIChatLog,
   AIChatLogger,
   AIChatMessage,
-  AIChatMessageAction,
+  AIChatMessageActionCard,
   AIChatMessageActionGroup,
   AIChatMessageAuthor,
   AIChatMessageBody,
@@ -63,7 +63,7 @@ const BotMessage = (props): JSX.Element => {
 };
 
 // eslint-disable-next-line storybook/prefer-pascal-case
-export const createNewMessage = (message: string): Omit<AIChat, "id"> => {
+const createNewMessage = (message: string): Omit<AIChat, "id"> => {
   const messageDirection = getRandomInt(2) === 1 ? "user" : "bot";
 
   return {
@@ -82,7 +82,7 @@ export const createNewMessage = (message: string): Omit<AIChat, "id"> => {
   };
 };
 
-export const SendButtonPlugin = ({ onClick }: { onClick: () => void }): JSX.Element => {
+const SendButtonPlugin = ({ onClick }: { onClick: () => void }): JSX.Element => {
   const [editor] = useLexicalComposerContext();
 
   const handleSend = (): void => {
@@ -99,7 +99,7 @@ export const SendButtonPlugin = ({ onClick }: { onClick: () => void }): JSX.Elem
   );
 };
 
-export const EnterKeySubmitPlugin = ({ onKeyDown }: { onKeyDown: () => void }): null => {
+const EnterKeySubmitPlugin = ({ onKeyDown }: { onKeyDown: () => void }): null => {
   const [editor] = useLexicalComposerContext();
 
   const handleEnterKey = React.useCallback(
@@ -159,8 +159,8 @@ export const AIChatLogComposer = (): React.ReactNode => {
               </Button>
             </ButtonGroup>
           </AIChatMessageActionGroup>
-          <AIChatMessageActionGroup aria-label="Feedback form">
-            <AIChatMessageAction>
+          <AIChatMessageActionGroup>
+            <AIChatMessageActionCard aria-label="Feedback form">
               Is this helpful?
               <Button variant="reset" size="reset">
                 <ThumbsUpIcon decorative={false} title="like result" />
@@ -168,7 +168,7 @@ export const AIChatLogComposer = (): React.ReactNode => {
               <Button variant="reset" size="reset">
                 <ThumbsDownIcon decorative={false} title="dislike result" />
               </Button>
-            </AIChatMessageAction>
+            </AIChatMessageActionCard>
           </AIChatMessageActionGroup>{" "}
         </AIChatMessage>
       ),
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
index 83f6fa4a42..681cbd08be 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
@@ -5,6 +5,8 @@ import { Button } from "@twilio-paste/button";
 import { ButtonGroup } from "@twilio-paste/button-group";
 import { ChatComposer } from "@twilio-paste/chat-composer";
 import { CustomizationProvider } from "@twilio-paste/customization";
+import { CopyIcon } from "@twilio-paste/icons/esm/CopyIcon";
+import { RefreshIcon } from "@twilio-paste/icons/esm/RefreshIcon";
 import { SendIcon } from "@twilio-paste/icons/esm/SendIcon";
 import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
 import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
@@ -15,7 +17,7 @@ import * as React from "react";
 import {
   AIChatLog,
   AIChatMessage,
-  AIChatMessageAction,
+  AIChatMessageActionCard,
   AIChatMessageActionGroup,
   AIChatMessageAuthor,
   AIChatMessageBody,
@@ -47,7 +49,7 @@ export const ExampleAIChatLog = (): React.ReactNode => {
             Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
             iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
             impedit repellat assumenda.
-            <Box paddingTop="space70">
+            <ButtonGroup>
               <Button variant="secondary" onClick={() => {}} size="rounded_small">
                 30007
               </Button>
@@ -57,18 +59,28 @@ export const ExampleAIChatLog = (): React.ReactNode => {
               <Button variant="secondary" onClick={() => {}} size="rounded_small">
                 30009
               </Button>
-            </Box>
+            </ButtonGroup>
           </AIChatMessageBody>
-          <AIChatMessageActionGroup aria-label="Feedback form">
-            <AIChatMessageAction>
+          <AIChatMessageActionGroup>
+            <AIChatMessageActionCard aria-label="Feedback form">
               Is this helpful?
-              <Button variant="reset" size="reset">
+              <Button variant="secondary_icon" size="reset">
                 <ThumbsUpIcon decorative={false} title="like result" />
               </Button>
-              <Button variant="reset" size="reset">
+              <Button variant="secondary_icon" size="reset">
                 <ThumbsDownIcon decorative={false} title="dislike result" />
               </Button>
-            </AIChatMessageAction>
+            </AIChatMessageActionCard>
+            <AIChatMessageActionCard aria-label="Rewrite and copy buttons">
+              <Button variant="secondary_icon" size="reset">
+                <RefreshIcon decorative />
+                Rewrite
+              </Button>
+              <Button variant="secondary_icon" size="reset">
+                <CopyIcon decorative />
+                Copy
+              </Button>
+            </AIChatMessageActionCard>
           </AIChatMessageActionGroup>
         </AIChatMessage>
         <AIChatMessage variant="user">
@@ -158,8 +170,8 @@ export const CustomizedExampleAIChatLog = (): React.ReactNode => {
               </ButtonGroup>
             </Box>
           </AIChatMessageBody>
-          <AIChatMessageActionGroup aria-label="Feedback form">
-            <AIChatMessageAction>
+          <AIChatMessageActionGroup>
+            <AIChatMessageActionCard aria-label="Feedback form">
               Is this helpful?
               <Button variant="reset" size="reset">
                 <ThumbsUpIcon decorative={false} title="like result" />
@@ -167,7 +179,7 @@ export const CustomizedExampleAIChatLog = (): React.ReactNode => {
               <Button variant="reset" size="reset">
                 <ThumbsDownIcon decorative={false} title="dislike result" />
               </Button>
-            </AIChatMessageAction>
+            </AIChatMessageActionCard>
           </AIChatMessageActionGroup>
         </AIChatMessage>
         <AIChatMessage variant="user">
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index b895fda128..42f5db2c6e 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -12,7 +12,7 @@ import * as React from "react";
 import {
   AIChatLog,
   AIChatMessage,
-  AIChatMessageAction,
+  AIChatMessageActionCard,
   AIChatMessageActionGroup,
   AIChatMessageAuthor,
   AIChatMessageBody,
@@ -107,8 +107,8 @@ export const AIMessageAuthor = (): React.ReactNode => {
 export const AIMessageActionGroup = (): React.ReactNode => {
   /* eslint-disable no-alert */
   return (
-    <AIChatMessageActionGroup aria-label="Feedback form">
-      <AIChatMessageAction>
+    <AIChatMessageActionGroup>
+      <AIChatMessageActionCard aria-label="Feedback form">
         Is this helpful?
         <Button variant="reset" size="reset">
           <ThumbsUpIcon decorative={false} title="like result" />
@@ -116,7 +116,7 @@ export const AIMessageActionGroup = (): React.ReactNode => {
         <Button variant="reset" size="reset">
           <ThumbsDownIcon decorative={false} title="dislike result" />
         </Button>
-      </AIChatMessageAction>
+      </AIChatMessageActionCard>
     </AIChatMessageActionGroup>
   );
   /* eslint-enable no-alert */
@@ -146,36 +146,38 @@ export const FullAIMessage = (): React.ReactNode => {
           </ButtonGroup>
         </Box>
       </AIChatMessageBody>
-      <AIChatMessageActionGroup aria-label="Feedback form">
-        <AIChatMessageAction>
+      <AIChatMessageActionGroup>
+        <AIChatMessageActionCard aria-label="Feedback form">
           Is this helpful?
           <Button
-            variant="reset"
-            size="reset"
+            variant="secondary_icon"
+            size="icon_small"
             pressed={liked}
             onClick={() => {
               setLiked(!liked);
+              setDisliked(false);
             }}
-            _hover={{ color: "colorTextPrimaryStronger" }}
-            _pressed={{ color: "colorTextPrimary" }}
-            _pressed_hover={{ color: "colorTextPrimaryStronger" }}
+            // _hover={{ color: "colorTextPrimaryStronger" }}
+            // _pressed={{ color: "colorTextPrimary" }}
+            // _pressed_hover={{ color: "colorTextPrimaryStronger" }}
           >
             <ThumbsUpIcon decorative={false} title="like result" />
           </Button>
           <Button
-            variant="reset"
-            size="reset"
+            variant="secondary_icon"
+            size="icon_small"
             pressed={disliked}
             onClick={() => {
               setDisliked(!disliked);
+              setLiked(false);
             }}
-            _hover={{ color: "colorTextPrimaryStronger" }}
-            _pressed={{ color: "colorTextPrimary" }}
-            _pressed_hover={{ color: "colorTextPrimaryStronger" }}
+            // _hover={{ color: "colorTextPrimaryStronger" }}
+            // _pressed={{ color: "colorTextPrimary" }}
+            // _pressed_hover={{ color: "colorTextPrimaryStronger" }}
           >
             <ThumbsDownIcon decorative={disliked} title="dislike result" />
           </Button>
-        </AIChatMessageAction>
+        </AIChatMessageActionCard>
       </AIChatMessageActionGroup>
     </AIChatMessage>
   );
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index 62bc361943..586ff2d2df 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -17,7 +17,7 @@ import * as React from "react";
 import {
   AIChatLogger,
   AIChatMessage,
-  AIChatMessageAction,
+  AIChatMessageActionCard,
   AIChatMessageActionGroup,
   AIChatMessageAuthor,
   AIChatMessageBody,
@@ -73,8 +73,8 @@ export const UseChatLogger: StoryFn = () => {
               </Button>
             </ButtonGroup>
           </AIChatMessageActionGroup>
-          <AIChatMessageActionGroup aria-label="Feedback form">
-            <AIChatMessageAction>
+          <AIChatMessageActionGroup>
+            <AIChatMessageActionCard aria-label="Feedback form">
               Is this helpful?
               <Button variant="reset" size="reset">
                 <ThumbsUpIcon decorative={false} title="like result" />
@@ -82,7 +82,7 @@ export const UseChatLogger: StoryFn = () => {
               <Button variant="reset" size="reset">
                 <ThumbsDownIcon decorative={false} title="dislike result" />
               </Button>
-            </AIChatMessageAction>
+            </AIChatMessageActionCard>
           </AIChatMessageActionGroup>{" "}
         </AIChatMessage>
       ),

From 3580d95322a0856e1c81ad54903b9e2aa0f5e251 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Fri, 14 Jun 2024 22:14:05 -0400
Subject: [PATCH 51/55] chore: update all stories with changes

---
 .../ai-chat-log/src/AIChatMessageBody.tsx     |   4 +-
 ...ndex.stories.tsx => aiChatLog.stories.tsx} | 137 ++++++++++++++++--
 .../ai-chat-log/stories/composer.stories.tsx  |  34 ++---
 .../ai-chat-log/stories/parts.stories.tsx     |  18 +--
 .../stories/useAIChatLogger.stories.tsx       |  32 ++--
 5 files changed, 161 insertions(+), 64 deletions(-)
 rename packages/paste-core/components/ai-chat-log/stories/{index.stories.tsx => aiChatLog.stories.tsx} (61%)

diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
index 1337fa036f..d81589c611 100644
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
+++ b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBody.tsx
@@ -46,9 +46,7 @@ export const AIChatMessageBody = React.forwardRef<HTMLDivElement, AIChatMessageB
       <Box
         {...safelySpreadBoxProps(props)}
         {...Sizes[size]}
-        display="inline-flex"
-        flexDirection="column"
-        rowGap="space50"
+        display="inline-block"
         color="colorText"
         wordWrap="break-word"
         maxWidth="100%"
diff --git a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/aiChatLog.stories.tsx
similarity index 61%
rename from packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
rename to packages/paste-core/components/ai-chat-log/stories/aiChatLog.stories.tsx
index 681cbd08be..0e32b316a6 100644
--- a/packages/paste-core/components/ai-chat-log/stories/index.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/aiChatLog.stories.tsx
@@ -49,25 +49,122 @@ export const ExampleAIChatLog = (): React.ReactNode => {
             Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
             iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
             impedit repellat assumenda.
-            <ButtonGroup>
-              <Button variant="secondary" onClick={() => {}} size="rounded_small">
-                30007
+            <Box marginTop="space50">
+              <ButtonGroup>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30009
+                </Button>
+              </ButtonGroup>
+            </Box>
+          </AIChatMessageBody>
+          <AIChatMessageActionGroup>
+            <AIChatMessageActionCard aria-label="Feedback form">
+              Is this helpful?
+              <Button variant="secondary_icon" size="reset" aria-label="this is a helpful response">
+                <ThumbsUpIcon decorative={false} title="like result" />
+              </Button>
+              <Button variant="secondary_icon" size="reset" aria-label="this is not a helpful response">
+                <ThumbsDownIcon decorative={false} title="dislike result" />
               </Button>
-              <Button variant="secondary" onClick={() => {}} size="rounded_small">
-                30007
+            </AIChatMessageActionCard>
+            <AIChatMessageActionCard aria-label="Rewrite and copy buttons">
+              <Button variant="secondary_icon" size="reset">
+                <RefreshIcon decorative />
+                Rewrite
               </Button>
-              <Button variant="secondary" onClick={() => {}} size="rounded_small">
-                30009
+              <Button variant="secondary_icon" size="reset">
+                <CopyIcon decorative />
+                Copy
               </Button>
-            </ButtonGroup>
+            </AIChatMessageActionCard>
+          </AIChatMessageActionGroup>
+        </AIChatMessage>
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor aria-label="You said">Gibby Radki</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+        </AIChatMessage>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody>
+            <AIChatMessageLoading
+              onStopLoading={() => {}}
+              i18nStopGeneratingLabel="Stop generating"
+              i18nAIScreenReaderText="AI response"
+            />
+          </AIChatMessageBody>
+        </AIChatMessage>
+      </AIChatLog>
+      <ChatComposer
+        config={{
+          namespace: "customer-chat",
+          onError: (e) => {
+            throw e;
+          },
+        }}
+        placeholder="Chat text"
+        ariaLabel="A placeholder chat composer"
+      >
+        <Box position="absolute" top="space30" right="space30">
+          <Button variant="primary_icon" size="reset">
+            <SendIcon decorative={false} title="Send message" />
+          </Button>
+        </Box>
+      </ChatComposer>
+    </>
+  );
+};
+
+export const ExampleFullScreenAIChatLog = (): React.ReactNode => {
+  return (
+    <>
+      <AIChatLog>
+        <AIChatMessage variant="user">
+          <AIChatMessageAuthor avatarName="Gibby Ridki" avatarIcon={UserIcon} aria-label="You said at 2:36pm">
+            You
+          </AIChatMessageAuthor>
+          <AIChatMessageBody size="fullScreen">
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+          </AIChatMessageBody>
+        </AIChatMessage>
+        <AIChatMessage variant="bot">
+          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageBody size="fullScreen">
+            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
+            iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
+            impedit repellat assumenda.
+            <Box marginTop="space50">
+              <ButtonGroup>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30009
+                </Button>
+              </ButtonGroup>
+            </Box>
           </AIChatMessageBody>
           <AIChatMessageActionGroup>
             <AIChatMessageActionCard aria-label="Feedback form">
               Is this helpful?
-              <Button variant="secondary_icon" size="reset">
+              <Button variant="secondary_icon" size="reset" aria-label="this is a helpful response">
                 <ThumbsUpIcon decorative={false} title="like result" />
               </Button>
-              <Button variant="secondary_icon" size="reset">
+              <Button variant="secondary_icon" size="reset" aria-label="this is not a helpful response">
                 <ThumbsDownIcon decorative={false} title="dislike result" />
               </Button>
             </AIChatMessageActionCard>
@@ -94,7 +191,11 @@ export const ExampleAIChatLog = (): React.ReactNode => {
         <AIChatMessage variant="bot">
           <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
           <AIChatMessageBody>
-            <AIChatMessageLoading onStopLoading={() => {}} />
+            <AIChatMessageLoading
+              onStopLoading={() => {}}
+              i18nStopGeneratingLabel="Stop generating"
+              i18nAIScreenReaderText="AI response"
+            />
           </AIChatMessageBody>
         </AIChatMessage>
       </AIChatLog>
@@ -156,7 +257,7 @@ export const CustomizedExampleAIChatLog = (): React.ReactNode => {
             Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
             iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
             impedit repellat assumenda.
-            <Box paddingTop="space70">
+            <Box marginTop="space50">
               <ButtonGroup>
                 <Button variant="secondary" onClick={() => {}} size="rounded_small">
                   30007
@@ -173,10 +274,10 @@ export const CustomizedExampleAIChatLog = (): React.ReactNode => {
           <AIChatMessageActionGroup>
             <AIChatMessageActionCard aria-label="Feedback form">
               Is this helpful?
-              <Button variant="reset" size="reset">
+              <Button variant="reset" size="reset" aria-label="this is a helpful response">
                 <ThumbsUpIcon decorative={false} title="like result" />
               </Button>
-              <Button variant="reset" size="reset">
+              <Button variant="reset" size="reset" aria-label="this is not a helpful response">
                 <ThumbsDownIcon decorative={false} title="dislike result" />
               </Button>
             </AIChatMessageActionCard>
@@ -191,9 +292,13 @@ export const CustomizedExampleAIChatLog = (): React.ReactNode => {
           </AIChatMessageBody>
         </AIChatMessage>
         <AIChatMessage variant="bot">
-          <AIChatMessageAuthor aria-label="AI said">Good Bot</AIChatMessageAuthor>
+          <AIChatMessageAuthor aria-label="AI is generating response">Good Bot</AIChatMessageAuthor>
           <AIChatMessageBody>
-            <AIChatMessageLoading onStopLoading={() => {}} />
+            <AIChatMessageLoading
+              onStopLoading={() => {}}
+              i18nStopGeneratingLabel="Stop generating"
+              i18nAIScreenReaderText="AI response"
+            />
           </AIChatMessageBody>
         </AIChatMessage>
       </AIChatLog>
diff --git a/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx
index 48e47aa657..aa16f75f75 100644
--- a/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/composer.stories.tsx
@@ -127,7 +127,7 @@ export const AIChatLogComposer = (): React.ReactNode => {
       variant: "user",
       content: (
         <AIChatMessage variant="user">
-          <AIChatMessageAuthor aria-label="You said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
+          <AIChatMessageAuthor aria-label="you said at 2:36pm">Gibby Radki</AIChatMessageAuthor>
           <AIChatMessageBody>
             Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus eligendi
             iure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit nesciunt
@@ -145,31 +145,31 @@ export const AIChatLogComposer = (): React.ReactNode => {
             Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus
             eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
             nesciunt impedit repellat assumenda.
+            <Box marginTop="space50">
+              <ButtonGroup>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30009
+                </Button>
+              </ButtonGroup>
+            </Box>
           </AIChatMessageBody>
-          <AIChatMessageActionGroup aria-label="Quick actions available:">
-            <ButtonGroup>
-              <Button variant="secondary" onClick={() => {}} size="rounded_small">
-                30007
-              </Button>
-              <Button variant="secondary" onClick={() => {}} size="rounded_small">
-                30007
-              </Button>
-              <Button variant="secondary" onClick={() => {}} size="rounded_small">
-                30009
-              </Button>
-            </ButtonGroup>
-          </AIChatMessageActionGroup>
           <AIChatMessageActionGroup>
             <AIChatMessageActionCard aria-label="Feedback form">
               Is this helpful?
-              <Button variant="reset" size="reset">
+              <Button variant="reset" size="reset" aria-label="this is a helpful response">
                 <ThumbsUpIcon decorative={false} title="like result" />
               </Button>
-              <Button variant="reset" size="reset">
+              <Button variant="reset" size="reset" aria-label="this is not a helpful response">
                 <ThumbsDownIcon decorative={false} title="dislike result" />
               </Button>
             </AIChatMessageActionCard>
-          </AIChatMessageActionGroup>{" "}
+          </AIChatMessageActionGroup>
         </AIChatMessage>
       ),
     },
diff --git a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
index 42f5db2c6e..ecb5c40406 100644
--- a/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/parts.stories.tsx
@@ -105,21 +105,19 @@ export const AIMessageAuthor = (): React.ReactNode => {
 };
 
 export const AIMessageActionGroup = (): React.ReactNode => {
-  /* eslint-disable no-alert */
   return (
     <AIChatMessageActionGroup>
       <AIChatMessageActionCard aria-label="Feedback form">
         Is this helpful?
-        <Button variant="reset" size="reset">
+        <Button variant="reset" size="reset" aria-label="this is a helpful response">
           <ThumbsUpIcon decorative={false} title="like result" />
         </Button>
-        <Button variant="reset" size="reset">
+        <Button variant="reset" size="reset" aria-label="this is not a helpful response">
           <ThumbsDownIcon decorative={false} title="dislike result" />
         </Button>
       </AIChatMessageActionCard>
     </AIChatMessageActionGroup>
   );
-  /* eslint-enable no-alert */
 };
 
 export const FullAIMessage = (): React.ReactNode => {
@@ -151,29 +149,25 @@ export const FullAIMessage = (): React.ReactNode => {
           Is this helpful?
           <Button
             variant="secondary_icon"
-            size="icon_small"
+            aria-label="this is a helpful response"
+            size="reset"
             pressed={liked}
             onClick={() => {
               setLiked(!liked);
               setDisliked(false);
             }}
-            // _hover={{ color: "colorTextPrimaryStronger" }}
-            // _pressed={{ color: "colorTextPrimary" }}
-            // _pressed_hover={{ color: "colorTextPrimaryStronger" }}
           >
             <ThumbsUpIcon decorative={false} title="like result" />
           </Button>
           <Button
             variant="secondary_icon"
-            size="icon_small"
+            aria-label="this is not a helpful response"
+            size="reset"
             pressed={disliked}
             onClick={() => {
               setDisliked(!disliked);
               setLiked(false);
             }}
-            // _hover={{ color: "colorTextPrimaryStronger" }}
-            // _pressed={{ color: "colorTextPrimary" }}
-            // _pressed_hover={{ color: "colorTextPrimaryStronger" }}
           >
             <ThumbsDownIcon decorative={disliked} title="dislike result" />
           </Button>
diff --git a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
index 586ff2d2df..3c443c64b0 100644
--- a/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
+++ b/packages/paste-core/components/ai-chat-log/stories/useAIChatLogger.stories.tsx
@@ -59,31 +59,31 @@ export const UseChatLogger: StoryFn = () => {
             Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt delectus fuga, necessitatibus
             eligendiiure adipisci facilis exercitationem officiis dolorem laborum, ex fugiat quisquam itaque, earum sit
             nesciunt impedit repellat assumenda.
+            <Box paddingTop="space50">
+              <ButtonGroup>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30007
+                </Button>
+                <Button variant="secondary" onClick={() => {}} size="rounded_small">
+                  30009
+                </Button>
+              </ButtonGroup>
+            </Box>
           </AIChatMessageBody>
-          <AIChatMessageActionGroup aria-label="Quick actions available:">
-            <ButtonGroup>
-              <Button variant="secondary" onClick={() => {}} size="rounded_small">
-                30007
-              </Button>
-              <Button variant="secondary" onClick={() => {}} size="rounded_small">
-                30007
-              </Button>
-              <Button variant="secondary" onClick={() => {}} size="rounded_small">
-                30009
-              </Button>
-            </ButtonGroup>
-          </AIChatMessageActionGroup>
           <AIChatMessageActionGroup>
             <AIChatMessageActionCard aria-label="Feedback form">
               Is this helpful?
-              <Button variant="reset" size="reset">
+              <Button variant="reset" size="reset" aria-label="this is a helpful response">
                 <ThumbsUpIcon decorative={false} title="like result" />
               </Button>
-              <Button variant="reset" size="reset">
+              <Button variant="reset" size="reset" aria-label="this is not a helpful response">
                 <ThumbsDownIcon decorative={false} title="dislike result" />
               </Button>
             </AIChatMessageActionCard>
-          </AIChatMessageActionGroup>{" "}
+          </AIChatMessageActionGroup>
         </AIChatMessage>
       ),
     },

From 94a4000891070800a1cd71cc8720fd8ac33ba86a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cnora?= <nkrantz@twilio.com>
Date: Fri, 14 Jun 2024 22:33:08 -0400
Subject: [PATCH 52/55] chore: typedocs

---
 .../paste-codemods/tools/.cache/mappings.json |  2 +-
 .../components/ai-chat-log/type-docs.json     | 32 +++++++++----------
 2 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/packages/paste-codemods/tools/.cache/mappings.json b/packages/paste-codemods/tools/.cache/mappings.json
index 354027dd9c..4c1b330799 100644
--- a/packages/paste-codemods/tools/.cache/mappings.json
+++ b/packages/paste-codemods/tools/.cache/mappings.json
@@ -9,7 +9,7 @@
   "AIChatLog": "@twilio-paste/core/ai-chat-log",
   "AIChatLogger": "@twilio-paste/core/ai-chat-log",
   "AIChatMessage": "@twilio-paste/core/ai-chat-log",
-  "AIChatMessageAction": "@twilio-paste/core/ai-chat-log",
+  "AIChatMessageActionCard": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageActionGroup": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageAuthor": "@twilio-paste/core/ai-chat-log",
   "AIChatMessageBody": "@twilio-paste/core/ai-chat-log",
diff --git a/packages/paste-core/components/ai-chat-log/type-docs.json b/packages/paste-core/components/ai-chat-log/type-docs.json
index 931f22bb86..b5f4f87b59 100644
--- a/packages/paste-core/components/ai-chat-log/type-docs.json
+++ b/packages/paste-core/components/ai-chat-log/type-docs.json
@@ -1591,13 +1591,6 @@
     }
   },
   "AIChatMessageActionGroup": {
-    "aria-label": {
-      "type": "string",
-      "defaultValue": "null",
-      "required": true,
-      "externalProp": false,
-      "description": "Defines a string value that labels the current element."
-    },
     "about": {
       "type": "string",
       "defaultValue": null,
@@ -1764,6 +1757,13 @@
       "externalProp": true,
       "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
     },
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": false,
+      "externalProp": true,
+      "description": "Defines a string value that labels the current element."
+    },
     "aria-labelledby": {
       "type": "string",
       "defaultValue": null,
@@ -6367,7 +6367,14 @@
       "externalProp": true
     }
   },
-  "AIChatMessageAction": {
+  "AIChatMessageActionCard": {
+    "aria-label": {
+      "type": "string",
+      "defaultValue": null,
+      "required": true,
+      "externalProp": false,
+      "description": "Label for the action card for screen readers"
+    },
     "about": {
       "type": "string",
       "defaultValue": null,
@@ -6534,13 +6541,6 @@
       "externalProp": true,
       "description": "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element."
     },
-    "aria-label": {
-      "type": "string",
-      "defaultValue": null,
-      "required": false,
-      "externalProp": true,
-      "description": "Defines a string value that labels the current element."
-    },
     "aria-labelledby": {
       "type": "string",
       "defaultValue": null,
@@ -6784,7 +6784,7 @@
     },
     "element": {
       "type": "string",
-      "defaultValue": "AI_CHAT_MESSAGE_ACTION",
+      "defaultValue": "AI_CHAT_MESSAGE_ACTION_CARD",
       "required": false,
       "externalProp": false,
       "description": "Overrides the default element name to apply unique styles with the Customization Provider"

From 3fb49a317041ff271634e6b23850ffd18b36e4ae Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Mon, 17 Jun 2024 10:43:11 -0500
Subject: [PATCH 53/55] chore(docs): update action card naming

---
 .../src/component-examples/AIChatLogExamples.ts      | 12 ++++++------
 .../src/pages/components/ai-chat-log/index.mdx       | 10 +++++-----
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/paste-website/src/component-examples/AIChatLogExamples.ts b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
index 4ceda36895..4a86abaea5 100644
--- a/packages/paste-website/src/component-examples/AIChatLogExamples.ts
+++ b/packages/paste-website/src/component-examples/AIChatLogExamples.ts
@@ -42,7 +42,7 @@ const MessageWithFeedback = () => {
           Here is what I found, error code 30003 means: The destination phone is unavailable or turned off, or it may be a landline or phone that doesn't support SMS.
         </AIChatMessageBody>
         <AIChatMessageActionGroup aria-label="Feedback form">
-          <AIChatMessageAction>
+          <AIChatMessageActionCard>
             Is this helpful?
             <Button variant="reset" size="reset">
               <ThumbsUpIcon decorative={false} title="like result" />
@@ -50,15 +50,15 @@ const MessageWithFeedback = () => {
             <Button variant="reset" size="reset">
               <ThumbsDownIcon decorative={false} title="dislike result" />
             </Button>
-          </AIChatMessageAction>
-          <AIChatMessageAction>
+          </AIChatMessageActionCard>
+          <AIChatMessageActionCard>
             <Button variant="reset" size="reset">
               <RefreshIcon decorative={true}/> Rewrite
             </Button>
             <Button variant="reset" size="reset">
               <CopyIcon decorative={true}/> Copy
             </Button>
-          </AIChatMessageAction>
+          </AIChatMessageActionCard>
         </AIChatMessageActionGroup>
       </AIChatMessage>
     </AIChatLog>
@@ -176,7 +176,7 @@ const AIChatLogExample = () => {
           Error 21608 means you're trying to send a message from an unverified number. Is your number verified in your Twilio account?
         </AIChatMessageBody>
         <AIChatMessageActionGroup aria-label="Feedback form">
-          <AIChatMessageAction>
+          <AIChatMessageActionCard>
             Is this helpful?
             <Button variant="reset" size="reset">
               <ThumbsUpIcon decorative={false} title="like result" />
@@ -184,7 +184,7 @@ const AIChatLogExample = () => {
             <Button variant="reset" size="reset">
               <ThumbsDownIcon decorative={false} title="dislike result" />
             </Button>
-          </AIChatMessageAction>
+          </AIChatMessageActionCard>
         </AIChatMessageActionGroup>
       </AIChatMessage>
       <AIChatMessage variant="user">
diff --git a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
index 0cd951d982..0e4a120740 100644
--- a/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
+++ b/packages/paste-website/src/pages/components/ai-chat-log/index.mdx
@@ -19,7 +19,7 @@ import {
   AIChatMessageLoading,
   AIChatLogger,
   useAIChatLogger,
-  AIChatMessageAction,
+  AIChatMessageActionCard,
   AIChatMessageActionGroup,
 } from "@twilio-paste/core/ai-chat-log";
 import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
@@ -187,11 +187,11 @@ Message actions can be used to provide quick responses or actions to the user.
 
 `AIChatMessageActionGroup` should be a child of `AIChatMessage` so that the text and meta information are correctly grouped together for assistive technologies. `AIChatMessageActionCard` also needs a readable `aria-label` that summarizes what the meta information says.
 
-Each item within `AIChatMessageActionGroup` should be wrapped with `AIChatMessageAction`. It is recommended to use reset button variants for content within `AIChatMessageAction`.
+Each item within `AIChatMessageActionGroup` should be wrapped with `AIChatMessageActionCard`. It is recommended to use reset button variants for content within `AIChatMessageActionCard`.
 
 Actions can still be added in `AIChatMessageBody` which are returned from the AI response.
 
-#### Feedback in AIChatMessageAction
+#### Feedback in AIChatMessageActionCard
 
 <LivePreview
   scope={{
@@ -199,7 +199,7 @@ Actions can still be added in `AIChatMessageBody` which are returned from the AI
     AIChatMessage,
     AIChatMessageAuthor,
     AIChatMessageBody,
-    AIChatMessageAction,
+    AIChatMessageActionCard,
     AIChatMessageActionGroup,
     Button,
     ThumbsUpIcon,
@@ -279,7 +279,7 @@ This example combines all the separate features displayed previously into one ex
     AIChatMessageAuthor,
     AIChatMessageBody,
     AIChatMessageLoading,
-    AIChatMessageAction,
+    AIChatMessageActionCard,
     AIChatMessageActionGroup,
     Button,
     ButtonGroup,

From 29f68f9eea0db7f8b3dd33c54a8d1f315637d9de Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Mon, 17 Jun 2024 10:59:06 -0500
Subject: [PATCH 54/55] chore(docs): cleanup PR

---
 .../ai-chat-log/__tests__/index.spec.tsx      |  11 -
 .../ai-chat-log/src/AIChatMessageActions.tsx  |  43 ----
 .../src/AIChatMessageBodyTypeWriter.tsx       | 206 ------------------
 .../ai-chat-log/src/AIChatMessageFeedback.tsx |  99 ---------
 .../ai-chat-log/src/AIChatMessageRewrite.tsx  |  70 ------
 5 files changed, 429 deletions(-)
 delete mode 100644 packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
 delete mode 100644 packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx

diff --git a/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx b/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
deleted file mode 100644
index 213832ca50..0000000000
--- a/packages/paste-core/components/ai-chat-log/__tests__/index.spec.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { render } from "@testing-library/react";
-import * as React from "react";
-
-import { AIChatLog } from "../src";
-
-describe("AiLog", () => {
-  it("should render", () => {
-    const { getByText } = render(<AIChatLog>test</AIChatLog>);
-    expect(getByText("test")).toBeDefined();
-  });
-});
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
deleted file mode 100644
index c0df6f20b8..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageActions.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps } from "@twilio-paste/box";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import * as React from "react";
-
-export interface AIChatMessageActionsProps extends HTMLPasteProps<"div"> {
-  /**
-   *
-   * @default null
-   * @type {string}
-   * @memberof AIChatMessageActionsProps
-   */
-  "aria-label": string;
-  children: NonNullable<React.ReactNode>;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "AI_CHAT_MESSAGE_ACTIONS"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatMessageActionsProps
-   */
-  element?: BoxElementProps["element"];
-}
-
-export const AIChatMessageActions = React.forwardRef<HTMLDivElement, AIChatMessageActionsProps>(
-  ({ children, element = "AI_CHAT_MESSAGE_ACTIONS", ...props }, ref) => {
-    return (
-      <Box
-        {...safelySpreadBoxProps(props)}
-        ref={ref}
-        element={element}
-        display="flex"
-        alignItems="center"
-        columnGap="space30"
-        fontWeight="fontWeightMedium"
-      >
-        {children}
-      </Box>
-    );
-  },
-);
-
-AIChatMessageActions.displayName = "AIChatMessageActions";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
deleted file mode 100644
index e4a9f4f2e2..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageBodyTypeWriter.tsx
+++ /dev/null
@@ -1,206 +0,0 @@
-import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps } from "@twilio-paste/box";
-import type { ThemeShape } from "@twilio-paste/theme";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import { uid } from "@twilio-paste/uid-library";
-import * as React from "react";
-
-const Variants = {
-  default: {
-    fontSize: "fontSize30" as ThemeShape["fontSizes"],
-    lineHeight: "lineHeight30" as ThemeShape["lineHeights"],
-  },
-  fullScreen: {
-    fontSize: "fontSize40" as ThemeShape["fontSizes"],
-    lineHeight: "lineHeight40" as ThemeShape["lineHeights"],
-  },
-};
-
-export interface AIChatMessageBodyTypeWriterProps extends HTMLPasteProps<"div"> {
-  children?: React.ReactNode;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "AI_CHAT_MESSAGE_BODY_TYPE_WRITER"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatMessageBodyTypeWriterProps
-   */
-  element?: BoxElementProps["element"];
-  /**
-   * Override the font size for full screen experiences.
-   *
-   * @default "default"
-   * @type {"default" | "fullScreen"}
-   * @memberof AIChatMessageBodyTypeWriterProps
-   */
-  variant?: "default" | "fullScreen";
-  /**
-   * Whether the text should be animated with type writer effect
-   *
-   * @default true
-   * @type {boolean}
-   * @memberof AIChatMessageBodyTypeWriterProps
-   */
-  animated?: boolean;
-}
-
-export const AIChatMessageBodyTypeWriter = React.forwardRef<HTMLDivElement, AIChatMessageBodyTypeWriterProps>(
-  ({ children, variant = "default", element = "AI_CHAT_MESSAGE_BODY_TYPE_WRITER", animated = true, ...props }, ref) => {
-    const [textLessChildren, setTextLessChildren] = React.useState<React.ReactNode[]>([]);
-    const [animatedChildren, setAnimatedChildren] = React.useState<React.ReactNode[]>([]);
-    const [childrenText, setChildrenText] = React.useState<string[]>([]);
-
-    const findNestedElementText = (elementNode: React.ReactNode): string => {
-      let text = "";
-
-      React.Children.forEach(elementNode, (child) => {
-        if (typeof child === "string") {
-          text += child;
-        } else if (React.isValidElement(child)) {
-          // Recursively find text in nested elements
-          text += findNestedElementText(child.props.children);
-        }
-      });
-
-      return text;
-    };
-
-    // Initially split all children from text and elements
-    React.useEffect(() => {
-      if (textLessChildren.length === 0 && childrenText.length === 0 && animated) {
-        React.Children.forEach(children, (child) => {
-          // Strings dn onot neet to copy props
-          if (typeof child === "string") {
-            setChildrenText((prevState) => [...prevState, child]);
-            setTextLessChildren((prevState) => [...prevState, ""]);
-          } else if (React.isValidElement(child)) {
-            setChildrenText((prevState) => [...prevState, findNestedElementText(child.props.children)]);
-            const { children: elementChildren, ...rest } = child.props;
-            // by using {...rest} we take all props except children (the text inside the element )
-            setTextLessChildren((prevState) => [...prevState, <child.type key={rest.key} {...rest} />]);
-          }
-        });
-      }
-    }, []);
-
-    const handleAnimationChangeForChild = (index: number): void => {
-      const animationChild = animatedChildren[index];
-      const textForChild = childrenText[index];
-
-      let currentText = "";
-
-      if (React.isValidElement(animationChild)) {
-        currentText += findNestedElementText(animationChild.props.children);
-        setAnimatedChildren((prev) =>
-          prev.map((el, i) => {
-            if (i === index) {
-              return (
-                <animationChild.type {...animationChild.props}>
-                  {findNestedElementText(animationChild.props.children) + textForChild[currentText.length]}
-                </animationChild.type>
-              );
-            }
-            return el;
-          }),
-        );
-      } else {
-        currentText += animationChild;
-        setAnimatedChildren((prev) =>
-          prev.map((el, i) => {
-            if (i === index) {
-              return currentText + textForChild[currentText.length];
-            }
-            return el;
-          }),
-        );
-      }
-    };
-
-    const handleAddNewAnimatedElWithFirstChar = (index: number): void => {
-      const textForChild = childrenText[index];
-      const child = React.Children.toArray(children)[index];
-
-      if (React.isValidElement(child)) {
-        setAnimatedChildren((prevState) => [
-          ...prevState,
-          <child.type key={child.props.key} {...child.props}>
-            {textForChild[0]}
-          </child.type>,
-        ]);
-      } else {
-        setAnimatedChildren((prevState) => [...prevState, textForChild[0]]);
-      }
-    };
-
-    React.useEffect(() => {
-      let interval: NodeJS.Timeout;
-
-      if (animated) {
-        interval = setInterval(() => {
-          if (textLessChildren.length > 0 && childrenText.length > 0) {
-            if (animatedChildren.length === 0) {
-              handleAddNewAnimatedElWithFirstChar(0);
-            } else {
-              /**
-               * Find the index of an element in the animated children array where the text content does not
-               * match the text length passed in
-               */
-              const indexOfElementToUpdate = animatedChildren.findIndex((child, i) => {
-                let currentText = "";
-
-                if (React.isValidElement(child)) {
-                  currentText += findNestedElementText(child.props.children);
-                } else {
-                  currentText += child;
-                }
-                if (currentText.length < childrenText[i].length) {
-                  return true;
-                }
-                return false;
-              });
-
-              if (indexOfElementToUpdate >= 0) {
-                handleAnimationChangeForChild(indexOfElementToUpdate);
-              }
-              // If text content matches another check is needed to add the next element that is missing
-              if (indexOfElementToUpdate === -1 && animatedChildren.length < textLessChildren.length) {
-                handleAddNewAnimatedElWithFirstChar(animatedChildren.length);
-              }
-              // If no element is missing and all text is the stop the interval
-              else {
-                clearInterval(interval);
-              }
-            }
-          }
-        }, 25);
-      }
-
-      return () => clearInterval(interval);
-    }, [textLessChildren, childrenText, animatedChildren]);
-
-    return (
-      <Box
-        {...safelySpreadBoxProps(props)}
-        {...Variants[variant]}
-        display="inline-block"
-        color="colorText"
-        wordWrap="break-word"
-        maxWidth="100%"
-        minWidth={0}
-        element={element}
-        ref={ref}
-        whiteSpace="pre-wrap"
-      >
-        {animated
-          ? animatedChildren.map((el, idx) => (
-              <Box as="span" key={uid(idx)}>
-                {el}
-              </Box>
-            ))
-          : children}
-      </Box>
-    );
-  },
-);
-
-AIChatMessageBodyTypeWriter.displayName = "AIChatMessageBodyTypeWriter";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
deleted file mode 100644
index ba62b7e038..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageFeedback.tsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import { Box, safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps } from "@twilio-paste/box";
-import { Button } from "@twilio-paste/button";
-import { ThumbsDownIcon } from "@twilio-paste/icons/esm/ThumbsDownIcon";
-import { ThumbsUpIcon } from "@twilio-paste/icons/esm/ThumbsUpIcon";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import * as React from "react";
-
-export interface AIChatMessageFeedbackProps extends HTMLPasteProps<"div"> {
-  children?: never;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "AI_CHAT_MESSAGE_FEEDBACK"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  element?: BoxElementProps["element"];
-  /**
-   * Custom label text for the message feedback component
-   *
-   * @default "Is this helpful?"
-   * @type {string}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  label?: string;
-  /**
-   * Custom accessible label for the "Like result" button for non-English languages
-   *
-   * @default "Like result"
-   * @type {string}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  i18nLikeLabel?: string;
-  /**
-   * Custom accessible label for the "Dislike result" button for non-English languages
-   *
-   * @default "Dislike result"
-   * @type {string}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  i18nDislikeLabel?: string;
-  /**
-   * Function to call on click of "Like result" button
-   *
-   * @type {() => void}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  onLike: () => void;
-  /**
-   * Function to call on click of "Disike result" button
-   *
-   * @type {() => void}
-   * @memberof AIChatMessageFeedbackProps
-   */
-  onDislike: () => void;
-}
-
-export const AIChatMessageFeedback = React.forwardRef<HTMLDivElement, AIChatMessageFeedbackProps>(
-  (
-    {
-      label = "Is this helpful?",
-      i18nLikeLabel = "Like result",
-      i18nDislikeLabel = "Dislike result",
-      onLike,
-      onDislike,
-      element = "AI_CHAT_MESSAGE_FEEDBACK",
-      ...props
-    },
-    ref,
-  ) => (
-    <Box
-      {...safelySpreadBoxProps(props)}
-      ref={ref}
-      element={element}
-      display="inline-flex"
-      alignItems="flex-start"
-      columnGap="space30"
-      color="colorTextIcon"
-      lineHeight="lineHeight20"
-      fontSize="fontSize20"
-      backgroundColor="colorBackgroundBody"
-      boxShadow="shadowBorderWeaker"
-      borderRadius="borderRadius30"
-      paddingX="space30"
-      paddingY="space20"
-    >
-      <Box as="span">{label}</Box>
-      <Button variant="reset" size="reset" onClick={onLike} element={`${element}_LIKE_BUTTON`}>
-        <ThumbsUpIcon decorative={false} title={i18nLikeLabel} />
-      </Button>
-      <Button variant="reset" size="reset" onClick={onDislike} element={`${element}_DISLIKE_BUTTON`}>
-        <ThumbsDownIcon decorative={false} title={i18nDislikeLabel} />
-      </Button>
-    </Box>
-  ),
-);
-
-AIChatMessageFeedback.displayName = "AIChatMessageFeedback";
diff --git a/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx b/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
deleted file mode 100644
index 380d248b45..0000000000
--- a/packages/paste-core/components/ai-chat-log/src/AIChatMessageRewrite.tsx
+++ /dev/null
@@ -1,70 +0,0 @@
-import { safelySpreadBoxProps } from "@twilio-paste/box";
-import type { BoxElementProps } from "@twilio-paste/box";
-import { Button } from "@twilio-paste/button";
-import { RefreshIcon } from "@twilio-paste/icons/esm/RefreshIcon";
-import type { HTMLPasteProps } from "@twilio-paste/types";
-import * as React from "react";
-
-import { AIMessageContext } from "./AIMessageContext";
-
-export interface AIChatMessageRewriteProps extends HTMLPasteProps<"button"> {
-  children?: never;
-  /**
-   * Overrides the default element name to apply unique styles with the Customization Provider
-   *
-   * @default "AI_CHAT_MESSAGE_REWRITE"
-   * @type {BoxProps["element"]}
-   * @memberof AIChatMessageRewriteProps
-   */
-  element?: BoxElementProps["element"];
-  /**
-   * Custom label text for the message rewrite component
-   *
-   * @default "Rewrite"
-   * @type {string}
-   * @memberof AIChatMessageRewriteProps
-   */
-  label?: string;
-  /**
-   * Function to call on click of message rewrite button
-   *
-   * @type {() => void}
-   * @memberof AIChatMessageRewriteProps
-   */
-  onRewrite: () => void;
-}
-
-export const AIChatMessageRewrite = React.forwardRef<HTMLButtonElement, AIChatMessageRewriteProps>(
-  ({ label = "Rewrite", onRewrite, element = "AI_CHAT_MESSAGE_REWRITE", ...props }, ref) => {
-    const { id: messageBodyId } = React.useContext(AIMessageContext);
-
-    return (
-      <Button
-        {...safelySpreadBoxProps(props)}
-        variant="reset"
-        size="reset"
-        ref={ref}
-        element={element}
-        display="inline-flex"
-        alignItems="flex-start"
-        columnGap="space30"
-        color="colorTextIcon"
-        lineHeight="lineHeight30"
-        fontSize="fontSize30"
-        fontWeight="fontWeightSemibold"
-        backgroundColor="colorBackgroundBody"
-        boxShadow="shadowBorderWeaker"
-        borderRadius="borderRadius30"
-        paddingX="space30"
-        paddingY="space20"
-        onClick={onRewrite}
-        aria-controls={messageBodyId}
-      >
-        <RefreshIcon decorative />
-        {label}
-      </Button>
-    );
-  },
-);
-
-AIChatMessageRewrite.displayName = "AIChatMessageRewrite";

From 634fabedb510ab12f6d1b66e785c5df64b596679 Mon Sep 17 00:00:00 2001
From: Kristian Antrobus <kantrobus@twilio.com>
Date: Mon, 17 Jun 2024 11:02:23 -0500
Subject: [PATCH 55/55] chore(docs): add vrt for new docs pages

---
 cypress/integration/sitemap-vrt/constants.ts | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/cypress/integration/sitemap-vrt/constants.ts b/cypress/integration/sitemap-vrt/constants.ts
index 49e88dd27e..c7367f49f6 100644
--- a/cypress/integration/sitemap-vrt/constants.ts
+++ b/cypress/integration/sitemap-vrt/constants.ts
@@ -24,6 +24,9 @@ export const SITEMAP = [
   "/components/account-switcher/",
   "/components/account-switcher/api",
   "/components/account-switcher/changelog",
+  "/components/ai-chat-log/",
+  "/components/ai-chat-log/api",
+  "/components/ai-chat-log/changelog",
   "/components/aspect-ratio/",
   "/components/aspect-ratio/api",
   "/components/aspect-ratio/changelog",