@agentica/chat 0.43.3 → 0.44.0-dev.20260313

package/src/movies/messages/AgenticaChatUserMessageMovie.tsx

@@ -1,56 +1,56 @@
-import type { AgenticaUserMessageHistory } from "@agentica/core";
-
-import FaceIcon from "@mui/icons-material/Face";
-import { Card, CardContent, Chip } from "@mui/material";
-
-import { MarkdownViewer } from "../../components/MarkdownViewer";
-
-export function AgenticaChatUserMessageMovie({
-  prompt,
-}: AgenticaChatUserMessageMovie.IProps) {
-  return (
-    <div
-      style={{
-        display: "flex",
-        justifyContent: "flex-end",
-      }}
-    >
-      {
-        prompt.contents.map((content, index) => (
-          content.type === "text"
-            ? (
-                <Card
-                  key={index}
-                  elevation={3}
-                  style={{
-                    marginTop: 15,
-                    marginBottom: 15,
-                    marginLeft: "15%",
-                    textAlign: "right",
-                    backgroundColor: "lightyellow",
-                  }}
-                >
-
-                  <CardContent>
-                    <Chip
-                      icon={<FaceIcon />}
-                      label="User"
-                      variant="outlined"
-                      color="primary"
-                    />
-                    <MarkdownViewer>{content.text}</MarkdownViewer>
-                  </CardContent>
-                </Card>
-              )
-              // @todo handle other content types (multi modal)
-            : null
-        ))
-      }
-    </div>
-  );
-}
-export namespace AgenticaChatUserMessageMovie {
-  export interface IProps {
-    prompt: AgenticaUserMessageHistory;
-  }
-}
+import type { AgenticaUserMessageHistory } from "@agentica/core";
+
+import FaceIcon from "@mui/icons-material/Face";
+import { Card, CardContent, Chip } from "@mui/material";
+
+import { MarkdownViewer } from "../../components/MarkdownViewer";
+
+export function AgenticaChatUserMessageMovie({
+  prompt,
+}: AgenticaChatUserMessageMovie.IProps) {
+  return (
+    <div
+      style={{
+        display: "flex",
+        justifyContent: "flex-end",
+      }}
+    >
+      {
+        prompt.contents.map((content, index) => (
+          content.type === "text"
+            ? (
+                <Card
+                  key={index}
+                  elevation={3}
+                  style={{
+                    marginTop: 15,
+                    marginBottom: 15,
+                    marginLeft: "15%",
+                    textAlign: "right",
+                    backgroundColor: "lightyellow",
+                  }}
+                >
+
+                  <CardContent>
+                    <Chip
+                      icon={<FaceIcon />}
+                      label="User"
+                      variant="outlined"
+                      color="primary"
+                    />
+                    <MarkdownViewer>{content.text}</MarkdownViewer>
+                  </CardContent>
+                </Card>
+              )
+              // @todo handle other content types (multi modal)
+            : null
+        ))
+      }
+    </div>
+  );
+}
+export namespace AgenticaChatUserMessageMovie {
+  export interface IProps {
+    prompt: AgenticaUserMessageHistory;
+  }
+}

package/src/movies/sides/AgenticaChatFunctionStackSideMovie.tsx

@@ -1,48 +1,48 @@
-import type { AgenticaOperationSelection } from "@agentica/core";
-
-import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
-import {
-  Accordion,
-  AccordionDetails,
-  AccordionSummary,
-  Typography,
-} from "@mui/material";
-import React from "react";
-
-import { MarkdownViewer } from "../../components/MarkdownViewer";
-
-export function AgenticaChatFunctionStackSideMovie(
-  props: AgenticaChatFunctionStackSideMovie.IProps,
-) {
-  return (
-    <React.Fragment>
-      <Typography variant="h5"> Function Stack </Typography>
-      <hr />
-      {props.selections.map(select => (
-        <Accordion>
-          <AccordionSummary expandIcon={<ExpandMoreIcon />}>
-            <Typography component="h6">
-              {select.operation.protocol === "http"
-                ? `${select.operation.function.method.toUpperCase()} ${select.operation.function.path}`
-                : select.operation.function.name}
-            </Typography>
-          </AccordionSummary>
-          <AccordionDetails>
-            <hr />
-            {select.reason}
-            <br />
-            <br />
-            <MarkdownViewer>
-              {select.operation.function.description}
-            </MarkdownViewer>
-          </AccordionDetails>
-        </Accordion>
-      ))}
-    </React.Fragment>
-  );
-}
-export namespace AgenticaChatFunctionStackSideMovie {
-  export interface IProps {
-    selections: AgenticaOperationSelection[];
-  }
-}
+import type { AgenticaOperationSelection } from "@agentica/core";
+
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import {
+  Accordion,
+  AccordionDetails,
+  AccordionSummary,
+  Typography,
+} from "@mui/material";
+import React from "react";
+
+import { MarkdownViewer } from "../../components/MarkdownViewer";
+
+export function AgenticaChatFunctionStackSideMovie(
+  props: AgenticaChatFunctionStackSideMovie.IProps,
+) {
+  return (
+    <React.Fragment>
+      <Typography variant="h5"> Function Stack </Typography>
+      <hr />
+      {props.selections.map(select => (
+        <Accordion>
+          <AccordionSummary expandIcon={<ExpandMoreIcon />}>
+            <Typography component="h6">
+              {select.operation.protocol === "http"
+                ? `${select.operation.function.method.toUpperCase()} ${select.operation.function.path}`
+                : select.operation.function.name}
+            </Typography>
+          </AccordionSummary>
+          <AccordionDetails>
+            <hr />
+            {select.reason}
+            <br />
+            <br />
+            <MarkdownViewer>
+              {select.operation.function.description}
+            </MarkdownViewer>
+          </AccordionDetails>
+        </Accordion>
+      ))}
+    </React.Fragment>
+  );
+}
+export namespace AgenticaChatFunctionStackSideMovie {
+  export interface IProps {
+    selections: AgenticaOperationSelection[];
+  }
+}

