@mastra/playground-ui 41.1.0-alpha.2 → 42.0.0-alpha.13

package/dist/components/ai/ask-user.cjs.js

@@ -0,0 +1,147 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const Badge = require('../../Badge-BlJpI3fY.cjs');
+const Button = require('../../Button-B5RnKrGb.cjs');
+const input = require('../../input-0R-fQTCF.cjs');
+const utils_cn = require('../../cn-vA5sWo9W.cjs');
+
+const AskUserContainer = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils_cn.cn("rounded-lg border border-border1 bg-surface2 p-3 text-sm", className), ...props });
+const AskUserQuestion = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("legend", { className: utils_cn.cn("mb-3 font-medium text-neutral6", className), ...props });
+const AskUserOptionDescription = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("block text-ui-xs font-normal text-neutral3", className), ...props });
+const AskUserOptionControl = ({ type, label, description, className, ...props }) => /* @__PURE__ */ jsxRuntime.jsxs(
+  "label",
+  {
+    className: utils_cn.cn(
+      "flex cursor-pointer items-start gap-2 rounded-md border border-border1 bg-surface3 px-3 py-2 text-neutral5 transition-colors hover:bg-surface4 has-[:checked]:border-border2 has-[:checked]:bg-surface4 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50",
+      className
+    ),
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("input", { type, className: "mt-0.5 accent-current", ...props }),
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block", children: label }),
+        description ? /* @__PURE__ */ jsxRuntime.jsx(AskUserOptionDescription, { children: description }) : null
+      ] })
+    ]
+  }
+);
+const AskUserSubmit = ({ children = "Submit answer", ...props }) => /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { type: "button", size: "sm", variant: "primary", ...props, children });
+const AskUserPending = ({ children = "Submitting…", className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("span", { role: "status", className: utils_cn.cn("text-ui-xs text-neutral3", className), ...props, children });
+const AskUserOutput = ({ result, className, ...props }) => /* @__PURE__ */ jsxRuntime.jsxs(
+  "div",
+  {
+    role: result.isError ? "alert" : "status",
+    className: utils_cn.cn("space-y-2 rounded-md bg-surface3 p-3 text-neutral5", result.isError && "text-error", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Badge.Badge, { size: "xs", variant: result.isError ? "error" : "success", children: result.isError ? "Error" : "Answered" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { children: result.content })
+    ]
+  }
+);
+const validOptions = (options) => options?.filter(
+  (option) => Boolean(option && typeof option.label === "string" && option.label)
+) ?? [];
+const AskUserInput = ({
+  payload,
+  options,
+  result,
+  isAnswered = false,
+  isSubmitting = false,
+  onSubmit,
+  footer,
+  ...props
+}) => {
+  const inputId = React.useId();
+  const [text, setText] = React.useState("");
+  const [selected, setSelected] = React.useState([]);
+  if (result || isAnswered) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(AskUserContainer, { "data-testid": "ask-user", ...props, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 font-medium text-neutral6", children: payload.question }),
+      result ? /* @__PURE__ */ jsxRuntime.jsx(AskUserOutput, { result }) : /* @__PURE__ */ jsxRuntime.jsx(Badge.Badge, { variant: "success", children: "Answered" })
+    ] });
+  }
+  const submitText = () => {
+    const answer = text.trim();
+    if (answer && !isSubmitting) onSubmit(answer);
+  };
+  const handleTextKeyDown = (event) => {
+    if (event.key === "Enter") {
+      event.preventDefault();
+      submitText();
+    }
+  };
+  if (options.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(AskUserContainer, { "data-testid": "ask-user", ...props, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("label", { className: "mb-2 block font-medium text-neutral6", htmlFor: inputId, children: payload.question }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          input.Input,
+          {
+            id: inputId,
+            value: text,
+            onChange: (event) => setText(event.target.value),
+            onKeyDown: handleTextKeyDown,
+            placeholder: "Type your answer...",
+            disabled: isSubmitting,
+            size: "sm"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(AskUserSubmit, { "aria-label": "Submit answer", disabled: isSubmitting || !text.trim(), onClick: submitText, children: "Submit" })
+      ] }),
+      isSubmitting ? /* @__PURE__ */ jsxRuntime.jsx(AskUserPending, { className: "mt-2 block" }) : null,
+      footer
+    ] });
+  }
+  const isMulti = payload.selectionMode === "multi_select";
+  return /* @__PURE__ */ jsxRuntime.jsx(AskUserContainer, { "data-testid": "ask-user", ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { disabled: isSubmitting, className: "space-y-2", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(AskUserQuestion, { children: payload.question }),
+    options.map((option) => {
+      const checked = selected.includes(option.label);
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        AskUserOptionControl,
+        {
+          type: isMulti ? "checkbox" : "radio",
+          name: inputId,
+          label: option.label,
+          description: option.description,
+          disabled: isSubmitting,
+          checked,
+          onChange: () => {
+            if (isSubmitting) return;
+            if (!isMulti) {
+              setSelected([option.label]);
+              onSubmit(option.label);
+              return;
+            }
+            setSelected(
+              (current) => current.includes(option.label) ? current.filter((selectedLabel) => selectedLabel !== option.label) : [...current, option.label]
+            );
+          }
+        },
+        option.label
+      );
+    }),
+    isMulti ? /* @__PURE__ */ jsxRuntime.jsx(AskUserSubmit, { disabled: isSubmitting || selected.length === 0, onClick: () => onSubmit(selected), children: "Submit answer" }) : null,
+    isSubmitting ? /* @__PURE__ */ jsxRuntime.jsx(AskUserPending, {}) : null,
+    footer
+  ] }) });
+};
+const AskUser = ({ payload, ...props }) => {
+  const options = validOptions(payload.options);
+  const payloadKey = JSON.stringify([payload.question, options.map((option) => option.label), payload.selectionMode]);
+  return /* @__PURE__ */ jsxRuntime.jsx(AskUserInput, { payload, options, ...props }, payloadKey);
+};
+
+exports.AskUser = AskUser;
+exports.AskUserContainer = AskUserContainer;
+exports.AskUserOptionControl = AskUserOptionControl;
+exports.AskUserOptionDescription = AskUserOptionDescription;
+exports.AskUserOutput = AskUserOutput;
+exports.AskUserPending = AskUserPending;
+exports.AskUserQuestion = AskUserQuestion;
+exports.AskUserSubmit = AskUserSubmit;
+//# sourceMappingURL=ask-user.cjs.js.map

