@mastra/playground-ui 55.0.0 → 56.0.0-alpha.5

package/dist/tool-call-DEtotEm0.cjs

@@ -0,0 +1,196 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const React = require('react');
+const useWatched = require('./use-watched-BixmYWp0.cjs');
+const collapsible = require('./collapsible-T4jTNOOE.cjs');
+const copyButton = require('./copy-button-Clv2tQeH.cjs');
+const shimmer = require('./shimmer-erjPu8YL.cjs');
+const Txt = require('./Txt-BZXvaPLR.cjs');
+const utils_cn = require('./cn-DPfV6E6L.cjs');
+
+const ToolCallContext = React.createContext(void 0);
+const noopOpenChange = () => {
+};
+function useToolCall() {
+  const context = React.useContext(ToolCallContext);
+  if (!context) throw new Error("ToolCall compounds must be rendered within ToolCall");
+  return context;
+}
+function ToolCall({
+  open: controlledOpen,
+  defaultOpen = false,
+  onOpenChange = noopOpenChange,
+  status = "idle",
+  className,
+  children,
+  ...props
+}) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);
+  const open = controlledOpen ?? uncontrolledOpen;
+  const statusId = React.useId();
+  const handleOpenChange = (nextOpen) => {
+    if (controlledOpen === void 0) setUncontrolledOpen(nextOpen);
+    onOpenChange(nextOpen);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(ToolCallContext.Provider, { value: { open, status }, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    collapsible.Collapsible,
+    {
+      open,
+      onOpenChange: handleOpenChange,
+      className: utils_cn.cn("max-w-full min-w-0", className),
+      role: "group",
+      "aria-busy": status === "running",
+      "aria-invalid": status === "error" || void 0,
+      "aria-describedby": status === "idle" ? void 0 : statusId,
+      "data-status": status,
+      ...props,
+      children: [
+        children,
+        status !== "idle" && /* @__PURE__ */ jsxRuntime.jsx("span", { id: statusId, className: "sr-only", children: status === "running" ? "Tool call running" : "Tool call failed" })
+      ]
+    }
+  ) });
+}
+const ToolCallTrigger = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
+  collapsible.CollapsibleTrigger,
+  {
+    className: utils_cn.cn(
+      "group/row w-full cursor-pointer rounded-md text-left transition-colors hover:bg-neutral6/5 focus-visible:ring-1 focus-visible:ring-accent1 focus-visible:outline-hidden motion-reduce:transition-none",
+      className
+    ),
+    ...props
+  }
+);
+const ToolCallHeader = ({ className, children, ...props }) => {
+  const { status } = useToolCall();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    shimmer.Shimmer,
+    {
+      active: status === "running",
+      className: utils_cn.cn("flex w-full min-w-0 items-center gap-2 px-1.5 py-1", className),
+      ...props,
+      children
+    }
+  );
+};
+const ToolCallIcon = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("flex size-4 shrink-0 items-center justify-center", className), ...props });
+const ToolCallLabel = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "span", variant: "ui-sm", className: utils_cn.cn("text-icon3 max-w-[55%] shrink-0 truncate", className), ...props });
+const ToolCallDetail = ({ className, ...props }) => {
+  const arriving = useWatched.useArriving();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Txt.Txt,
+    {
+      as: "span",
+      variant: "ui-xs",
+      font: "mono",
+      className: utils_cn.cn("text-icon3 min-w-0 truncate", arriving, className),
+      ...props
+    }
+  );
+};
+const ToolCallSummary = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("flex min-w-0 items-center gap-1", className), ...props });
+const ToolCallSpacer = ({ rule, className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
+  "span",
+  {
+    "aria-hidden": true,
+    className: utils_cn.cn("min-w-2 flex-1", rule && "h-px bg-border1 mask-r-from-[calc(100%-min(100%,160px))]", className),
+    ...props
+  }
+);
+const ToolCallTrailing = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("flex shrink-0 items-center", className), ...props });
+const ToolCallDisclosure = ({ className, children, ...props }) => {
+  const { open } = useToolCall();
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("flex size-4 shrink-0 items-center justify-center", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      "aria-hidden": true,
+      className: utils_cn.cn(
+        "text-icon3 flex shrink-0 items-center opacity-0 transition duration-150 motion-reduce:transition-none",
+        "group-hover/row:opacity-100 group-focus-visible/row:opacity-100",
+        open && "rotate-90 opacity-100"
+      ),
+      children: children ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { size: 13 })
+    }
+  ) });
+};
+const ToolCallPresentedHeader = ({
+  leading,
+  icon: Icon,
+  label,
+  detail,
+  disclosure = true,
+  ...props
+}) => {
+  const { status } = useToolCall();
+  return /* @__PURE__ */ jsxRuntime.jsxs(ToolCallHeader, { ...props, children: [
+    leading,
+    /* @__PURE__ */ jsxRuntime.jsx(ToolCallIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      Icon,
+      {
+        size: 14,
+        strokeWidth: 1.75,
+        "aria-hidden": true,
+        className: status === "error" ? "text-error/80" : "text-icon2"
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ToolCallLabel, { children: label }),
+    detail && /* @__PURE__ */ jsxRuntime.jsx(ToolCallDetail, { children: detail }),
+    /* @__PURE__ */ jsxRuntime.jsx(ToolCallSpacer, {}),
+    status === "error" && /* @__PURE__ */ jsxRuntime.jsx(ToolCallTrailing, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 13, role: "img", "aria-label": "Failed", className: "text-error shrink-0" }) }),
+    disclosure && /* @__PURE__ */ jsxRuntime.jsx(ToolCallDisclosure, {})
+  ] });
+};
+const ToolCallContent = ({ className, children, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(collapsible.CollapsibleContent, { className: "max-w-full min-w-0", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    className: utils_cn.cn(
+      "relative ml-[14px] flex max-w-full min-w-0 flex-col gap-1.5 py-1.5 pr-1 pl-4 before:absolute before:inset-y-0 before:left-0 before:w-px before:bg-border1 before:mask-b-from-[calc(100%-min(40%,80px))] before:content-['']",
+      className
+    ),
+    children
+  }
+) });
+const ToolCallMono = ({ copyText, className, children, ...props }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/block relative max-w-full min-w-0", children: [
+  /* @__PURE__ */ jsxRuntime.jsx(
+    "pre",
+    {
+      className: utils_cn.cn(
+        "m-0 max-h-60 max-w-full overflow-auto rounded-md bg-neutral6/5 px-3 py-2 font-mono text-ui-sm break-words whitespace-pre-wrap",
+        className
+      ),
+      ...props,
+      children
+    }
+  ),
+  /* @__PURE__ */ jsxRuntime.jsx(
+    copyButton.CopyButton,
+    {
+      content: copyText,
+      size: "sm",
+      variant: "ghost",
+      className: "absolute top-1 right-1 opacity-0 transition-opacity group-hover/block:opacity-100 focus-visible:opacity-100"
+    }
+  )
+] });
+const ToolCallCommand = ({ command }) => /* @__PURE__ */ jsxRuntime.jsxs(ToolCallMono, { copyText: command, className: "text-icon5", children: [
+  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-icon3 select-none", children: "$ " }),
+  command
+] });
+
+exports.ToolCall = ToolCall;
+exports.ToolCallCommand = ToolCallCommand;
+exports.ToolCallContent = ToolCallContent;
+exports.ToolCallDetail = ToolCallDetail;
+exports.ToolCallDisclosure = ToolCallDisclosure;
+exports.ToolCallHeader = ToolCallHeader;
+exports.ToolCallIcon = ToolCallIcon;
+exports.ToolCallLabel = ToolCallLabel;
+exports.ToolCallMono = ToolCallMono;
+exports.ToolCallPresentedHeader = ToolCallPresentedHeader;
+exports.ToolCallSpacer = ToolCallSpacer;
+exports.ToolCallSummary = ToolCallSummary;
+exports.ToolCallTrailing = ToolCallTrailing;
+exports.ToolCallTrigger = ToolCallTrigger;
+//# sourceMappingURL=tool-call-DEtotEm0.cjs.map

