impact-nova 2.6.2 → 3.0.0-alpha.0

package/dist/components/flows/iris-chat/iris-chat-menu.js

@@ -0,0 +1,259 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { useRef as S, useState as y } from "react";
+import { FunnelShow as I, ThreeDots as L, Pin as M, Pencil as A, Bin as D, ChevronRight as T } from "impact-nova-icons";
+import { DropdownMenu as g, DropdownMenuTrigger as v, DropdownMenuContent as b, DropdownMenuItem as f } from "../../feedback/dropdown-menu/dropdown-menu.js";
+import { ButtonIconTooltip as N } from "../../feedback/tooltip/button-icon-tooltip.js";
+import { Button as x } from "../../primitives/button/button.js";
+import { Accordion as j, AccordionItem as k, AccordionTrigger as R, AccordionContent as E } from "../../primitives/accordion/accordion.js";
+import { useImpactNovaI18n as w } from "../../../i18n/use-impact-nova-i18n.js";
+import { useVirtualizedList as B } from "../../../lib/virtualized/useVirtualizedList.js";
+import { createComponent as O } from "../../../lib/primitives/create-component.js";
+import { cn as C } from "../../../lib/utils.js";
+import { IrisChatAttachIcon as $ } from "./iris-chat-icons.js";
+const z = ["type", "status", "lastActivity"], ee = O(
+  "IrisChatMenu",
+  ({ className: t, children: m, ...l }, c) => /* @__PURE__ */ e(
+    "div",
+    {
+      ref: c,
+      "data-component": "iris-chat-menu",
+      className: C("flex flex-col gap-4 py-4", t),
+      ...l,
+      children: /* @__PURE__ */ e(j, { type: "multiple", defaultValue: ["recent", "artifacts"], className: "flex flex-col gap-4", children: m })
+    }
+  )
+), P = ({
+  value: t,
+  title: m,
+  onFilterSelect: l,
+  onViewMore: c,
+  viewMoreLabel: a,
+  className: h,
+  children: p
+}) => {
+  const { t: i } = w(), d = {
+    type: i("irisChat.filterType"),
+    status: i("irisChat.filterStatus"),
+    lastActivity: i("irisChat.filterLastActivity")
+  };
+  return /* @__PURE__ */ s(
+    k,
+    {
+      value: t,
+      "data-component": "iris-chat-menu-section",
+      className: C("rounded-none border-0 bg-transparent shadow-none", h),
+      children: [
+        /* @__PURE__ */ s("div", { className: "flex h-10 items-center justify-between gap-2", children: [
+          /* @__PURE__ */ s(R, { variant: "plain", headingLevel: 3, className: "flex min-w-0 flex-1 items-center gap-2 py-0", children: [
+            /* @__PURE__ */ e("span", { className: "flex size-6 shrink-0 items-center justify-center rounded-full bg-secondary text-content-secondary", children: /* @__PURE__ */ e(
+              T,
+              {
+                size: 14,
+                className: "rotate-90 transition-transform group-data-[state=open]:-rotate-90"
+              }
+            ) }),
+            /* @__PURE__ */ e("span", { className: "text-sm font-medium text-content", children: m })
+          ] }),
+          /* @__PURE__ */ s(g, { children: [
+            /* @__PURE__ */ e(N, { label: i("irisChat.filter"), children: /* @__PURE__ */ e(v, { asChild: !0, children: /* @__PURE__ */ e(
+              x,
+              {
+                type: "button",
+                variant: "ghost",
+                size: "iconSm",
+                "aria-label": i("irisChat.filter"),
+                "data-testid": `iris-chat-filter-${t}`,
+                children: /* @__PURE__ */ e(I, { size: 16 })
+              }
+            ) }) }),
+            /* @__PURE__ */ e(b, { align: "end", children: z.map((o) => /* @__PURE__ */ e(f, { onSelect: () => l?.(o), children: d[o] }, o)) })
+          ] })
+        ] }),
+        /* @__PURE__ */ s(E, { className: "px-0 pb-1 pt-1", children: [
+          /* @__PURE__ */ e("div", { className: "flex flex-col", children: p }),
+          c ? /* @__PURE__ */ e(
+            x,
+            {
+              type: "button",
+              variant: "link",
+              "data-testid": `iris-chat-view-more-${t}`,
+              className: "mt-1 h-auto justify-start px-2 text-sm",
+              onClick: c,
+              children: a ?? i("irisChat.viewMore")
+            }
+          ) : null
+        ] })
+      ]
+    }
+  );
+};
+P.displayName = "IrisChatMenuSection";
+const V = ({ title: t, onSelect: m, onAction: l, className: c }) => {
+  const { t: a } = w(), [h, p] = y(!1), [i, d] = y(!1), [o, u] = y(t), n = () => {
+    const r = o.trim();
+    if (d(!1), !r || r === t) {
+      u(t);
+      return;
+    }
+    l?.("rename", r);
+  };
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      "data-component": "iris-chat-list-item",
+      "data-menu-open": h ? "" : void 0,
+      className: C(
+        "flex min-h-10 items-center justify-between gap-2 rounded-full px-3",
+        (h || i) && "bg-secondary",
+        "hover:bg-secondary",
+        c
+      ),
+      children: [
+        i ? /* @__PURE__ */ e(
+          "input",
+          {
+            value: o,
+            autoFocus: !0,
+            "aria-label": a("irisChat.rename"),
+            "data-testid": "iris-chat-item-rename",
+            className: "min-w-0 flex-1 bg-transparent text-sm text-content outline-none",
+            onChange: (r) => u(r.target.value),
+            onBlur: n,
+            onKeyDown: (r) => {
+              r.key === "Enter" && (r.preventDefault(), n()), r.key === "Escape" && (u(t), d(!1));
+            }
+          }
+        ) : /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            className: "min-w-0 flex-1 truncate text-start text-sm text-content",
+            onClick: m,
+            children: t
+          }
+        ),
+        /* @__PURE__ */ s(g, { open: h, onOpenChange: p, children: [
+          /* @__PURE__ */ e(N, { label: a("irisChat.moreActions"), children: /* @__PURE__ */ e(v, { asChild: !0, children: /* @__PURE__ */ e(
+            x,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "iconSm",
+              "aria-label": a("irisChat.moreActions"),
+              "data-testid": "iris-chat-item-more",
+              children: /* @__PURE__ */ e(L, { size: 16 })
+            }
+          ) }) }),
+          /* @__PURE__ */ s(b, { align: "end", className: "w-[182px]", children: [
+            /* @__PURE__ */ e(
+              f,
+              {
+                icon: /* @__PURE__ */ e(M, { size: 16 }),
+                onSelect: () => l?.("pin"),
+                children: a("irisChat.pin")
+              }
+            ),
+            /* @__PURE__ */ e(
+              f,
+              {
+                icon: /* @__PURE__ */ e(A, { size: 16 }),
+                onSelect: () => {
+                  u(t), window.setTimeout(() => d(!0), 0);
+                },
+                children: a("irisChat.rename")
+              }
+            ),
+            /* @__PURE__ */ e(
+              f,
+              {
+                icon: /* @__PURE__ */ e($, {}),
+                onSelect: () => l?.("archive"),
+                children: a("irisChat.archive")
+              }
+            ),
+            /* @__PURE__ */ e(
+              f,
+              {
+                icon: /* @__PURE__ */ e(D, { size: 16 }),
+                className: "text-destructive focus:bg-destructive/10 focus:text-destructive",
+                onSelect: () => l?.("delete"),
+                children: a("irisChat.delete")
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+};
+V.displayName = "IrisChatListItem";
+function F({
+  items: t,
+  getItemId: m,
+  renderItem: l,
+  title: c,
+  onFilterSelect: a,
+  estimateSize: h = 32,
+  className: p
+}) {
+  const { t: i } = w(), d = S(null), o = B({
+    rowCount: t.length,
+    getRowData: (n) => t[n],
+    getRowId: (n) => m(t[n]),
+    estimateSize: () => h,
+    scrollElementRef: d,
+    hasMore: !1
+  }), u = {
+    type: i("irisChat.filterType"),
+    status: i("irisChat.filterStatus"),
+    lastActivity: i("irisChat.filterLastActivity")
+  };
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      "data-component": "iris-chat-list",
+      className: C("flex min-h-0 flex-1 flex-col", p),
+      children: [
+        c || a ? /* @__PURE__ */ s("div", { className: "flex items-center justify-between gap-2 py-3", children: [
+          c ? /* @__PURE__ */ e("p", { className: "text-sm font-medium text-content", children: c }) : /* @__PURE__ */ e("span", {}),
+          a ? /* @__PURE__ */ s(g, { children: [
+            /* @__PURE__ */ e(N, { label: i("irisChat.filter"), children: /* @__PURE__ */ e(v, { asChild: !0, children: /* @__PURE__ */ e(
+              x,
+              {
+                type: "button",
+                variant: "ghost",
+                size: "iconSm",
+                "aria-label": i("irisChat.filter"),
+                "data-testid": "iris-chat-filter-list",
+                children: /* @__PURE__ */ e(I, { size: 16 })
+              }
+            ) }) }),
+            /* @__PURE__ */ e(b, { align: "end", children: z.map((n) => /* @__PURE__ */ e(f, { onSelect: () => a(n), children: u[n] }, n)) })
+          ] }) : null
+        ] }) : null,
+        /* @__PURE__ */ e("div", { ref: d, className: "min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ e("div", { style: { height: o.virtualizer.getTotalSize(), position: "relative" }, children: o.virtualizer.getVirtualItems().map((n) => {
+          const r = t[n.index];
+          return /* @__PURE__ */ e(
+            "div",
+            {
+              className: "absolute inset-x-0",
+              style: {
+                height: n.size,
+                transform: `translateY(${n.start}px)`
+              },
+              children: l(r)
+            },
+            m(r)
+          );
+        }) }) })
+      ]
+    }
+  );
+}
+F.displayName = "IrisChatList";
+export {
+  F as IrisChatList,
+  V as IrisChatListItem,
+  ee as IrisChatMenu,
+  P as IrisChatMenuSection
+};