package/dist/components/ai/ask-user.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ask-user.cjs.js","sources":["../../../src/ds/components/ai/ask-user/ask-user.tsx"],"sourcesContent":["import { useId, useState } from 'react';\nimport type { ComponentProps, KeyboardEvent, ReactNode } from 'react';\nimport { Badge } from '@/ds/components/Badge';\nimport { Button } from '@/ds/components/Button';\nimport { Input } from '@/ds/components/Input';\nimport { cn } from '@/lib/utils';\n\nexport type AskUserSelectionMode = 'single_select' | 'multi_select';\nexport type AskUserAnswer = string | string[];\n\nexport interface AskUserOption {\n  label: string;\n  description?: string;\n}\n\nexport interface AskUserPayload {\n  question: string;\n  options?: AskUserOption[];\n  selectionMode?: AskUserSelectionMode;\n}\n\nexport interface AskUserResult {\n  content: string;\n  isError?: boolean;\n}\n\nexport const AskUserContainer = ({ className, ...props }: ComponentProps<'div'>) => (\n  <div className={cn('rounded-lg border border-border1 bg-surface2 p-3 text-sm', className)} {...props} />\n);\n\nexport const AskUserQuestion = ({ className, ...props }: ComponentProps<'legend'>) => (\n  <legend className={cn('mb-3 font-medium text-neutral6', className)} {...props} />\n);\n\nexport const AskUserOptionDescription = ({ className, ...props }: ComponentProps<'span'>) => (\n  <span className={cn('block text-ui-xs font-normal text-neutral3', className)} {...props} />\n);\n\ninterface AskUserOptionControlProps extends Omit<ComponentProps<'input'>, 'type'> {\n  type: 'radio' | 'checkbox';\n  label: string;\n  description?: string;\n}\n\nexport const AskUserOptionControl = ({ type, label, description, className, ...props }: AskUserOptionControlProps) => (\n  <label\n    className={cn(\n      'flex cursor-pointer items-start gap-2 rounded-md border border-border1 bg-surface3 px-3 py-2 text-neutral5 transition-colors hover:bg-surface4 has-[:checked]:border-border2 has-[:checked]:bg-surface4 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50',\n      className,\n    )}\n  >\n    <input type={type} className=\"mt-0.5 accent-current\" {...props} />\n    <span>\n      <span className=\"block\">{label}</span>\n      {description ? <AskUserOptionDescription>{description}</AskUserOptionDescription> : null}\n    </span>\n  </label>\n);\n\nexport const AskUserSubmit = ({ children = 'Submit answer', ...props }: ComponentProps<typeof Button>) => (\n  <Button type=\"button\" size=\"sm\" variant=\"primary\" {...props}>\n    {children}\n  </Button>\n);\n\nexport const AskUserPending = ({ children = 'Submitting…', className, ...props }: ComponentProps<'span'>) => (\n  <span role=\"status\" className={cn('text-ui-xs text-neutral3', className)} {...props}>\n    {children}\n  </span>\n);\n\nexport interface AskUserOutputProps extends ComponentProps<'div'> {\n  result: AskUserResult;\n}\n\nexport const AskUserOutput = ({ result, className, ...props }: AskUserOutputProps) => (\n  <div\n    role={result.isError ? 'alert' : 'status'}\n    className={cn('space-y-2 rounded-md bg-surface3 p-3 text-neutral5', result.isError && 'text-error', className)}\n    {...props}\n  >\n    <Badge size=\"xs\" variant={result.isError ? 'error' : 'success'}>\n      {result.isError ? 'Error' : 'Answered'}\n    </Badge>\n    <p>{result.content}</p>\n  </div>\n);\n\nexport interface AskUserProps extends Omit<ComponentProps<typeof AskUserContainer>, 'children' | 'onSubmit'> {\n  payload: AskUserPayload;\n  result?: AskUserResult;\n  isAnswered?: boolean;\n  isSubmitting?: boolean;\n  onSubmit: (answer: AskUserAnswer) => void;\n  footer?: ReactNode;\n}\n\nconst validOptions = (options: AskUserPayload['options']): AskUserOption[] =>\n  options?.filter((option): option is AskUserOption =>\n    Boolean(option && typeof option.label === 'string' && option.label),\n  ) ?? [];\n\ninterface AskUserInputProps extends AskUserProps {\n  options: AskUserOption[];\n}\n\nconst AskUserInput = ({\n  payload,\n  options,\n  result,\n  isAnswered = false,\n  isSubmitting = false,\n  onSubmit,\n  footer,\n  ...props\n}: AskUserInputProps) => {\n  const inputId = useId();\n  const [text, setText] = useState('');\n  const [selected, setSelected] = useState<string[]>([]);\n\n  if (result || isAnswered) {\n    return (\n      <AskUserContainer data-testid=\"ask-user\" {...props}>\n        <p className=\"mb-2 font-medium text-neutral6\">{payload.question}</p>\n        {result ? <AskUserOutput result={result} /> : <Badge variant=\"success\">Answered</Badge>}\n      </AskUserContainer>\n    );\n  }\n\n  const submitText = () => {\n    const answer = text.trim();\n    if (answer && !isSubmitting) onSubmit(answer);\n  };\n\n  const handleTextKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n    if (event.key === 'Enter') {\n      event.preventDefault();\n      submitText();\n    }\n  };\n\n  if (options.length === 0) {\n    return (\n      <AskUserContainer data-testid=\"ask-user\" {...props}>\n        <label className=\"mb-2 block font-medium text-neutral6\" htmlFor={inputId}>\n          {payload.question}\n        </label>\n        <div className=\"flex items-center gap-2\">\n          <Input\n            id={inputId}\n            value={text}\n            onChange={event => setText(event.target.value)}\n            onKeyDown={handleTextKeyDown}\n            placeholder=\"Type your answer...\"\n            disabled={isSubmitting}\n            size=\"sm\"\n          />\n          <AskUserSubmit aria-label=\"Submit answer\" disabled={isSubmitting || !text.trim()} onClick={submitText}>\n            Submit\n          </AskUserSubmit>\n        </div>\n        {isSubmitting ? <AskUserPending className=\"mt-2 block\" /> : null}\n        {footer}\n      </AskUserContainer>\n    );\n  }\n\n  const isMulti = payload.selectionMode === 'multi_select';\n  return (\n    <AskUserContainer data-testid=\"ask-user\" {...props}>\n      <fieldset disabled={isSubmitting} className=\"space-y-2\">\n        <AskUserQuestion>{payload.question}</AskUserQuestion>\n        {options.map(option => {\n          const checked = selected.includes(option.label);\n          return (\n            <AskUserOptionControl\n              key={option.label}\n              type={isMulti ? 'checkbox' : 'radio'}\n              name={inputId}\n              label={option.label}\n              description={option.description}\n              disabled={isSubmitting}\n              checked={checked}\n              onChange={() => {\n                if (isSubmitting) return;\n                if (!isMulti) {\n                  setSelected([option.label]);\n                  onSubmit(option.label);\n                  return;\n                }\n                setSelected(current =>\n                  current.includes(option.label)\n                    ? current.filter(selectedLabel => selectedLabel !== option.label)\n                    : [...current, option.label],\n                );\n              }}\n            />\n          );\n        })}\n        {isMulti ? (\n          <AskUserSubmit disabled={isSubmitting || selected.length === 0} onClick={() => onSubmit(selected)}>\n            Submit answer\n          </AskUserSubmit>\n        ) : null}\n        {isSubmitting ? <AskUserPending /> : null}\n        {footer}\n      </fieldset>\n    </AskUserContainer>\n  );\n};\n\nexport const AskUser = ({ payload, ...props }: AskUserProps) => {\n  const options = validOptions(payload.options);\n  const payloadKey = JSON.stringify([payload.question, options.map(option => option.label), payload.selectionMode]);\n\n  return <AskUserInput key={payloadKey} payload={payload} options={options} {...props} />;\n};\n"],"names":["jsx","cn","jsxs","Button","Badge","useId","useState","Input"],"mappings":"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"}

