impact-nova 3.0.0-alpha.6 → 3.0.0-alpha.7

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

@@ -1,13 +1,13 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { Download as y, ThreeDots as v } from "impact-nova-icons";
-import { Checkbox as C } from "../../forms/checkbox/checkbox.js";
-import { DropdownMenu as w, DropdownMenuTrigger as j, DropdownMenuContent as k, DropdownMenuItem as p } from "../../feedback/dropdown-menu/dropdown-menu.js";
+import { Download as N, ThreeDots as y } from "impact-nova-icons";
+import { Checkbox as v } from "../../forms/checkbox/checkbox.js";
+import { DropdownMenu as C, DropdownMenuTrigger as j, DropdownMenuContent as k, DropdownMenuItem as p } from "../../feedback/dropdown-menu/dropdown-menu.js";
 import { ButtonIconTooltip as x } from "../../feedback/tooltip/button-icon-tooltip.js";
-import { Button as b } from "../../primitives/button/button.js";
+import { Button as f } from "../../primitives/button/button.js";
 import { useImpactNovaI18n as I } from "../../../i18n/use-impact-nova-i18n.js";
-import { createComponent as f } from "../../../lib/primitives/create-component.js";
+import { createComponent as b } from "../../../lib/primitives/create-component.js";
 import { cn as u } from "../../../lib/utils.js";
