@mastra/playground-ui 22.1.3-alpha.3 → 22.2.0-alpha.9

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.
package/dist/index.css CHANGED
@@ -183,6 +183,7 @@
183
183
  --spacing-64: 16rem;
184
184
  --spacing-72: 18rem;
185
185
  --spacing-80: 20rem;
186
+ --spacing-96: 24rem;
186
187
  --spacing-px: .0625rem;
187
188
  --spacing-0_5: .125rem;
188
189
  --spacing-1_5: .375rem;
@@ -1046,6 +1047,10 @@
1046
1047
  height: var(--spacing-48) !important;
1047
1048
  }
1048
1049
 
1050
+ .h-64 {
1051
+ height: var(--spacing-64);
1052
+ }
1053
+
1049
1054
  .h-\[0\.6rem\] {
1050
1055
  height: .6rem;
1051
1056
  }
@@ -1339,6 +1344,10 @@
1339
1344
  width: var(--spacing-80);
1340
1345
  }
1341
1346
 
1347
+ .w-96 {
1348
+ width: var(--spacing-96);
1349
+ }
1350
+
1342
1351
  .w-\[\.75rem\] {
1343
1352
  width: .75rem;
1344
1353
  }
@@ -2066,6 +2075,10 @@
2066
2075
  overflow: hidden;
2067
2076
  }
2068
2077
 
2078
+ .overflow-visible {
2079
+ overflow: visible;
2080
+ }
2081
+
2069
2082
  .overflow-x-auto {
2070
2083
  overflow-x: auto;
2071
2084
  }
@@ -7703,3 +7716,139 @@ html.light {
7703
7716
  transform: translateX(100%);
7704
7717
  }
7705
7718
  }
7719
+ .logo svg {
7720
+ shape-rendering: geometricprecision;
7721
+ overflow: visible;
7722
+ }
7723
+
7724
+ .logo .logo-fill {
7725
+ fill: currentcolor;
7726
+ transition: fill-opacity 320ms cubic-bezier(0.4, 0, 0.2, 1);
7727
+ }
7728
+
7729
+ /* Inner stroke: clipPath clips the stroke to the shape so only the inside
7730
+ half renders — reads as a line drawn inside, not a border around. */
7731
+ .logo .logo-stroke {
7732
+ fill: none;
7733
+ stroke: currentcolor;
7734
+ stroke-width: 0;
7735
+ transition: stroke-width 320ms cubic-bezier(0.4, 0, 0.2, 1);
7736
+ }
7737
+
7738
+ .logo-animate-on-hover .logo-fill {
7739
+ animation: logo-fill-cycle 1500ms cubic-bezier(0.4, 0, 0.2, 1) 1;
7740
+ }
7741
+
7742
+ .logo-animate-on-hover .logo-stroke {
7743
+ animation: logo-stroke-cycle 1500ms cubic-bezier(0.4, 0, 0.2, 1) 1;
7744
+ }
7745
+
7746
+ @keyframes logo-fill-cycle {
7747
+ 0% {
7748
+ fill-opacity: 1;
7749
+ }
7750
+
7751
+ 23.3% {
7752
+ fill-opacity: 0;
7753
+ }
7754
+
7755
+ 43.3% {
7756
+ fill-opacity: 0;
7757
+ }
7758
+
7759
+ 100% {
7760
+ fill-opacity: 1;
7761
+ }
7762
+ }
7763
+
7764
+ @keyframes logo-stroke-cycle {
7765
+ 0% {
7766
+ stroke-width: 0;
7767
+ }
7768
+
7769
+ 23.3% {
7770
+ stroke-width: 2;
7771
+ }
7772
+
7773
+ 43.3% {
7774
+ stroke-width: 2;
7775
+ }
7776
+
7777
+ 100% {
7778
+ stroke-width: 0;
7779
+ }
7780
+ }
7781
+
7782
+ @media (prefers-reduced-motion: reduce) {
7783
+ .logo .logo-fill,
7784
+ .logo .logo-stroke {
7785
+ transition: none;
7786
+ animation: none;
7787
+ }
7788
+ }
7789
+ .brand-loader svg {
7790
+ filter: drop-shadow(0 0 0.7px currentcolor);
7791
+ shape-rendering: geometricprecision;
7792
+ }
7793
+
7794
+ .brand-loader circle {
7795
+ fill: currentcolor;
7796
+ }
7797
+
7798
+ .brand-loader line {
7799
+ stroke: currentcolor;
7800
+ stroke-width: 2.8;
7801
+ stroke-linecap: round;
7802
+ }
7803
+
7804
+ .brand-loader circle,
7805
+ .brand-loader line {
7806
+ animation: brand-loader-pulse 1.8s ease-in-out infinite;
7807
+ }
7808
+
7809
+ .brand-loader .brand-loader-b1 {
7810
+ animation-delay: 0s;
7811
+ }
7812
+
7813
+ .brand-loader .brand-loader-b2 {
7814
+ animation-delay: 0.09s;
7815
+ }
7816
+
7817
+ .brand-loader .brand-loader-ln23 {
7818
+ animation-delay: 0.135s;
7819
+ }
7820
+
7821
+ .brand-loader .brand-loader-b3 {
7822
+ animation-delay: 0.18s;
7823
+ }
7824
+
7825
+ .brand-loader .brand-loader-ln34 {
7826
+ animation-delay: 0.225s;
7827
+ }
7828
+
7829
+ .brand-loader .brand-loader-b4 {
7830
+ animation-delay: 0.27s;
7831
+ }
7832
+
7833
+ .brand-loader .brand-loader-ln45 {
7834
+ animation-delay: 0.315s;
7835
+ }
7836
+
7837
+ .brand-loader .brand-loader-b5 {
7838
+ animation-delay: 0.36s;
7839
+ }
7840
+
7841
+ @keyframes brand-loader-pulse {
7842
+ 0%,
7843
+ 100% {
7844
+ opacity: 1;
7845
+ }
7846
+
7847
+ 40% {
7848
+ opacity: 0;
7849
+ }
7850
+
7851
+ 70% {
7852
+ opacity: 1;
7853
+ }
7854
+ }
package/dist/index.es.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
2
  import { X, Wand2, InfoIcon as InfoIcon$1, AlertCircle, TriangleAlert, CircleCheck, CircleX, CircleAlert, Info, CheckIcon as CheckIcon$1, CopyIcon, ShieldX, LogIn, Check, ChevronsUpDown, Search, ChevronDown, Circle, TriangleAlertIcon, SearchIcon, XIcon, TrendingUpIcon, TrendingDownIcon, CalendarIcon, CircleAlertIcon, ArrowLeftIcon, ArrowRightIcon, Type, Hash, ToggleLeft, AlignLeft, Braces, List, Trash2Icon, ChevronRightIcon, PanelRightIcon, KeyboardIcon, AlertTriangleIcon, AlignLeftIcon, AlignJustifyIcon, ArrowUpIcon, ArrowDownIcon, ChevronsRightIcon, ChevronLeftIcon, ClockIcon, BanIcon, ChevronRight, Folder, File, FilterIcon, CircleXIcon, ExpandIcon, ExternalLinkIcon, Link2Icon, Ban, ListX, ChevronsLeft, ChevronsRight, ChevronLeft, Text, TextSearch, EqualNot, Equal, Plus, Component, ArrowRight, ArrowLeft } from 'lucide-react';