package/dist/components/ai/ask-user.d.ts

@@ -0,0 +1,2 @@
+export * from '../../src/ds/components/ai/ask-user/index'
+export {}

package/dist/components/ai/ask-user.es.js

@@ -0,0 +1,136 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useId, useState } from 'react';
+import { B as Badge } from '../../Badge-woV6OD8k.js';
+import { B as Button } from '../../Button-Dh5CZ6Ir.js';
+import { I as Input } from '../../input-DVZ0-3KP.js';
+import { c as cn } from '../../cn-BakJzhuv.js';
+
+const AskUserContainer = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("rounded-lg border border-border1 bg-surface2 p-3 text-sm", className), ...props });
+const AskUserQuestion = ({ className, ...props }) => /* @__PURE__ */ jsx("legend", { className: cn("mb-3 font-medium text-neutral6", className), ...props });
+const AskUserOptionDescription = ({ className, ...props }) => /* @__PURE__ */ jsx("span", { className: cn("block text-ui-xs font-normal text-neutral3", className), ...props });
+const AskUserOptionControl = ({ type, label, description, className, ...props }) => /* @__PURE__ */ jsxs(
+  "label",
+  {
+    className: cn(
+      "flex cursor-pointer items-start gap-2 rounded-md border border-border1 bg-surface3 px-3 py-2 text-neutral5 transition-colors hover:bg-surface4 has-[:checked]:border-border2 has-[:checked]:bg-surface4 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50",
+      className
+    ),
+    children: [
+      /* @__PURE__ */ jsx("input", { type, className: "mt-0.5 accent-current", ...props }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        /* @__PURE__ */ jsx("span", { className: "block", children: label }),
+        description ? /* @__PURE__ */ jsx(AskUserOptionDescription, { children: description }) : null
+      ] })
+    ]
+  }
+);
+const AskUserSubmit = ({ children = "Submit answer", ...props }) => /* @__PURE__ */ jsx(Button, { type: "button", size: "sm", variant: "primary", ...props, children });
+const AskUserPending = ({ children = "Submitting…", className, ...props }) => /* @__PURE__ */ jsx("span", { role: "status", className: cn("text-ui-xs text-neutral3", className), ...props, children });
+const AskUserOutput = ({ result, className, ...props }) => /* @__PURE__ */ jsxs(
+  "div",
+  {
+    role: result.isError ? "alert" : "status",
+    className: cn("space-y-2 rounded-md bg-surface3 p-3 text-neutral5", result.isError && "text-error", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(Badge, { size: "xs", variant: result.isError ? "error" : "success", children: result.isError ? "Error" : "Answered" }),
+      /* @__PURE__ */ jsx("p", { children: result.content })
+    ]
+  }
+);
+const validOptions = (options) => options?.filter(
+  (option) => Boolean(option && typeof option.label === "string" && option.label)
+) ?? [];
+const AskUserInput = ({
+  payload,
+  options,
+  result,
+  isAnswered = false,
+  isSubmitting = false,
+  onSubmit,
+  footer,
+  ...props
+}) => {
+  const inputId = useId();
+  const [text, setText] = useState("");
+  const [selected, setSelected] = useState([]);
+  if (result || isAnswered) {
+    return /* @__PURE__ */ jsxs(AskUserContainer, { "data-testid": "ask-user", ...props, children: [
+      /* @__PURE__ */ jsx("p", { className: "mb-2 font-medium text-neutral6", children: payload.question }),
+      result ? /* @__PURE__ */ jsx(AskUserOutput, { result }) : /* @__PURE__ */ jsx(Badge, { variant: "success", children: "Answered" })
+    ] });
+  }
+  const submitText = () => {
+    const answer = text.trim();
+    if (answer && !isSubmitting) onSubmit(answer);
+  };
+  const handleTextKeyDown = (event) => {
+    if (event.key === "Enter") {
+      event.preventDefault();
+      submitText();
+    }
+  };
+  if (options.length === 0) {
+    return /* @__PURE__ */ jsxs(AskUserContainer, { "data-testid": "ask-user", ...props, children: [
+      /* @__PURE__ */ jsx("label", { className: "mb-2 block font-medium text-neutral6", htmlFor: inputId, children: payload.question }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: inputId,
+            value: text,
+            onChange: (event) => setText(event.target.value),
+            onKeyDown: handleTextKeyDown,
+            placeholder: "Type your answer...",
+            disabled: isSubmitting,
+            size: "sm"
+          }
+        ),
+        /* @__PURE__ */ jsx(AskUserSubmit, { "aria-label": "Submit answer", disabled: isSubmitting || !text.trim(), onClick: submitText, children: "Submit" })
+      ] }),
+      isSubmitting ? /* @__PURE__ */ jsx(AskUserPending, { className: "mt-2 block" }) : null,
+      footer
+    ] });
+  }
+  const isMulti = payload.selectionMode === "multi_select";
+  return /* @__PURE__ */ jsx(AskUserContainer, { "data-testid": "ask-user", ...props, children: /* @__PURE__ */ jsxs("fieldset", { disabled: isSubmitting, className: "space-y-2", children: [
+    /* @__PURE__ */ jsx(AskUserQuestion, { children: payload.question }),
+    options.map((option) => {
+      const checked = selected.includes(option.label);
+      return /* @__PURE__ */ jsx(
+        AskUserOptionControl,
+        {
+          type: isMulti ? "checkbox" : "radio",
+          name: inputId,
+          label: option.label,
+          description: option.description,
+          disabled: isSubmitting,
+          checked,
+          onChange: () => {
+            if (isSubmitting) return;
+            if (!isMulti) {
+              setSelected([option.label]);
+              onSubmit(option.label);
+              return;
+            }
+            setSelected(
+              (current) => current.includes(option.label) ? current.filter((selectedLabel) => selectedLabel !== option.label) : [...current, option.label]
+            );
+          }
+        },
+        option.label
+      );
+    }),
+    isMulti ? /* @__PURE__ */ jsx(AskUserSubmit, { disabled: isSubmitting || selected.length === 0, onClick: () => onSubmit(selected), children: "Submit answer" }) : null,
+    isSubmitting ? /* @__PURE__ */ jsx(AskUserPending, {}) : null,
+    footer
+  ] }) });
+};
+const AskUser = ({ payload, ...props }) => {
+  const options = validOptions(payload.options);
+  const payloadKey = JSON.stringify([payload.question, options.map((option) => option.label), payload.selectionMode]);
+  return /* @__PURE__ */ jsx(AskUserInput, { payload, options, ...props }, payloadKey);
+};
+
+export { AskUser, AskUserContainer, AskUserOptionControl, AskUserOptionDescription, AskUserOutput, AskUserPending, AskUserQuestion, AskUserSubmit };
+//# sourceMappingURL=ask-user.es.js.map