package/src/movies/sides/AgenticaChatSideMovie.tsx

@@ -1,75 +1,75 @@
-import type {
-  AgenticaOperationSelection,
-  AgenticaTokenUsage,
-  IAgenticaConfig,
-  IAgenticaVendor,
-  IMicroAgenticaConfig,
-} from "@agentica/core";
-
-import { Typography } from "@mui/material";
-
-import { AgenticaChatFunctionStackSideMovie } from "./AgenticaChatFunctionStackSideMovie";
-import { AgenticaChatTokenUsageSideMovie } from "./AgenticaChatTokenUsageSideMovie";
-
-export function AgenticaChatSideMovie(props: AgenticaChatSideMovie.IProps) {
-  return (
-    <div
-      style={{
-        padding: 25,
-      }}
-    >
-      {props.error !== null
-        ? (
-            <>
-              <Typography variant="h5" color="error">
-                OpenAI Error
-              </Typography>
-              <hr />
-              {props.error.message}
-              <br />
-              <br />
-              Your OpenAI API key may not valid.
-              <br />
-              <br />
-              <br />
-            </>
-          )
-        : null}
-      <Typography variant="h5">Agent Information</Typography>
-      <hr />
-      <ul>
-        <li>
-          Vendor Model:
-          {" "}
-          {props.vendor.model}
-        </li>
-        <li>
-          Locale:
-          {" "}
-          {props.config?.locale ?? navigator.language}
-        </li>
-        <li>
-          Timezone:
-          {" "}
-          {props.config?.timezone
-            ?? Intl.DateTimeFormat().resolvedOptions().timeZone}
-        </li>
-      </ul>
-      <br />
-      <br />
-      <AgenticaChatTokenUsageSideMovie usage={props.usage} />
-      <br />
-      <br />
-      <AgenticaChatFunctionStackSideMovie selections={props.selections} />
-    </div>
-  );
-}
-export namespace AgenticaChatSideMovie {
-  export interface IProps {
-    vendor: IAgenticaVendor;
-    config: IAgenticaConfig | IMicroAgenticaConfig | undefined;
-    usage: AgenticaTokenUsage;
-    selections: AgenticaOperationSelection[];
-    error: Error | null;
-  }
-}
+import type {
+  AgenticaOperationSelection,
+  AgenticaTokenUsage,
+  IAgenticaConfig,
+  IAgenticaVendor,
+  IMicroAgenticaConfig,
+} from "@agentica/core";
+
+import { Typography } from "@mui/material";
+
+import { AgenticaChatFunctionStackSideMovie } from "./AgenticaChatFunctionStackSideMovie";
+import { AgenticaChatTokenUsageSideMovie } from "./AgenticaChatTokenUsageSideMovie";
+
+export function AgenticaChatSideMovie(props: AgenticaChatSideMovie.IProps) {
+  return (
+    <div
+      style={{
+        padding: 25,
+      }}
+    >
+      {props.error !== null
+        ? (
+            <>
+              <Typography variant="h5" color="error">
+                OpenAI Error
+              </Typography>
+              <hr />
+              {props.error.message}
+              <br />
+              <br />
+              Your OpenAI API key may not valid.
+              <br />
+              <br />
+              <br />
+            </>
+          )
+        : null}
+      <Typography variant="h5">Agent Information</Typography>
+      <hr />
+      <ul>
+        <li>
+          Vendor Model:
+          {" "}
+          {props.vendor.model}
+        </li>
+        <li>
+          Locale:
+          {" "}
+          {props.config?.locale ?? navigator.language}
+        </li>
+        <li>
+          Timezone:
+          {" "}
+          {props.config?.timezone
+            ?? Intl.DateTimeFormat().resolvedOptions().timeZone}
+        </li>
+      </ul>
+      <br />
+      <br />
+      <AgenticaChatTokenUsageSideMovie usage={props.usage} />
+      <br />
+      <br />
+      <AgenticaChatFunctionStackSideMovie selections={props.selections} />
+    </div>
+  );
+}
+export namespace AgenticaChatSideMovie {
+  export interface IProps {
+    vendor: IAgenticaVendor;
+    config: IAgenticaConfig | IMicroAgenticaConfig | undefined;
+    usage: AgenticaTokenUsage;
+    selections: AgenticaOperationSelection[];
+    error: Error | null;
+  }
+}