package/dist/components/flows/iris-chat/iris-chat-prompt.d.ts

@@ -0,0 +1,3 @@
+import { IrisChatPromptProps } from './iris-chat.types';
+declare const IrisChatPrompt: import('react').ForwardRefExoticComponent<IrisChatPromptProps & import('react').RefAttributes<HTMLFormElement>>;
+export { IrisChatPrompt };

package/dist/components/flows/iris-chat/iris-chat-prompt.js

@@ -0,0 +1,46 @@
+import { jsxs as l, jsx as o } from "react/jsx-runtime";
+import { Button as c } from "../../primitives/button/button.js";
+import { useImpactNovaI18n as d } from "../../../i18n/use-impact-nova-i18n.js";
+import { createComponent as f } from "../../../lib/primitives/create-component.js";
+import { cn as u } from "../../../lib/utils.js";
+const b = f(
+  "IrisChatPrompt",
+  ({
+    className: e,
+    title: t,
+    children: m,
+    submitLabel: n,
+    submitDisabled: r = !1,
+    onSubmit: a
+  }, i) => {
+    const { t: p } = d();
+    return /* @__PURE__ */ l(
+      "form",
+      {
+        ref: i,
+        "data-component": "iris-chat-prompt",
+        className: u("flex w-full min-w-0 flex-col gap-4 rounded-2xl bg-secondary p-4", e),
+        onSubmit: (s) => {
+          s.preventDefault(), !r && a?.();
+        },
+        children: [
+          t ? /* @__PURE__ */ o("p", { className: "text-sm font-medium leading-5 text-content", children: t }) : null,
+          m,
+          /* @__PURE__ */ o(
+            c,
+            {
+              type: "submit",
+              disabled: r,
+              "data-testid": "iris-chat-prompt-submit",
+              className: "w-fit rounded-full",
+              children: n ?? p("irisChat.applySend")
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+export {
+  b as IrisChatPrompt
+};

package/dist/components/flows/iris-chat/iris-chat-thinking.d.ts

@@ -0,0 +1,12 @@
+import { IrisChatCitationsProps, IrisChatProcessStepsProps, IrisChatThinkingProps, IrisChatThinkingStatusProps } from './iris-chat.types';
+declare const IrisChatThinking: import('react').ForwardRefExoticComponent<IrisChatThinkingProps & import('react').RefAttributes<HTMLDivElement>>;
+declare const IrisChatThinkingStatus: import('react').ForwardRefExoticComponent<IrisChatThinkingStatusProps & import('react').RefAttributes<HTMLDivElement>>;
+declare const IrisChatProcessSteps: {
+    ({ title, steps, defaultOpen, open, onOpenChange, className, }: IrisChatProcessStepsProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const IrisChatCitations: {
+    ({ title, groups, defaultOpen, open, onOpenChange, className, }: IrisChatCitationsProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { IrisChatCitations, IrisChatProcessSteps, IrisChatThinking, IrisChatThinkingStatus };

package/dist/components/flows/iris-chat/iris-chat-thinking.js

@@ -0,0 +1,202 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { useState as S, useEffect as _ } from "react";
+import { ChevronRight as b, Checkmark as A } from "impact-nova-icons";
+import { Accordion as C, AccordionItem as I, AccordionTrigger as y, AccordionContent as k } from "../../primitives/accordion/accordion.js";
+import { IrisAlanGradientIcon as v } from "../../primitives/iris/iris-alan-gradient-icon.js";
+import { useImpactNovaI18n as g } from "../../../i18n/use-impact-nova-i18n.js";
+import { useControllableState as w } from "@radix-ui/react-use-controllable-state";
+import { createComponent as T } from "../../../lib/primitives/create-component.js";
+import { cn as l } from "../../../lib/utils.js";
+const D = T(
+  "IrisChatThinking",
+  ({ className: n, ...s }, a) => /* @__PURE__ */ e(
+    "div",
+    {
+      ref: a,
+      "data-component": "iris-chat-thinking",
+      className: l("flex w-full flex-col gap-2", n),
+      ...s
+    }
+  )
+), z = 1e4, R = 6e4;
+function G() {
+  const [n, s] = S("typing");
+  return _(() => {
+    const a = window.setTimeout(() => s("falling"), z), r = window.setTimeout(() => s("bricks"), R);
+    return () => {
+      window.clearTimeout(a), window.clearTimeout(r);
+    };
+  }, []), /* @__PURE__ */ e("span", { className: "iris-dot-loader-wrap", "aria-hidden": !0, children: /* @__PURE__ */ e(
+    "span",
+    {
+      "data-testid": "iris-chat-thinking-dots",
+      "data-stage": n,
+      className: l(
+        "iris-dot-loader",
+        n === "typing" && "iris-dot-typing",
+        n === "falling" && "iris-dot-falling",
+        n === "bricks" && "iris-dot-bricks"
+      )
+    }
+  ) });
+}
+const q = T(
+  "IrisChatThinkingStatus",
+  ({ className: n, children: s, ...a }, r) => {
+    const { t: o } = g();
+    return /* @__PURE__ */ i(
+      "div",
+      {
+        ref: r,
+        "data-component": "iris-chat-thinking-status",
+        role: "status",
+        "aria-label": o("irisChat.thinking"),
+        className: l(
+          "flex h-4 items-center gap-1.5 leading-none text-sm text-content-secondary",
+          n
+        ),
+        ...a,
+        children: [
+          /* @__PURE__ */ e("span", { className: "inline-flex size-4 shrink-0 items-center justify-center animate-spin motion-reduce:animate-none [animation-duration:2.6s]", children: /* @__PURE__ */ e(v, { size: 16 }) }),
+          s ?? /* @__PURE__ */ e(G, {})
+        ]
+      }
+    );
+  }
+), L = ({
+  title: n,
+  steps: s,
+  defaultOpen: a = !1,
+  open: r,
+  onOpenChange: o,
+  className: p
+}) => {
+  const { t: h } = g(), [c, f] = w({
+    prop: r,
+    defaultProp: a,
+    onChange: o
+  }), x = n ?? h("irisChat.processSteps");
+  return /* @__PURE__ */ e(
+    C,
+    {
+      type: "single",
+      collapsible: !0,
+      value: c ? "steps" : "",
+      onValueChange: (t) => f(t === "steps"),
+      className: p,
+      children: /* @__PURE__ */ i(
+        I,
+        {
+          value: "steps",
+          className: "border-0 bg-transparent",
+          "data-component": "iris-chat-process-steps",
+          children: [
+            /* @__PURE__ */ i(
+              y,
+              {
+                variant: "plain",
+                headingLevel: 3,
+                className: "flex w-full items-center gap-2 py-1.5",
+                children: [
+                  /* @__PURE__ */ e(v, { size: 16 }),
+                  /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 text-start text-sm font-medium text-content", children: x }),
+                  /* @__PURE__ */ e(
+                    b,
+                    {
+                      size: 16,
+                      className: l("shrink-0 text-content-secondary", c && "rotate-90")
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ e(k, { className: "px-0 pb-2 pt-1", children: /* @__PURE__ */ e("ol", { className: "flex flex-col gap-2 ps-6", children: s.map((t) => /* @__PURE__ */ i("li", { className: "flex flex-col gap-1 text-sm text-content", children: [
+              /* @__PURE__ */ i("span", { className: "flex items-center gap-2", children: [
+                t.status === "complete" ? /* @__PURE__ */ e(A, { size: 14, className: "text-brand" }) : /* @__PURE__ */ e("span", { className: "size-2 rounded-full bg-brand" }),
+                t.label
+              ] }),
+              t.chip ? /* @__PURE__ */ e("span", { className: "ms-6 w-fit rounded-md bg-secondary px-2 py-0.5 font-mono text-xs", children: t.chip }) : null
+            ] }, t.id)) }) })
+          ]
+        }
+      )
+    }
+  );
+};
+L.displayName = "IrisChatProcessSteps";
+const O = ({
+  title: n,
+  groups: s,
+  defaultOpen: a = !1,
+  open: r,
+  onOpenChange: o,
+  className: p
+}) => {
+  const { t: h } = g(), [c, f] = w({
+    prop: r,
+    defaultProp: a,
+    onChange: o
+  }), x = n ?? h("irisChat.citations");
+  return /* @__PURE__ */ e(
+    C,
+    {
+      type: "single",
+      collapsible: !0,
+      value: c ? "citations" : "",
+      onValueChange: (t) => f(t === "citations"),
+      className: p,
+      children: /* @__PURE__ */ i(
+        I,
+        {
+          value: "citations",
+          className: "border-0 bg-transparent",
+          "data-component": "iris-chat-citations",
+          children: [
+            /* @__PURE__ */ i(
+              y,
+              {
+                variant: "plain",
+                headingLevel: 3,
+                className: "flex w-full items-center gap-2 py-1.5",
+                children: [
+                  /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 text-start text-sm font-medium text-content", children: x }),
+                  /* @__PURE__ */ e(
+                    b,
+                    {
+                      size: 16,
+                      className: l("shrink-0 text-content-secondary", c && "rotate-90")
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ e(k, { className: "px-0 pb-2 pt-1", children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-3", children: s.map((t) => /* @__PURE__ */ i("div", { className: "flex flex-col gap-1", children: [
+              /* @__PURE__ */ e("p", { className: "text-xs font-medium text-content-secondary", children: t.label }),
+              /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-1", children: t.tags.map((d) => {
+                const m = typeof d == "string" ? d : d.label, u = typeof d == "string" ? void 0 : d.href, N = "rounded-md bg-secondary px-2 py-0.5 text-xs text-content";
+                return u ? /* @__PURE__ */ e(
+                  "a",
+                  {
+                    href: u,
+                    target: "_blank",
+                    rel: "noreferrer",
+                    className: l(N, "text-brand underline"),
+                    children: m
+                  },
+                  m
+                ) : /* @__PURE__ */ e("span", { className: N, children: m }, m);
+              }) })
+            ] }, t.id)) }) })
+          ]
+        }
+      )
+    }
+  );
+};
+O.displayName = "IrisChatCitations";
+export {
+  O as IrisChatCitations,
+  L as IrisChatProcessSteps,
+  D as IrisChatThinking,
+  q as IrisChatThinkingStatus
+};

package/dist/components/flows/iris-chat/iris-chat-thread.d.ts

@@ -0,0 +1,37 @@
+import { IrisChatAttachmentProps, IrisChatErrorProps, IrisChatDayProps, IrisChatFollowUpListProps, IrisChatFollowUpProps, IrisChatGreetingProps, IrisChatSuggestionProps, IrisChatThreadProps } from './iris-chat.types';
+import * as React from "react";
+declare const IrisChatGreeting: React.ForwardRefExoticComponent<IrisChatGreetingProps & React.RefAttributes<HTMLDivElement>>;
+declare const IrisChatSuggestions: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const IrisChatSuggestion: React.ForwardRefExoticComponent<IrisChatSuggestionProps & React.RefAttributes<HTMLButtonElement>>;
+declare const IrisChatWorkflows: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    onShowMore?: () => void;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const IrisChatWorkflow: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    title: string;
+    description?: string;
+} & React.RefAttributes<HTMLButtonElement>>;
+declare const IrisChatThread: React.ForwardRefExoticComponent<IrisChatThreadProps & React.RefAttributes<HTMLDivElement>>;
+declare const IrisChatDay: React.ForwardRefExoticComponent<IrisChatDayProps & React.RefAttributes<HTMLDivElement>>;
+declare const IrisChatMessage: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
+    role: import('./iris-chat.types').IrisChatRole;
+    time?: string;
+} & React.RefAttributes<HTMLElement>>;
+declare const IrisChatActions: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    liked?: boolean;
+    disliked?: boolean;
+    copyText?: string;
+    onLike?: () => void;
+    onDislike?: () => void;
+    onCopy?: () => void;
+    onRetry?: () => void;
+    onSpeak?: () => void;
+    onFeedback?: (feedback: import('./iris-chat.types').IrisChatFeedback) => void;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const IrisChatFollowUps: React.ForwardRefExoticComponent<IrisChatFollowUpListProps & React.RefAttributes<HTMLDivElement>>;
+declare const IrisChatFollowUp: React.ForwardRefExoticComponent<IrisChatFollowUpProps & React.RefAttributes<HTMLButtonElement>>;
+declare const IrisChatAttachment: React.ForwardRefExoticComponent<IrisChatAttachmentProps & React.RefAttributes<HTMLDivElement>>;
+declare const IrisChatError: React.ForwardRefExoticComponent<IrisChatErrorProps & React.RefAttributes<HTMLDivElement>>;
+declare const IrisChatChip: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    variant?: "default" | "outline";
+} & React.RefAttributes<HTMLButtonElement>>;
+export { IrisChatActions, IrisChatAttachment, IrisChatChip, IrisChatDay, IrisChatError, IrisChatFollowUp, IrisChatFollowUps, IrisChatGreeting, IrisChatMessage, IrisChatSuggestion, IrisChatSuggestions, IrisChatThread, IrisChatWorkflow, IrisChatWorkflows, };