package/dist/components/ai/ask-user.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ask-user.es.js","sources":["../../../src/ds/components/ai/ask-user/ask-user.tsx"],"sourcesContent":["import { useId, useState } from 'react';\nimport type { ComponentProps, KeyboardEvent, ReactNode } from 'react';\nimport { Badge } from '@/ds/components/Badge';\nimport { Button } from '@/ds/components/Button';\nimport { Input } from '@/ds/components/Input';\nimport { cn } from '@/lib/utils';\n\nexport type AskUserSelectionMode = 'single_select' | 'multi_select';\nexport type AskUserAnswer = string | string[];\n\nexport interface AskUserOption {\n  label: string;\n  description?: string;\n}\n\nexport interface AskUserPayload {\n  question: string;\n  options?: AskUserOption[];\n  selectionMode?: AskUserSelectionMode;\n}\n\nexport interface AskUserResult {\n  content: string;\n  isError?: boolean;\n}\n\nexport const AskUserContainer = ({ className, ...props }: ComponentProps<'div'>) => (\n  <div className={cn('rounded-lg border border-border1 bg-surface2 p-3 text-sm', className)} {...props} />\n);\n\nexport const AskUserQuestion = ({ className, ...props }: ComponentProps<'legend'>) => (\n  <legend className={cn('mb-3 font-medium text-neutral6', className)} {...props} />\n);\n\nexport const AskUserOptionDescription = ({ className, ...props }: ComponentProps<'span'>) => (\n  <span className={cn('block text-ui-xs font-normal text-neutral3', className)} {...props} />\n);\n\ninterface AskUserOptionControlProps extends Omit<ComponentProps<'input'>, 'type'> {\n  type: 'radio' | 'checkbox';\n  label: string;\n  description?: string;\n}\n\nexport const AskUserOptionControl = ({ type, label, description, className, ...props }: AskUserOptionControlProps) => (\n  <label\n    className={cn(\n      'flex cursor-pointer items-start gap-2 rounded-md border border-border1 bg-surface3 px-3 py-2 text-neutral5 transition-colors hover:bg-surface4 has-[:checked]:border-border2 has-[:checked]:bg-surface4 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50',\n      className,\n    )}\n  >\n    <input type={type} className=\"mt-0.5 accent-current\" {...props} />\n    <span>\n      <span className=\"block\">{label}</span>\n      {description ? <AskUserOptionDescription>{description}</AskUserOptionDescription> : null}\n    </span>\n  </label>\n);\n\nexport const AskUserSubmit = ({ children = 'Submit answer', ...props }: ComponentProps<typeof Button>) => (\n  <Button type=\"button\" size=\"sm\" variant=\"primary\" {...props}>\n    {children}\n  </Button>\n);\n\nexport const AskUserPending = ({ children = 'Submitting…', className, ...props }: ComponentProps<'span'>) => (\n  <span role=\"status\" className={cn('text-ui-xs text-neutral3', className)} {...props}>\n    {children}\n  </span>\n);\n\nexport interface AskUserOutputProps extends ComponentProps<'div'> {\n  result: AskUserResult;\n}\n\nexport const AskUserOutput = ({ result, className, ...props }: AskUserOutputProps) => (\n  <div\n    role={result.isError ? 'alert' : 'status'}\n    className={cn('space-y-2 rounded-md bg-surface3 p-3 text-neutral5', result.isError && 'text-error', className)}\n    {...props}\n  >\n    <Badge size=\"xs\" variant={result.isError ? 'error' : 'success'}>\n      {result.isError ? 'Error' : 'Answered'}\n    </Badge>\n    <p>{result.content}</p>\n  </div>\n);\n\nexport interface AskUserProps extends Omit<ComponentProps<typeof AskUserContainer>, 'children' | 'onSubmit'> {\n  payload: AskUserPayload;\n  result?: AskUserResult;\n  isAnswered?: boolean;\n  isSubmitting?: boolean;\n  onSubmit: (answer: AskUserAnswer) => void;\n  footer?: ReactNode;\n}\n\nconst validOptions = (options: AskUserPayload['options']): AskUserOption[] =>\n  options?.filter((option): option is AskUserOption =>\n    Boolean(option && typeof option.label === 'string' && option.label),\n  ) ?? [];\n\ninterface AskUserInputProps extends AskUserProps {\n  options: AskUserOption[];\n}\n\nconst AskUserInput = ({\n  payload,\n  options,\n  result,\n  isAnswered = false,\n  isSubmitting = false,\n  onSubmit,\n  footer,\n  ...props\n}: AskUserInputProps) => {\n  const inputId = useId();\n  const [text, setText] = useState('');\n  const [selected, setSelected] = useState<string[]>([]);\n\n  if (result || isAnswered) {\n    return (\n      <AskUserContainer data-testid=\"ask-user\" {...props}>\n        <p className=\"mb-2 font-medium text-neutral6\">{payload.question}</p>\n        {result ? <AskUserOutput result={result} /> : <Badge variant=\"success\">Answered</Badge>}\n      </AskUserContainer>\n    );\n  }\n\n  const submitText = () => {\n    const answer = text.trim();\n    if (answer && !isSubmitting) onSubmit(answer);\n  };\n\n  const handleTextKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n    if (event.key === 'Enter') {\n      event.preventDefault();\n      submitText();\n    }\n  };\n\n  if (options.length === 0) {\n    return (\n      <AskUserContainer data-testid=\"ask-user\" {...props}>\n        <label className=\"mb-2 block font-medium text-neutral6\" htmlFor={inputId}>\n          {payload.question}\n        </label>\n        <div className=\"flex items-center gap-2\">\n          <Input\n            id={inputId}\n            value={text}\n            onChange={event => setText(event.target.value)}\n            onKeyDown={handleTextKeyDown}\n            placeholder=\"Type your answer...\"\n            disabled={isSubmitting}\n            size=\"sm\"\n          />\n          <AskUserSubmit aria-label=\"Submit answer\" disabled={isSubmitting || !text.trim()} onClick={submitText}>\n            Submit\n          </AskUserSubmit>\n        </div>\n        {isSubmitting ? <AskUserPending className=\"mt-2 block\" /> : null}\n        {footer}\n      </AskUserContainer>\n    );\n  }\n\n  const isMulti = payload.selectionMode === 'multi_select';\n  return (\n    <AskUserContainer data-testid=\"ask-user\" {...props}>\n      <fieldset disabled={isSubmitting} className=\"space-y-2\">\n        <AskUserQuestion>{payload.question}</AskUserQuestion>\n        {options.map(option => {\n          const checked = selected.includes(option.label);\n          return (\n            <AskUserOptionControl\n              key={option.label}\n              type={isMulti ? 'checkbox' : 'radio'}\n              name={inputId}\n              label={option.label}\n              description={option.description}\n              disabled={isSubmitting}\n              checked={checked}\n              onChange={() => {\n                if (isSubmitting) return;\n                if (!isMulti) {\n                  setSelected([option.label]);\n                  onSubmit(option.label);\n                  return;\n                }\n                setSelected(current =>\n                  current.includes(option.label)\n                    ? current.filter(selectedLabel => selectedLabel !== option.label)\n                    : [...current, option.label],\n                );\n              }}\n            />\n          );\n        })}\n        {isMulti ? (\n          <AskUserSubmit disabled={isSubmitting || selected.length === 0} onClick={() => onSubmit(selected)}>\n            Submit answer\n          </AskUserSubmit>\n        ) : null}\n        {isSubmitting ? <AskUserPending /> : null}\n        {footer}\n      </fieldset>\n    </AskUserContainer>\n  );\n};\n\nexport const AskUser = ({ payload, ...props }: AskUserProps) => {\n  const options = validOptions(payload.options);\n  const payloadKey = JSON.stringify([payload.question, options.map(option => option.label), payload.selectionMode]);\n\n  return <AskUserInput key={payloadKey} payload={payload} options={options} {...props} />;\n};\n"],"names":[],"mappings":"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"}