package/src/movies/sides/AgenticaChatTokenUsageSideMovie.tsx

@@ -1,86 +1,86 @@
-import type { AgenticaTokenUsage } from "@agentica/core";
-
-import {
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableRow,
-  Typography,
-} from "@mui/material";
-import React from "react";
-
-export function AgenticaChatTokenUsageSideMovie(props: AgenticaChatTokenUsageSideMovie.IProps) {
-  const price: IPrice = compute(props.usage);
-  return (
-    <React.Fragment>
-      <Typography variant="h5"> Token Usage </Typography>
-      <hr />
-      <Table>
-        <TableHead>
-          <TableRow>
-            <TableCell>Type</TableCell>
-            <TableCell>Token Usage</TableCell>
-            <TableCell>Price</TableCell>
-          </TableRow>
-        </TableHead>
-        <TableBody>
-          <TableRow>
-            <TableCell>Total</TableCell>
-            <TableCell>
-              {props.usage.aggregate.total.toLocaleString()}
-            </TableCell>
-            <TableCell>
-              $
-              {price.total.toLocaleString()}
-            </TableCell>
-          </TableRow>
-          <TableRow>
-            <TableCell>Input</TableCell>
-            <TableCell>
-              {props.usage.aggregate.input.total.toLocaleString()}
-            </TableCell>
-            <TableCell>
-              $
-              {price.prompt.toLocaleString()}
-            </TableCell>
-          </TableRow>
-          <TableRow>
-            <TableCell>Output</TableCell>
-            <TableCell>
-              {props.usage.aggregate.output.total.toLocaleString()}
-            </TableCell>
-            <TableCell>
-              $
-              {price.completion.toLocaleString()}
-            </TableCell>
-          </TableRow>
-        </TableBody>
-      </Table>
-    </React.Fragment>
-  );
-}
-export namespace AgenticaChatTokenUsageSideMovie {
-  export interface IProps {
-    usage: AgenticaTokenUsage;
-  }
-}
-
-interface IPrice {
-  total: number;
-  prompt: number;
-  completion: number;
-}
-
-function compute(usage: AgenticaTokenUsage): IPrice {
-  const prompt: number
-    = (usage.aggregate.input.total - usage.aggregate.input.cached)
-      * (2.5 / 1_000_000)
-      + usage.aggregate.input.cached * (1.25 / 1_000_000);
-  const completion: number = usage.aggregate.output.total * (10.0 / 1_000_000);
-  return {
-    total: prompt + completion,
-    prompt,
-    completion,
-  };
-}
+import type { AgenticaTokenUsage } from "@agentica/core";
+
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+  Typography,
+} from "@mui/material";
+import React from "react";
+
+export function AgenticaChatTokenUsageSideMovie(props: AgenticaChatTokenUsageSideMovie.IProps) {
+  const price: IPrice = compute(props.usage);
+  return (
+    <React.Fragment>
+      <Typography variant="h5"> Token Usage </Typography>
+      <hr />
+      <Table>
+        <TableHead>
+          <TableRow>
+            <TableCell>Type</TableCell>
+            <TableCell>Token Usage</TableCell>
+            <TableCell>Price</TableCell>
+          </TableRow>
+        </TableHead>
+        <TableBody>
+          <TableRow>
+            <TableCell>Total</TableCell>
+            <TableCell>
+              {props.usage.aggregate.total.toLocaleString()}
+            </TableCell>
+            <TableCell>
+              $
+              {price.total.toLocaleString()}
+            </TableCell>
+          </TableRow>
+          <TableRow>
+            <TableCell>Input</TableCell>
+            <TableCell>
+              {props.usage.aggregate.input.total.toLocaleString()}
+            </TableCell>
+            <TableCell>
+              $
+              {price.prompt.toLocaleString()}
+            </TableCell>
+          </TableRow>
+          <TableRow>
+            <TableCell>Output</TableCell>
+            <TableCell>
+              {props.usage.aggregate.output.total.toLocaleString()}
+            </TableCell>
+            <TableCell>
+              $
+              {price.completion.toLocaleString()}
+            </TableCell>
+          </TableRow>
+        </TableBody>
+      </Table>
+    </React.Fragment>
+  );
+}
+export namespace AgenticaChatTokenUsageSideMovie {
+  export interface IProps {
+    usage: AgenticaTokenUsage;
+  }
+}
+
+interface IPrice {
+  total: number;
+  prompt: number;
+  completion: number;
+}
+
+function compute(usage: AgenticaTokenUsage): IPrice {
+  const prompt: number
+    = (usage.aggregate.input.total - usage.aggregate.input.cached)
+      * (2.5 / 1_000_000)
+      + usage.aggregate.input.cached * (1.25 / 1_000_000);
+  const completion: number = usage.aggregate.output.total * (10.0 / 1_000_000);
+  return {
+    total: prompt + completion,
+    prompt,
+    completion,
+  };
+}