-function N(o, i) {
+function g(o, i) {
   const a = o.map((l) => l.header).join(","), n = i.map(
     (l) => o.map((t) => {
       const d = l.cells[t.id];
@@ -18,16 +18,16 @@ function N(o, i) {
 `);
 }
 function S(o, i, a) {
-  const n = new Blob([N(i, a)], { type: "text/csv;charset=utf-8" }), l = URL.createObjectURL(n), t = document.createElement("a");
+  const n = new Blob([g(i, a)], { type: "text/csv;charset=utf-8" }), l = URL.createObjectURL(n), t = document.createElement("a");
   t.href = l, t.download = `${o.replaceAll(/\s+/g, "-").toLowerCase()}.csv`, t.click(), URL.revokeObjectURL(l);
 }
-const O = f(
+const O = b(
   "IrisChatArtifact",
   ({ className: o, title: i, columns: a, rows: n, onDownload: l, onMore: t }, d) => {
     const { t: c } = I(), m = () => {
       S(i, a, n), l?.();
-    }, g = () => {
-      navigator.clipboard?.writeText(N(a, n)).catch(() => {
+    }, w = () => {
+      navigator.clipboard?.writeText(g(a, n)).catch(() => {
       }), t?.();
     };
     return /* @__PURE__ */ r(
@@ -35,62 +35,72 @@ const O = f(
       {
         ref: d,
         "data-component": "iris-chat-artifact",
-        className: u("min-w-0 w-full max-w-full overflow-hidden rounded-xl border border-stroke-subtle", o),
+        className: u(
+          "grid w-full min-w-0 max-w-full grid-cols-[minmax(0,1fr)] overflow-hidden rounded-xl border border-stroke-subtle",
+          o
+        ),
         children: [
-          /* @__PURE__ */ r("header", { className: "flex items-center justify-between gap-2 px-3 py-2", children: [
+          /* @__PURE__ */ r("header", { className: "flex min-w-0 items-center justify-between gap-2 px-3 py-2", children: [
             /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-content", children: i }),
             /* @__PURE__ */ r("div", { className: "flex items-center gap-1", children: [
               /* @__PURE__ */ e(x, { label: c("irisChat.download"), children: /* @__PURE__ */ e(
-                b,
+                f,
                 {
                   type: "button",
                   variant: "ghost",
                   size: "iconSm",
                   "aria-label": c("irisChat.download"),
                   onClick: m,
-                  children: /* @__PURE__ */ e(y, { size: 16 })
+                  children: /* @__PURE__ */ e(N, { size: 16 })
                 }
               ) }),
-              /* @__PURE__ */ r(w, { children: [
+              /* @__PURE__ */ r(C, { children: [
                 /* @__PURE__ */ e(x, { label: c("irisChat.moreActions"), children: /* @__PURE__ */ e(j, { asChild: !0, children: /* @__PURE__ */ e(
-                  b,
+                  f,
                   {
                     type: "button",
                     variant: "ghost",
                     size: "iconSm",
                     "aria-label": c("irisChat.moreActions"),
-                    children: /* @__PURE__ */ e(v, { size: 16 })
+                    children: /* @__PURE__ */ e(y, { size: 16 })
                   }
                 ) }) }),
                 /* @__PURE__ */ r(k, { align: "end", children: [
-                  /* @__PURE__ */ e(p, { onSelect: g, children: c("irisChat.copy") }),
+                  /* @__PURE__ */ e(p, { onSelect: w, children: c("irisChat.copy") }),
                   /* @__PURE__ */ e(p, { onSelect: m, children: c("irisChat.download") })
                 ] })
               ] })
             ] })
           ] }),
-          /* @__PURE__ */ e("div", { className: "overflow-x-auto", children: /* @__PURE__ */ r("table", { className: "w-full table-fixed border-t border-stroke-subtle text-sm", children: [
-            /* @__PURE__ */ e("thead", { className: "bg-secondary", children: /* @__PURE__ */ r("tr", { children: [
-              /* @__PURE__ */ e("th", { className: "w-10 px-3 py-2", children: /* @__PURE__ */ e("span", { className: "sr-only", children: c("aria.toggleSelection") }) }),
-              a.map((s) => /* @__PURE__ */ e(
-                "th",
-                {
-                  className: "px-3 py-2 text-start font-medium text-content",
-                  children: s.header
-                },
-                s.id
-              ))
-            ] }) }),
-            /* @__PURE__ */ e("tbody", { children: n.map((s) => /* @__PURE__ */ r("tr", { className: "border-t border-stroke-subtle", children: [
-              /* @__PURE__ */ e("td", { className: "px-3 py-2", children: /* @__PURE__ */ e(C, { "aria-label": s.id }) }),
-              a.map((h) => /* @__PURE__ */ e("td", { className: "px-3 py-2 text-content", children: s.cells[h.id] }, h.id))
-            ] }, s.id)) })
-          ] }) })
+          /* @__PURE__ */ e(
+            "div",
+            {
+              "data-slot": "artifact-scroll",
+              className: "min-w-0 max-w-full overflow-x-auto overflow-y-hidden overscroll-x-contain",
+              children: /* @__PURE__ */ r("table", { className: "w-max min-w-full border-t border-stroke-subtle text-sm", children: [
+                /* @__PURE__ */ e("thead", { className: "bg-secondary", children: /* @__PURE__ */ r("tr", { children: [
+                  /* @__PURE__ */ e("th", { className: "w-10 px-3 py-2", children: /* @__PURE__ */ e("span", { className: "sr-only", children: c("aria.toggleSelection") }) }),
+                  a.map((s) => /* @__PURE__ */ e(
+                    "th",
+                    {
+                      className: "whitespace-nowrap px-3 py-2 text-start font-medium text-content",
+                      children: s.header
+                    },
+                    s.id
+                  ))
+                ] }) }),
+                /* @__PURE__ */ e("tbody", { children: n.map((s) => /* @__PURE__ */ r("tr", { className: "border-t border-stroke-subtle", children: [
+                  /* @__PURE__ */ e("td", { className: "px-3 py-2", children: /* @__PURE__ */ e(v, { "aria-label": s.id }) }),
+                  a.map((h) => /* @__PURE__ */ e("td", { className: "whitespace-nowrap px-3 py-2 text-content", children: s.cells[h.id] }, h.id))
+                ] }, s.id)) })
+              ] })
+            }
+          )
         ]
       }
     );
   }
-), $ = f(
+), $ = b(
   "IrisChatScenario",
   ({ className: o, title: i, rows: a, notes: n }, l) => /* @__PURE__ */ r(
     "section",

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

@@ -1,62 +1,82 @@
 import { jsx as t, jsxs as s } from "react/jsx-runtime";
-import { useState as c } from "react";
-import { ButtonIconTooltip as p } from "../../feedback/tooltip/button-icon-tooltip.js";
-import { Button as m } from "../../primitives/button/button.js";
-import { useImpactNovaI18n as l } from "../../../i18n/use-impact-nova-i18n.js";
-import { createComponent as d } from "../../../lib/primitives/create-component.js";
-import { cn as f } from "../../../lib/utils.js";
-import { IrisChatCopyIcon as h } from "./iris-chat-icons.js";
+import { useState as l } from "react";
+import { ButtonIconTooltip as c } from "../../feedback/tooltip/button-icon-tooltip.js";
+import { Button as d } from "../../primitives/button/button.js";
+import { useImpactNovaI18n as m } from "../../../i18n/use-impact-nova-i18n.js";
+import { createComponent as p } from "../../../lib/primitives/create-component.js";
+import { cn as h } from "../../../lib/utils.js";
+import { IrisChatCopyIcon as f } from "./iris-chat-icons.js";
 import { irisChatMarkdownVariants as u } from "./iris-chat.variants.js";
-import { Markdown as C } from "../../../node_modules/react-markdown/lib/index.js";
-import k from "../../../node_modules/remark-gfm/lib/index.js";
+import { Markdown as w } from "../../../node_modules/react-markdown/lib/index.js";
+import b from "../../../node_modules/remark-gfm/lib/index.js";
 function n(r) {
   return typeof r == "string" || typeof r == "number" ? String(r) : Array.isArray(r) ? r.map(n).join("") : r && typeof r == "object" && "props" in r ? n(r.props.children) : "";
 }
-function y({ children: r }) {
-  const { t: o } = l(), [e, i] = c(!1), a = n(r);
+function x({ children: r }) {
+  return /* @__PURE__ */ t("div", { className: "grid w-full min-w-0 max-w-full grid-cols-[minmax(0,1fr)] overflow-hidden rounded-xl border border-stroke-subtle", children: /* @__PURE__ */ t(
+    "div",
+    {
+      "data-slot": "markdown-table-scroll",
+      className: "min-w-0 max-w-full overflow-x-auto overflow-y-hidden overscroll-x-contain",
+      children: /* @__PURE__ */ t("table", { className: "w-max min-w-full border-separate border-spacing-0 text-sm", children: r })
+    }
+  ) });
+}
+function k({ children: r }) {
+  const { t: i } = m(), [a, e] = l(!1), o = n(r);
   return /* @__PURE__ */ s("div", { className: "relative", children: [
-    /* @__PURE__ */ t(p, { label: o(e ? "irisChat.copied" : "irisChat.copyCode"), children: /* @__PURE__ */ t(
-      m,
+    /* @__PURE__ */ t(c, { label: i(a ? "irisChat.copied" : "irisChat.copyCode"), children: /* @__PURE__ */ t(
+      d,
       {
         type: "button",
         variant: "ghost",
         size: "icon",
         className: "absolute end-1.5 top-1.5 size-7",
-        "aria-label": o(e ? "irisChat.copied" : "irisChat.copyCode"),
+        "aria-label": i(a ? "irisChat.copied" : "irisChat.copyCode"),
         "data-testid": "iris-chat-copy-code",
         onClick: () => {
-          navigator.clipboard?.writeText(a).catch(() => {
-          }), i(!0), window.setTimeout(() => i(!1), 1600);
+          navigator.clipboard?.writeText(o).catch(() => {
+          }), e(!0), window.setTimeout(() => e(!1), 1600);
         },
-        children: /* @__PURE__ */ t(h, { size: 14 })
+        children: /* @__PURE__ */ t(f, { size: 14 })
       }
     ) }),
     /* @__PURE__ */ t("pre", { children: r })
   ] });
 }
-const B = d(
+const A = p(
   "IrisChatMarkdown",
-  ({ className: r, children: o }, e) => /* @__PURE__ */ t(
+  ({ className: r, children: i }, a) => /* @__PURE__ */ t(
     "div",
     {
-      ref: e,
+      ref: a,
       "data-component": "iris-chat-markdown",
-      className: f(u(), r),
+      className: h(u(), r),
       children: /* @__PURE__ */ t(
-        C,
+        w,
         {
-          remarkPlugins: [k],
+          remarkPlugins: [b],
           skipHtml: !0,
           components: {
-            a: ({ href: i, children: a }) => /* @__PURE__ */ t("a", { href: i, target: "_blank", rel: "noreferrer", children: a }),
-            pre: ({ children: i }) => /* @__PURE__ */ t(y, { children: i })
+            a: ({ href: e, children: o }) => /* @__PURE__ */ t("a", { href: e, target: "_blank", rel: "noreferrer", children: o }),
+            pre: ({ children: e }) => /* @__PURE__ */ t(k, { children: e }),
+            table: ({ children: e }) => /* @__PURE__ */ t(x, { children: e }),
+            th: ({ children: e, style: o }) => /* @__PURE__ */ t(
+              "th",
+              {
+                style: o,
+                className: "whitespace-nowrap bg-secondary px-3 py-2 text-start text-xs font-semibold",
+                children: e
+              }
+            ),
+            td: ({ children: e, style: o }) => /* @__PURE__ */ t("td", { style: o, className: "whitespace-nowrap border-t border-stroke-subtle px-3 py-2", children: e })
           },
-          children: o
+          children: i
         }
       )
     }
   )
 );
 export {
-  B as IrisChatMarkdown
+  A as IrisChatMarkdown
 };

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

@@ -15,6 +15,7 @@ declare const IrisChatDay: React.ForwardRefExoticComponent<IrisChatDayProps & Re
 declare const IrisChatMessage: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
     role: import('./iris-chat.types').IrisChatRole;
     time?: string;
+    framed?: boolean;
 } & React.RefAttributes<HTMLElement>>;
 declare const IrisChatActions: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
     liked?: boolean;