package/dist/components/ai/plan.cjs.js

@@ -8,7 +8,7 @@ const React = require('react');
 const Badge = require('../../Badge-BlJpI3fY.cjs');
 const Button = require('../../Button-B5RnKrGb.cjs');
 const markdownRenderer = require('../../markdown-renderer-DRnUrMmF.cjs');
-const Txt = require('../../Txt-BT8_EkuZ.cjs');
+const Txt = require('../../Txt-I5lK8zy7.cjs');
 const icons_Icon = require('../../icons/Icon.cjs.js');
 const hooks_useCopyToClipboard = require('../../hooks/use-copy-to-clipboard.cjs.js');
 const utils_cn = require('../../cn-vA5sWo9W.cjs');

package/dist/components/ai/plan.es.js

@@ -4,7 +4,7 @@ import { useState, createContext, useContext } from 'react';
 import { B as Badge } from '../../Badge-woV6OD8k.js';
 import { B as Button } from '../../Button-Dh5CZ6Ir.js';
 import { M as MarkdownRenderer } from '../../markdown-renderer-ZzJcwfS3.js';
-import { T as Txt } from '../../Txt-p33XTnu8.js';
+import { T as Txt } from '../../Txt-Df42XG5p.js';
 import { Icon } from '../../icons/Icon.es.js';
 import { useCopyToClipboard } from '../../hooks/use-copy-to-clipboard.es.js';
 import { c as cn } from '../../cn-BakJzhuv.js';

package/dist/components/ai/task-list.cjs.js

@@ -0,0 +1,90 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const React = require('react');
+const utils_cn = require('../../cn-vA5sWo9W.cjs');
+
+const TaskListContainer = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("section", { className: utils_cn.cn("rounded-2xl border border-border2/40 bg-surface3 px-3 py-2.5", className), ...props });
+const TaskListHeader = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("header", { className: utils_cn.cn("mb-2 flex items-center gap-2", className), ...props });
+const TaskListCount = ({ completed, total, className, ...props }) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: utils_cn.cn("ml-auto text-ui-xs text-neutral4 tabular-nums", className), ...props, children: [
+  completed,
+  "/",
+  total,
+  " completed"
+] });
+const TaskListProgress = ({ completed, total, className, ...props }) => {
+  const percentage = total === 0 ? 0 : completed / total * 100;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      role: "progressbar",
+      "aria-label": "Task completion",
+      "aria-valuemin": 0,
+      "aria-valuemax": total,
+      "aria-valuenow": completed,
+      className: utils_cn.cn("mb-2.5 h-1 w-full rounded-full bg-surface4", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full rounded-full bg-accent6 transition-all duration-300", style: { width: `${percentage}%` } })
+    }
+  );
+};
+const icons = {
+  completed: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle2, { className: "size-3.5 shrink-0 text-positive1" }),
+  in_progress: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "size-3.5 shrink-0 text-warning1 motion-safe:animate-spin" }),
+  pending: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Circle, { className: "size-3.5 shrink-0 text-neutral4" })
+};
+const statusLabels = {
+  completed: "Completed",
+  in_progress: "In progress",
+  pending: "Pending"
+};
+const textClasses = {
+  completed: "text-neutral4 line-through",
+  in_progress: "font-medium text-warning1",
+  pending: "text-neutral5"
+};
+const TaskListStatusIcon = ({ status, className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-label": statusLabels[status], className: utils_cn.cn("pt-0.5", className), ...props, children: icons[status] });
+const TaskListRow = ({ task, className, ...props }) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: utils_cn.cn("flex items-start gap-2 py-0.5", className), ...props, children: [
+  /* @__PURE__ */ jsxRuntime.jsx(TaskListStatusIcon, { status: task.status }),
+  /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("text-ui-sm leading-ui-sm", textClasses[task.status]), children: task.status === "in_progress" ? task.activeForm : task.content })
+] });
+const TaskList = ({
+  tasks,
+  title = "Tasks",
+  hideWhenEmpty = true,
+  hideWhenComplete = true,
+  scrollActiveIntoView = true,
+  ...props
+}) => {
+  const activeTaskRef = React.useRef(null);
+  const activeTaskId = tasks.find((task) => task.status === "in_progress")?.id;
+  const completed = tasks.filter((task) => task.status === "completed").length;
+  const total = tasks.length;
+  React.useEffect(() => {
+    if (!scrollActiveIntoView || !activeTaskRef.current || typeof activeTaskRef.current.scrollIntoView !== "function")
+      return;
+    activeTaskRef.current.scrollIntoView({ block: "nearest" });
+  }, [activeTaskId, scrollActiveIntoView]);
+  if (hideWhenEmpty && total === 0 || hideWhenComplete && total > 0 && completed === total) return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(TaskListContainer, { "aria-label": "Task list", "data-testid": "task-list", ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(TaskListHeader, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ListChecks, { className: "size-4 shrink-0 text-accent6" }),
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-ui-sm leading-ui-sm font-medium text-neutral6", children: title }),
+      /* @__PURE__ */ jsxRuntime.jsx(TaskListCount, { completed, total })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(TaskListProgress, { completed, total }),
+    /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "max-h-32 space-y-1 overflow-y-auto pr-1", children: tasks.map((task) => /* @__PURE__ */ jsxRuntime.jsx(TaskListRow, { ref: task.id === activeTaskId ? activeTaskRef : void 0, task }, task.id)) })
+  ] });
+};
+
+exports.TaskList = TaskList;
+exports.TaskListContainer = TaskListContainer;
+exports.TaskListCount = TaskListCount;
+exports.TaskListHeader = TaskListHeader;
+exports.TaskListProgress = TaskListProgress;
+exports.TaskListRow = TaskListRow;
+exports.TaskListStatusIcon = TaskListStatusIcon;
+//# sourceMappingURL=task-list.cjs.js.map

