@stackone/malachite 2.21.0 → 2.22.0

package/dist/components/Chat/ChatThinking.js

@@ -0,0 +1,20 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import a from "../Skeleton.js";
+import { Typography as n } from "../Typography/index.js";
+const i = ["92%", "76%", "58%"], l = "min-w-[200px]", x = ({ label: o, className: r = "" }) => /* @__PURE__ */ s(
+  "div",
+  {
+    className: `flex flex-col gap-2 ${l} ${r}`,
+    role: "status",
+    "aria-busy": "true",
+    children: [
+      o ? /* @__PURE__ */ e(n.SecondaryText, { size: "xsmall", children: o }) : null,
+      i.map((t) => /* @__PURE__ */ e(a.Input, { width: t, height: 12 }, t))
+    ]
+  }
+);
+export {
+  x as ChatThinking,
+  x as default
+};
+//# sourceMappingURL=ChatThinking.js.map

package/dist/components/Chat/ChatThinking.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatThinking.js","sources":["../../../src/components/Chat/ChatThinking.tsx"],"sourcesContent":["import React from 'react';\nimport Skeleton from '../Skeleton';\nimport Typography from '../Typography';\n\nexport interface ChatThinkingProps {\n    /** Names what is happening, when that is worth saying. Omitted, the bars speak alone. */\n    label?: string;\n    className?: string;\n}\n\n/** Uneven, so the block reads as prose arriving rather than as a loading graphic. */\nconst BAR_WIDTHS = ['92%', '76%', '58%'];\n\n/**\n * Roughly the width a short reply would occupy. A percentage width only resolves against a\n * containing block whose OWN width is already known — inside `Chat.Message`'s `bubble`\n * variant, which hugs its content instead of filling the column, nothing sets that, so the\n * bars' percentages fell back to 0 and the bubble collapsed to its padding. This pixel floor\n * gives this component's own box a width regardless of variant, so the percentage bars inside\n * it have something to resolve against; `plain`/`card` already stretch past it and see no\n * change.\n */\nconst MIN_WIDTH_CLASS = 'min-w-[200px]';\n\n/**\n * Shown while a reply is on its way but nothing has streamed in yet.\n *\n * Bars rather than a spinner: they occupy the shape the answer will take, so the transcript\n * does not jump when it lands, and there is no looping motion to look away from.\n */\nconst ChatThinking: React.FC<ChatThinkingProps> = ({ label, className = '' }) => (\n    <div\n        className={`flex flex-col gap-2 ${MIN_WIDTH_CLASS} ${className}`}\n        role=\"status\"\n        aria-busy=\"true\"\n    >\n        {label ? <Typography.SecondaryText size=\"xsmall\">{label}</Typography.SecondaryText> : null}\n        {BAR_WIDTHS.map((width) => (\n            <Skeleton.Input key={width} width={width} height={12} />\n        ))}\n    </div>\n);\n\nexport default ChatThinking;\nexport { ChatThinking };\n"],"names":["BAR_WIDTHS","MIN_WIDTH_CLASS","ChatThinking","label","className","jsxs","Typography","width","jsx","Skeleton"],"mappings":";;;AAWA,MAAMA,IAAa,CAAC,OAAO,OAAO,KAAK,GAWjCC,IAAkB,iBAQlBC,IAA4C,CAAC,EAAE,OAAAC,GAAO,WAAAC,IAAY,SACpE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,WAAW,uBAAuBJ,CAAe,IAAIG,CAAS;AAAA,IAC9D,MAAK;AAAA,IACL,aAAU;AAAA,IAET,UAAA;AAAA,MAAAD,sBAASG,EAAW,eAAX,EAAyB,MAAK,UAAU,aAAM,IAA8B;AAAA,MACrFN,EAAW,IAAI,CAACO,MACb,gBAAAC,EAACC,EAAS,OAAT,EAA2B,OAAAF,GAAc,QAAQ,GAAA,GAA7BA,CAAiC,CACzD;AAAA,IAAA;AAAA,EAAA;AACL;"}

package/dist/components/Chat/ChatThread.js

@@ -0,0 +1,68 @@
+import { jsxs as m, jsx as l, Fragment as g } from "react/jsx-runtime";
+import b from "react";
+import { Button as N } from "../Button.js";
+import y from "../CustomIcons/CaretDownIcon.js";
+import { Typography as f } from "../Typography/index.js";
+import { useStickToBottom as C } from "./stickToBottom.js";
+const z = ({
+  children: i,
+  "aria-label": d,
+  emptyTitle: e,
+  emptyDescription: a,
+  emptyIcon: t,
+  emptyContent: o,
+  className: h = ""
+}) => {
+  const { scrollRef: x, contentRef: u, pinned: p, scrollToBottom: v } = C(), n = b.Children.toArray(i).length === 0, s = n && !!o, c = n && !o && !!(e || a || t);
+  let r = "flex flex-col gap-4 p-4";
+  return s ? r = "flex flex-1 flex-col p-4" : c && (r = "flex min-h-full flex-col items-center justify-center gap-2 p-6 text-center"), /* @__PURE__ */ m("div", { className: `relative flex min-h-0 flex-1 flex-col ${h}`, children: [
+    /* @__PURE__ */ l("div", { ref: x, className: "flex min-h-0 flex-1 flex-col overflow-y-auto", children: /* @__PURE__ */ l(
+      "div",
+      {
+        ref: u,
+        role: "log",
+        "aria-live": "polite",
+        "aria-label": d,
+        className: r,
+        children: s ? (
+          // `margin-top: auto` consumes the free space the scroll div's flex
+          // layout gives this (now `flex-1`) content box, pinning the block to
+          // the bottom. `flex-direction: column-reverse` was the mock's own
+          // approach, but it inverts scroll geometry that `useStickToBottom` and
+          // the jump-to-latest control both rely on — this gets the same bottom
+          // anchoring without touching either.
+          /* @__PURE__ */ l("div", { className: "mt-auto text-left", children: o })
+        ) : c ? /* @__PURE__ */ m(g, { children: [
+          t ? /* @__PURE__ */ l("span", { className: "text-[var(--malachite-text-dimmed)]", children: t }) : null,
+          e ? /* @__PURE__ */ l(f.SecondaryText, { fontWeight: "bold", children: e }) : null,
+          a ? /* @__PURE__ */ l(f.SecondaryText, { size: "small", children: a }) : null
+        ] }) : i
+      }
+    ) }),
+    !p && // Pinned to the side rather than centred over the newest message, which is
+    // the thing a reader scrolled back to see. `-translate-y-1/2` is measured
+    // working inside a shadow root (see the CardStrip arrow).
+    /* @__PURE__ */ l("div", { className: "absolute right-3 top-1/2 -translate-y-1/2", children: /* @__PURE__ */ l(
+      N,
+      {
+        variant: "outline",
+        size: "small",
+        iconOnly: !0,
+        radius: "xl",
+        style: {
+          backgroundColor: "var(--malachite-card-background)",
+          boxShadow: "var(--malachite-shadow-md)"
+        },
+        icon: /* @__PURE__ */ l(y, { size: 14 }),
+        tooltip: "Jump to latest",
+        "aria-label": "Jump to latest",
+        onClick: v
+      }
+    ) })
+  ] });
+};
+export {
+  z as ChatThread,
+  z as default
+};
+//# sourceMappingURL=ChatThread.js.map

