@mastra/playground-ui 1.0.0-alpha.3 → 1.0.0-alpha.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.es.js +29 -29
  2. package/dist/index.es.js.map +1 -1
  3. package/package.json +7 -5
package/dist/index.es.js CHANGED
@@ -4053,18 +4053,17 @@ const Thread = ({ memory }) => {
4053
4053
  {
4054
4054
  style: {
4055
4055
  paddingTop: "2rem",
4056
- paddingInline: "2rem",
4057
4056
  background: "inherit",
4058
4057
  scrollBehavior: "smooth",
4059
4058
  overflowY: "scroll",
4060
4059
  display: "flex",
4061
4060
  flexDirection: "column",
4062
4061
  alignItems: "center",
4063
- height: "calc(100vh - 65px)",
4062
+ height: memory ? "calc(100vh - 65px)" : "calc(100vh - 90px)",
4064
4063
  paddingBottom: "108px"
4065
4064
  },
4066
4065
  children: [
4067
- /* @__PURE__ */ jsxs("div", { style: { width: "100%", maxWidth: "48rem" }, children: [
4066
+ /* @__PURE__ */ jsxs("div", { style: { width: "100%", maxWidth: "48rem", paddingInline: "1.5rem" }, children: [
4068
4067
  /* @__PURE__ */ jsx(ThreadWelcome, {}),
4069
4068
  /* @__PURE__ */ jsx(
4070
4069
  ThreadPrimitive.Messages,
@@ -4093,7 +4092,8 @@ const Thread = ({ memory }) => {
4093
4092
  zIndex: 10,
4094
4093
  paddingBottom: "0.5em",
4095
4094
  left: "50%",
4096
- transform: "translate(-50%)"
4095
+ transform: "translate(-50%)",
4096
+ background: "#0f0f0f"
4097
4097
  },
4098
4098
  className: "px-4",
4099
4099
  children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
@@ -5041,14 +5041,14 @@ function Traces({ traces }) {
5041
5041
  setTraces(traces);
5042
5042
  }, [traces]);
5043
5043
  return /* @__PURE__ */ jsx("div", { className: "h-full w-[calc(100%_-_400px)]", children: /* @__PURE__ */ jsx(ScrollArea, { className: "h-full", children: /* @__PURE__ */ jsxs(Table, { children: [
5044
- /* @__PURE__ */ jsx(TableHeader, { className: "bg-mastra-bg-2 sticky top-0 z-10", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5045
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Trace" }),
5046
- /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1", children: [
5044
+ /* @__PURE__ */ jsx(TableHeader, { className: "sticky top-0 z-10 bg-[#0F0F0F]", style: { outline: "1px solid 0_0%_20.4%" }, children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5045
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Trace" }),
5046
+ /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1 h-10", children: [
5047
5047
  /* @__PURE__ */ jsx(Braces, { className: "h-3 w-3" }),
5048
5048
  " Trace Id"
5049
5049
  ] }),
5050
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Started" }),
5051
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Total Duration" })
5050
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Started" }),
5051
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Total Duration" })
5052
5052
  ] }) }),
5053
5053
  /* @__PURE__ */ jsx(TableBody, { className: "border-b border-gray-6", children: !traces.length ? /* @__PURE__ */ jsx(TableRow, { className: "border-b-gray-6 border-b-[0.1px] text-[0.8125rem]", children: /* @__PURE__ */ jsx(TableCell, { colSpan: 4, className: "h-24 text-center", children: "No traces found" }) }) : traces.map((trace, index) => /* @__PURE__ */ jsxs(
5054
5054
  TableRow,
@@ -5639,14 +5639,14 @@ function AgentTracesInner({
5639
5639
  if (firstCallLoading) {
5640
5640
  return /* @__PURE__ */ jsxs("main", { className: "flex-1 relative overflow-hidden h-full", children: [
5641
5641
  /* @__PURE__ */ jsx("div", { className: "h-full w-[calc(100%_-_400px)]", children: /* @__PURE__ */ jsxs(Table, { children: [
5642
- /* @__PURE__ */ jsx(TableHeader, { className: "bg-mastra-bg-2 sticky top-0 z-10", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5643
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Trace" }),
5644
- /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1", children: [
5642
+ /* @__PURE__ */ jsx(TableHeader, { className: "sticky top-0 z-10 bg-[#0F0F0F]", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5643
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Trace" }),
5644
+ /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1 h-10", children: [
5645
5645
  /* @__PURE__ */ jsx(Braces, { className: "h-3 w-3" }),
5646
5646
  " Trace Id"
5647
5647
  ] }),
5648
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Started" }),
5649
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Total Duration" })
5648
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Started" }),
5649
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Total Duration" })
5650
5650
  ] }) }),
5651
5651
  /* @__PURE__ */ jsx(TableBody, { className: "border-b border-gray-6", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-b-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5652
5652
  /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-full" }) }),
@@ -5661,14 +5661,14 @@ function AgentTracesInner({
5661
5661
  if (!traces || traces.length === 0) {
5662
5662
  return /* @__PURE__ */ jsxs("main", { className: "flex-1 h-full relative overflow-hidden", children: [
5663
5663
  /* @__PURE__ */ jsx("div", { className: "h-full w-[calc(100%_-_400px)]", children: /* @__PURE__ */ jsxs(Table, { children: [
5664
- /* @__PURE__ */ jsx(TableHeader, { className: "bg-mastra-bg-2 sticky top-0 z-10", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5665
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Trace" }),
5666
- /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1", children: [
5664
+ /* @__PURE__ */ jsx(TableHeader, { className: "sticky top-0 z-10 bg-[#0F0F0F]", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5665
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Trace" }),
5666
+ /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1 h-10", children: [
5667
5667
  /* @__PURE__ */ jsx(Braces, { className: "h-3 w-3" }),
5668
5668
  " Trace Id"
5669
5669
  ] }),
5670
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Started" }),
5671
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Total Duration" })
5670
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Started" }),
5671
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Total Duration" })
5672
5672
  ] }) }),
5673
5673
  /* @__PURE__ */ jsx(TableBody, { className: "border-b border-gray-6", children: /* @__PURE__ */ jsx(TableRow, { className: "border-b-gray-6 border-b-[0.1px] text-[0.8125rem]", children: /* @__PURE__ */ jsx(TableCell, { colSpan: 4, className: "h-24 text-center", children: error?.message || "No traces found" }) }) })
5674
5674
  ] }) }),
@@ -5945,14 +5945,14 @@ function WorkflowTracesInner({
5945
5945
  if (firstCallLoading) {
5946
5946
  return /* @__PURE__ */ jsxs("main", { className: "flex-1 h-full relative overflow-hidden", children: [
5947
5947
  /* @__PURE__ */ jsx("div", { className: "h-full w-[calc(100%_-_400px)]", children: /* @__PURE__ */ jsxs(Table, { children: [
5948
- /* @__PURE__ */ jsx(TableHeader, { className: "bg-mastra-bg-2 sticky top-0 z-10", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5949
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Trace" }),
5950
- /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1", children: [
5948
+ /* @__PURE__ */ jsx(TableHeader, { className: "sticky top-0 z-10 bg-[#0F0F0F]", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5949
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Trace" }),
5950
+ /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1 h-10", children: [
5951
5951
  /* @__PURE__ */ jsx(Braces, { className: "h-3 w-3" }),
5952
5952
  " Trace Id"
5953
5953
  ] }),
5954
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Started" }),
5955
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Total Duration" })
5954
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Started" }),
5955
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Total Duration" })
5956
5956
  ] }) }),
5957
5957
  /* @__PURE__ */ jsx(TableBody, { className: "border-b border-gray-6", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-b-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5958
5958
  /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-full" }) }),
@@ -5967,14 +5967,14 @@ function WorkflowTracesInner({
5967
5967
  if (!traces || traces.length === 0) {
5968
5968
  return /* @__PURE__ */ jsxs("main", { className: "flex-1 h-full relative overflow-hidden", children: [
5969
5969
  /* @__PURE__ */ jsx("div", { className: "h-full w-[calc(100%_-_400px)]", children: /* @__PURE__ */ jsxs(Table, { children: [
5970
- /* @__PURE__ */ jsx(TableHeader, { className: "bg-mastra-bg-2 sticky top-0 z-10", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5971
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Trace" }),
5972
- /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1", children: [
5970
+ /* @__PURE__ */ jsx(TableHeader, { className: "sticky top-0 z-10 bg-[#0F0F0F]", children: /* @__PURE__ */ jsxs(TableRow, { className: "border-gray-6 border-b-[0.1px] text-[0.8125rem]", children: [
5971
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Trace" }),
5972
+ /* @__PURE__ */ jsxs(TableHead, { className: "text-mastra-el-3 flex items-center gap-1 h-10", children: [
5973
5973
  /* @__PURE__ */ jsx(Braces, { className: "h-3 w-3" }),
5974
5974
  " Trace Id"
5975
5975
  ] }),
5976
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Started" }),
5977
- /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3", children: "Total Duration" })
5976
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Started" }),
5977
+ /* @__PURE__ */ jsx(TableHead, { className: "text-mastra-el-3 h-10", children: "Total Duration" })
5978
5978
  ] }) }),
5979
5979
  /* @__PURE__ */ jsx(TableBody, { className: "border-b border-gray-6", children: /* @__PURE__ */ jsx(TableRow, { className: "border-b-gray-6 border-b-[0.1px] text-[0.8125rem]", children: /* @__PURE__ */ jsx(TableCell, { colSpan: 4, className: "h-24 text-center", children: error?.message || "No traces found" }) }) })
5980
5980
  ] }) }),