package/dist/components/ai/task-list.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"task-list.cjs.js","sources":["../../../src/ds/components/ai/task-list/task-list.tsx"],"sourcesContent":["import type { TaskItem } from '@mastra/core/signals';\nimport { CheckCircle2, Circle, ListChecks, Loader2 } from 'lucide-react';\nimport { useEffect, useRef } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport type TaskListItem = TaskItem;\n\nexport const TaskListContainer = ({ className, ...props }: ComponentProps<'section'>) => (\n  <section className={cn('rounded-2xl border border-border2/40 bg-surface3 px-3 py-2.5', className)} {...props} />\n);\n\nexport const TaskListHeader = ({ className, ...props }: ComponentProps<'header'>) => (\n  <header className={cn('mb-2 flex items-center gap-2', className)} {...props} />\n);\n\nexport interface TaskListCountProps extends ComponentProps<'span'> {\n  completed: number;\n  total: number;\n}\n\nexport const TaskListCount = ({ completed, total, className, ...props }: TaskListCountProps) => (\n  <span className={cn('ml-auto text-ui-xs text-neutral4 tabular-nums', className)} {...props}>\n    {completed}/{total} completed\n  </span>\n);\n\nexport interface TaskListProgressProps extends Omit<ComponentProps<'div'>, 'children'> {\n  completed: number;\n  total: number;\n}\n\nexport const TaskListProgress = ({ completed, total, className, ...props }: TaskListProgressProps) => {\n  const percentage = total === 0 ? 0 : (completed / total) * 100;\n  return (\n    <div\n      role=\"progressbar\"\n      aria-label=\"Task completion\"\n      aria-valuemin={0}\n      aria-valuemax={total}\n      aria-valuenow={completed}\n      className={cn('mb-2.5 h-1 w-full rounded-full bg-surface4', className)}\n      {...props}\n    >\n      <div className=\"h-full rounded-full bg-accent6 transition-all duration-300\" style={{ width: `${percentage}%` }} />\n    </div>\n  );\n};\n\nconst icons: Record<TaskListItem['status'], ReactNode> = {\n  completed: <CheckCircle2 className=\"size-3.5 shrink-0 text-positive1\" />,\n  in_progress: <Loader2 className=\"size-3.5 shrink-0 text-warning1 motion-safe:animate-spin\" />,\n  pending: <Circle className=\"size-3.5 shrink-0 text-neutral4\" />,\n};\n\nconst statusLabels: Record<TaskListItem['status'], string> = {\n  completed: 'Completed',\n  in_progress: 'In progress',\n  pending: 'Pending',\n};\n\nconst textClasses: Record<TaskListItem['status'], string> = {\n  completed: 'text-neutral4 line-through',\n  in_progress: 'font-medium text-warning1',\n  pending: 'text-neutral5',\n};\n\nexport interface TaskListStatusIconProps extends ComponentProps<'span'> {\n  status: TaskListItem['status'];\n}\n\nexport const TaskListStatusIcon = ({ status, className, ...props }: TaskListStatusIconProps) => (\n  <span aria-label={statusLabels[status]} className={cn('pt-0.5', className)} {...props}>\n    {icons[status]}\n  </span>\n);\n\nexport interface TaskListRowProps extends ComponentProps<'li'> {\n  task: TaskListItem;\n}\n\nexport const TaskListRow = ({ task, className, ...props }: TaskListRowProps) => (\n  <li className={cn('flex items-start gap-2 py-0.5', className)} {...props}>\n    <TaskListStatusIcon status={task.status} />\n    <span className={cn('text-ui-sm leading-ui-sm', textClasses[task.status])}>\n      {task.status === 'in_progress' ? task.activeForm : task.content}\n    </span>\n  </li>\n);\n\nexport interface TaskListProps extends Omit<ComponentProps<typeof TaskListContainer>, 'children' | 'title'> {\n  tasks: TaskListItem[];\n  title?: ReactNode;\n  hideWhenEmpty?: boolean;\n  hideWhenComplete?: boolean;\n  scrollActiveIntoView?: boolean;\n}\n\nexport const TaskList = ({\n  tasks,\n  title = 'Tasks',\n  hideWhenEmpty = true,\n  hideWhenComplete = true,\n  scrollActiveIntoView = true,\n  ...props\n}: TaskListProps) => {\n  const activeTaskRef = useRef<HTMLLIElement | null>(null);\n  const activeTaskId = tasks.find(task => task.status === 'in_progress')?.id;\n  const completed = tasks.filter(task => task.status === 'completed').length;\n  const total = tasks.length;\n\n  useEffect(() => {\n    if (!scrollActiveIntoView || !activeTaskRef.current || typeof activeTaskRef.current.scrollIntoView !== 'function')\n      return;\n    activeTaskRef.current.scrollIntoView({ block: 'nearest' });\n  }, [activeTaskId, scrollActiveIntoView]);\n\n  if ((hideWhenEmpty && total === 0) || (hideWhenComplete && total > 0 && completed === total)) return null;\n\n  return (\n    <TaskListContainer aria-label=\"Task list\" data-testid=\"task-list\" {...props}>\n      <TaskListHeader>\n        <ListChecks className=\"size-4 shrink-0 text-accent6\" />\n        <h2 className=\"text-ui-sm leading-ui-sm font-medium text-neutral6\">{title}</h2>\n        <TaskListCount completed={completed} total={total} />\n      </TaskListHeader>\n      <TaskListProgress completed={completed} total={total} />\n      <ul className=\"max-h-32 space-y-1 overflow-y-auto pr-1\">\n        {tasks.map(task => (\n          <TaskListRow key={task.id} ref={task.id === activeTaskId ? activeTaskRef : undefined} task={task} />\n        ))}\n      </ul>\n    </TaskListContainer>\n  );\n};\n"],"names":["jsx","cn","jsxs","CheckCircle2","Loader2","Circle","useRef","useEffect","ListChecks"],"mappings":"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"}