package/dist/tool-call-DEtotEm0.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tool-call-DEtotEm0.cjs","sources":["../src/ds/components/ai/tool-call/tool-call.tsx"],"sourcesContent":["import { ChevronRight, X } from 'lucide-react';\nimport type { LucideIcon } from 'lucide-react';\nimport { createContext, useContext, useId, useState } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useArriving } from '@/ds/components/Arrival';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { CopyButton } from '@/ds/components/CopyButton';\nimport { Shimmer } from '@/ds/components/Shimmer';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\ntype ToolCallStatus = 'idle' | 'running' | 'error';\n\ninterface ToolCallContextValue {\n  open: boolean;\n  status: ToolCallStatus;\n}\n\nconst ToolCallContext = createContext<ToolCallContextValue | undefined>(undefined);\n\n// Stryker disable next-line ArrowFunction: the default callback is intentionally behaviorless.\nconst noopOpenChange = () => {};\n\nfunction useToolCall() {\n  const context = useContext(ToolCallContext);\n  if (!context) throw new Error('ToolCall compounds must be rendered within ToolCall');\n  return context;\n}\n\nexport interface ToolCallProps extends Omit<\n  ComponentProps<typeof Collapsible>,\n  'defaultOpen' | 'onOpenChange' | 'open'\n> {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  status?: ToolCallStatus;\n}\n\nexport function ToolCall({\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange = noopOpenChange,\n  status = 'idle',\n  className,\n  children,\n  ...props\n}: ToolCallProps) {\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n  const open = controlledOpen ?? uncontrolledOpen;\n  const statusId = useId();\n\n  const handleOpenChange = (nextOpen: boolean) => {\n    if (controlledOpen === undefined) setUncontrolledOpen(nextOpen);\n    onOpenChange(nextOpen);\n  };\n\n  return (\n    <ToolCallContext.Provider value={{ open, status }}>\n      <Collapsible\n        open={open}\n        onOpenChange={handleOpenChange}\n        className={cn('max-w-full min-w-0', className)}\n        role=\"group\"\n        aria-busy={status === 'running'}\n        aria-invalid={status === 'error' || undefined}\n        aria-describedby={status === 'idle' ? undefined : statusId}\n        data-status={status}\n        {...props}\n      >\n        {children}\n        {status !== 'idle' && (\n          <span id={statusId} className=\"sr-only\">\n            {status === 'running' ? 'Tool call running' : 'Tool call failed'}\n          </span>\n        )}\n      </Collapsible>\n    </ToolCallContext.Provider>\n  );\n}\n\nexport const ToolCallTrigger = ({ className, ...props }: ComponentProps<typeof CollapsibleTrigger>) => (\n  <CollapsibleTrigger\n    className={cn(\n      'group/row w-full cursor-pointer rounded-md text-left transition-colors hover:bg-neutral6/5 focus-visible:ring-1 focus-visible:ring-accent1 focus-visible:outline-hidden motion-reduce:transition-none',\n      className,\n    )}\n    {...props}\n  />\n);\n\nexport const ToolCallHeader = ({ className, children, ...props }: ComponentProps<'span'>) => {\n  const { status } = useToolCall();\n\n  return (\n    <Shimmer\n      active={status === 'running'}\n      className={cn('flex w-full min-w-0 items-center gap-2 px-1.5 py-1', className)}\n      {...props}\n    >\n      {children}\n    </Shimmer>\n  );\n};\n\nexport const ToolCallIcon = ({ className, ...props }: ComponentProps<'span'>) => (\n  <span className={cn('flex size-4 shrink-0 items-center justify-center', className)} {...props} />\n);\n\nexport const ToolCallLabel = ({ className, ...props }: ComponentProps<typeof Txt>) => (\n  <Txt as=\"span\" variant=\"ui-sm\" className={cn('text-icon3 max-w-[55%] shrink-0 truncate', className)} {...props} />\n);\n\nexport const ToolCallDetail = ({ className, ...props }: ComponentProps<typeof Txt>) => {\n  const arriving = useArriving();\n\n  return (\n    <Txt\n      as=\"span\"\n      variant=\"ui-xs\"\n      font=\"mono\"\n      className={cn('text-icon3 min-w-0 truncate', arriving, className)}\n      {...props}\n    />\n  );\n};\n\nexport const ToolCallSummary = ({ className, ...props }: ComponentProps<'span'>) => (\n  <span className={cn('flex min-w-0 items-center gap-1', className)} {...props} />\n);\n\nexport interface ToolCallSpacerProps extends ComponentProps<'span'> {\n  rule?: boolean;\n}\n\nexport const ToolCallSpacer = ({ rule, className, ...props }: ToolCallSpacerProps) => (\n  <span\n    aria-hidden\n    className={cn('min-w-2 flex-1', rule && 'h-px bg-border1 mask-r-from-[calc(100%-min(100%,160px))]', className)}\n    {...props}\n  />\n);\n\nexport const ToolCallTrailing = ({ className, ...props }: ComponentProps<'span'>) => (\n  <span className={cn('flex shrink-0 items-center', className)} {...props} />\n);\n\nexport const ToolCallDisclosure = ({ className, children, ...props }: ComponentProps<'span'>) => {\n  const { open } = useToolCall();\n\n  return (\n    <span className={cn('flex size-4 shrink-0 items-center justify-center', className)} {...props}>\n      <span\n        aria-hidden\n        className={cn(\n          'text-icon3 flex shrink-0 items-center opacity-0 transition duration-150 motion-reduce:transition-none',\n          'group-hover/row:opacity-100 group-focus-visible/row:opacity-100',\n          open && 'rotate-90 opacity-100',\n        )}\n      >\n        {children ?? <ChevronRight size={13} />}\n      </span>\n    </span>\n  );\n};\n\nexport interface ToolCallPresentedHeaderProps extends Omit<ComponentProps<typeof ToolCallHeader>, 'children'> {\n  /** Rendered ahead of the icon, e.g. a timestamp. */\n  leading?: ReactNode;\n  icon: LucideIcon;\n  label: string;\n  detail?: string;\n  disclosure?: boolean;\n}\n\n/** The canonical header of a presented tool call: icon, label, detail, failure mark, chevron. */\nexport const ToolCallPresentedHeader = ({\n  leading,\n  icon: Icon,\n  label,\n  detail,\n  disclosure = true,\n  ...props\n}: ToolCallPresentedHeaderProps) => {\n  const { status } = useToolCall();\n\n  return (\n    <ToolCallHeader {...props}>\n      {leading}\n      <ToolCallIcon>\n        <Icon\n          size={14}\n          strokeWidth={1.75}\n          aria-hidden\n          className={status === 'error' ? 'text-error/80' : 'text-icon2'}\n        />\n      </ToolCallIcon>\n      <ToolCallLabel>{label}</ToolCallLabel>\n      {detail && <ToolCallDetail>{detail}</ToolCallDetail>}\n      <ToolCallSpacer />\n      {status === 'error' && (\n        <ToolCallTrailing>\n          <X size={13} role=\"img\" aria-label=\"Failed\" className=\"text-error shrink-0\" />\n        </ToolCallTrailing>\n      )}\n      {disclosure && <ToolCallDisclosure />}\n    </ToolCallHeader>\n  );\n};\n\nexport const ToolCallContent = ({ className, children, ...props }: ComponentProps<typeof CollapsibleContent>) => (\n  <CollapsibleContent className=\"max-w-full min-w-0\" {...props}>\n    <div\n      className={cn(\n        \"relative ml-[14px] flex max-w-full min-w-0 flex-col gap-1.5 py-1.5 pr-1 pl-4 before:absolute before:inset-y-0 before:left-0 before:w-px before:bg-border1 before:mask-b-from-[calc(100%-min(40%,80px))] before:content-['']\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  </CollapsibleContent>\n);\n\nexport interface ToolCallMonoProps extends ComponentProps<'pre'> {\n  copyText: string;\n}\n\n/** Monospace body block of an expanded call — arguments, command, output — with a hover copy. */\nexport const ToolCallMono = ({ copyText, className, children, ...props }: ToolCallMonoProps) => (\n  <div className=\"group/block relative max-w-full min-w-0\">\n    <pre\n      className={cn(\n        'm-0 max-h-60 max-w-full overflow-auto rounded-md bg-neutral6/5 px-3 py-2 font-mono text-ui-sm break-words whitespace-pre-wrap',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </pre>\n    <CopyButton\n      content={copyText}\n      size=\"sm\"\n      variant=\"ghost\"\n      className=\"absolute top-1 right-1 opacity-0 transition-opacity group-hover/block:opacity-100 focus-visible:opacity-100\"\n    />\n  </div>\n);\n\n/** A shell command as the body shows it: `$` in the margin, the copy takes the command alone. */\nexport const ToolCallCommand = ({ command }: { command: string }) => (\n  <ToolCallMono copyText={command} className=\"text-icon5\">\n    <span className=\"text-icon3 select-none\">$ </span>\n    {command}\n  </ToolCallMono>\n);\n\nexport type { ToolCallStatus };\n"],"names":["createContext","useContext","useState","useId","jsx","jsxs","Collapsible","cn","CollapsibleTrigger","Shimmer","Txt","useArriving","ChevronRight","X","CollapsibleContent","CopyButton"],"mappings":"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"}