3
3
  import * as React from 'react';
4
- import React__default, { useState, useRef, useCallback, useSyncExternalStore, forwardRef, useMemo, useEffect, Suspense, useId, Fragment as Fragment$1 } from 'react';
4
+ import React__default, { useState, useRef, useCallback, useSyncExternalStore, forwardRef, useMemo, useId, useEffect, Suspense, Fragment as Fragment$1 } from 'react';
5
5
  import { Shadows, Glows, BorderColors, Colors, Sizes, FontSizes, LineHeights, BorderRadius, Spacings } from './tokens.es.js';
6
6
  import './index.css';export { Animations } from './tokens.es.js';
7
7
  import * as TooltipPrimitive from '@radix-ui/react-tooltip';
@@ -3352,7 +3352,7 @@ function cn(...inputs) {
3352
3352
  return twMerge(clsx(inputs));
3353
3353
  }
3354
3354
 
3355
- const sizeClasses$4 = {
3355
+ const sizeClasses$6 = {
3356
3356
  sm: `${formElementSizes.sm} text-ui-sm px-[.75em]`,
3357
3357
  md: `${formElementSizes.md} text-ui-md px-[.75em]`,
3358
3358
  default: `${formElementSizes.default} text-ui-md px-[.85em] `,
@@ -3385,7 +3385,7 @@ function resolveVariant(variant) {
3385
3385
  function buttonVariants(options) {
3386
3386
  const variant = resolveVariant(options?.variant || "default");
3387
3387
  const size = options?.size || "default";
3388
- return cn(sharedStyles, sizeClasses$4[size], variantClasses$4[variant], options?.iconOnly && "[&>svg]:opacity-75");
3388
+ return cn(sharedStyles, sizeClasses$6[size], variantClasses$4[variant], options?.iconOnly && "[&>svg]:opacity-75");
3389
3389
  }
3390
3390
  function flattenChildren(children) {
3391
3391
  const result = [];
@@ -4763,7 +4763,7 @@ const AlertDescription = ({ children, as: As = "p" }) => {
4763
4763
  return /* @__PURE__ */ jsx(Txt, { as: As, variant: "ui-sm", children });
4764
4764
  };
4765
4765
 
4766
- const sizeClasses$3 = {
4766
+ const sizeClasses$5 = {
4767
4767
  sm: "h-avatar-sm w-avatar-sm",
4768
4768
  md: "h-avatar-md w-avatar-md",
4769
4769
  lg: "h-avatar-lg w-avatar-lg"
@@ -4773,7 +4773,7 @@ const Avatar = ({ src, name, size = "sm", interactive = false }) => {
4773
4773
  "div",
4774
4774
  {
4775
4775
  className: cn(
4776
- sizeClasses$3[size],
4776
+ sizeClasses$5[size],
4777
4777
  "border border-border1 bg-surface3 shrink-0 overflow-hidden rounded-full flex items-center justify-center",
4778
4778
  transitions.all,
4779
4779
  interactive && "cursor-pointer hover:scale-105 hover:border-neutral2 hover:shadow-sm"
@@ -5588,6 +5588,59 @@ const LogoWithoutText = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://w
5588
5588
  }
5589
5589
  ) });
5590
5590
 
5591
+ const PATH_D = "M4.49805 11.6934C6.98237 11.6934 8.99609 13.7081 8.99609 16.1924C8.9959 18.6765 6.98225 20.6904 4.49805 20.6904C2.01394 20.6903 0.000196352 18.6765 0 16.1924C0 13.7081 2.01382 11.6935 4.49805 11.6934ZM10.3867 0C12.8709 0 14.8846 2.01388 14.8848 4.49805C14.8848 4.8377 14.847 5.16846 14.7755 5.48643C14.4618 6.88139 14.1953 8.4633 14.9928 9.65L16.2575 11.5319C16.3363 11.6491 16.4727 11.7115 16.6137 11.703C16.7369 11.6957 16.8525 11.6343 16.9214 11.5318L18.1876 9.64717C18.9772 8.47198 18.7236 6.90783 18.4205 5.52484C18.3523 5.21392 18.3164 4.89094 18.3164 4.55957C18.3167 2.07546 20.3313 0.0615234 22.8154 0.0615234C25.2994 0.0617476 27.3132 2.0756 27.3135 4.55957C27.3135 4.93883 27.2665 5.30712 27.178 5.65896C26.8547 6.94441 26.5817 8.37932 27.2446 9.52714L28.459 11.6301C28.4819 11.6697 28.5245 11.6934 28.5703 11.6934C31.0545 11.6935 33.0684 13.7081 33.0684 16.1924C33.0682 18.6765 31.0544 20.6903 28.5703 20.6904C26.0861 20.6904 24.0725 18.6765 24.0723 16.1924C24.0723 15.8049 24.1212 15.4288 24.2133 15.0701C24.5458 13.7746 24.8298 12.3251 24.1609 11.1668L23.0044 9.16384C22.9656 9.09659 22.8931 9.05859 22.8154 9.05859C22.7983 9.05859 22.7824 9.06614 22.7728 9.08033L21.4896 10.9895C20.686 12.1851 20.9622 13.781 21.284 15.1851C21.3582 15.5089 21.3975 15.8461 21.3975 16.1924C21.3973 18.6764 19.3834 20.6902 16.8994 20.6904C14.4152 20.6904 12.4006 18.6765 12.4004 16.1924C12.4004 15.932 12.4226 15.6768 12.4651 15.4286C12.6859 14.14 12.8459 12.7122 12.1167 11.6271L11.2419 10.3253C10.6829 9.49347 9.71913 9.05932 8.78286 8.70188C7.0906 8.05584 5.88867 6.41734 5.88867 4.49805C5.88886 2.0139 7.90254 3.29835e-05 10.3867 0Z";
5592
+ const sizeClasses$4 = {
5593
+ sm: "w-6",
5594
+ md: "w-10"
5595
+ };
5596
+ function prefersReducedMotion() {
5597
+ if (typeof window === "undefined" || !window.matchMedia) return false;
5598
+ return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
5599
+ }
5600
+ function Logo({ className, size = "md", animateOnHover = false, "aria-label": ariaLabel = "Mastra" }) {
5601
+ const reactId = useId();
5602
+ const clipId = `logo-clip-${reactId.replace(/[^a-zA-Z0-9_-]/g, "")}`;
5603
+ const [playing, setPlaying] = useState(false);
5604
+ const handleMouseEnter = animateOnHover ? () => {
5605
+ if (prefersReducedMotion()) return;
5606
+ setPlaying(true);
5607
+ } : void 0;
5608
+ const handleAnimationEnd = animateOnHover && playing ? (e) => {
5609
+ if (e.animationName !== "logo-stroke-cycle") return;
5610
+ setPlaying(false);
5611
+ } : void 0;
5612
+ return /* @__PURE__ */ jsx(
5613
+ "div",
5614
+ {
5615
+ role: "img",
5616
+ "aria-label": ariaLabel,
5617
+ onMouseEnter: handleMouseEnter,
5618
+ onAnimationEnd: handleAnimationEnd,
5619
+ className: cn(
5620
+ "logo inline-block text-neutral6",
5621
+ sizeClasses$4[size],
5622
+ animateOnHover && playing && "logo-animate-on-hover",
5623
+ className
5624
+ ),
5625
+ children: /* @__PURE__ */ jsxs(
5626
+ "svg",
5627
+ {
5628
+ xmlns: "http://www.w3.org/2000/svg",
5629
+ viewBox: "0 0 34 21",
5630
+ fill: "none",
5631
+ className: "logo-svg block w-full h-auto",
5632
+ "aria-hidden": "true",
5633
+ children: [
5634
+ /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: clipId, children: /* @__PURE__ */ jsx("path", { d: PATH_D }) }) }),
5635
+ /* @__PURE__ */ jsx("path", { className: "logo-fill", d: PATH_D }),
5636
+ /* @__PURE__ */ jsx("path", { className: "logo-stroke", d: PATH_D, clipPath: `url(#${clipId})` })
5637
+ ]
5638
+ }
5639
+ )
5640
+ }
5641
+ );
5642
+ }
5643
+
5591
5644
  const rowSize = {
5592
5645
  default: "[&>tbody>tr]:h-table-row",
5593
5646
  small: "[&>tbody>tr]:h-table-row-small"
@@ -7009,7 +7062,7 @@ function SelectFieldBlock({
7009
7062
  ] });
7010
7063
  }