package/dist/components/ai/task-list.d.ts

@@ -0,0 +1,2 @@
+export * from '../../src/ds/components/ai/task-list/index'
+export {}

package/dist/components/ai/task-list.es.js

@@ -0,0 +1,80 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { ListChecks, Circle, Loader2, CheckCircle2 } from 'lucide-react';
+import { useRef, useEffect } from 'react';
+import { c as cn } from '../../cn-BakJzhuv.js';
+
+const TaskListContainer = ({ className, ...props }) => /* @__PURE__ */ jsx("section", { className: cn("rounded-2xl border border-border2/40 bg-surface3 px-3 py-2.5", className), ...props });
+const TaskListHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("header", { className: cn("mb-2 flex items-center gap-2", className), ...props });
+const TaskListCount = ({ completed, total, className, ...props }) => /* @__PURE__ */ jsxs("span", { className: cn("ml-auto text-ui-xs text-neutral4 tabular-nums", className), ...props, children: [
+  completed,
+  "/",
+  total,
+  " completed"
+] });
+const TaskListProgress = ({ completed, total, className, ...props }) => {
+  const percentage = total === 0 ? 0 : completed / total * 100;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "progressbar",
+      "aria-label": "Task completion",
+      "aria-valuemin": 0,
+      "aria-valuemax": total,
+      "aria-valuenow": completed,
+      className: cn("mb-2.5 h-1 w-full rounded-full bg-surface4", className),
+      ...props,
+      children: /* @__PURE__ */ jsx("div", { className: "h-full rounded-full bg-accent6 transition-all duration-300", style: { width: `${percentage}%` } })
+    }
+  );
+};
+const icons = {
+  completed: /* @__PURE__ */ jsx(CheckCircle2, { className: "size-3.5 shrink-0 text-positive1" }),
+  in_progress: /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 shrink-0 text-warning1 motion-safe:animate-spin" }),
+  pending: /* @__PURE__ */ jsx(Circle, { className: "size-3.5 shrink-0 text-neutral4" })
+};
+const statusLabels = {
+  completed: "Completed",
+  in_progress: "In progress",
+  pending: "Pending"
+};
+const textClasses = {
+  completed: "text-neutral4 line-through",
+  in_progress: "font-medium text-warning1",
+  pending: "text-neutral5"
+};
+const TaskListStatusIcon = ({ status, className, ...props }) => /* @__PURE__ */ jsx("span", { "aria-label": statusLabels[status], className: cn("pt-0.5", className), ...props, children: icons[status] });
+const TaskListRow = ({ task, className, ...props }) => /* @__PURE__ */ jsxs("li", { className: cn("flex items-start gap-2 py-0.5", className), ...props, children: [
+  /* @__PURE__ */ jsx(TaskListStatusIcon, { status: task.status }),
+  /* @__PURE__ */ jsx("span", { className: cn("text-ui-sm leading-ui-sm", textClasses[task.status]), children: task.status === "in_progress" ? task.activeForm : task.content })
+] });
+const TaskList = ({
+  tasks,
+  title = "Tasks",
+  hideWhenEmpty = true,
+  hideWhenComplete = true,
+  scrollActiveIntoView = true,
+  ...props
+}) => {
+  const activeTaskRef = useRef(null);
+  const activeTaskId = tasks.find((task) => task.status === "in_progress")?.id;
+  const completed = tasks.filter((task) => task.status === "completed").length;
+  const total = tasks.length;
+  useEffect(() => {
+    if (!scrollActiveIntoView || !activeTaskRef.current || typeof activeTaskRef.current.scrollIntoView !== "function")
+      return;
+    activeTaskRef.current.scrollIntoView({ block: "nearest" });
+  }, [activeTaskId, scrollActiveIntoView]);
+  if (hideWhenEmpty && total === 0 || hideWhenComplete && total > 0 && completed === total) return null;
+  return /* @__PURE__ */ jsxs(TaskListContainer, { "aria-label": "Task list", "data-testid": "task-list", ...props, children: [
+    /* @__PURE__ */ jsxs(TaskListHeader, { children: [
+      /* @__PURE__ */ jsx(ListChecks, { className: "size-4 shrink-0 text-accent6" }),
+      /* @__PURE__ */ jsx("h2", { className: "text-ui-sm leading-ui-sm font-medium text-neutral6", children: title }),
+      /* @__PURE__ */ jsx(TaskListCount, { completed, total })
+    ] }),
+    /* @__PURE__ */ jsx(TaskListProgress, { completed, total }),
+    /* @__PURE__ */ jsx("ul", { className: "max-h-32 space-y-1 overflow-y-auto pr-1", children: tasks.map((task) => /* @__PURE__ */ jsx(TaskListRow, { ref: task.id === activeTaskId ? activeTaskRef : void 0, task }, task.id)) })
+  ] });
+};
+
+export { TaskList, TaskListContainer, TaskListCount, TaskListHeader, TaskListProgress, TaskListRow, TaskListStatusIcon };
+//# sourceMappingURL=task-list.es.js.map