package/dist/components/Chat/ChatThread.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatThread.js","sources":["../../../src/components/Chat/ChatThread.tsx"],"sourcesContent":["import React from 'react';\nimport Button from '../Button';\nimport CaretDownIcon from '../CustomIcons/CaretDownIcon';\nimport Typography from '../Typography';\nimport { useStickToBottom } from './stickToBottom';\n\nexport interface ChatThreadProps {\n    children?: React.ReactNode;\n    /** Names the transcript for assistive tech, e.g. \"Policy assistant conversation\". */\n    'aria-label'?: string;\n    /** Shown, centred, while the transcript holds nothing. Ignored when `emptyContent` is\n     *  supplied. */\n    emptyTitle?: string;\n    /** The lines under the title. A node, because guidance is rarely one sentence. Ignored\n     *  when `emptyContent` is supplied. */\n    emptyDescription?: React.ReactNode;\n    /** Ignored when `emptyContent` is supplied. */\n    emptyIcon?: React.ReactNode;\n    /**\n     * Replaces the `emptyTitle`/`emptyDescription`/`emptyIcon` composition. Renders\n     * left-aligned at the bottom of the transcript, directly above the composer — an empty\n     * conversation should read as ready to start, not as a decorated void.\n     */\n    emptyContent?: React.ReactNode;\n    className?: string;\n}\n\n/**\n * The scrolling transcript. Owns scroll ownership and the pin-to-newest behaviour so a\n * consumer never wires a scroll listener of its own.\n *\n * `flex-1 min-h-0` is load-bearing: without the floor, WebKit shrinks an `overflow` child to\n * fit its content and scrolling silently moves to an ancestor.\n */\nconst ChatThread: React.FC<ChatThreadProps> = ({\n    children,\n    'aria-label': ariaLabel,\n    emptyTitle,\n    emptyDescription,\n    emptyIcon,\n    emptyContent,\n    className = '',\n}) => {\n    const { scrollRef, contentRef, pinned, scrollToBottom } = useStickToBottom();\n\n    // `toArray` rather than `count`: it drops the nulls a caller leaves behind when a\n    // conditional turn renders nothing, which `count` would tally as content.\n    const isEmpty = React.Children.toArray(children).length === 0;\n    const isEmptyWithCustomContent = isEmpty && Boolean(emptyContent);\n    const isEmptyWithLegacyState =\n        isEmpty && !emptyContent && Boolean(emptyTitle || emptyDescription || emptyIcon);\n\n    let contentClassName = 'flex flex-col gap-4 p-4';\n    if (isEmptyWithCustomContent) {\n        // `flex-1`, not `min-h-full`: a percentage height only resolves against a parent with\n        // an explicit height, and the scroll div's height comes from flex resolution rather\n        // than a set value, so the percentage silently fails to resolve and the content\n        // collapses to the top. `flex-1` instead asks the (now flex) scroll div's own layout\n        // for a real height, which `mt-auto` below can then push against.\n        contentClassName = 'flex flex-1 flex-col p-4';\n    } else if (isEmptyWithLegacyState) {\n        contentClassName =\n            'flex min-h-full flex-col items-center justify-center gap-2 p-6 text-center';\n    }\n\n    return (\n        <div className={`relative flex min-h-0 flex-1 flex-col ${className}`}>\n            <div ref={scrollRef} className=\"flex min-h-0 flex-1 flex-col overflow-y-auto\">\n                <div\n                    ref={contentRef}\n                    role=\"log\"\n                    aria-live=\"polite\"\n                    aria-label={ariaLabel}\n                    className={contentClassName}\n                >\n                    {isEmptyWithCustomContent ? (\n                        // `margin-top: auto` consumes the free space the scroll div's flex\n                        // layout gives this (now `flex-1`) content box, pinning the block to\n                        // the bottom. `flex-direction: column-reverse` was the mock's own\n                        // approach, but it inverts scroll geometry that `useStickToBottom` and\n                        // the jump-to-latest control both rely on — this gets the same bottom\n                        // anchoring without touching either.\n                        <div className=\"mt-auto text-left\">{emptyContent}</div>\n                    ) : isEmptyWithLegacyState ? (\n                        <>\n                            {emptyIcon ? (\n                                <span className=\"text-[var(--malachite-text-dimmed)]\">\n                                    {emptyIcon}\n                                </span>\n                            ) : null}\n                            {emptyTitle ? (\n                                <Typography.SecondaryText fontWeight=\"bold\">\n                                    {emptyTitle}\n                                </Typography.SecondaryText>\n                            ) : null}\n                            {emptyDescription ? (\n                                <Typography.SecondaryText size=\"small\">\n                                    {emptyDescription}\n                                </Typography.SecondaryText>\n                            ) : null}\n                        </>\n                    ) : (\n                        children\n                    )}\n                </div>\n            </div>\n            {!pinned && (\n                // Pinned to the side rather than centred over the newest message, which is\n                // the thing a reader scrolled back to see. `-translate-y-1/2` is measured\n                // working inside a shadow root (see the CardStrip arrow).\n                <div className=\"absolute right-3 top-1/2 -translate-y-1/2\">\n                    <Button\n                        variant=\"outline\"\n                        size=\"small\"\n                        iconOnly\n                        radius=\"xl\"\n                        // Inline, because no utility class can reach it: Tailwind's utilities\n                        // sit in `@layer utilities` while `.btn-outline`'s transparent\n                        // background is an unlayered rule, and unlayered wins. Without this\n                        // the transcript reads straight through the button.\n                        style={{\n                            backgroundColor: 'var(--malachite-card-background)',\n                            boxShadow: 'var(--malachite-shadow-md)',\n                        }}\n                        icon={<CaretDownIcon size={14} />}\n                        tooltip=\"Jump to latest\"\n                        aria-label=\"Jump to latest\"\n                        onClick={scrollToBottom}\n                    />\n                </div>\n            )}\n        </div>\n    );\n};\n\nexport default ChatThread;\nexport { ChatThread };\n"],"names":["ChatThread","children","ariaLabel","emptyTitle","emptyDescription","emptyIcon","emptyContent","className","scrollRef","contentRef","pinned","scrollToBottom","useStickToBottom","isEmpty","React","isEmptyWithCustomContent","isEmptyWithLegacyState","contentClassName","jsxs","jsx","Fragment","Typography","Button","CaretDownIcon"],"mappings":";;;;;;AAkCA,MAAMA,IAAwC,CAAC;AAAA,EAC3C,UAAAC;AAAA,EACA,cAAcC;AAAA,EACd,YAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC,IAAY;AAChB,MAAM;AACF,QAAM,EAAE,WAAAC,GAAW,YAAAC,GAAY,QAAAC,GAAQ,gBAAAC,EAAA,IAAmBC,EAAA,GAIpDC,IAAUC,EAAM,SAAS,QAAQb,CAAQ,EAAE,WAAW,GACtDc,IAA2BF,KAAW,EAAQP,GAC9CU,IACFH,KAAW,CAACP,KAAgB,GAAQH,KAAcC,KAAoBC;AAE1E,MAAIY,IAAmB;AACvB,SAAIF,IAMAE,IAAmB,6BACZD,MACPC,IACI,+EAIJ,gBAAAC,EAAC,OAAA,EAAI,WAAW,yCAAyCX,CAAS,IAC9D,UAAA;AAAA,IAAA,gBAAAY,EAAC,OAAA,EAAI,KAAKX,GAAW,WAAU,gDAC3B,UAAA,gBAAAW;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAKV;AAAA,QACL,MAAK;AAAA,QACL,aAAU;AAAA,QACV,cAAYP;AAAA,QACZ,WAAWe;AAAA,QAEV,UAAAF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAOG,gBAAAI,EAAC,OAAA,EAAI,WAAU,qBAAqB,UAAAb,EAAA,CAAa;AAAA,YACjDU,IACA,gBAAAE,EAAAE,GAAA,EACK,UAAA;AAAA,UAAAf,IACG,gBAAAc,EAAC,QAAA,EAAK,WAAU,uCACX,aACL,IACA;AAAA,UACHhB,sBACIkB,EAAW,eAAX,EAAyB,YAAW,QAChC,aACL,IACA;AAAA,UACHjB,sBACIiB,EAAW,eAAX,EAAyB,MAAK,SAC1B,aACL,IACA;AAAA,QAAA,EAAA,CACR,IAEApB;AAAA,MAAA;AAAA,IAAA,GAGZ;AAAA,IACC,CAACS;AAAA;AAAA;AAAA,IAIE,gBAAAS,EAAC,OAAA,EAAI,WAAU,6CACX,UAAA,gBAAAA;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,UAAQ;AAAA,QACR,QAAO;AAAA,QAKP,OAAO;AAAA,UACH,iBAAiB;AAAA,UACjB,WAAW;AAAA,QAAA;AAAA,QAEf,MAAM,gBAAAH,EAACI,GAAA,EAAc,MAAM,GAAA,CAAI;AAAA,QAC/B,SAAQ;AAAA,QACR,cAAW;AAAA,QACX,SAASZ;AAAA,MAAA;AAAA,IAAA,EACb,CACJ;AAAA,EAAA,GAER;AAER;"}

package/dist/components/Chat/ChatToolCall.js

@@ -0,0 +1,59 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { Accordion as d } from "../Accordion.js";
+import c from "../CodeBlock.js";
+import p from "../CustomIcons/CheckIcon.js";
+import f from "../CustomIcons/RejectIcon.js";
+import { Tag as T } from "../Tag.js";
+import { Typography as s } from "../Typography/index.js";
+const x = {
+  running: "Running",
+  completed: "Completed",
+  error: "Failed"
+}, S = {
+  running: "warning",
+  completed: "success",
+  error: "error"
+}, h = {
+  completed: /* @__PURE__ */ e(p, { size: 11 }),
+  error: /* @__PURE__ */ e(f, { size: 11 })
+}, y = ({
+  name: t,
+  status: o = "completed",
+  callId: l,
+  input: r,
+  output: n,
+  defaultExpanded: m = !1,
+  className: a
+}) => /* @__PURE__ */ e(
+  d,
+  {
+    variant: "sunken",
+    defaultExpanded: m,
+    className: a,
+    header: /* @__PURE__ */ e("span", { className: "min-w-0 text-left", children: /* @__PURE__ */ e(s.Text, { size: "small", fontWeight: "semi-bold", children: t }) }),
+    trailing: /* @__PURE__ */ e(
+      T,
+      {
+        value: x[o],
+        type: S[o],
+        fontSize: "xsmall",
+        textTransform: "none",
+        icon: h[o],
+        iconPosition: "left"
+      }
+    ),
+    children: /* @__PURE__ */ i("div", { className: "flex flex-col gap-2 p-2", children: [
+      l === void 0 ? null : /* @__PURE__ */ i(s.SecondaryText, { size: "xsmall", children: [
+        "Call ID: ",
+        l
+      ] }),
+      r === void 0 ? null : /* @__PURE__ */ e(c, { json: r, collapsed: 2 }),
+      n === void 0 ? null : /* @__PURE__ */ e(c, { json: n, collapsed: 2 })
+    ] })
+  }
+);
+export {
+  y as ChatToolCall,
+  y as default
+};
+//# sourceMappingURL=ChatToolCall.js.map

package/dist/components/Chat/ChatToolCall.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatToolCall.js","sources":["../../../src/components/Chat/ChatToolCall.tsx"],"sourcesContent":["import React from 'react';\nimport Accordion from '../Accordion';\nimport CodeBlock from '../CodeBlock';\nimport CheckIcon from '../CustomIcons/CheckIcon';\nimport RejectIcon from '../CustomIcons/RejectIcon';\nimport Tag from '../Tag';\nimport type { TagType } from '../Tag';\nimport Typography from '../Typography';\n\nexport type ChatToolCallStatus = 'running' | 'completed' | 'error';\n\nexport interface ChatToolCallProps {\n    /** The tool the assistant called, e.g. `update_policy_draft`. */\n    name: string;\n    status?: ChatToolCallStatus;\n    /**\n     * The provider's id for this call. Shown once the card is expanded, not on the collapsed\n     * row: it is a long opaque string nobody reads at a glance, and beside the tool name it\n     * was taking two lines of the transcript to say nothing a reader wanted.\n     */\n    callId?: string;\n    /** Arguments the assistant sent. */\n    input?: object;\n    /** What the call returned. Absent while it is still running. */\n    output?: object;\n    defaultExpanded?: boolean;\n    className?: string;\n}\n\nconst STATUS_LABELS: Record<ChatToolCallStatus, string> = {\n    running: 'Running',\n    completed: 'Completed',\n    error: 'Failed',\n};\n\nconst STATUS_TAG_TYPES: Record<ChatToolCallStatus, TagType> = {\n    running: 'warning',\n    completed: 'success',\n    error: 'error',\n};\n\n/** Only a settled call carries a mark; a running one would be claiming an outcome. */\nconst STATUS_ICONS: Partial<Record<ChatToolCallStatus, React.ReactNode>> = {\n    completed: <CheckIcon size={11} />,\n    error: <RejectIcon size={11} />,\n};\n\n/**\n * One tool call in a transcript, collapsed by default: what the assistant did is worth a\n * line, and the arguments behind it are worth a click.\n *\n * The status sits in `trailing` rather than in the header, so it stays outside the toggle\n * button — a tag nested inside a button is invalid, and it reads as its own thing.\n */\nconst ChatToolCall: React.FC<ChatToolCallProps> = ({\n    name,\n    status = 'completed',\n    callId,\n    input,\n    output,\n    defaultExpanded = false,\n    className,\n}) => (\n    <Accordion\n        variant=\"sunken\"\n        defaultExpanded={defaultExpanded}\n        className={className}\n        header={\n            <span className=\"min-w-0 text-left\">\n                <Typography.Text size=\"small\" fontWeight=\"semi-bold\">\n                    {name}\n                </Typography.Text>\n            </span>\n        }\n        trailing={\n            <Tag\n                value={STATUS_LABELS[status]}\n                type={STATUS_TAG_TYPES[status]}\n                fontSize=\"xsmall\"\n                textTransform=\"none\"\n                icon={STATUS_ICONS[status]}\n                iconPosition=\"left\"\n            />\n        }\n    >\n        <div className=\"flex flex-col gap-2 p-2\">\n            {callId === undefined ? null : (\n                <Typography.SecondaryText size=\"xsmall\">Call ID: {callId}</Typography.SecondaryText>\n            )}\n            {input === undefined ? null : <CodeBlock json={input} collapsed={2} />}\n            {output === undefined ? null : <CodeBlock json={output} collapsed={2} />}\n        </div>\n    </Accordion>\n);\n\nexport default ChatToolCall;\nexport { ChatToolCall };\n"],"names":["STATUS_LABELS","STATUS_TAG_TYPES","STATUS_ICONS","jsx","CheckIcon","RejectIcon","ChatToolCall","name","status","callId","input","output","defaultExpanded","className","Accordion","Typography","Tag","jsxs","CodeBlock"],"mappings":";;;;;;;AA6BA,MAAMA,IAAoD;AAAA,EACtD,SAAS;AAAA,EACT,WAAW;AAAA,EACX,OAAO;AACX,GAEMC,IAAwD;AAAA,EAC1D,SAAS;AAAA,EACT,WAAW;AAAA,EACX,OAAO;AACX,GAGMC,IAAqE;AAAA,EACvE,WAAW,gBAAAC,EAACC,GAAA,EAAU,MAAM,GAAA,CAAI;AAAA,EAChC,OAAO,gBAAAD,EAACE,GAAA,EAAW,MAAM,GAAA,CAAI;AACjC,GASMC,IAA4C,CAAC;AAAA,EAC/C,MAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,WAAAC;AACJ,MACI,gBAAAV;AAAA,EAACW;AAAA,EAAA;AAAA,IACG,SAAQ;AAAA,IACR,iBAAAF;AAAA,IACA,WAAAC;AAAA,IACA,QACI,gBAAAV,EAAC,QAAA,EAAK,WAAU,qBACZ,UAAA,gBAAAA,EAACY,EAAW,MAAX,EAAgB,MAAK,SAAQ,YAAW,aACpC,aACL,GACJ;AAAA,IAEJ,UACI,gBAAAZ;AAAA,MAACa;AAAA,MAAA;AAAA,QACG,OAAOhB,EAAcQ,CAAM;AAAA,QAC3B,MAAMP,EAAiBO,CAAM;AAAA,QAC7B,UAAS;AAAA,QACT,eAAc;AAAA,QACd,MAAMN,EAAaM,CAAM;AAAA,QACzB,cAAa;AAAA,MAAA;AAAA,IAAA;AAAA,IAIrB,UAAA,gBAAAS,EAAC,OAAA,EAAI,WAAU,2BACV,UAAA;AAAA,MAAAR,MAAW,SAAY,OACpB,gBAAAQ,EAACF,EAAW,eAAX,EAAyB,MAAK,UAAS,UAAA;AAAA,QAAA;AAAA,QAAUN;AAAA,MAAA,GAAO;AAAA,MAE5DC,MAAU,SAAY,OAAO,gBAAAP,EAACe,KAAU,MAAMR,GAAO,WAAW,GAAG;AAAA,MACnEC,MAAW,SAAY,OAAO,gBAAAR,EAACe,KAAU,MAAMP,GAAQ,WAAW,EAAA,CAAG;AAAA,IAAA,EAAA,CAC1E;AAAA,EAAA;AACJ;"}