7011
7064
 
7012
- const sizeClasses$2 = {
7065
+ const sizeClasses$3 = {
7013
7066
  sm: `${formElementSizes.sm} w-form-sm`,
7014
7067
  md: `${formElementSizes.md} w-form-md`,
7015
7068
  lg: `${formElementSizes.lg} w-form-lg`,
@@ -7042,7 +7095,7 @@ const IconButton = React__default.forwardRef(
7042
7095
  baseButtonStyles,
7043
7096
  formElementFocus,
7044
7097
  variantClasses$1[variant],
7045
- sizeClasses$2[size],
7098
+ sizeClasses$3[size],
7046
7099
  disabled && "active:scale-100",
7047
7100
  className
7048
7101
  ),
@@ -7206,7 +7259,7 @@ function MetricsCardError({
7206
7259
  return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-3 items-center justify-center", className), children: /* @__PURE__ */ jsx("p", { className: "text-ui-sm text-accent2", children: message }) });
7207
7260
  }
7208
7261
 
7209
- const sizeClasses$1 = {
7262
+ const sizeClasses$2 = {
7210
7263
  sm: "w-4 h-4",
7211
7264
  md: "w-6 h-6",
7212
7265
  lg: "w-8 h-8"
@@ -7215,7 +7268,7 @@ function Spinner({ color, className, size = "md" }) {
7215
7268
  return /* @__PURE__ */ jsx(
7216
7269
  "svg",
7217
7270
  {
7218
- className: cn("animate-spin", sizeClasses$1[size], className),
7271
+ className: cn("animate-spin", sizeClasses$2[size], className),
7219
7272
  style: { animationDuration: "800ms", animationTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)" },
7220
7273
  xmlns: "http://www.w3.org/2000/svg",
7221
7274
  width: "24",
@@ -7627,6 +7680,49 @@ const Slider = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
7627
7680
  ));
7628
7681
  Slider.displayName = SliderPrimitive.Root.displayName;
7629
7682
 
7683
+ const sizeClasses$1 = {
7684
+ sm: "w-6",
7685
+ md: "w-10",
7686
+ lg: "w-16"
7687
+ };
7688
+ function BrandLoader({ className, size = "md", "aria-label": ariaLabel = "Loading" }) {
7689
+ const reactId = useId();
7690
+ const filterId = `brand-loader-${reactId.replace(/[^a-zA-Z0-9_-]/g, "")}`;
7691
+ return /* @__PURE__ */ jsx(
7692
+ "div",
7693
+ {
7694
+ role: "status",
7695
+ "aria-label": ariaLabel,
7696
+ className: cn("brand-loader inline-block text-neutral6", sizeClasses$1[size], className),
7697
+ children: /* @__PURE__ */ jsxs(
7698
+ "svg",
7699
+ {
7700
+ xmlns: "http://www.w3.org/2000/svg",
7701
+ viewBox: "0 0 34 21",
7702
+ className: "block w-full h-auto overflow-visible",
7703
+ "aria-hidden": "true",
7704
+ children: [
7705
+ /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("filter", { id: filterId, children: [
7706
+ /* @__PURE__ */ jsx("feGaussianBlur", { in: "SourceGraphic", stdDeviation: "0.55" }),
7707
+ /* @__PURE__ */ jsx("feColorMatrix", { values: "1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 18 -7" })
7708
+ ] }) }),
7709
+ /* @__PURE__ */ jsxs("g", { filter: `url(#${filterId})`, children: [
7710
+ /* @__PURE__ */ jsx("line", { className: "brand-loader-ln23", x1: "10.4", y1: "4.5", x2: "16.8", y2: "16.2" }),
7711
+ /* @__PURE__ */ jsx("line", { className: "brand-loader-ln34", x1: "16.8", y1: "16.2", x2: "23.2", y2: "4.5" }),
7712
+ /* @__PURE__ */ jsx("line", { className: "brand-loader-ln45", x1: "23.2", y1: "4.5", x2: "29.5", y2: "16.2" }),
7713
+ /* @__PURE__ */ jsx("circle", { className: "brand-loader-b1", cx: "4.5", cy: "16.2", r: "4.5" }),
7714
+ /* @__PURE__ */ jsx("circle", { className: "brand-loader-b2", cx: "10.4", cy: "4.5", r: "4.5" }),
7715
+ /* @__PURE__ */ jsx("circle", { className: "brand-loader-b3", cx: "16.8", cy: "16.2", r: "4.5" }),
7716
+ /* @__PURE__ */ jsx("circle", { className: "brand-loader-b4", cx: "23.2", cy: "4.5", r: "4.5" }),
7717
+ /* @__PURE__ */ jsx("circle", { className: "brand-loader-b5", cx: "29.5", cy: "16.2", r: "4.5" })
7718
+ ] })
7719
+ ]
7720
+ }
7721
+ )
7722
+ }
7723
+ );
7724
+ }
7725
+
7630
7726
  const Switch = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
7631
7727
  SwitchPrimitives.Root,
7632
7728
  {
@@ -11313,6 +11409,45 @@ function DataListSkeleton({ columns = "auto 1fr auto auto", numberOfRows = 3 })
11313
11409
  )) });
11314
11410
  }
