@actioneer/ads 0.1.0

package/components/ai-elements/task.js

@@ -0,0 +1,73 @@
+"use client";
+import { jsx as a, jsxs as r } from "react/jsx-runtime";
+import { Collapsible as i, CollapsibleContent as l, CollapsibleTrigger as d } from "../collapsible.js";
+import { Search as m, ChevronDown as c } from "../../lib/icons.js";
+import { cn as o } from "../../lib/cn.js";
+const p = ({
+  children: e,
+  className: t,
+  ...s
+}) => /* @__PURE__ */ a(
+  "div",
+  {
+    className: o(
+      "inline-flex items-center gap-1 rounded-md bg-fill px-1.5 py-0.5 text-xs text-fill-foreground",
+      t
+    ),
+    ...s,
+    children: e
+  }
+);
+p.displayName = "TaskItemFile";
+const u = ({ children: e, className: t, ...s }) => /* @__PURE__ */ a("div", { className: o("text-base text-secondary", t), ...s, children: e });
+u.displayName = "TaskItem";
+const f = ({ defaultOpen: e = !0, className: t, ...s }) => /* @__PURE__ */ a(i, { className: o(t), defaultOpen: e, ...s });
+f.displayName = "Task";
+const g = ({
+  children: e,
+  className: t,
+  title: s,
+  ...n
+}) => /* @__PURE__ */ a(d, { asChild: !0, className: o("group", t), ...n, children: e ?? /* @__PURE__ */ r(
+  "button",
+  {
+    type: "button",
+    className: "flex w-full cursor-pointer items-center gap-2 rounded-sm text-base text-secondary outline-none transition-colors hover:text-foreground focus-visible:ring-3 focus-visible:ring-ring motion-reduce:transition-none",
+    children: [
+      /* @__PURE__ */ a(m, { className: "size-4 shrink-0", "aria-hidden": !0 }),
+      /* @__PURE__ */ a("span", { className: "text-base", children: s }),
+      /* @__PURE__ */ a(
+        c,
+        {
+          className: "size-4 shrink-0 transition-transform duration-(--duration-fast) ease-out group-data-[state=open]:rotate-180 motion-reduce:transition-none",
+          "aria-hidden": !0
+        }
+      )
+    ]
+  }
+) });
+g.displayName = "TaskTrigger";
+const x = ({
+  children: e,
+  className: t,
+  ...s
+}) => /* @__PURE__ */ a(
+  l,
+  {
+    className: o(
+      "overflow-hidden text-foreground outline-none",
+      "data-[state=closed]:pointer-events-none",
+      t
+    ),
+    ...s,
+    children: /* @__PURE__ */ a("div", { className: "mt-4 space-y-2 border-l-2 border-border pl-4", children: e })
+  }
+);
+x.displayName = "TaskContent";
+export {
+  f as Task,
+  x as TaskContent,
+  u as TaskItem,
+  p as TaskItemFile,
+  g as TaskTrigger
+};

package/components/ai-elements/tool.d.ts

@@ -0,0 +1,53 @@
+import { ComponentProps } from 'react';
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../collapsible';
+/**
+ * Tool — a collapsible record of a single tool call: its name, a status badge,
+ * the input parameters, and the result/error. An ADS-native port of the Vercel
+ * AI Elements `Tool` component.
+ *
+ * Deviations from upstream (see the port notes): the `ai` package's
+ * `ToolUIPart` type is re-declared locally as {@link ToolState}; the upstream
+ * `CodeBlock` (syntax-highlighted) is mapped to a plain ADS-tokenized `<pre>`
+ * block; shadcn `Badge` is mapped to the ADS `Badge`.
+ */
+/**
+ * The tool-call lifecycle. Re-declared locally so this component carries no
+ * dependency on the `ai` package's `ToolUIPart["state"]` union.
+ */
+export type ToolState = "input-streaming" | "input-available" | "output-available" | "output-error";
+export type ToolProps = ComponentProps<typeof Collapsible>;
+export declare const Tool: {
+    ({ className, ...props }: ToolProps): import("react").JSX.Element;
+    displayName: string;
+};
+export type ToolHeaderProps = {
+    title?: string;
+    type: string;
+    state: ToolState;
+    className?: string;
+} & Omit<ComponentProps<typeof CollapsibleTrigger>, "type">;
+export declare const ToolHeader: {
+    ({ className, title, type, state, ...props }: ToolHeaderProps): import("react").JSX.Element;
+    displayName: string;
+};
+export type ToolContentProps = ComponentProps<typeof CollapsibleContent>;
+export declare const ToolContent: {
+    ({ className, ...props }: ToolContentProps): import("react").JSX.Element;
+    displayName: string;
+};
+export type ToolInputProps = ComponentProps<"div"> & {
+    input: unknown;
+};
+export declare const ToolInput: {
+    ({ className, input, ...props }: ToolInputProps): import("react").JSX.Element;
+    displayName: string;
+};
+export type ToolOutputProps = Omit<ComponentProps<"div">, "output"> & {
+    /** ReactNode passes through; any other value is stringified as JSON. */
+    output?: unknown;
+    errorText?: string;
+};
+export declare const ToolOutput: {
+    ({ className, output, errorText, ...props }: ToolOutputProps): import("react").JSX.Element | null;
+    displayName: string;
+};