package/dist/components/Chat/index.js

@@ -0,0 +1,29 @@
+import { ChatComposer as t } from "./ChatComposer.js";
+import { ChatComposerChip as r } from "./ChatComposerChip.js";
+import { ChatContext as e } from "./ChatContext.js";
+import { ChatContextMeter as m } from "./ChatContextMeter.js";
+import { ChatHeader as C } from "./ChatHeader.js";
+import { ChatMessage as a } from "./ChatMessage.js";
+import { ChatModelPicker as i } from "./ChatModelPicker.js";
+import h from "./ChatRoot.js";
+import { ChatSuggestion as p } from "./ChatSuggestion.js";
+import { ChatThinking as f } from "./ChatThinking.js";
+import { ChatThread as s } from "./ChatThread.js";
+import { ChatToolCall as n } from "./ChatToolCall.js";
+const o = h;
+o.Header = C;
+o.Thread = s;
+o.Message = a;
+o.ToolCall = n;
+o.Thinking = f;
+o.Composer = t;
+o.ComposerChip = r;
+o.Context = e;
+o.ContextMeter = m;
+o.ModelPicker = i;
+o.Suggestion = p;
+export {
+  o as Chat,
+  o as default
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Chat/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/Chat/index.tsx"],"sourcesContent":["import React from 'react';\nimport { default as ChatComposer, type ChatComposerProps } from './ChatComposer';\nimport { default as ChatComposerChip, type ChatComposerChipProps } from './ChatComposerChip';\nimport { default as ChatContext, type ChatContextProps } from './ChatContext';\nimport { default as ChatContextMeter, type ChatContextMeterProps } from './ChatContextMeter';\nimport { default as ChatHeader, type ChatHeaderProps } from './ChatHeader';\nimport { default as ChatMessage, type ChatMessageProps } from './ChatMessage';\nimport { default as ChatModelPicker, type ChatModelPickerProps } from './ChatModelPicker';\nimport { type ChatProps, default as ChatRoot } from './ChatRoot';\nimport { default as ChatSuggestion, type ChatSuggestionProps } from './ChatSuggestion';\nimport { default as ChatThinking, type ChatThinkingProps } from './ChatThinking';\nimport { default as ChatThread, type ChatThreadProps } from './ChatThread';\nimport { default as ChatToolCall, type ChatToolCallProps } from './ChatToolCall';\n\nexport type {\n    ChatFeedback,\n    ChatMessageStatus,\n    ChatMessageUsage,\n    ChatMessageVariant,\n    ChatRole,\n} from './ChatMessage';\nexport type { ChatToolCallStatus } from './ChatToolCall';\nexport type { ChatModelOption, ChatModelSubOption } from './ChatModelPicker';\nexport type { ChatContextItem } from './ChatContext';\nexport type {\n    ChatComposerChipProps,\n    ChatComposerProps,\n    ChatContextMeterProps,\n    ChatContextProps,\n    ChatHeaderProps,\n    ChatMessageProps,\n    ChatModelPickerProps,\n    ChatProps,\n    ChatSuggestionProps,\n    ChatThinkingProps,\n    ChatThreadProps,\n    ChatToolCallProps,\n};\n\ninterface ChatComponent extends React.FC<ChatProps> {\n    Header: React.FC<ChatHeaderProps>;\n    Thread: React.FC<ChatThreadProps>;\n    Message: React.FC<ChatMessageProps>;\n    ToolCall: React.FC<ChatToolCallProps>;\n    Thinking: React.FC<ChatThinkingProps>;\n    Composer: React.FC<ChatComposerProps>;\n    ComposerChip: React.FC<ChatComposerChipProps>;\n    Context: React.FC<ChatContextProps>;\n    ContextMeter: React.FC<ChatContextMeterProps>;\n    ModelPicker: React.FC<ChatModelPickerProps>;\n    Suggestion: React.FC<ChatSuggestionProps>;\n}\n\nconst Chat = ChatRoot as ChatComponent;\n\nChat.Header = ChatHeader;\nChat.Thread = ChatThread;\nChat.Message = ChatMessage;\nChat.ToolCall = ChatToolCall;\nChat.Thinking = ChatThinking;\nChat.Composer = ChatComposer;\nChat.ComposerChip = ChatComposerChip;\nChat.Context = ChatContext;\nChat.ContextMeter = ChatContextMeter;\nChat.ModelPicker = ChatModelPicker;\nChat.Suggestion = ChatSuggestion;\n\nexport default Chat;\nexport { Chat };\n"],"names":["Chat","ChatRoot","ChatHeader","ChatThread","ChatMessage","ChatToolCall","ChatThinking","ChatComposer","ChatComposerChip","ChatContext","ChatContextMeter","ChatModelPicker","ChatSuggestion"],"mappings":";;;;;;;;;;;;AAqDA,MAAMA,IAAOC;AAEbD,EAAK,SAASE;AACdF,EAAK,SAASG;AACdH,EAAK,UAAUI;AACfJ,EAAK,WAAWK;AAChBL,EAAK,WAAWM;AAChBN,EAAK,WAAWO;AAChBP,EAAK,eAAeQ;AACpBR,EAAK,UAAUS;AACfT,EAAK,eAAeU;AACpBV,EAAK,cAAcW;AACnBX,EAAK,aAAaY;"}

package/dist/components/Chat/stickToBottom.js

@@ -0,0 +1,29 @@
+import { useRef as r, useState as p, useCallback as a, useEffect as h } from "react";
+const m = 32, T = (t) => t.scrollHeight - t.scrollTop - t.clientHeight <= m, R = () => {
+  const t = r(null), s = r(null), [d, i] = p(!0), n = r(!0), f = a(() => {
+    const e = t.current;
+    if (!e)
+      return;
+    typeof window.matchMedia == "function" && !window.matchMedia("(prefers-reduced-motion: reduce)").matches && typeof e.scrollTo == "function" ? e.scrollTo({ top: e.scrollHeight, behavior: "smooth" }) : e.scrollTop = e.scrollHeight, n.current = !0, i(!0);
+  }, []);
+  return h(() => {
+    const e = t.current, c = s.current;
+    if (!e || !c)
+      return;
+    const l = () => {
+      const u = T(e);
+      n.current = u, i(u);
+    };
+    e.addEventListener("scroll", l, { passive: !0 });
+    const o = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(() => {
+      n.current && (e.scrollTop = e.scrollHeight);
+    });
+    return o == null || o.observe(c), () => {
+      e.removeEventListener("scroll", l), o == null || o.disconnect();
+    };
+  }, []), { scrollRef: t, contentRef: s, pinned: d, scrollToBottom: f };
+};
+export {
+  R as useStickToBottom
+};
+//# sourceMappingURL=stickToBottom.js.map

package/dist/components/Chat/stickToBottom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stickToBottom.js","sources":["../../../src/components/Chat/stickToBottom.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\n/** How far from the bottom still counts as pinned, in px. */\nconst PINNED_SLACK = 32;\n\nconst isPinned = (node: HTMLElement): boolean =>\n    node.scrollHeight - node.scrollTop - node.clientHeight <= PINNED_SLACK;\n\n/**\n * Keeps a scroll container pinned to its newest content while the reader is at the bottom,\n * and reports when they have scrolled away.\n *\n * `contentRef` goes on the growing child rather than the container: a streaming reply changes\n * the content's height, never the container's, so an observer on the container never fires.\n */\nexport const useStickToBottom = () => {\n    const scrollRef = useRef<HTMLDivElement>(null);\n    const contentRef = useRef<HTMLDivElement>(null);\n    const [pinned, setPinned] = useState(true);\n\n    // Whether the reader was pinned BEFORE the content grew. By the time the observer runs,\n    // the container is no longer at the bottom, so the live DOM cannot answer this.\n    const pinnedRef = useRef(true);\n\n    const scrollToBottom = useCallback(() => {\n        const node = scrollRef.current;\n\n        if (!node) {\n            return;\n        }\n\n        // Eased, because arriving instantly at the bottom reads as a glitch rather than as\n        // travel. `scrollTo` is asked for smooth only when the reader has not opted out of\n        // motion — matchMedia rather than CSS, since this is a scroll and not a style.\n        const smooth =\n            typeof window.matchMedia === 'function' &&\n            !window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n\n        if (smooth && typeof node.scrollTo === 'function') {\n            node.scrollTo({ top: node.scrollHeight, behavior: 'smooth' });\n        } else {\n            node.scrollTop = node.scrollHeight;\n        }\n\n        // Pinned because this just pinned it, rather than waiting to be told: Chrome can\n        // coalesce the scroll event a programmatic scroll produces, which would leave the\n        // jump-to-latest affordance on screen at the latest message.\n        pinnedRef.current = true;\n        setPinned(true);\n    }, []);\n\n    useEffect(() => {\n        const node = scrollRef.current;\n        const content = contentRef.current;\n\n        if (!node || !content) {\n            return;\n        }\n\n        const readPinned = () => {\n            const next = isPinned(node);\n            pinnedRef.current = next;\n            setPinned(next);\n        };\n\n        node.addEventListener('scroll', readPinned, { passive: true });\n\n        // jsdom has no ResizeObserver, and a thread that cannot follow its content is still\n        // a working transcript — so pinning degrades rather than throwing on mount.\n        const observer =\n            typeof ResizeObserver === 'undefined'\n                ? undefined\n                : new ResizeObserver(() => {\n                      if (pinnedRef.current) {\n                          node.scrollTop = node.scrollHeight;\n                      }\n                  });\n        observer?.observe(content);\n\n        return () => {\n            node.removeEventListener('scroll', readPinned);\n            observer?.disconnect();\n        };\n    }, []);\n\n    return { scrollRef, contentRef, pinned, scrollToBottom };\n};\n"],"names":["PINNED_SLACK","isPinned","node","useStickToBottom","scrollRef","useRef","contentRef","pinned","setPinned","useState","pinnedRef","scrollToBottom","useCallback","useEffect","content","readPinned","next","observer"],"mappings":";AAGA,MAAMA,IAAe,IAEfC,IAAW,CAACC,MACdA,EAAK,eAAeA,EAAK,YAAYA,EAAK,gBAAgBF,GASjDG,IAAmB,MAAM;AAClC,QAAMC,IAAYC,EAAuB,IAAI,GACvCC,IAAaD,EAAuB,IAAI,GACxC,CAACE,GAAQC,CAAS,IAAIC,EAAS,EAAI,GAInCC,IAAYL,EAAO,EAAI,GAEvBM,IAAiBC,EAAY,MAAM;AACrC,UAAMV,IAAOE,EAAU;AAEvB,QAAI,CAACF;AACD;AAUJ,IAHI,OAAO,OAAO,cAAe,cAC7B,CAAC,OAAO,WAAW,kCAAkC,EAAE,WAE7C,OAAOA,EAAK,YAAa,aACnCA,EAAK,SAAS,EAAE,KAAKA,EAAK,cAAc,UAAU,UAAU,IAE5DA,EAAK,YAAYA,EAAK,cAM1BQ,EAAU,UAAU,IACpBF,EAAU,EAAI;AAAA,EAClB,GAAG,CAAA,CAAE;AAEL,SAAAK,EAAU,MAAM;AACZ,UAAMX,IAAOE,EAAU,SACjBU,IAAUR,EAAW;AAE3B,QAAI,CAACJ,KAAQ,CAACY;AACV;AAGJ,UAAMC,IAAa,MAAM;AACrB,YAAMC,IAAOf,EAASC,CAAI;AAC1B,MAAAQ,EAAU,UAAUM,GACpBR,EAAUQ,CAAI;AAAA,IAClB;AAEA,IAAAd,EAAK,iBAAiB,UAAUa,GAAY,EAAE,SAAS,IAAM;AAI7D,UAAME,IACF,OAAO,iBAAmB,MACpB,SACA,IAAI,eAAe,MAAM;AACrB,MAAIP,EAAU,YACVR,EAAK,YAAYA,EAAK;AAAA,IAE9B,CAAC;AACX,WAAAe,KAAA,QAAAA,EAAU,QAAQH,IAEX,MAAM;AACT,MAAAZ,EAAK,oBAAoB,UAAUa,CAAU,GAC7CE,KAAA,QAAAA,EAAU;AAAA,IACd;AAAA,EACJ,GAAG,CAAA,CAAE,GAEE,EAAE,WAAAb,GAAW,YAAAE,GAAY,QAAAC,GAAQ,gBAAAI,EAAA;AAC5C;"}

package/dist/components/Chat/tokenText.js

@@ -0,0 +1,6 @@
+const r = (e) => e === 0 ? "0" : e >= 1e6 ? `${(e / 1e6).toFixed(1)}m` : e >= 1e3 ? `${(e / 1e3).toFixed(1)}k` : e.toLocaleString(), i = (e) => e == null ? "-" : r(e);
+export {
+  r as compactCount,
+  i as compactOrDash
+};
+//# sourceMappingURL=tokenText.js.map

package/dist/components/Chat/tokenText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokenText.js","sources":["../../../src/components/Chat/tokenText.ts"],"sourcesContent":["/**\n * Token counts as a footer reads them — a glance, not a ledger: 157, 3.5k, 1.2m.\n *\n * A sibling module because two components format counts, and a component file exports\n * components only.\n */\nexport const compactCount = (count: number): string => {\n    if (count === 0) {\n        return '0';\n    }\n\n    if (count >= 1_000_000) {\n        return `${(count / 1_000_000).toFixed(1)}m`;\n    }\n\n    if (count >= 1_000) {\n        return `${(count / 1_000).toFixed(1)}k`;\n    }\n\n    return count.toLocaleString();\n};\n\n/** An absent count reads as a dash rather than as zero, which would claim it was measured. */\nexport const compactOrDash = (count: number | null | undefined): string =>\n    count === null || count === undefined ? '-' : compactCount(count);\n"],"names":["compactCount","count","compactOrDash"],"mappings":"AAMO,MAAMA,IAAe,CAACC,MACrBA,MAAU,IACH,MAGPA,KAAS,MACF,IAAIA,IAAQ,KAAW,QAAQ,CAAC,CAAC,MAGxCA,KAAS,MACF,IAAIA,IAAQ,KAAO,QAAQ,CAAC,CAAC,MAGjCA,EAAM,eAAA,GAIJC,IAAgB,CAACD,MAC1BA,KAAU,OAA8B,MAAMD,EAAaC,CAAK;"}

package/dist/components/Checkbox.js

@@ -0,0 +1,79 @@
+import { jsx as t, jsxs as b, Fragment as y } from "react/jsx-runtime";
+import { FOCUS_RING as m } from "./focusRing.js";
+const $ = ({
+  checked: o,
+  indeterminate: a = !1,
+  onChange: e,
+  disabled: l = !1,
+  size: r = 14,
+  presentational: u = !1,
+  "aria-label": p,
+  "aria-labelledby": x,
+  className: i = "",
+  id: g
+}) => {
+  const c = o && !a, n = Math.max(3, Math.round(r * 0.36)), d = Math.round(r * 0.57), f = a || o ? "var(--malachite-accent-background, rgb(0, 175, 102))" : "var(--malachite-text-placeholder, rgb(187, 187, 187))", h = {
+    position: "relative",
+    flexShrink: 0,
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    width: `${r}px`,
+    height: `${r}px`,
+    padding: 0,
+    borderRadius: `${n}px`,
+    borderWidth: "1px",
+    borderStyle: "solid",
+    borderColor: f,
+    backgroundColor: c ? "var(--malachite-accent-background, rgb(0, 175, 102))" : "transparent",
+    color: "#fff",
+    opacity: l ? 0.5 : 1,
+    transition: "background-color 150ms ease, border-color 150ms ease"
+  }, s = /* @__PURE__ */ b(y, { children: [
+    c && /* @__PURE__ */ b(
+      "svg",
+      {
+        width: Math.round(r * 0.78),
+        height: Math.round(r * 0.78),
+        viewBox: "0 0 24 24",
+        "aria-hidden": "true",
+        children: [
+          /* @__PURE__ */ t("title", { children: "checked" }),
+          /* @__PURE__ */ t("path", { d: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z" })
+        ]
+      }
+    ),
+    a && /* @__PURE__ */ t(
+      "span",
+      {
+        style: {
+          width: `${d}px`,
+          height: `${d}px`,
+          borderRadius: `${Math.max(2, Math.round(n * 0.6))}px`,
+          backgroundColor: "var(--malachite-accent-background, rgb(0, 175, 102))"
+        }
+      }
+    )
+  ] });
+  return u ? /* @__PURE__ */ t("span", { "aria-hidden": "true", className: i, style: h, children: s }) : /* @__PURE__ */ t(
+    "button",
+    {
+      type: "button",
+      role: "checkbox",
+      id: g,
+      "aria-checked": a ? "mixed" : o,
+      "aria-label": p,
+      "aria-labelledby": x,
+      disabled: l,
+      onClick: () => e == null ? void 0 : e(a ? !0 : !o),
+      className: `${m} ${i}`,
+      style: { ...h, cursor: l ? "not-allowed" : "pointer" },
+      children: s
+    }
+  );
+};
+export {
+  $ as Checkbox,
+  $ as default
+};
+//# sourceMappingURL=Checkbox.js.map

package/dist/components/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sources":["../../src/components/Checkbox.tsx"],"sourcesContent":["import React from 'react';\nimport { FOCUS_RING } from './focusRing';\n\ninterface CheckboxProps {\n    checked: boolean;\n    /** Tri-state \"partial\" look — overrides the checked tick with a square. */\n    indeterminate?: boolean;\n    /** Optional when `presentational` — a presentational checkbox is a visual indicator only. */\n    onChange?: (checked: boolean) => void;\n    disabled?: boolean;\n    size?: number;\n    /**\n     * Render a visual-only indicator (a non-interactive, non-focusable `<span>`,\n     * `aria-hidden`) instead of an interactive checkbox. Use this inside a clickable\n     * row/card whose wrapper is the real control, so there's a single tab stop.\n     */\n    presentational?: boolean;\n    'aria-label'?: string;\n    'aria-labelledby'?: string;\n    className?: string;\n    id?: string;\n}\n\nconst Checkbox: React.FC<CheckboxProps> = ({\n    checked,\n    indeterminate = false,\n    onChange,\n    disabled = false,\n    size = 14,\n    presentational = false,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    className = '',\n    id,\n}) => {\n    const isFilled = checked && !indeterminate;\n    const radius = Math.max(3, Math.round(size * 0.36));\n    const innerSize = Math.round(size * 0.57);\n\n    // Indeterminate shares the checked border rather than a fainter one, so \"some selected\"\n    // never reads weaker than \"nothing selected\"; the transparent fill separates the states.\n    const borderColor =\n        indeterminate || checked\n            ? 'var(--malachite-accent-background, rgb(0, 175, 102))'\n            : 'var(--malachite-text-placeholder, rgb(187, 187, 187))';\n\n    const boxStyle: React.CSSProperties = {\n        position: 'relative',\n        flexShrink: 0,\n        display: 'inline-flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        width: `${size}px`,\n        height: `${size}px`,\n        padding: 0,\n        borderRadius: `${radius}px`,\n        borderWidth: '1px',\n        borderStyle: 'solid',\n        borderColor,\n        backgroundColor: isFilled\n            ? 'var(--malachite-accent-background, rgb(0, 175, 102))'\n            : 'transparent',\n        color: '#fff',\n        opacity: disabled ? 0.5 : 1,\n        transition: 'background-color 150ms ease, border-color 150ms ease',\n    };\n\n    const glyph = (\n        <>\n            {isFilled && (\n                <svg\n                    width={Math.round(size * 0.78)}\n                    height={Math.round(size * 0.78)}\n                    viewBox=\"0 0 24 24\"\n                    aria-hidden=\"true\"\n                >\n                    <title>checked</title>\n                    {/* Filled glyph — the library forces `svg path { fill: currentColor }` */}\n                    <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\" />\n                </svg>\n            )}\n            {indeterminate && (\n                <span\n                    style={{\n                        width: `${innerSize}px`,\n                        height: `${innerSize}px`,\n                        borderRadius: `${Math.max(2, Math.round(radius * 0.6))}px`,\n                        backgroundColor: 'var(--malachite-accent-background, rgb(0, 175, 102))',\n                    }}\n                />\n            )}\n        </>\n    );\n\n    if (presentational) {\n        return (\n            <span aria-hidden=\"true\" className={className} style={boxStyle}>\n                {glyph}\n            </span>\n        );\n    }\n\n    return (\n        <button\n            type=\"button\"\n            role=\"checkbox\"\n            id={id}\n            aria-checked={indeterminate ? 'mixed' : checked}\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledBy}\n            disabled={disabled}\n            onClick={() => onChange?.(indeterminate ? true : !checked)}\n            className={`${FOCUS_RING} ${className}`}\n            style={{ ...boxStyle, cursor: disabled ? 'not-allowed' : 'pointer' }}\n        >\n            {glyph}\n        </button>\n    );\n};\n\nexport default Checkbox;\nexport { Checkbox };\nexport type { CheckboxProps };\n"],"names":["Checkbox","checked","indeterminate","onChange","disabled","size","presentational","ariaLabel","ariaLabelledBy","className","id","isFilled","radius","innerSize","borderColor","boxStyle","glyph","jsxs","Fragment","jsx","FOCUS_RING"],"mappings":";;AAuBA,MAAMA,IAAoC,CAAC;AAAA,EACvC,SAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,MAAAC,IAAO;AAAA,EACP,gBAAAC,IAAiB;AAAA,EACjB,cAAcC;AAAA,EACd,mBAAmBC;AAAA,EACnB,WAAAC,IAAY;AAAA,EACZ,IAAAC;AACJ,MAAM;AACF,QAAMC,IAAWV,KAAW,CAACC,GACvBU,IAAS,KAAK,IAAI,GAAG,KAAK,MAAMP,IAAO,IAAI,CAAC,GAC5CQ,IAAY,KAAK,MAAMR,IAAO,IAAI,GAIlCS,IACFZ,KAAiBD,IACX,yDACA,yDAEJc,IAAgC;AAAA,IAClC,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,OAAO,GAAGV,CAAI;AAAA,IACd,QAAQ,GAAGA,CAAI;AAAA,IACf,SAAS;AAAA,IACT,cAAc,GAAGO,CAAM;AAAA,IACvB,aAAa;AAAA,IACb,aAAa;AAAA,IACb,aAAAE;AAAA,IACA,iBAAiBH,IACX,yDACA;AAAA,IACN,OAAO;AAAA,IACP,SAASP,IAAW,MAAM;AAAA,IAC1B,YAAY;AAAA,EAAA,GAGVY,IACF,gBAAAC,EAAAC,GAAA,EACK,UAAA;AAAA,IAAAP,KACG,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,OAAO,KAAK,MAAMZ,IAAO,IAAI;AAAA,QAC7B,QAAQ,KAAK,MAAMA,IAAO,IAAI;AAAA,QAC9B,SAAQ;AAAA,QACR,eAAY;AAAA,QAEZ,UAAA;AAAA,UAAA,gBAAAc,EAAC,WAAM,UAAA,UAAA,CAAO;AAAA,UAEd,gBAAAA,EAAC,QAAA,EAAK,GAAE,oDAAA,CAAoD;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAGnEjB,KACG,gBAAAiB;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,OAAO;AAAA,UACH,OAAO,GAAGN,CAAS;AAAA,UACnB,QAAQ,GAAGA,CAAS;AAAA,UACpB,cAAc,GAAG,KAAK,IAAI,GAAG,KAAK,MAAMD,IAAS,GAAG,CAAC,CAAC;AAAA,UACtD,iBAAiB;AAAA,QAAA;AAAA,MACrB;AAAA,IAAA;AAAA,EACJ,GAER;AAGJ,SAAIN,sBAEK,QAAA,EAAK,eAAY,QAAO,WAAAG,GAAsB,OAAOM,GACjD,UAAAC,GACL,IAKJ,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,MAAK;AAAA,MACL,IAAAT;AAAA,MACA,gBAAcR,IAAgB,UAAUD;AAAA,MACxC,cAAYM;AAAA,MACZ,mBAAiBC;AAAA,MACjB,UAAAJ;AAAA,MACA,SAAS,MAAMD,KAAA,gBAAAA,EAAWD,IAAgB,KAAO,CAACD;AAAA,MAClD,WAAW,GAAGmB,CAAU,IAAIX,CAAS;AAAA,MACrC,OAAO,EAAE,GAAGM,GAAU,QAAQX,IAAW,gBAAgB,UAAA;AAAA,MAExD,UAAAY;AAAA,IAAA;AAAA,EAAA;AAGb;"}

package/dist/components/ClampText.js

@@ -0,0 +1,30 @@
+import { jsx as t } from "react/jsx-runtime";
+import { FOCUS_RING_INSET as o } from "./focusRing.js";
+const s = ({
+  children: a,
+  lines: i = 3,
+  expandOnHover: e = !0,
+  className: l = ""
+}) => /* @__PURE__ */ t(
+  "div",
+  {
+    className: [
+      "w-full overflow-hidden leading-[1.5em] [display:-webkit-box] [-webkit-box-orient:vertical]",
+      "[-webkit-line-clamp:var(--malachite-clamp-lines)]",
+      "max-h-[calc(1.5em*var(--malachite-clamp-lines))]",
+      "transition-[max-height] duration-300 ease-[var(--malachite-ease-standard)] motion-reduce:transition-none",
+      e ? (
+        // Inset ring: the element is `overflow-hidden`, so an outset outline is clipped.
+        `${o} hover:[-webkit-line-clamp:unset] focus-visible:[-webkit-line-clamp:unset] hover:max-h-[1000px] focus-visible:max-h-[1000px]`
+      ) : "",
+      l
+    ].filter(Boolean).join(" "),
+    style: { "--malachite-clamp-lines": i },
+    tabIndex: e ? 0 : void 0,
+    children: a
+  }
+);
+export {
+  s as default
+};
+//# sourceMappingURL=ClampText.js.map

package/dist/components/ClampText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClampText.js","sources":["../../src/components/ClampText.tsx"],"sourcesContent":["import React from 'react';\nimport { FOCUS_RING_INSET } from './focusRing';\n\nexport interface ClampTextProps {\n    children: React.ReactNode;\n    lines?: number;\n    expandOnHover?: boolean;\n    className?: string;\n}\n\n/**\n * Text clamped to `lines`, revealing the full text on hover / keyboard focus when\n * `expandOnHover`. Pure CSS. The expanded state caps at 1000px, so this is for short blurbs.\n *\n * `line-height` is `1.5em`, NOT the bare `1.5`, and that unit is what makes the cap exact: a\n * `<number>` inherits as a FACTOR, so each descendant re-resolves it against its own\n * font-size, while `max-height: calc(1.5em * lines)` resolves against THIS element's. With\n * the bare number they disagreed — 14px text in a 13px row gave 21px line boxes against a\n * 19.5px allowance and the last line was sliced. As a `<length>` both share one basis.\n *\n * The cap also bounds block children, which `-webkit-line-clamp` counts as one \"line\" each —\n * so a MarkdownBlock in `block` variant relies on it. (Prefer `variant=\"flow\"` there.)\n */\nconst ClampText: React.FC<ClampTextProps> = ({\n    children,\n    lines = 3,\n    expandOnHover = true,\n    className = '',\n}) => (\n    <div\n        className={[\n            'w-full overflow-hidden leading-[1.5em] [display:-webkit-box] [-webkit-box-orient:vertical]',\n            '[-webkit-line-clamp:var(--malachite-clamp-lines)]',\n            'max-h-[calc(1.5em*var(--malachite-clamp-lines))]',\n            'transition-[max-height] duration-300 ease-[var(--malachite-ease-standard)] motion-reduce:transition-none',\n            expandOnHover\n                ? // Inset ring: the element is `overflow-hidden`, so an outset outline is clipped.\n                  `${FOCUS_RING_INSET} hover:[-webkit-line-clamp:unset] focus-visible:[-webkit-line-clamp:unset] hover:max-h-[1000px] focus-visible:max-h-[1000px]`\n                : '',\n            className,\n        ]\n            .filter(Boolean)\n            .join(' ')}\n        style={{ '--malachite-clamp-lines': lines } as React.CSSProperties}\n        tabIndex={expandOnHover ? 0 : undefined}\n    >\n        {children}\n    </div>\n);\n\nexport default ClampText;\n"],"names":["ClampText","children","lines","expandOnHover","className","jsx","FOCUS_RING_INSET"],"mappings":";;AAuBA,MAAMA,IAAsC,CAAC;AAAA,EACzC,UAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,eAAAC,IAAgB;AAAA,EAChB,WAAAC,IAAY;AAChB,MACI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,WAAW;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACAF;AAAA;AAAA,QAEM,GAAGG,CAAgB;AAAA,UACnB;AAAA,MACNF;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,IACb,OAAO,EAAE,2BAA2BF,EAAA;AAAA,IACpC,UAAUC,IAAgB,IAAI;AAAA,IAE7B,UAAAF;AAAA,EAAA;AACL;"}

package/dist/components/CodeBlock.js

@@ -0,0 +1,223 @@
+import { jsxs as S, jsx as e } from "react/jsx-runtime";
+import T from "@uiw/react-json-view";
+import g from "react";
+import _ from "./CustomIcons/CopyIcon.js";
+import { diffHunks as D } from "./codeBlockDiff.js";
+import { CodeLine as I } from "./codeBlockLine.js";
+import { FOCUS_RING as O } from "./focusRing.js";
+const A = g.lazy(() => import("./CodeBlockHighlighter.js")), z = {
+  added: "var(--malachite-codeblock-diff-added-background)",
+  removed: "var(--malachite-codeblock-diff-removed-background)",
+  context: void 0
+}, B = {
+  added: "+",
+  removed: "-",
+  context: void 0
+}, K = {
+  added: "var(--malachite-codeblock-diff-assistant-background)",
+  removed: "var(--malachite-codeblock-diff-assistant-removed-background)",
+  context: void 0
+}, $ = {
+  added: "✦",
+  // U+2212 minus sign, not a hyphen: the mock is explicit about which glyph.
+  removed: "−",
+  context: "·"
+}, M = {
+  added: "var(--malachite-codeblock-diff-assistant-foreground)",
+  removed: "var(--malachite-codeblock-diff-removed-foreground)",
+  context: "var(--malachite-codeblock-diff-context-foreground)"
+}, E = (o) => `⋯ ${o} unchanged ${o === 1 ? "line" : "lines"}`, G = (o, d, n) => {
+  const t = n === "assistant";
+  return {
+    background: t ? K[o.type] : z[o.type],
+    marker: t ? $[o.type] : B[o.type],
+    markerColor: t ? M[o.type] : void 0,
+    // Reserved on unchanged rows too, so the code column does not step in and out.
+    reserveMarker: !0,
+    // Context rows read as de-emphasised, not just unmarked, in the assistant palette.
+    textColor: t && o.type === "context" ? "var(--malachite-codeblock-diff-context-text)" : void 0,
+    strikethrough: t && o.type === "removed",
+    separatorAbove: o.skippedAbove === void 0 ? void 0 : E(o.skippedAbove),
+    // A removed line has no number in the after-text, so it keeps the one it had before.
+    lineNumber: d ? o.afterNumber ?? o.beforeNumber : void 0
+  };
+}, Y = ({
+  code: o,
+  json: d,
+  showLineNumbers: n = !0,
+  className: t = "",
+  style: j = {},
+  height: x,
+  enableCopy: s = !0,
+  wrapLines: u = !1,
+  language: v,
+  collapsed: N = !1,
+  diff: l
+}) => {
+  const a = l ? D(l.before, l.after, l.context) : null, m = (a == null ? void 0 : a.map((c) => c.text).join(`
+`)) ?? "", k = (() => {
+    if (a)
+      return m;
+    if (o)
+      return o;
+    if (d !== void 0)
+      try {
+        return JSON.stringify(d, null, 2);
+      } catch {
+        return;
+      }
+  })(), C = s && k !== void 0 && /* @__PURE__ */ e(
+    "button",
+    {
+      type: "button",
+      "aria-label": "Copy",
+      onClick: () => {
+        var c, r;
+        k !== void 0 && ((r = (c = navigator.clipboard) == null ? void 0 : c.writeText(k)) == null || r.catch(() => {
+        }));
+      },
+      className: `absolute top-2 right-2 z-10 flex items-center justify-center rounded-md border border-solid border-[var(--malachite-codeblock-border)] bg-[var(--malachite-codeblock-background)] p-1.5 transition-colors hover:bg-[var(--malachite-codeblock-border)] ${O}`,
+      style: { color: "var(--malachite-codeblock-line-number)" },
+      children: /* @__PURE__ */ e(_, { size: 14 })
+    }
+  );
+  if (d && !a)
+    return /* @__PURE__ */ S(
+      "div",
+      {
+        className: `relative border rounded-lg overflow-hidden ${t}`,
+        style: {
+          backgroundColor: "var(--malachite-codeblock-background)",
+          borderColor: "var(--malachite-codeblock-border)",
+          height: x,
+          ...j
+        },
+        children: [
+          C,
+          /* @__PURE__ */ e(
+            T,
+            {
+              value: d,
+              style: {
+                backgroundColor: "var(--malachite-codeblock-background)",
+                color: "var(--malachite-codeblock-foreground)",
+                fontSize: "14px",
+                fontFamily: "var(--malachite-font-mono, monospace)",
+                padding: "16px",
+                lineHeight: "1.5",
+                textAlign: "left",
+                "--w-rjv-color": "var(--malachite-codeblock-foreground)",
+                "--w-rjv-key-string": "var(--malachite-codeblock-keyword)",
+                "--w-rjv-background-color": "var(--malachite-codeblock-background)",
+                "--w-rjv-line-color": "var(--malachite-codeblock-border)",
+                "--w-rjv-arrow-color": "var(--malachite-codeblock-line-number)",
+                "--w-rjv-edit-color": "var(--malachite-codeblock-keyword)",
+                "--w-rjv-info-color": "var(--malachite-codeblock-line-number)",
+                "--w-rjv-update-color": "var(--malachite-codeblock-keyword)",
+                "--w-rjv-copied-color": "var(--malachite-codeblock-string)",
+                "--w-rjv-copied-success-color": "var(--malachite-codeblock-string)",
+                "--w-rjv-curlybraces-color": "var(--malachite-codeblock-foreground)",
+                "--w-rjv-colon-color": "var(--malachite-codeblock-foreground)",
+                "--w-rjv-brackets-color": "var(--malachite-codeblock-foreground)",
+                "--w-rjv-quotes-color": "var(--malachite-codeblock-string)",
+                "--w-rjv-quotes-string-color": "var(--malachite-codeblock-string)",
+                "--w-rjv-type-string-color": "var(--malachite-codeblock-string)",
+                "--w-rjv-type-int-color": "var(--malachite-codeblock-number)",
+                "--w-rjv-type-float-color": "var(--malachite-codeblock-number)",
+                "--w-rjv-type-bigint-color": "var(--malachite-codeblock-number)",
+                "--w-rjv-type-boolean-color": "var(--malachite-codeblock-keyword)",
+                "--w-rjv-type-date-color": "var(--malachite-codeblock-string)",
+                "--w-rjv-type-url-color": "var(--malachite-codeblock-keyword)",
+                "--w-rjv-type-null-color": "var(--malachite-codeblock-comment)",
+                "--w-rjv-type-nan-color": "var(--malachite-codeblock-comment)",
+                "--w-rjv-type-undefined-color": "var(--malachite-codeblock-comment)"
+              },
+              displayDataTypes: !1,
+              enableClipboard: s,
+              collapsed: N,
+              displayObjectSize: !1
+            }
+          )
+        ]
+      }
+    );
+  const h = s && (!!o || !!a), p = (c, r) => {
+    const f = c.split(`
+`);
+    return /* @__PURE__ */ e(
+      "div",
+      {
+        className: "p-4 overflow-auto text-left",
+        style: { paddingRight: h ? 44 : void 0 },
+        children: /* @__PURE__ */ e("div", { style: { width: "max-content", minWidth: "100%" }, children: f.map((i, y) => {
+          const b = r == null ? void 0 : r(y);
+          return /* @__PURE__ */ e(
+            I,
+            {
+              line: i,
+              lineNumber: (b == null ? void 0 : b.lineNumber) ?? (n ? y + 1 : void 0),
+              wrap: u,
+              decoration: b,
+              children: i
+            },
+            y
+          );
+        }) })
+      }
+    );
+  }, w = () => o ? p(o) : null, F = (c) => {
+    if (c.length === 0)
+      return /* @__PURE__ */ e(
+        "div",
+        {
+          className: "p-4 text-left",
+          style: { color: "var(--malachite-codeblock-comment)" },
+          children: "No changes"
+        }
+      );
+    const r = (f) => {
+      const i = c[f];
+      return i ? G(i, n, l == null ? void 0 : l.origin) : void 0;
+    };
+    return v ? /* @__PURE__ */ e(g.Suspense, { fallback: p(m, r), children: /* @__PURE__ */ e(
+      A,
+      {
+        code: m,
+        language: v,
+        showLineNumbers: n,
+        wrapLines: u,
+        copyClearance: h,
+        decorate: r
+      }
+    ) }) : p(m, r);
+  }, R = () => o ? v ? /* @__PURE__ */ e(g.Suspense, { fallback: w(), children: /* @__PURE__ */ e(
+    A,
+    {
+      code: o,
+      language: v,
+      showLineNumbers: n,
+      wrapLines: u,
+      copyClearance: h
+    }
+  ) }) : w() : null;
+  return /* @__PURE__ */ S(
+    "div",
+    {
+      className: `relative border rounded-lg overflow-hidden ${t}`,
+      style: {
+        backgroundColor: "var(--malachite-codeblock-background)",
+        borderColor: "var(--malachite-codeblock-border)",
+        height: x,
+        ...j
+      },
+      children: [
+        C,
+        a ? F(a) : R()
+      ]
+    }
+  );
+};
+export {
+  Y as default
+};
+//# sourceMappingURL=CodeBlock.js.map