11315
11411
 
11412
+ function toDate$2(value) {
11413
+ const date = value instanceof Date ? value : new Date(value);
11414
+ return isNaN(date.getTime()) ? null : date;
11415
+ }
11416
+ function ScoresDataListDateCell({ timestamp }) {
11417
+ const date = toDate$2(timestamp);
11418
+ return /* @__PURE__ */ jsx(DataListCell, { height: "compact", className: "text-ui-smd text-neutral2", children: date ? isToday$1(date) ? "Today" : format(date, "MMM dd") : "-" });
11419
+ }
11420
+ function ScoresDataListTimeCell({ timestamp }) {
11421
+ const date = toDate$2(timestamp);
11422
+ return /* @__PURE__ */ jsx(DataListCell, { height: "compact", className: "text-ui-smd text-neutral3", children: date ? format(date, "h:mm:ss aaa") : "-" });
11423
+ }
11424
+ function ScoresDataListInputCell({ input }) {
11425
+ return /* @__PURE__ */ jsx(DataListCell, { height: "compact", className: "min-w-0", children: /* @__PURE__ */ jsx("span", { className: "block text-neutral3 text-ui-smd font-mono truncate", children: input != null ? JSON.stringify(input) : "-" }) });
11426
+ }
11427
+ function ScoresDataListEntityCell({ entityId }) {
11428
+ return /* @__PURE__ */ jsx(DataListCell, { height: "compact", className: "min-w-0", children: /* @__PURE__ */ jsx("span", { className: "block text-ui-smd truncate", children: entityId || "-" }) });
11429
+ }
11430
+ function ScoresDataListScoreCell({ score }) {
11431
+ const display = score == null ? "-" : typeof score === "object" ? JSON.stringify(score) : String(score);
11432
+ return /* @__PURE__ */ jsx(DataListCell, { height: "compact", className: "text-ui-smd font-mono text-neutral3", children: display });
11433
+ }
11434
+
11435
+ function ScoresDataListRoot(props) {
11436
+ return /* @__PURE__ */ jsx(DataListRoot, { ...props });
11437
+ }
11438
+ const ScoresDataList = Object.assign(ScoresDataListRoot, {
11439
+ Top: DataListTop,
11440
+ TopCell: DataListTopCell,
11441
+ RowButton: DataListRowButton,
11442
+ NoMatch: DataListNoMatch,
11443
+ NextPageLoading: DataListNextPageLoading,
11444
+ DateCell: ScoresDataListDateCell,
11445
+ TimeCell: ScoresDataListTimeCell,
11446
+ InputCell: ScoresDataListInputCell,
11447
+ EntityCell: ScoresDataListEntityCell,
11448
+ ScoreCell: ScoresDataListScoreCell
11449
+ });
11450
+
11316
11451
  function toDate$1(value) {
11317
11452
  const date = value instanceof Date ? value : new Date(value);
11318
11453
  return isNaN(date.getTime()) ? null : date;
@@ -11375,7 +11510,10 @@ function TracesDataListStatusCell({ status }) {
11375
11510
  return /* @__PURE__ */ jsx(DataListCell, { height: "compact", children: /* @__PURE__ */ jsx("span", { className: "uppercase text-ui-sm font-semibold", style: { color: config.color }, children: config.label }) });
11376
11511
  }
11377
11512
 
11378
- const TracesDataList = Object.assign(DataListRoot, {
11513
+ function TracesDataListRoot(props) {
11514
+ return /* @__PURE__ */ jsx(DataListRoot, { ...props });
11515
+ }
11516
+ const TracesDataList = Object.assign(TracesDataListRoot, {
11379
11517
  Top: DataListTop,
11380
11518
  TopCell: DataListTopCell,
11381
11519
  RowButton: DataListRowButton,
@@ -14063,5 +14201,5 @@ function generateDefaultValues(schema) {
14063
14201
  return generateObjectDefaults(schema.properties, 0);
14064
14202
  }
14065
14203
 
14066
- export { AddField, AgentCoinIcon, AgentIcon, AgentNetworkCoinIcon, AiIcon, Alert, AlertDescription, AlertDialog, AlertTitle, AmazonIcon, AnthropicChatIcon, AnthropicMessagesIcon, ApiIcon, Avatar, AzureIcon, Badge, BorderColors, BorderRadius, BranchIcon, Breadcrumb, Button, ButtonWithTooltip, ButtonsGroup, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Cell, CheckIcon, Checkbox, ChevronIcon, Chip, ChipsGroup, CodeDiff, CodeEditor, CohereIcon, Collapsible, CollapsibleContent, CollapsiblePanel, CollapsibleTrigger, Colors, Column, Columns, CombinedButtons, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, CommitIcon, ContentBlock, ContentBlocks, CopyButton, CrossIcon, Crumb, DashboardCard, DataCodeSection, DataDetailsPanel, DataKeysAndValues, DataList, DataListSkeleton, DataPanel, DatePicker, DateTimeCell, DateTimePicker, DateTimePickerContent, DateTimeRangePicker, DbIcon, DebugIcon, DefaultTrigger, DeploymentIcon, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DividerIcon, DocsIcon, DropdownMenu, EXTENSION_TO_MIME, ElementSelect, EmptyState, Entity, EntityContent, EntityDescription, EntityHeader, EntityIcon, EntityList, EntityListPageLayout, EntityListSkeleton, EntityName, Entry, EntryCell, EntryList, EntryListSkeleton, EnvIcon, ErrorState, Field, FieldBlock, FieldBlocksLayout, FieldDescription, FieldList, FieldName, FieldNullable, FieldOptional, FieldRemove, FieldType, FiltersIcon, FolderIcon, FontSizes, GithubCoinIcon, GithubIcon, Glows, GoogleIcon, GroqIcon, Header$1 as Header, HeaderAction, HeaderGroup, HeaderTitle, HomeIcon, HorizontalBars, HoverPopover, Icon, IconButton, InfoIcon, Input, ItemList, ItemListSkeleton, JSONSchemaForm, JudgeIcon, Kbd, KeyValueList, Label, LatencyIcon, LineHeights, ListSearch, LogoWithoutText, LogsDataList, DataListSkeleton as LogsDataListSkeleton, LogsIcon, MainContentContent, MainContentLayout, MainHeader, MainSidebar, MainSidebarProvider, MainSidebarTrigger, MarkdownRenderer, MastraIcon, McpCoinIcon, McpServerIcon, MemoryIcon, MetricsCard, MetricsDataTable, MetricsFlexGrid, MetricsKpiCard, MetricsLineChart, MetricsLineChartTooltip, MistralIcon, MultiColumn, MultiCombobox, NestedFields, NetlifyIcon, NoDataPageLayout, Notice, Notification, OPERATORS, OPERATOR_LABELS, OpenAIIcon, OpenaiChatIcon, PageHeader, PageLayout, PanelSeparator, PermissionDenied, Popover, PopoverContent, PopoverTrigger, PrevNextNav, ProcessStepList, ProcessStepListItem, ProcessStepProgressBar, ProcessorIcon, PromptIcon, RadioGroup, RadioGroupItem, RepoIcon, Root$1 as Root, Row, RuleBuilder, RuleFieldSelect, RuleOperatorSelect, RuleRow, RuleValueInput, ScrollArea, ScrollBar, ScrollableContainer, SearchFieldBlock, Searchbar, SearchbarWrapper, Section, SectionRoot, Sections, Select, SelectContent, SelectDataFilter, SelectField, SelectFieldBlock, SelectGroup, SelectItem, SelectTrigger, SelectValue, SessionExpired, SettingsIcon, Shadows, SideDialog, Sizes, Skeleton, SkillIcon, SlashIcon, Slider, Spacings, Spinner, StatusBadge, SubSectionRoot, Switch, Tab, TabContent, TabList, Table, Tabs, Tbody, TextAndIcon, TextFieldBlock, Textarea, Th, Thead, ThreadDeleteButton, ThreadItem, ThreadLink, ThreadList, Threads, TimePicker, ToolCoinIcon, ToolsIcon, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TraceIcon, TracesDataList, Tree, Truncate, TsIcon, Txt, TxtCell, VARIABLE_PATTERN, VariablesIcon, WorkflowCoinIcon, WorkflowIcon, XGroqIcon, buttonVariants, cn, comboboxStyles, countLeafRules, createDefaultRule, createDefaultRuleGroup, createField, createVariableAutocomplete, fieldsToJSONSchema, fileToBase64, flattenSchemaToVariables, focusRing, formElementFocus, formElementFocusWithin, formElementRadius, formElementSizes, formElementTransition, formatJSON, generateDefaultValues, getChildFieldOptions, getColumnTemplate, getFieldOptionAtPath, getFieldOptionsFromSchema, getFileContentType, getItemListColumnTemplate, getMainContentContentClassName, getShortId$1 as getShortId, getStatusIcon, getToNextEntryFn, getToNextItemFn, getToPreviousEntryFn, getToPreviousItemFn, highlight, hoverEffects, inputVariants, is401UnauthorizedError, is403ForbiddenError, isNonRetryableError, isObjectEmpty, isRule, isRuleGroup, isValidJson, jsonSchemaToFields, lodashTitleCase, parseError, parseFieldPath, sharedFormElementDisabledStyle, sharedFormElementFocusStyle, sharedFormElementStyle, shouldRetryQuery, stringToColor, textareaVariants, toSigFigs, toast, transitions, truncateString, useAutoscroll, useCodemirrorTheme$3 as useCodemirrorTheme, useCopyToClipboard, useInView, useIsDarkMode, useJSONSchemaForm, useJSONSchemaFormField, useJSONSchemaFormNestedContext, useMainSidebar, useMaybeSidebar, usePlaygroundStore, useTableKeyboardNavigation, variableHighlight };
14204
+ export { AddField, AgentCoinIcon, AgentIcon, AgentNetworkCoinIcon, AiIcon, Alert, AlertDescription, AlertDialog, AlertTitle, AmazonIcon, AnthropicChatIcon, AnthropicMessagesIcon, ApiIcon, Avatar, AzureIcon, Badge, BorderColors, BorderRadius, BranchIcon, BrandLoader, Breadcrumb, Button, ButtonWithTooltip, ButtonsGroup, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Cell, CheckIcon, Checkbox, ChevronIcon, Chip, ChipsGroup, CodeDiff, CodeEditor, CohereIcon, Collapsible, CollapsibleContent, CollapsiblePanel, CollapsibleTrigger, Colors, Column, Columns, CombinedButtons, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, CommitIcon, ContentBlock, ContentBlocks, CopyButton, CrossIcon, Crumb, DashboardCard, DataCodeSection, DataDetailsPanel, DataKeysAndValues, DataList, DataListSkeleton, DataPanel, DatePicker, DateTimeCell, DateTimePicker, DateTimePickerContent, DateTimeRangePicker, DbIcon, DebugIcon, DefaultTrigger, DeploymentIcon, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DividerIcon, DocsIcon, DropdownMenu, EXTENSION_TO_MIME, ElementSelect, EmptyState, Entity, EntityContent, EntityDescription, EntityHeader, EntityIcon, EntityList, EntityListPageLayout, EntityListSkeleton, EntityName, Entry, EntryCell, EntryList, EntryListSkeleton, EnvIcon, ErrorState, Field, FieldBlock, FieldBlocksLayout, FieldDescription, FieldList, FieldName, FieldNullable, FieldOptional, FieldRemove, FieldType, FiltersIcon, FolderIcon, FontSizes, GithubCoinIcon, GithubIcon, Glows, GoogleIcon, GroqIcon, Header$1 as Header, HeaderAction, HeaderGroup, HeaderTitle, HomeIcon, HorizontalBars, HoverPopover, Icon, IconButton, InfoIcon, Input, ItemList, ItemListSkeleton, JSONSchemaForm, JudgeIcon, Kbd, KeyValueList, Label, LatencyIcon, LineHeights, ListSearch, Logo, LogoWithoutText, LogsDataList, DataListSkeleton as LogsDataListSkeleton, LogsIcon, MainContentContent, MainContentLayout, MainHeader, MainSidebar, MainSidebarProvider, MainSidebarTrigger, MarkdownRenderer, MastraIcon, McpCoinIcon, McpServerIcon, MemoryIcon, MetricsCard, MetricsDataTable, MetricsFlexGrid, MetricsKpiCard, MetricsLineChart, MetricsLineChartTooltip, MistralIcon, MultiColumn, MultiCombobox, NestedFields, NetlifyIcon, NoDataPageLayout, Notice, Notification, OPERATORS, OPERATOR_LABELS, OpenAIIcon, OpenaiChatIcon, PageHeader, PageLayout, PanelSeparator, PermissionDenied, Popover, PopoverContent, PopoverTrigger, PrevNextNav, ProcessStepList, ProcessStepListItem, ProcessStepProgressBar, ProcessorIcon, PromptIcon, RadioGroup, RadioGroupItem, RepoIcon, Root$1 as Root, Row, RuleBuilder, RuleFieldSelect, RuleOperatorSelect, RuleRow, RuleValueInput, ScoresDataList, ScrollArea, ScrollBar, ScrollableContainer, SearchFieldBlock, Searchbar, SearchbarWrapper, Section, SectionRoot, Sections, Select, SelectContent, SelectDataFilter, SelectField, SelectFieldBlock, SelectGroup, SelectItem, SelectTrigger, SelectValue, SessionExpired, SettingsIcon, Shadows, SideDialog, Sizes, Skeleton, SkillIcon, SlashIcon, Slider, Spacings, Spinner, StatusBadge, SubSectionRoot, Switch, Tab, TabContent, TabList, Table, Tabs, Tbody, TextAndIcon, TextFieldBlock, Textarea, Th, Thead, ThreadDeleteButton, ThreadItem, ThreadLink, ThreadList, Threads, TimePicker, ToolCoinIcon, ToolsIcon, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TraceIcon, TracesDataList, Tree, Truncate, TsIcon, Txt, TxtCell, VARIABLE_PATTERN, VariablesIcon, WorkflowCoinIcon, WorkflowIcon, XGroqIcon, buttonVariants, cn, comboboxStyles, countLeafRules, createDefaultRule, createDefaultRuleGroup, createField, createVariableAutocomplete, fieldsToJSONSchema, fileToBase64, flattenSchemaToVariables, focusRing, formElementFocus, formElementFocusWithin, formElementRadius, formElementSizes, formElementTransition, formatJSON, generateDefaultValues, getChildFieldOptions, getColumnTemplate, getFieldOptionAtPath, getFieldOptionsFromSchema, getFileContentType, getItemListColumnTemplate, getMainContentContentClassName, getShortId$1 as getShortId, getStatusIcon, getToNextEntryFn, getToNextItemFn, getToPreviousEntryFn, getToPreviousItemFn, highlight, hoverEffects, inputVariants, is401UnauthorizedError, is403ForbiddenError, isNonRetryableError, isObjectEmpty, isRule, isRuleGroup, isValidJson, jsonSchemaToFields, lodashTitleCase, parseError, parseFieldPath, sharedFormElementDisabledStyle, sharedFormElementFocusStyle, sharedFormElementStyle, shouldRetryQuery, stringToColor, textareaVariants, toSigFigs, toast, transitions, truncateString, useAutoscroll, useCodemirrorTheme$3 as useCodemirrorTheme, useCopyToClipboard, useInView, useIsDarkMode, useJSONSchemaForm, useJSONSchemaFormField, useJSONSchemaFormNestedContext, useMainSidebar, useMaybeSidebar, usePlaygroundStore, useTableKeyboardNavigation, variableHighlight };
14067
14205
  //# sourceMappingURL=index.es.js.map