package/components/ai-elements/tool.js

@@ -0,0 +1,116 @@
+"use client";
+import { jsx as o, jsxs as l } from "react/jsx-runtime";
+import { isValidElement as c } from "react";
+import { Collapsible as u, CollapsibleContent as m, CollapsibleTrigger as p } from "../collapsible.js";
+import { Badge as f } from "../badge.js";
+import { Wrench as g, ChevronDown as h, CloseCircle as x, CheckCircle as b, Clock as N, CircleDashed as v } from "../../lib/icons.js";
+import { cn as t } from "../../lib/cn.js";
+const y = ({ className: e, ...n }) => /* @__PURE__ */ o(
+  u,
+  {
+    className: t(
+      "not-prose group/tool w-full overflow-hidden rounded-xl bg-card",
+      e
+    ),
+    ...n
+  }
+);
+y.displayName = "Tool";
+const w = {
+  "input-streaming": { label: "Pending", color: "default", icon: v },
+  "input-available": { label: "Running", color: "info", icon: N, pulse: !0 },
+  "output-available": { label: "Completed", color: "success", icon: b },
+  "output-error": { label: "Error", color: "danger", icon: x }
+}, C = ({ state: e }) => {
+  const { label: n, color: r, icon: a, pulse: i } = w[e];
+  return /* @__PURE__ */ l(f, { variant: "soft", color: r, children: [
+    /* @__PURE__ */ o(
+      a,
+      {
+        className: t(
+          "size-3",
+          i && "animate-pulse motion-reduce:animate-none"
+        ),
+        "aria-hidden": !0
+      }
+    ),
+    n
+  ] });
+}, T = ({
+  className: e,
+  title: n,
+  type: r,
+  state: a,
+  ...i
+}) => /* @__PURE__ */ l(
+  p,
+  {
+    className: t(
+      "group/tool-header flex w-full items-center justify-between gap-4 px-4 py-3 text-left transition-colors hover:bg-muted motion-reduce:transition-none",
+      "outline-none focus-visible:ring-3 focus-visible:ring-ring",
+      e
+    ),
+    ...i,
+    children: [
+      /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ o(g, { className: "size-4 shrink-0 text-tertiary", "aria-hidden": !0 }),
+        /* @__PURE__ */ o("span", { className: "font-medium text-base", children: n ?? r.split("-").slice(1).join("-") }),
+        /* @__PURE__ */ o(C, { state: a })
+      ] }),
+      /* @__PURE__ */ o(
+        h,
+        {
+          className: "size-4 shrink-0 text-tertiary transition-transform duration-(--duration-fast) ease-out group-data-[state=open]/tool-header:rotate-180 motion-reduce:transition-none",
+          "aria-hidden": !0
+        }
+      )
+    ]
+  }
+);
+T.displayName = "ToolHeader";
+const S = ({ className: e, ...n }) => /* @__PURE__ */ o(
+  m,
+  {
+    className: t(
+      "overflow-hidden text-foreground outline-none",
+      "data-[state=closed]:pointer-events-none",
+      e
+    ),
+    ...n
+  }
+);
+S.displayName = "ToolContent";
+const s = ({
+  code: e,
+  className: n
+}) => /* @__PURE__ */ o(
+  "pre",
+  {
+    className: t(
+      "overflow-x-auto rounded-md bg-surface p-3 text-xs leading-relaxed text-foreground tabular-nums",
+      n
+    ),
+    children: /* @__PURE__ */ o("code", { children: e })
+  }
+), d = ({ children: e }) => /* @__PURE__ */ o("h4", { className: "text-xs font-medium uppercase tracking-wide text-tertiary", children: e }), j = ({ className: e, input: n, ...r }) => /* @__PURE__ */ l("div", { className: t("space-y-2 overflow-hidden p-4", e), ...r, children: [
+  /* @__PURE__ */ o(d, { children: "Parameters" }),
+  /* @__PURE__ */ o(s, { code: JSON.stringify(n, null, 2) })
+] });
+j.displayName = "ToolInput";
+const k = (e) => typeof e == "object" && e !== null && !c(e) ? /* @__PURE__ */ o(s, { code: JSON.stringify(e, null, 2) }) : typeof e == "string" ? /* @__PURE__ */ o("div", { className: "rounded-md bg-surface p-3 text-xs leading-relaxed text-foreground whitespace-pre-wrap", children: e }) : e, O = ({
+  className: e,
+  output: n,
+  errorText: r,
+  ...a
+}) => n || r ? /* @__PURE__ */ l("div", { className: t("space-y-2 p-4", e), ...a, children: [
+  /* @__PURE__ */ o(d, { children: r ? "Error" : "Result" }),
+  r ? /* @__PURE__ */ o("div", { className: "rounded-md bg-danger-50 p-3 text-xs leading-relaxed text-danger-700 whitespace-pre-wrap", children: r }) : /* @__PURE__ */ o("div", { className: "overflow-x-auto text-xs text-foreground [&_table]:w-full", children: k(n) })
+] }) : null;
+O.displayName = "ToolOutput";
+export {
+  y as Tool,
+  S as ToolContent,
+  T as ToolHeader,
+  j as ToolInput,
+  O as ToolOutput
+};