package/dist/tooltip-D1PLTHDf.js

@@ -0,0 +1,112 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
+import * as React from 'react';
+import { FLOATING_POSITION_METHOD } from './primitives/floating.es.js';
+import { c as cn } from './cn-Dxjsbr9n.js';
+
+import './tooltip.css';function TooltipProvider({ delay, delayDuration, timeout, skipDelayDuration, ...props }) {
+  const resolvedDelay = delay ?? delayDuration;
+  const resolvedTimeout = timeout ?? skipDelayDuration;
+  return /* @__PURE__ */ jsx(
+    Tooltip$1.Provider,
+    {
+      ...resolvedDelay !== void 0 ? { delay: resolvedDelay } : {},
+      ...resolvedTimeout !== void 0 ? { timeout: resolvedTimeout } : {},
+      ...props
+    }
+  );
+}
+const Tooltip = Tooltip$1.Root;
+const TooltipTrigger = React.forwardRef(
+  ({ asChild, render, children, ...props }, ref) => {
+    if (asChild && React.isValidElement(children)) {
+      return /* @__PURE__ */ jsx(Tooltip$1.Trigger, { ref, render: children, ...props });
+    }
+    return /* @__PURE__ */ jsx(Tooltip$1.Trigger, { ref, render, ...props, children });
+  }
+);
+TooltipTrigger.displayName = "TooltipTrigger";
+const TooltipContent = React.forwardRef(
+  ({
+    className,
+    side = "top",
+    sideOffset = 8,
+    align = "center",
+    alignOffset = 0,
+    arrowPadding = 10,
+    anchor,
+    positionMethod = FLOATING_POSITION_METHOD,
+    collisionBoundary,
+    collisionPadding,
+    sticky,
+    disableAnchorTracking,
+    collisionAvoidance,
+    children,
+    ...props
+  }, ref) => {
+    const positionerProps = {
+      side,
+      sideOffset,
+      align,
+      alignOffset,
+      arrowPadding,
+      anchor,
+      positionMethod,
+      collisionBoundary,
+      collisionPadding,
+      sticky,
+      disableAnchorTracking,
+      collisionAvoidance
+    };
+    return /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsx(Tooltip$1.Positioner, { className: "isolate z-100", ...positionerProps, children: /* @__PURE__ */ jsxs(
+      Tooltip$1.Popup,
+      {
+        ref,
+        role: "tooltip",
+        className: cn(
+          "new-theme relative z-100 flex origin-(--transform-origin) flex-col rounded-lg border border-border bg-popover px-2.5 py-1.5 text-ui-sm leading-ui-sm text-foreground shadow-dialog transition-[transform,scale,opacity] duration-150",
+          "data-[starting-style]:scale-95 data-[starting-style]:opacity-0",
+          "data-[ending-style]:scale-95 data-[ending-style]:opacity-0",
+          "data-[instant]:transition-none motion-reduce:transition-none",
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          /* @__PURE__ */ jsx(
+            Tooltip$1.Arrow,
+            {
+              className: cn(
+                "flex",
+                "data-[side=top]:-bottom-2 data-[side=top]:rotate-180",
+                "data-[side=bottom]:-top-2",
+                "data-[side=left]:right-[-10px] data-[side=left]:rotate-90",
+                "data-[side=right]:left-[-10px] data-[side=right]:-rotate-90"
+              ),
+              children: /* @__PURE__ */ jsx(TooltipArrowSvg, {})
+            }
+          )
+        ]
+      }
+    ) }) });
+  }
+);
+TooltipContent.displayName = "TooltipContent";
+function TooltipArrowSvg() {
+  return /* @__PURE__ */ jsxs("svg", { width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", overflow: "visible", children: [
+    /* @__PURE__ */ jsx("path", { d: "M0 7L4 2Q6 0 8 2L12 7L12 8L0 8Z", className: "fill-popover" }),
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: "M0 7.5L4 2.5Q6 0.5 8 2.5L12 7.5",
+        className: "stroke-border fill-none",
+        strokeWidth: "1",
+        strokeLinejoin: "round",
+        strokeLinecap: "round"
+      }
+    )
+  ] });
+}
+
+export { Tooltip as T, TooltipContent as a, TooltipProvider as b, TooltipTrigger as c };
+//# sourceMappingURL=tooltip-D1PLTHDf.js.map