package/dist/components/ai/task-list.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"task-list.es.js","sources":["../../../src/ds/components/ai/task-list/task-list.tsx"],"sourcesContent":["import type { TaskItem } from '@mastra/core/signals';\nimport { CheckCircle2, Circle, ListChecks, Loader2 } from 'lucide-react';\nimport { useEffect, useRef } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport type TaskListItem = TaskItem;\n\nexport const TaskListContainer = ({ className, ...props }: ComponentProps<'section'>) => (\n  <section className={cn('rounded-2xl border border-border2/40 bg-surface3 px-3 py-2.5', className)} {...props} />\n);\n\nexport const TaskListHeader = ({ className, ...props }: ComponentProps<'header'>) => (\n  <header className={cn('mb-2 flex items-center gap-2', className)} {...props} />\n);\n\nexport interface TaskListCountProps extends ComponentProps<'span'> {\n  completed: number;\n  total: number;\n}\n\nexport const TaskListCount = ({ completed, total, className, ...props }: TaskListCountProps) => (\n  <span className={cn('ml-auto text-ui-xs text-neutral4 tabular-nums', className)} {...props}>\n    {completed}/{total} completed\n  </span>\n);\n\nexport interface TaskListProgressProps extends Omit<ComponentProps<'div'>, 'children'> {\n  completed: number;\n  total: number;\n}\n\nexport const TaskListProgress = ({ completed, total, className, ...props }: TaskListProgressProps) => {\n  const percentage = total === 0 ? 0 : (completed / total) * 100;\n  return (\n    <div\n      role=\"progressbar\"\n      aria-label=\"Task completion\"\n      aria-valuemin={0}\n      aria-valuemax={total}\n      aria-valuenow={completed}\n      className={cn('mb-2.5 h-1 w-full rounded-full bg-surface4', className)}\n      {...props}\n    >\n      <div className=\"h-full rounded-full bg-accent6 transition-all duration-300\" style={{ width: `${percentage}%` }} />\n    </div>\n  );\n};\n\nconst icons: Record<TaskListItem['status'], ReactNode> = {\n  completed: <CheckCircle2 className=\"size-3.5 shrink-0 text-positive1\" />,\n  in_progress: <Loader2 className=\"size-3.5 shrink-0 text-warning1 motion-safe:animate-spin\" />,\n  pending: <Circle className=\"size-3.5 shrink-0 text-neutral4\" />,\n};\n\nconst statusLabels: Record<TaskListItem['status'], string> = {\n  completed: 'Completed',\n  in_progress: 'In progress',\n  pending: 'Pending',\n};\n\nconst textClasses: Record<TaskListItem['status'], string> = {\n  completed: 'text-neutral4 line-through',\n  in_progress: 'font-medium text-warning1',\n  pending: 'text-neutral5',\n};\n\nexport interface TaskListStatusIconProps extends ComponentProps<'span'> {\n  status: TaskListItem['status'];\n}\n\nexport const TaskListStatusIcon = ({ status, className, ...props }: TaskListStatusIconProps) => (\n  <span aria-label={statusLabels[status]} className={cn('pt-0.5', className)} {...props}>\n    {icons[status]}\n  </span>\n);\n\nexport interface TaskListRowProps extends ComponentProps<'li'> {\n  task: TaskListItem;\n}\n\nexport const TaskListRow = ({ task, className, ...props }: TaskListRowProps) => (\n  <li className={cn('flex items-start gap-2 py-0.5', className)} {...props}>\n    <TaskListStatusIcon status={task.status} />\n    <span className={cn('text-ui-sm leading-ui-sm', textClasses[task.status])}>\n      {task.status === 'in_progress' ? task.activeForm : task.content}\n    </span>\n  </li>\n);\n\nexport interface TaskListProps extends Omit<ComponentProps<typeof TaskListContainer>, 'children' | 'title'> {\n  tasks: TaskListItem[];\n  title?: ReactNode;\n  hideWhenEmpty?: boolean;\n  hideWhenComplete?: boolean;\n  scrollActiveIntoView?: boolean;\n}\n\nexport const TaskList = ({\n  tasks,\n  title = 'Tasks',\n  hideWhenEmpty = true,\n  hideWhenComplete = true,\n  scrollActiveIntoView = true,\n  ...props\n}: TaskListProps) => {\n  const activeTaskRef = useRef<HTMLLIElement | null>(null);\n  const activeTaskId = tasks.find(task => task.status === 'in_progress')?.id;\n  const completed = tasks.filter(task => task.status === 'completed').length;\n  const total = tasks.length;\n\n  useEffect(() => {\n    if (!scrollActiveIntoView || !activeTaskRef.current || typeof activeTaskRef.current.scrollIntoView !== 'function')\n      return;\n    activeTaskRef.current.scrollIntoView({ block: 'nearest' });\n  }, [activeTaskId, scrollActiveIntoView]);\n\n  if ((hideWhenEmpty && total === 0) || (hideWhenComplete && total > 0 && completed === total)) return null;\n\n  return (\n    <TaskListContainer aria-label=\"Task list\" data-testid=\"task-list\" {...props}>\n      <TaskListHeader>\n        <ListChecks className=\"size-4 shrink-0 text-accent6\" />\n        <h2 className=\"text-ui-sm leading-ui-sm font-medium text-neutral6\">{title}</h2>\n        <TaskListCount completed={completed} total={total} />\n      </TaskListHeader>\n      <TaskListProgress completed={completed} total={total} />\n      <ul className=\"max-h-32 space-y-1 overflow-y-auto pr-1\">\n        {tasks.map(task => (\n          <TaskListRow key={task.id} ref={task.id === activeTaskId ? activeTaskRef : undefined} task={task} />\n        ))}\n      </ul>\n    </TaskListContainer>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/{data-code-section-Crs5wpnX.js → data-code-section-BjqDCzy3.js}

@@ -10,11 +10,11 @@ import ReactCodeMirror from '@uiw/react-codemirror';
 import { AlignLeftIcon, AlignJustifyIcon, ExpandIcon, XIcon } from 'lucide-react';
 import { useState, useRef, useMemo, useCallback } from 'react';
 import { B as Button } from './Button-Dh5CZ6Ir.js';
-import { B as ButtonsGroup } from './buttons-group-b6an6uao.js';
+import { B as ButtonsGroup } from './buttons-group-DJh4wnMs.js';
 import { C as CopyButton } from './copy-button-BuIpvUI7.js';
 import { c as cn } from './cn-BakJzhuv.js';
 import { D as Dialog, c as DialogContent, f as DialogHeader, i as DialogTitle, d as DialogDescription, b as DialogClose } from './dialog-DhjOHEDT.js';
-import { S as SearchFieldBlock } from './search-field-block-e9qthuwY.js';
+import { S as SearchFieldBlock } from './search-field-block-CMoQ9fjl.js';
 import { u as useTheme } from './theme-provider-C9ih9jSS.js';
 
 function DataPanelSectionHeading({ icon, className, children }) {
@@ -329,4 +329,4 @@ function containsInnerNewline(obj) {
 }
 
 export { DataCodeSection as D, DataPanelSectionHeading as a };
-//# sourceMappingURL=data-code-section-Crs5wpnX.js.map
+//# sourceMappingURL=data-code-section-BjqDCzy3.js.map