package/components/ai-elements/voice.d.ts

@@ -0,0 +1,74 @@
+import * as React from "react";
+/**
+ * Voice — the approved ADS voice visualizers and controls.
+ *
+ * `Voice` renders three volume-reactive WebGL visuals: the original ADS orb,
+ * plus LiveKit Agents UI's Aura and Wave shaders. All are driven by props, so
+ * consumers keep a transport-neutral integration surface.
+ *
+ * The controls (VoiceControl + friends) are standalone and props-driven — no
+ * assistant-ui runtime — so they compose with any transport.
+ *
+ * Reduced motion: honored through `<MotionConfig reducedMotion="user">` for the
+ * personas and a `reduced` freeze for every shader.
+ */
+export type VoiceState = "idle" | "connecting" | "listening" | "thinking" | "speaking" | "muted" | "asleep";
+export type VoiceVariant = "orb" | "aura" | "wave";
+export declare const VOICE_PALETTES: readonly ["default", "blue", "violet", "emerald", "sunset"];
+export type VoicePalette = (typeof VOICE_PALETTES)[number];
+/** Backwards-compatible name for the palette type originally used by Orb. */
+export type VoiceOrbPalette = VoicePalette;
+export declare const VOICE_VARIANTS: readonly ["orb", "aura", "wave"];
+export declare const VOICE_STATES: readonly ["idle", "connecting", "listening", "thinking", "speaking", "muted", "asleep"];
+export interface VoiceProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Reactive animation state. */
+    state?: VoiceState;
+    /** Visualizer style. */
+    variant?: VoiceVariant;
+    className?: string;
+    /** Normalized audio energy 0–1, shared by every visualizer. Default 0. */
+    volume?: number;
+    /** Shared shader colorway. Default "default". */
+    palette?: VoiceOrbPalette;
+    /** Fired once on mount (API parity with the old Persona `onReady`). */
+    onReady?: () => void;
+    "aria-label"?: string;
+}
+export declare const Voice: React.ForwardRefExoticComponent<VoiceProps & React.RefAttributes<HTMLDivElement>>;
+export interface VoiceStatusDotProps {
+    /** The session state the dot reflects. */
+    state?: VoiceState;
+    className?: string;
+}
+export declare function VoiceStatusDot({ state, className }: VoiceStatusDotProps): React.JSX.Element;
+export interface VoiceConnectButtonProps {
+    onConnect?: () => void;
+    disabled?: boolean;
+    className?: string;
+}
+export declare function VoiceConnectButton({ onConnect, disabled, className, }: VoiceConnectButtonProps): React.JSX.Element;
+export interface VoiceMuteButtonProps {
+    isMuted?: boolean;
+    onMute?: () => void;
+    onUnmute?: () => void;
+    disabled?: boolean;
+    className?: string;
+}
+export declare function VoiceMuteButton({ isMuted, onMute, onUnmute, disabled, className, }: VoiceMuteButtonProps): React.JSX.Element;
+export interface VoiceDisconnectButtonProps {
+    onDisconnect?: () => void;
+    disabled?: boolean;
+    className?: string;
+}
+export declare function VoiceDisconnectButton({ onDisconnect, disabled, className, }: VoiceDisconnectButtonProps): React.JSX.Element;
+export interface VoiceControlProps {
+    /** Session status. */
+    status: "ended" | "starting" | "running";
+    isMuted?: boolean;
+    onConnect?: () => void;
+    onMute?: () => void;
+    onUnmute?: () => void;
+    onDisconnect?: () => void;
+    className?: string;
+}
+export declare function VoiceControl({ status, isMuted, onConnect, onMute, onUnmute, onDisconnect, className, }: VoiceControlProps): React.JSX.Element;