package/dist/tooltip-D1PLTHDf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-D1PLTHDf.js","sources":["../src/ds/components/Tooltip/tooltip.tsx"],"sourcesContent":["'use client';\n\nimport '../../../../new-theme.css';\nimport { Tooltip as TooltipPrimitive } from '@base-ui/react/tooltip';\nimport type { TooltipPopupProps, TooltipPositionerProps } from '@base-ui/react/tooltip';\nimport * as React from 'react';\n\nimport { FLOATING_POSITION_METHOD } from '@/ds/primitives/floating';\nimport { cn } from '@/lib/utils';\n\ntype TooltipProviderProps = Omit<TooltipPrimitive.Provider.Props, 'delay' | 'timeout'> & {\n  delay?: number;\n  timeout?: number;\n  /** Radix API compatibility alias for `delay`. */\n  delayDuration?: number;\n  /** Radix API compatibility alias for `timeout`. */\n  skipDelayDuration?: number;\n};\n\nfunction TooltipProvider({ delay, delayDuration, timeout, skipDelayDuration, ...props }: TooltipProviderProps) {\n  const resolvedDelay = delay ?? delayDuration;\n  const resolvedTimeout = timeout ?? skipDelayDuration;\n  return (\n    <TooltipPrimitive.Provider\n      {...(resolvedDelay !== undefined ? { delay: resolvedDelay } : {})}\n      {...(resolvedTimeout !== undefined ? { timeout: resolvedTimeout } : {})}\n      {...props}\n    />\n  );\n}\n\nconst Tooltip = TooltipPrimitive.Root;\n\ntype TooltipTriggerProps = TooltipPrimitive.Trigger.Props & {\n  /** @deprecated Use Base UI's native `render` prop instead for stronger composition typing. */\n  asChild?: boolean;\n};\n\nconst TooltipTrigger = React.forwardRef<HTMLButtonElement, TooltipTriggerProps>(\n  ({ asChild, render, children, ...props }, ref) => {\n    if (asChild && React.isValidElement(children)) {\n      return <TooltipPrimitive.Trigger ref={ref} render={children} {...props} />;\n    }\n    return (\n      <TooltipPrimitive.Trigger ref={ref} render={render} {...props}>\n        {children}\n      </TooltipPrimitive.Trigger>\n    );\n  },\n);\nTooltipTrigger.displayName = 'TooltipTrigger';\n\ntype TooltipContentPositionerProps = Omit<TooltipPositionerProps, keyof TooltipPopupProps>;\n\ntype TooltipContentProps = TooltipPopupProps & TooltipContentPositionerProps;\n\nconst TooltipContent = React.forwardRef<HTMLDivElement, TooltipContentProps>(\n  (\n    {\n      className,\n      side = 'top',\n      sideOffset = 8,\n      align = 'center',\n      alignOffset = 0,\n      arrowPadding = 10,\n      anchor,\n      positionMethod = FLOATING_POSITION_METHOD,\n      collisionBoundary,\n      collisionPadding,\n      sticky,\n      disableAnchorTracking,\n      collisionAvoidance,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const positionerProps: TooltipContentPositionerProps = {\n      side,\n      sideOffset,\n      align,\n      alignOffset,\n      arrowPadding,\n      anchor,\n      positionMethod,\n      collisionBoundary,\n      collisionPadding,\n      sticky,\n      disableAnchorTracking,\n      collisionAvoidance,\n    };\n\n    return (\n      <TooltipPrimitive.Portal>\n        <TooltipPrimitive.Positioner className=\"isolate z-100\" {...positionerProps}>\n          <TooltipPrimitive.Popup\n            ref={ref}\n            // Base UI omits the tooltip role queried by existing consumers.\n            role=\"tooltip\"\n            className={cn(\n              'new-theme relative z-100 flex origin-(--transform-origin) flex-col rounded-lg border border-border bg-popover px-2.5 py-1.5 text-ui-sm leading-ui-sm text-foreground shadow-dialog transition-[transform,scale,opacity] duration-150',\n              'data-[starting-style]:scale-95 data-[starting-style]:opacity-0',\n              'data-[ending-style]:scale-95 data-[ending-style]:opacity-0',\n              'data-[instant]:transition-none motion-reduce:transition-none',\n              className,\n            )}\n            {...props}\n          >\n            {children}\n            <TooltipPrimitive.Arrow\n              className={cn(\n                'flex',\n                'data-[side=top]:-bottom-2 data-[side=top]:rotate-180',\n                'data-[side=bottom]:-top-2',\n                'data-[side=left]:right-[-10px] data-[side=left]:rotate-90',\n                'data-[side=right]:left-[-10px] data-[side=right]:-rotate-90',\n              )}\n            >\n              <TooltipArrowSvg />\n            </TooltipPrimitive.Arrow>\n          </TooltipPrimitive.Popup>\n        </TooltipPrimitive.Positioner>\n      </TooltipPrimitive.Portal>\n    );\n  },\n);\nTooltipContent.displayName = 'TooltipContent';\n\n// Stroke endpoints meet the popup border without overlapping its edge.\nfunction TooltipArrowSvg() {\n  return (\n    <svg width=\"12\" height=\"8\" viewBox=\"0 0 12 8\" fill=\"none\" overflow=\"visible\">\n      <path d=\"M0 7L4 2Q6 0 8 2L12 7L12 8L0 8Z\" className=\"fill-popover\" />\n      <path\n        d=\"M0 7.5L4 2.5Q6 0.5 8 2.5L12 7.5\"\n        className=\"stroke-border fill-none\"\n        strokeWidth=\"1\"\n        strokeLinejoin=\"round\"\n        strokeLinecap=\"round\"\n      />\n    </svg>\n  );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n"],"names":["TooltipPrimitive"],"mappings":";;;;;;AAmBA,SAAS,eAAA,CAAgB,EAAE,KAAA,EAAO,aAAA,EAAe,SAAS,iBAAA,EAAmB,GAAG,OAAM,EAAyB;AAC7G,EAAA,MAAM,gBAAgB,KAAA,IAAS,aAAA;AAC/B,EAAA,MAAM,kBAAkB,OAAA,IAAW,iBAAA;AACnC,EAAA,uBACE,GAAA;AAAA,IAACA,SAAA,CAAiB,QAAA;AAAA,IAAjB;AAAA,MACE,GAAI,aAAA,KAAkB,MAAA,GAAY,EAAE,KAAA,EAAO,aAAA,KAAkB,EAAC;AAAA,MAC9D,GAAI,eAAA,KAAoB,MAAA,GAAY,EAAE,OAAA,EAAS,eAAA,KAAoB,EAAC;AAAA,MACpE,GAAG;AAAA;AAAA,GACN;AAEJ;AAEA,MAAM,UAAUA,SAAA,CAAiB;AAOjC,MAAM,iBAAiB,KAAA,CAAM,UAAA;AAAA,EAC3B,CAAC,EAAE,OAAA,EAAS,MAAA,EAAQ,UAAU,GAAG,KAAA,IAAS,GAAA,KAAQ;AAChD,IAAA,IAAI,OAAA,IAAW,KAAA,CAAM,cAAA,CAAe,QAAQ,CAAA,EAAG;AAC7C,MAAA,uBAAO,GAAA,CAACA,UAAiB,OAAA,EAAjB,EAAyB,KAAU,MAAA,EAAQ,QAAA,EAAW,GAAG,KAAA,EAAO,CAAA;AAAA,IAC1E;AACA,IAAA,uBACE,GAAA,CAACA,UAAiB,OAAA,EAAjB,EAAyB,KAAU,MAAA,EAAiB,GAAG,OACrD,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;AACA,cAAA,CAAe,WAAA,GAAc,gBAAA;AAM7B,MAAM,iBAAiB,KAAA,CAAM,UAAA;AAAA,EAC3B,CACE;AAAA,IACE,SAAA;AAAA,IACA,IAAA,GAAO,KAAA;AAAA,IACP,UAAA,GAAa,CAAA;AAAA,IACb,KAAA,GAAQ,QAAA;AAAA,IACR,WAAA,GAAc,CAAA;AAAA,IACd,YAAA,GAAe,EAAA;AAAA,IACf,MAAA;AAAA,IACA,cAAA,GAAiB,wBAAA;AAAA,IACjB,iBAAA;AAAA,IACA,gBAAA;AAAA,IACA,MAAA;AAAA,IACA,qBAAA;AAAA,IACA,kBAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,MAAM,eAAA,GAAiD;AAAA,MACrD,IAAA;AAAA,MACA,UAAA;AAAA,MACA,KAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,cAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,qBAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,uBACE,GAAA,CAACA,SAAA,CAAiB,MAAA,EAAjB,EACC,QAAA,kBAAA,GAAA,CAACA,SAAA,CAAiB,UAAA,EAAjB,EAA4B,SAAA,EAAU,eAAA,EAAiB,GAAG,eAAA,EACzD,QAAA,kBAAA,IAAA;AAAA,MAACA,SAAA,CAAiB,KAAA;AAAA,MAAjB;AAAA,QACC,GAAA;AAAA,QAEA,IAAA,EAAK,SAAA;AAAA,QACL,SAAA,EAAW,EAAA;AAAA,UACT,sOAAA;AAAA,UACA,gEAAA;AAAA,UACA,4DAAA;AAAA,UACA,8DAAA;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,QAAA;AAAA,0BACD,GAAA;AAAA,YAACA,SAAA,CAAiB,KAAA;AAAA,YAAjB;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,MAAA;AAAA,gBACA,sDAAA;AAAA,gBACA,2BAAA;AAAA,gBACA,2DAAA;AAAA,gBACA;AAAA,eACF;AAAA,cAEA,8BAAC,eAAA,EAAA,EAAgB;AAAA;AAAA;AACnB;AAAA;AAAA,OAEJ,CAAA,EACF,CAAA;AAAA,EAEJ;AACF;AACA,cAAA,CAAe,WAAA,GAAc,gBAAA;AAG7B,SAAS,eAAA,GAAkB;AACzB,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,IAAA,EAAK,MAAA,EAAO,GAAA,EAAI,OAAA,EAAQ,UAAA,EAAW,IAAA,EAAK,MAAA,EAAO,QAAA,EAAS,SAAA,EACjE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,iCAAA,EAAkC,SAAA,EAAU,cAAA,EAAe,CAAA;AAAA,oBACnE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAA,EAAE,iCAAA;AAAA,QACF,SAAA,EAAU,yBAAA;AAAA,QACV,WAAA,EAAY,GAAA;AAAA,QACZ,cAAA,EAAe,OAAA;AAAA,QACf,aAAA,EAAc;AAAA;AAAA;AAChB,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/tooltip-D9ylrXmx.cjs

@@ -0,0 +1,136 @@
+'use strict';
+
+require('./tooltip.css');const jsxRuntime = require('react/jsx-runtime');
+const tooltip = require('@base-ui/react/tooltip');
+const React = require('react');
+const primitives_floating = require('./primitives/floating.cjs.js');
+const utils_cn = require('./cn-DPfV6E6L.cjs');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+function TooltipProvider({ delay, delayDuration, timeout, skipDelayDuration, ...props }) {
+  const resolvedDelay = delay ?? delayDuration;
+  const resolvedTimeout = timeout ?? skipDelayDuration;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    tooltip.Tooltip.Provider,
+    {
+      ...resolvedDelay !== void 0 ? { delay: resolvedDelay } : {},
+      ...resolvedTimeout !== void 0 ? { timeout: resolvedTimeout } : {},
+      ...props
+    }
+  );
+}
+const Tooltip = tooltip.Tooltip.Root;
+const TooltipTrigger = React__namespace.forwardRef(
+  ({ asChild, render, children, ...props }, ref) => {
+    if (asChild && React__namespace.isValidElement(children)) {
+      return /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Trigger, { ref, render: children, ...props });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Trigger, { ref, render, ...props, children });
+  }
+);
+TooltipTrigger.displayName = "TooltipTrigger";
+const TooltipContent = React__namespace.forwardRef(
+  ({
+    className,
+    side = "top",
+    sideOffset = 8,
+    align = "center",
+    alignOffset = 0,
+    arrowPadding = 10,
+    anchor,
+    positionMethod = primitives_floating.FLOATING_POSITION_METHOD,
+    collisionBoundary,
+    collisionPadding,
+    sticky,
+    disableAnchorTracking,
+    collisionAvoidance,
+    children,
+    ...props
+  }, ref) => {
+    const positionerProps = {
+      side,
+      sideOffset,
+      align,
+      alignOffset,
+      arrowPadding,
+      anchor,
+      positionMethod,
+      collisionBoundary,
+      collisionPadding,
+      sticky,
+      disableAnchorTracking,
+      collisionAvoidance
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Positioner, { className: "isolate z-100", ...positionerProps, children: /* @__PURE__ */ jsxRuntime.jsxs(
+      tooltip.Tooltip.Popup,
+      {
+        ref,
+        role: "tooltip",
+        className: utils_cn.cn(
+          "new-theme relative z-100 flex origin-(--transform-origin) flex-col rounded-lg border border-border bg-popover px-2.5 py-1.5 text-ui-sm leading-ui-sm text-foreground shadow-dialog transition-[transform,scale,opacity] duration-150",
+          "data-[starting-style]:scale-95 data-[starting-style]:opacity-0",
+          "data-[ending-style]:scale-95 data-[ending-style]:opacity-0",
+          "data-[instant]:transition-none motion-reduce:transition-none",
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          /* @__PURE__ */ jsxRuntime.jsx(
+            tooltip.Tooltip.Arrow,
+            {
+              className: utils_cn.cn(
+                "flex",
+                "data-[side=top]:-bottom-2 data-[side=top]:rotate-180",
+                "data-[side=bottom]:-top-2",
+                "data-[side=left]:right-[-10px] data-[side=left]:rotate-90",
+                "data-[side=right]:left-[-10px] data-[side=right]:-rotate-90"
+              ),
+              children: /* @__PURE__ */ jsxRuntime.jsx(TooltipArrowSvg, {})
+            }
+          )
+        ]
+      }
+    ) }) });
+  }
+);
+TooltipContent.displayName = "TooltipContent";
+function TooltipArrowSvg() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", overflow: "visible", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M0 7L4 2Q6 0 8 2L12 7L12 8L0 8Z", className: "fill-popover" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        d: "M0 7.5L4 2.5Q6 0.5 8 2.5L12 7.5",
+        className: "stroke-border fill-none",
+        strokeWidth: "1",
+        strokeLinejoin: "round",
+        strokeLinecap: "round"
+      }
+    )
+  ] });
+}
+
+exports.Tooltip = Tooltip;
+exports.TooltipContent = TooltipContent;
+exports.TooltipProvider = TooltipProvider;
+exports.TooltipTrigger = TooltipTrigger;
+//# sourceMappingURL=tooltip-D9ylrXmx.cjs.map

package/dist/tooltip-D9ylrXmx.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-D9ylrXmx.cjs","sources":["../src/ds/components/Tooltip/tooltip.tsx"],"sourcesContent":["'use client';\n\nimport '../../../../new-theme.css';\nimport { Tooltip as TooltipPrimitive } from '@base-ui/react/tooltip';\nimport type { TooltipPopupProps, TooltipPositionerProps } from '@base-ui/react/tooltip';\nimport * as React from 'react';\n\nimport { FLOATING_POSITION_METHOD } from '@/ds/primitives/floating';\nimport { cn } from '@/lib/utils';\n\ntype TooltipProviderProps = Omit<TooltipPrimitive.Provider.Props, 'delay' | 'timeout'> & {\n  delay?: number;\n  timeout?: number;\n  /** Radix API compatibility alias for `delay`. */\n  delayDuration?: number;\n  /** Radix API compatibility alias for `timeout`. */\n  skipDelayDuration?: number;\n};\n\nfunction TooltipProvider({ delay, delayDuration, timeout, skipDelayDuration, ...props }: TooltipProviderProps) {\n  const resolvedDelay = delay ?? delayDuration;\n  const resolvedTimeout = timeout ?? skipDelayDuration;\n  return (\n    <TooltipPrimitive.Provider\n      {...(resolvedDelay !== undefined ? { delay: resolvedDelay } : {})}\n      {...(resolvedTimeout !== undefined ? { timeout: resolvedTimeout } : {})}\n      {...props}\n    />\n  );\n}\n\nconst Tooltip = TooltipPrimitive.Root;\n\ntype TooltipTriggerProps = TooltipPrimitive.Trigger.Props & {\n  /** @deprecated Use Base UI's native `render` prop instead for stronger composition typing. */\n  asChild?: boolean;\n};\n\nconst TooltipTrigger = React.forwardRef<HTMLButtonElement, TooltipTriggerProps>(\n  ({ asChild, render, children, ...props }, ref) => {\n    if (asChild && React.isValidElement(children)) {\n      return <TooltipPrimitive.Trigger ref={ref} render={children} {...props} />;\n    }\n    return (\n      <TooltipPrimitive.Trigger ref={ref} render={render} {...props}>\n        {children}\n      </TooltipPrimitive.Trigger>\n    );\n  },\n);\nTooltipTrigger.displayName = 'TooltipTrigger';\n\ntype TooltipContentPositionerProps = Omit<TooltipPositionerProps, keyof TooltipPopupProps>;\n\ntype TooltipContentProps = TooltipPopupProps & TooltipContentPositionerProps;\n\nconst TooltipContent = React.forwardRef<HTMLDivElement, TooltipContentProps>(\n  (\n    {\n      className,\n      side = 'top',\n      sideOffset = 8,\n      align = 'center',\n      alignOffset = 0,\n      arrowPadding = 10,\n      anchor,\n      positionMethod = FLOATING_POSITION_METHOD,\n      collisionBoundary,\n      collisionPadding,\n      sticky,\n      disableAnchorTracking,\n      collisionAvoidance,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const positionerProps: TooltipContentPositionerProps = {\n      side,\n      sideOffset,\n      align,\n      alignOffset,\n      arrowPadding,\n      anchor,\n      positionMethod,\n      collisionBoundary,\n      collisionPadding,\n      sticky,\n      disableAnchorTracking,\n      collisionAvoidance,\n    };\n\n    return (\n      <TooltipPrimitive.Portal>\n        <TooltipPrimitive.Positioner className=\"isolate z-100\" {...positionerProps}>\n          <TooltipPrimitive.Popup\n            ref={ref}\n            // Base UI omits the tooltip role queried by existing consumers.\n            role=\"tooltip\"\n            className={cn(\n              'new-theme relative z-100 flex origin-(--transform-origin) flex-col rounded-lg border border-border bg-popover px-2.5 py-1.5 text-ui-sm leading-ui-sm text-foreground shadow-dialog transition-[transform,scale,opacity] duration-150',\n              'data-[starting-style]:scale-95 data-[starting-style]:opacity-0',\n              'data-[ending-style]:scale-95 data-[ending-style]:opacity-0',\n              'data-[instant]:transition-none motion-reduce:transition-none',\n              className,\n            )}\n            {...props}\n          >\n            {children}\n            <TooltipPrimitive.Arrow\n              className={cn(\n                'flex',\n                'data-[side=top]:-bottom-2 data-[side=top]:rotate-180',\n                'data-[side=bottom]:-top-2',\n                'data-[side=left]:right-[-10px] data-[side=left]:rotate-90',\n                'data-[side=right]:left-[-10px] data-[side=right]:-rotate-90',\n              )}\n            >\n              <TooltipArrowSvg />\n            </TooltipPrimitive.Arrow>\n          </TooltipPrimitive.Popup>\n        </TooltipPrimitive.Positioner>\n      </TooltipPrimitive.Portal>\n    );\n  },\n);\nTooltipContent.displayName = 'TooltipContent';\n\n// Stroke endpoints meet the popup border without overlapping its edge.\nfunction TooltipArrowSvg() {\n  return (\n    <svg width=\"12\" height=\"8\" viewBox=\"0 0 12 8\" fill=\"none\" overflow=\"visible\">\n      <path d=\"M0 7L4 2Q6 0 8 2L12 7L12 8L0 8Z\" className=\"fill-popover\" />\n      <path\n        d=\"M0 7.5L4 2.5Q6 0.5 8 2.5L12 7.5\"\n        className=\"stroke-border fill-none\"\n        strokeWidth=\"1\"\n        strokeLinejoin=\"round\"\n        strokeLinecap=\"round\"\n      />\n    </svg>\n  );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n"],"names":["jsx","TooltipPrimitive","React","FLOATING_POSITION_METHOD","jsxs","cn"],"mappings":"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"}

package/dist/tooltip.css

@@ -0,0 +1,31 @@
+.new-theme {
+  --background: var(--background-2);
+  --sidebar: var(--background-1);
+  --card: var(--background-3);
+  --popover: var(--background-3);
+  --muted: var(--gray-1);
+  --foreground: var(--gray-10);
+  --muted-foreground: var(--gray-9);
+  --border: var(--gray-alpha-2);
+  --ring: var(--gray-8);
+  --sidebar-accent: var(--gray-alpha-1);
+  --selected: var(--gray-alpha-2);
+}
+
+html.light .new-theme {
+  --border: var(--gray-alpha-3);
+}
+
+@theme inline {
+  --color-background: var(--background);
+  --color-sidebar: var(--sidebar);
+  --color-card: var(--card);
+  --color-popover: var(--popover);
+  --color-muted: var(--muted);
+  --color-foreground: var(--foreground);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-border: var(--border);
+  --color-ring: var(--ring);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-selected: var(--selected);
+}

package/dist/traces-data-list-B6WI6noa.cjs

@@ -0,0 +1,86 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const dataListTop = require('./data-list-top-B_RRVRf5.cjs');
+const dataList = require('./data-list-DjSl3F2g.cjs');
+const lucideReact = require('lucide-react');
+const Badge = require('./Badge-DUXOjcfL.cjs');
+const tooltip = require('./tooltip-D9ylrXmx.cjs');
+const icons_AgentIcon = require('./icons/AgentIcon.cjs.js');
+const icons_WorkflowIcon = require('./icons/WorkflowIcon.cjs.js');
+const utils_cn = require('./cn-DPfV6E6L.cjs');
+
+function TracesDataListNameCell({ name, parentSpanId, showLevelTooltip }) {
+  const isRoot = parentSpanId == null;
+  const Icon = isRoot ? lucideReact.ListTreeIcon : lucideReact.CornerDownRightIcon;
+  const label = isRoot ? "Trace" : "Subtrace";
+  const icon = /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-label": label, className: "inline-flex shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: utils_cn.cn("size-4 shrink-0", isRoot ? "text-neutral3" : "text-neutral2"), "aria-hidden": true }) });
+  return /* @__PURE__ */ jsxRuntime.jsxs(dataListTop.DataListCell, { className: "text-ui-smd text-neutral4 flex min-w-0 items-center gap-2", children: [
+    showLevelTooltip ? /* @__PURE__ */ jsxRuntime.jsxs(tooltip.Tooltip, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(tooltip.TooltipTrigger, { asChild: true, children: icon }),
+      /* @__PURE__ */ jsxRuntime.jsx(tooltip.TooltipContent, { children: label })
+    ] }) : icon,
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: name || "-" })
+  ] });
+}
+function TracesDataListInputCell({ input }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(dataListTop.DataListTextCell, { font: "mono", children: input || "-" });
+}
+function EntityTypeIcon({ entityType, className }) {
+  const iconClass = utils_cn.cn("size-3.5 shrink-0 text-neutral2", className);
+  const normalizedEntityType = entityType.toLowerCase();
+  switch (normalizedEntityType) {
+    case "agent":
+      return /* @__PURE__ */ jsxRuntime.jsx(icons_AgentIcon.AgentIcon, { className: iconClass, "aria-hidden": true });
+    case "workflow":
+    case "workflow_run":
+      return /* @__PURE__ */ jsxRuntime.jsx(icons_WorkflowIcon.WorkflowIcon, { className: iconClass, "aria-hidden": true });
+    default:
+      return null;
+  }
+}
+function TracesDataListEntityCell({ entityType, entityName }) {
+  const type = entityType ?? "";
+  return /* @__PURE__ */ jsxRuntime.jsxs(dataListTop.DataListCell, { className: "flex min-w-0 items-center gap-2", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(EntityTypeIcon, { entityType: type }),
+    entityName ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-ui-smd min-w-0 truncate", children: entityName }) : "-"
+  ] });
+}
+const UNSET_STATUS_CONFIG = { label: "-", variant: "neutral" };
+const STATUS_CONFIG = {
+  completed: { label: "OK", variant: "green" },
+  ok: { label: "OK", variant: "green" },
+  success: { label: "OK", variant: "green" },
+  error: { label: "ERR", variant: "red" },
+  running: { label: "RUN", variant: "neutral" },
+  unset: UNSET_STATUS_CONFIG
+};
+function TracesDataListStatusCell({ status }) {
+  const key = (status ?? "unset").toLowerCase();
+  const config = STATUS_CONFIG[key] ?? UNSET_STATUS_CONFIG;
+  return /* @__PURE__ */ jsxRuntime.jsx(dataListTop.DataListCell, { children: /* @__PURE__ */ jsxRuntime.jsx(Badge.Badge, { size: "xs", variant: config.variant, children: config.label }) });
+}
+
+function TracesDataListRoot(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(dataListTop.DataListRoot, { ...props });
+}
+const TracesDataList = Object.assign(TracesDataListRoot, {
+  Top: dataListTop.DataListTop,
+  TopCell: dataListTop.DataListTopCell,
+  TopCellWithTooltip: dataListTop.DataListTopCellWithTooltip,
+  RowButton: dataListTop.DataListRowButton,
+  NoMatch: dataListTop.DataListNoMatch,
+  Subheader: dataList.DataListSubheader,
+  SubHeading: dataList.DataListSubHeading,
+  Spacer: dataListTop.DataListSpacer,
+  IdCell: dataListTop.DataListIdCell,
+  CreatedCell: dataListTop.DataListCreatedCell,
+  NameCell: TracesDataListNameCell,
+  InputCell: TracesDataListInputCell,
+  EntityCell: TracesDataListEntityCell,
+  StatusCell: TracesDataListStatusCell,
+  NextPageLoading: dataListTop.DataListNextPageLoading
+});
+
+exports.TracesDataList = TracesDataList;
+//# sourceMappingURL=traces-data-list-B6WI6noa.cjs.map