@truefoundry/agent-ui-sdk 0.0.1 → 0.0.3

package/dist/index.js

@@ -1,10 +1,133 @@
 "use client";
 
+// src/icons/fontawesome.ts
+import { library } from "@fortawesome/fontawesome-svg-core";
+import {
+  faArrowDown,
+  faArrowUp,
+  faBoxArchive,
+  faEllipsis,
+  faPencil,
+  faPlus,
+  faTrash,
+  faXmark
+} from "@fortawesome/free-solid-svg-icons";
+library.add(faArrowDown, faArrowUp, faBoxArchive, faEllipsis, faPencil, faPlus, faTrash, faXmark);
+
+// src/icons/registerAgentIcons.ts
+import { registerIcons } from "tfy-web-components/components/atoms/IconProvider";
+
+// src/icons/agent-2.svg
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+var SvgAgent2 = (props) => /* @__PURE__ */ jsx("svg", { width: "1em", height: "1em", viewBox: "0 0 16 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx("path", { d: "M8 0C8.40158 8.28071e-05 8.72754 0.325937 8.72754 0.727539V2.90918H12.3623C13.5671 2.90921 14.5437 3.88607 14.5439 5.09082V7.27246H15.2725C15.6741 7.27253 16 7.59839 16 8C15.9999 8.40155 15.674 8.72747 15.2725 8.72754H14.5439V10.9092C14.5437 12.1139 13.5671 13.0908 12.3623 13.0908H3.63477C2.43015 13.0906 1.45334 12.1138 1.45312 10.9092V8.72754H0.727539C0.325964 8.7275 7.21982e-05 8.40157 0 8C0 7.59837 0.32592 7.2725 0.727539 7.27246H1.45312V5.09082C1.45335 3.8862 2.43015 2.90942 3.63477 2.90918H7.27246V1.45508H5.09082C4.68943 1.4549 4.36346 1.12893 4.36328 0.727539C4.36328 0.325997 4.68932 0.00017902 5.09082 0H8ZM3.63477 4.36426C3.23346 4.3645 2.90843 4.68951 2.9082 5.09082V7.99023C2.90824 7.99344 2.90918 7.99678 2.90918 8C2.90918 8.00326 2.90825 8.00651 2.9082 8.00977V10.9092C2.90841 11.3105 3.23345 11.6365 3.63477 11.6367H12.3623C12.7638 11.6367 13.0896 11.3106 13.0898 10.9092V5.09082C13.0896 4.68937 12.7638 4.36428 12.3623 4.36426H3.63477ZM5.81738 6.54492C6.21902 6.54492 6.54489 6.87084 6.54492 7.27246V8.72656C6.54492 9.12822 6.21904 9.4541 5.81738 9.4541C5.41587 9.45393 5.08984 9.12811 5.08984 8.72656V7.27246C5.08988 6.87094 5.41589 6.54509 5.81738 6.54492ZM10.1816 6.54492C10.5831 6.54514 10.9091 6.87097 10.9092 7.27246V8.72656C10.9092 9.12808 10.5831 9.45388 10.1816 9.4541C9.77999 9.4541 9.4541 9.12822 9.4541 8.72656V7.27246C9.45413 6.87084 9.78001 6.54492 10.1816 6.54492Z", fill: "currentColor" }) });
+var agent_2_default = SvgAgent2;
+
+// src/icons/ai.svg
+import * as React2 from "react";
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var SvgAi = (props) => /* @__PURE__ */ jsx2("svg", { width: "1em", height: "1em", viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsxs("g", { opacity: 0.9, children: [
+  /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.4419 9.43023C15.7501 9.43023 16 9.68012 16 9.98837V10.0304C16 11.398 16 12.4813 15.886 13.329C15.7687 14.2015 15.5216 14.9077 14.9647 15.4647C14.4077 16.0216 13.7015 16.2687 12.829 16.386C11.9813 16.5 10.898 16.5 9.53035 16.5H9.48837C9.18012 16.5 8.93023 16.2501 8.93023 15.9419C8.93023 15.6336 9.18012 15.3837 9.48837 15.3837C10.9074 15.3837 11.9155 15.3825 12.6803 15.2797C13.429 15.1791 13.8604 14.9903 14.1753 14.6753C14.4903 14.3604 14.6791 13.929 14.7797 13.1803C14.8825 12.4155 14.8837 11.4074 14.8837 9.98837C14.8837 9.68012 15.1336 9.43023 15.4419 9.43023Z", fill: "currentColor" }),
+  /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.55814 9.43023C0.866392 9.43023 1.11628 9.68012 1.11628 9.98837C1.11628 11.4074 1.11747 12.4155 1.22029 13.1803C1.32095 13.929 1.50973 14.3604 1.82467 14.6753C2.13962 14.9903 2.57098 15.1791 3.3197 15.2797C4.08448 15.3825 5.0926 15.3837 6.51163 15.3837C6.81988 15.3837 7.06977 15.6336 7.06977 15.9419C7.06977 16.2501 6.81988 16.5 6.51163 16.5H6.46965C5.10201 16.5 4.01875 16.5 3.17096 16.386C2.29846 16.2687 1.59227 16.0216 1.03534 15.4647C0.478423 14.9077 0.231266 14.2015 0.113961 13.329C-2.0957e-05 12.4813 -1.15596e-05 11.398 2.3934e-07 10.0304C3.72411e-07 10.0164 5.05482e-07 10.0024 5.05482e-07 9.98837C5.05482e-07 9.68012 0.249888 9.43023 0.55814 9.43023Z", fill: "currentColor" }),
+  /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.46964 0.5L6.51163 0.500001C6.81988 0.500001 7.06977 0.749888 7.06977 1.05814C7.06977 1.36639 6.81988 1.61628 6.51163 1.61628C5.0926 1.61628 4.08448 1.61747 3.3197 1.72029C2.57098 1.82095 2.13962 2.00973 1.82467 2.32467C1.50973 2.63962 1.32095 3.07098 1.22029 3.8197C1.11747 4.58448 1.11628 5.5926 1.11628 7.01163C1.11628 7.31988 0.866392 7.56977 0.55814 7.56977C0.249888 7.56977 5.05482e-07 7.31988 5.05482e-07 7.01163L2.3934e-07 6.96964C-1.15596e-05 5.60201 -2.0957e-05 4.51875 0.113961 3.67096C0.231266 2.79846 0.478423 2.09227 1.03534 1.53534C1.59227 0.978423 2.29846 0.731266 3.17096 0.613961C4.01875 0.499979 5.10201 0.499988 6.46964 0.5Z", fill: "currentColor" }),
+  /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.6803 1.72029C11.9155 1.61747 10.9074 1.61628 9.48837 1.61628C9.18012 1.61628 8.93023 1.36639 8.93023 1.05814C8.93023 0.749888 9.18012 0.500001 9.48837 0.500001C9.5024 0.500001 9.51639 0.5 9.53036 0.5C10.898 0.499988 11.9813 0.499979 12.829 0.613961C13.7015 0.731266 14.4077 0.978423 14.9647 1.53534C15.5216 2.09227 15.7687 2.79846 15.886 3.67096C16 4.51875 16 5.60201 16 6.96965V7.01163C16 7.31988 15.7501 7.56977 15.4419 7.56977C15.1336 7.56977 14.8837 7.31988 14.8837 7.01163C14.8837 5.5926 14.8825 4.58448 14.7797 3.8197C14.6791 3.07098 14.4903 2.63962 14.1753 2.32467C13.8604 2.00973 13.429 1.82095 12.6803 1.72029Z", fill: "currentColor" }),
+  /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2.70041 3.20041C2.04651 3.85431 2.04651 4.90675 2.04651 7.01163V9.98837C2.04651 12.0933 2.04651 13.1457 2.70041 13.7996C3.35431 14.4535 4.40675 14.4535 6.51163 14.4535H9.48837C11.5933 14.4535 12.6457 14.4535 13.2996 13.7996C13.9535 13.1457 13.9535 12.0933 13.9535 9.98837V7.01163C13.9535 4.90675 13.9535 3.85431 13.2996 3.20041C12.6457 2.54651 11.5933 2.54651 9.48837 2.54651H6.51163C4.40675 2.54651 3.35431 2.54651 2.70041 3.20041ZM5.65417 10.5348C5.81478 10.3181 6.12065 10.2726 6.33733 10.4332C6.8116 10.7848 7.38407 10.9884 8 10.9884C8.61593 10.9884 9.1884 10.7848 9.66267 10.4332C9.87936 10.2726 10.1852 10.3181 10.3458 10.5348C10.5064 10.7514 10.461 11.0573 10.2443 11.2179C9.61111 11.6873 8.83673 11.9651 8 11.9651C7.16327 11.9651 6.38889 11.6873 5.75569 11.2179C5.53901 11.0573 5.49356 10.7514 5.65417 10.5348ZM10.6047 7.24419C10.6047 7.78363 10.3131 8.22093 9.95349 8.22093C9.59386 8.22093 9.30233 7.78363 9.30233 7.24419C9.30233 6.70475 9.59386 6.26744 9.95349 6.26744C10.3131 6.26744 10.6047 6.70475 10.6047 7.24419ZM6.04651 8.22093C6.40614 8.22093 6.69767 7.78363 6.69767 7.24419C6.69767 6.70475 6.40614 6.26744 6.04651 6.26744C5.68688 6.26744 5.39535 6.70475 5.39535 7.24419C5.39535 7.78363 5.68688 8.22093 6.04651 8.22093Z", fill: "currentColor" })
+] }) });
+var ai_default = SvgAi;
+
+// src/icons/brain-regular.svg
+import * as React3 from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var SvgBrainRegular = (props) => /* @__PURE__ */ jsx3("svg", { width: "1em", height: "1em", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx3("path", { d: "M0 6.9375C0 6.30469 0.234375 5.69531 0.609375 5.25C0.5625 5.0625 0.5625 4.875 0.5625 4.6875C0.5625 3.9375 0.9375 3.25781 1.52344 2.85938C1.61719 2.17969 2.01562 1.59375 2.60156 1.26562C2.90625 0.515625 3.63281 0 4.5 0C5.08594 0 5.60156 0.257812 6 0.65625C6.375 0.257812 6.89062 0 7.5 0C8.34375 0 9.07031 0.515625 9.375 1.26562C9.96094 1.59375 10.3594 2.17969 10.4531 2.85938C11.0391 3.25781 11.4375 3.9375 11.4375 4.6875C11.4375 4.875 11.4141 5.0625 11.3672 5.25C11.7422 5.69531 12 6.30469 12 6.9375C12 7.66406 11.6953 8.32031 11.2266 8.78906L11.25 8.8125C11.25 9.9375 10.4297 10.8516 9.375 11.0391C9 11.625 8.34375 12 7.59375 12C6.96094 12 6.375 11.7422 6 11.2969C5.60156 11.7422 5.01562 12 4.40625 12C3.63281 12 2.97656 11.625 2.60156 11.0391C1.54688 10.8516 0.75 9.9375 0.75 8.8125V8.78906C0.28125 8.32031 0 7.66406 0 6.9375ZM5.41406 9.9375H5.4375V2.0625C5.4375 1.54688 5.01562 1.125 4.5 1.125C3.96094 1.125 3.5625 1.54688 3.5625 2.0625V2.08594C3.07031 2.17969 2.69531 2.55469 2.625 3.04688C2.625 3.09375 2.625 3.14062 2.625 3.1875C2.625 3.32812 2.625 3.46875 2.67188 3.58594C2.50781 3.60938 2.32031 3.65625 2.17969 3.75C1.89844 3.9375 1.71094 4.24219 1.6875 4.57031C1.6875 4.61719 1.6875 4.66406 1.6875 4.6875C1.6875 5.03906 1.82812 5.34375 2.0625 5.55469C1.71094 5.69531 1.40625 5.97656 1.24219 6.32812C1.17188 6.51562 1.10156 6.72656 1.10156 6.9375C1.10156 7.5 1.42969 7.99219 1.875 8.25C1.92188 8.27344 1.94531 8.29688 1.99219 8.32031C1.96875 8.34375 1.96875 8.36719 1.94531 8.39062C1.89844 8.53125 1.875 8.67188 1.875 8.8125C1.875 9.32812 2.20312 9.77344 2.67188 9.91406C2.76562 9.9375 2.88281 9.9375 3 9.9375C3.11719 9.9375 3.25781 9.91406 3.375 9.89062C3.375 10.1016 3.44531 10.3125 3.58594 10.4766C3.77344 10.7344 4.05469 10.875 4.40625 10.875C4.92188 10.875 5.36719 10.4766 5.41406 9.9375ZM8.41406 2.08594L8.4375 2.0625C8.4375 1.54688 8.01562 1.125 7.5 1.125C6.96094 1.125 6.5625 1.54688 6.5625 2.0625V9.9375C6.60938 10.4766 7.05469 10.875 7.59375 10.875C7.92188 10.875 8.20312 10.7344 8.39062 10.4766C8.53125 10.3125 8.60156 10.1016 8.60156 9.89062C8.71875 9.91406 8.85938 9.9375 9 9.9375C9.09375 9.9375 9.21094 9.9375 9.30469 9.91406C9.77344 9.77344 10.125 9.32812 10.125 8.8125C10.125 8.67188 10.0781 8.53125 10.0312 8.39062C10.0078 8.36719 10.0078 8.34375 9.98438 8.32031C10.0312 8.29688 10.0547 8.27344 10.1016 8.25C10.5469 7.99219 10.875 7.5 10.875 6.9375C10.875 6.72656 10.8047 6.51562 10.7344 6.32812C10.5703 5.97656 10.2656 5.69531 9.91406 5.55469C10.1484 5.34375 10.3125 5.03906 10.3125 4.6875C10.3125 4.66406 10.2891 4.61719 10.2891 4.57031C10.2656 4.24219 10.0781 3.9375 9.79688 3.75C9.65625 3.65625 9.46875 3.60938 9.30469 3.58594C9.35156 3.46875 9.375 3.32812 9.375 3.1875C9.375 3.14062 9.35156 3.09375 9.35156 3.04688C9.28125 2.55469 8.90625 2.17969 8.41406 2.08594Z", fill: "currentColor" }) });
+var brain_regular_default = SvgBrainRegular;
+
+// src/icons/compare.svg
+import * as React4 from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var SvgCompare = (props) => /* @__PURE__ */ jsx4("svg", { width: "1em", height: "1em", viewBox: "0 0 14 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx4("path", { d: "M5.09091 16.5V15.0455H1.45455C1.05455 15.0455 0.712121 14.903 0.427273 14.6182C0.142424 14.3333 0 13.9909 0 13.5909V3.40909C0 3.00909 0.142424 2.66667 0.427273 2.38182C0.712121 2.09697 1.05455 1.95455 1.45455 1.95455H5.09091V0.5H6.54545V16.5H5.09091ZM8 15.0455V13.5909L11.6364 13.5909V3.40909H8V1.95455H11.6364C12.0364 1.95455 12.3788 2.09697 12.6636 2.38182C12.9485 2.66667 13.0909 3.00909 13.0909 3.40909V13.5909C13.0909 13.9909 12.9485 14.3333 12.6636 14.6182C12.3788 14.903 12.0364 15.0455 11.6364 15.0455H8Z", fill: "currentColor" }) });
+var compare_default = SvgCompare;
+
+// src/icons/mcp-server.svg
+import * as React5 from "react";
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+var SvgMcpServer = (props) => /* @__PURE__ */ jsxs2("svg", { width: "1em", height: "1em", viewBox: "0 0 14 14", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
+  /* @__PURE__ */ jsxs2("g", { clipPath: "url(#clip0_5446_3655)", children: [
+    /* @__PURE__ */ jsx5("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.15174 1.36702C8.86989 1.09272 8.49212 0.939234 8.09883 0.939234C7.70553 0.939234 7.32776 1.09272 7.04591 1.36702L1.43074 6.87369C1.33678 6.96502 1.21091 7.01611 1.07987 7.01611C0.948831 7.01611 0.822958 6.96502 0.728994 6.87369C0.68299 6.82895 0.646423 6.77544 0.621453 6.71633C0.596483 6.65721 0.583618 6.59369 0.583618 6.52952C0.583618 6.46535 0.596483 6.40183 0.621453 6.34272C0.646423 6.2836 0.68299 6.23009 0.728994 6.18536L6.34416 0.678689C6.81387 0.221585 7.44341 -0.0341797 8.09883 -0.0341797C8.75424 -0.0341797 9.38379 0.221585 9.85349 0.678689C10.1253 0.943 10.3306 1.26791 10.4527 1.62683C10.5748 1.98575 10.6101 2.36848 10.5558 2.74369C10.936 2.68962 11.3235 2.72356 11.6885 2.8429C12.0535 2.96224 12.3863 3.16379 12.6611 3.43202L12.6902 3.46119C12.9203 3.68489 13.1031 3.95243 13.2279 4.248C13.3528 4.54357 13.4171 4.86117 13.4171 5.18202C13.4171 5.50288 13.3528 5.82048 13.2279 6.11605C13.1031 6.41162 12.9203 6.67916 12.6902 6.90286L7.61174 11.8828C7.59642 11.8977 7.58423 11.9155 7.57591 11.9352C7.56759 11.9549 7.5633 11.976 7.5633 11.9974C7.5633 12.0188 7.56759 12.0399 7.57591 12.0596C7.58423 12.0793 7.59642 12.0971 7.61174 12.112L8.65474 13.1352C8.70075 13.1799 8.73731 13.2334 8.76228 13.2926C8.78725 13.3517 8.80012 13.4152 8.80012 13.4794C8.80012 13.5435 8.78725 13.607 8.76228 13.6662C8.73731 13.7253 8.70075 13.7788 8.65474 13.8235C8.56078 13.9149 8.43491 13.9659 8.30387 13.9659C8.17283 13.9659 8.04696 13.9149 7.95299 13.8235L6.90999 12.8009C6.80257 12.6966 6.71717 12.5717 6.65886 12.4337C6.60054 12.2957 6.5705 12.1475 6.5705 11.9977C6.5705 11.8479 6.60054 11.6996 6.65886 11.5617C6.71717 11.4237 6.80257 11.2988 6.90999 11.1944L11.9885 6.21394C12.1264 6.07968 12.2361 5.91914 12.3109 5.74181C12.3858 5.56447 12.4244 5.37393 12.4244 5.18144C12.4244 4.98895 12.3858 4.79841 12.3109 4.62107C12.2361 4.44374 12.1264 4.2832 11.9885 4.14894L11.9593 4.12036C11.6778 3.84634 11.3005 3.69287 10.9076 3.69254C10.5148 3.69222 10.1372 3.84506 9.85524 4.11861L5.67158 8.22177L5.67041 8.22294L5.61324 8.27952C5.51925 8.37103 5.39326 8.42223 5.26208 8.42223C5.1309 8.42223 5.0049 8.37103 4.91091 8.27952C4.86491 8.23478 4.82834 8.18128 4.80337 8.12216C4.7784 8.06305 4.76553 7.99953 4.76553 7.93536C4.76553 7.87118 4.7784 7.80766 4.80337 7.74855C4.82834 7.68944 4.86491 7.63593 4.91091 7.59119L9.15349 3.43027C9.29105 3.29592 9.40033 3.1354 9.47488 2.95816C9.54943 2.78093 9.58776 2.59056 9.58759 2.39828C9.58743 2.206 9.54878 2.0157 9.47393 1.83859C9.39907 1.66147 9.28953 1.50114 9.15174 1.36702Z", fill: "currentColor" }),
+    /* @__PURE__ */ jsx5("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.44964 2.74425C8.49564 2.69951 8.53221 2.646 8.55718 2.58689C8.58215 2.52777 8.59501 2.46425 8.59501 2.40008C8.59501 2.33591 8.58215 2.27239 8.55718 2.21328C8.53221 2.15416 8.49564 2.10066 8.44964 2.05592C8.35564 1.96441 8.22965 1.91321 8.09847 1.91321C7.96729 1.91321 7.84129 1.96441 7.7473 2.05592L3.59455 6.12875C3.36454 6.35245 3.1817 6.61999 3.05685 6.91556C2.932 7.21113 2.86768 7.52873 2.86768 7.84958C2.86768 8.17044 2.932 8.48804 3.05685 8.78361C3.1817 9.07918 3.36454 9.34672 3.59455 9.57042C4.06433 10.0274 4.69385 10.2831 5.34922 10.2831C6.00459 10.2831 6.63411 10.0274 7.10389 9.57042L11.2572 5.49758C11.3032 5.45284 11.3398 5.39934 11.3648 5.34022C11.3897 5.28111 11.4026 5.21759 11.4026 5.15342C11.4026 5.08925 11.3897 5.02573 11.3648 4.96661C11.3398 4.9075 11.3032 4.85399 11.2572 4.80925C11.1632 4.71774 11.0372 4.66654 10.9061 4.66654C10.7749 4.66654 10.6489 4.71774 10.5549 4.80925L6.40214 8.88208C6.12029 9.15639 5.74252 9.30987 5.34922 9.30987C4.95592 9.30987 4.57815 9.15639 4.2963 8.88208C4.15836 8.74782 4.04873 8.58729 3.97386 8.40995C3.899 8.23261 3.86043 8.04207 3.86043 7.84958C3.86043 7.65709 3.899 7.46655 3.97386 7.28922C4.04873 7.11188 4.15836 6.95134 4.2963 6.81708L8.44964 2.74425Z", fill: "currentColor" })
+  ] }),
+  /* @__PURE__ */ jsx5("defs", { children: /* @__PURE__ */ jsx5("clipPath", { id: "clip0_5446_3655", children: /* @__PURE__ */ jsx5("rect", { width: 14, height: 14, fill: "white" }) }) })
+] });
+var mcp_server_default = SvgMcpServer;
+
+// src/icons/search-globe.svg
+import * as React6 from "react";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var SvgSearchGlobe = (props) => /* @__PURE__ */ jsx6("svg", { width: "1em", height: "1em", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx6("path", { d: "M7 0C10.8555 0 14 3.14453 14 7C14 10.8828 10.8555 14 7 14C3.11719 14 0 10.8828 0 7C0 3.14453 3.11719 0 7 0ZM7 12.6875C7.19141 12.6875 7.71094 12.4961 8.28516 11.375C8.53125 10.8828 8.72266 10.3086 8.88672 9.625H5.08594C5.25 10.3086 5.44141 10.8828 5.6875 11.375C6.26172 12.4961 6.78125 12.6875 7 12.6875ZM4.86719 8.3125H9.10547C9.16016 7.90234 9.1875 7.46484 9.1875 7C9.1875 6.5625 9.16016 6.125 9.10547 5.6875H4.86719C4.8125 6.125 4.8125 6.5625 4.8125 7C4.8125 7.46484 4.8125 7.90234 4.86719 8.3125ZM8.88672 4.375C8.72266 3.71875 8.53125 3.14453 8.28516 2.65234C7.71094 1.53125 7.19141 1.3125 7 1.3125C6.78125 1.3125 6.26172 1.53125 5.6875 2.65234C5.44141 3.14453 5.25 3.71875 5.08594 4.375H8.88672ZM10.418 5.6875C10.4727 6.125 10.5 6.5625 10.5 7C10.5 7.46484 10.4727 7.90234 10.418 8.3125H12.5234C12.6328 7.90234 12.6875 7.46484 12.6875 7C12.6875 6.5625 12.6328 6.125 12.5234 5.6875H10.418ZM9.35156 1.83203C9.73438 2.54297 10.0352 3.41797 10.2266 4.375H12.0312C11.457 3.25391 10.5 2.35156 9.35156 1.83203ZM4.62109 1.83203C3.47266 2.35156 2.51562 3.25391 1.94141 4.375H3.74609C3.9375 3.41797 4.23828 2.54297 4.62109 1.83203ZM1.3125 7C1.3125 7.46484 1.33984 7.90234 1.44922 8.3125H3.55469C3.5 7.90234 3.5 7.46484 3.5 7C3.5 6.5625 3.5 6.125 3.55469 5.6875H1.44922C1.33984 6.125 1.3125 6.5625 1.3125 7ZM12.0312 9.625H10.2266C10.0352 10.6094 9.73438 11.4844 9.35156 12.1953C10.5 11.6758 11.457 10.7734 12.0312 9.625ZM3.74609 9.625H1.94141C2.51562 10.7734 3.47266 11.6758 4.62109 12.1953C4.23828 11.4844 3.9375 10.6094 3.74609 9.625Z", fill: "currentColor" }) });
+var search_globe_default = SvgSearchGlobe;
+
+// src/icons/registerAgentIcons.ts
+registerIcons({
+  "mcp-server": mcp_server_default,
+  "agent-2": agent_2_default,
+  compare: compare_default,
+  ai: ai_default,
+  searchGlobe: search_globe_default,
+  "brain-regular": brain_regular_default
+});
+
 // src/theme/SlotsProvider.tsx
-import { createContext, useContext, useMemo as useMemo2 } from "react";
+import { createContext, useContext, useMemo } from "react";
+import {
+  ThemeProvider as TfyThemeProvider,
+  useTheme as useTfyTheme
+} from "tfy-web-components/components/theme/useTheme";
+
+// src/theme/defaultSlots.ts
+import {
+  Accordion as Accordion2,
+  AccordionDetails as AccordionDetails2,
+  AccordionSummary as AccordionSummary2
+} from "tfy-web-components/components/atoms/Accordion";
+import Button2 from "tfy-web-components/components/atoms/Button";
+import IconButton4 from "tfy-web-components/components/atoms/IconButton";
+import Modal2 from "tfy-web-components/components/atoms/Modal";
+import Skeleton3 from "tfy-web-components/components/atoms/Skeleton";
+import { LightTooltip } from "tfy-web-components/components/atoms/Tooltip";
+import Dialog from "tfy-web-components/components/molecules/Dialog";
+
+// src/atoms/adapters/AskUserPromptAdapter.tsx
+import {
+  AskUserQuestionCard as TfyAskUserQuestionCard
+} from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx7 } from "react/jsx-runtime";
+function AskUserPrompt(props) {
+  return /* @__PURE__ */ jsx7(TfyAskUserQuestionCard, { ...props });
+}
+
+// src/atoms/adapters/McpAuthPromptAdapter.tsx
+import {
+  McpAuthCard as TfyMcpAuthCard
+} from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx8 } from "react/jsx-runtime";
+function McpAuthPrompt(props) {
+  return /* @__PURE__ */ jsx8(TfyMcpAuthCard, { ...props });
+}
+
+// src/atoms/adapters/ReasoningCardAdapter.tsx
+import {
+  ReasoningCard as TfyReasoningCard
+} from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx9 } from "react/jsx-runtime";
+function ReasoningCard(props) {
+  return /* @__PURE__ */ jsx9(TfyReasoningCard, { ...props });
+}
 
 // src/atoms/primitives/Avatar.tsx
-import { Avatar as AvatarPrimitive } from "radix-ui";
+import "react";
+import TfyAvatar, {
+  AvatarImage as TfyAvatarImage,
+  AvatarFallback as TfyAvatarFallback
+} from "tfy-web-components/components/atoms/Avatar";
 
 // src/atoms/lib/cn.ts
 import { clsx } from "clsx";
@@ -14,885 +137,253 @@ function cn(...inputs) {
 }
 
 // src/atoms/primitives/Avatar.tsx
-import { jsx } from "react/jsx-runtime";
+import { jsx as jsx10 } from "react/jsx-runtime";
+var AvatarRoot = TfyAvatar;
+var AvatarImagePrimitive = TfyAvatarImage;
+var AvatarFallbackPrimitive = TfyAvatarFallback;
 function Avatar({ className, size = "default", ...props }) {
-  return /* @__PURE__ */ jsx(
-    AvatarPrimitive.Root,
+  return /* @__PURE__ */ jsx10(
+    AvatarRoot,
     {
       "data-slot": "avatar",
       "data-size": size,
-      className: cn(
-        "group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten",
-        className
-      ),
+      size,
+      className: cn(className),
       ...props
     }
   );
 }
 function AvatarImage({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    AvatarPrimitive.Image,
-    {
-      "data-slot": "avatar-image",
-      className: cn("aspect-square size-full rounded-full object-cover", className),
-      ...props
-    }
-  );
+  return /* @__PURE__ */ jsx10(AvatarImagePrimitive, { "data-slot": "avatar-image", className: cn(className), ...props });
 }
 function AvatarFallback({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    AvatarPrimitive.Fallback,
-    {
-      "data-slot": "avatar-fallback",
-      className: cn(
-        "flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs",
-        className
-      ),
-      ...props
-    }
-  );
+  return /* @__PURE__ */ jsx10(AvatarFallbackPrimitive, { "data-slot": "avatar-fallback", className: cn(className), ...props });
 }
 
-// src/atoms/primitives/Button.tsx
-import { cva } from "class-variance-authority";
-import { Slot } from "radix-ui";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var buttonVariants = cva(
-  "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-  {
-    variants: {
-      variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/80",
-        outline: "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
-        ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
-        destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
-        link: "text-primary underline-offset-4 hover:underline"
-      },
-      size: {
-        default: "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
-        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
-        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
-        lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
-        icon: "size-8",
-        "icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
-        "icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
-        "icon-lg": "size-9"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-);
-function Button({
-  className,
-  variant = "default",
-  size = "default",
-  asChild = false,
-  ...props
-}) {
-  const Comp = asChild ? Slot.Root : "button";
-  return /* @__PURE__ */ jsx2(
-    Comp,
-    {
-      "data-slot": "button",
-      "data-variant": variant,
-      "data-size": size,
-      className: cn(buttonVariants({ variant, size, className })),
-      ...props
-    }
-  );
-}
-
-// src/atoms/primitives/Collapsible.tsx
-import { Collapsible as CollapsiblePrimitive } from "radix-ui";
-import { jsx as jsx3 } from "react/jsx-runtime";
-function Collapsible(props) {
-  return /* @__PURE__ */ jsx3(CollapsiblePrimitive.Root, { "data-slot": "collapsible", ...props });
-}
-function CollapsibleTrigger(props) {
-  return /* @__PURE__ */ jsx3(CollapsiblePrimitive.CollapsibleTrigger, { "data-slot": "collapsible-trigger", ...props });
-}
-function CollapsibleContent(props) {
-  return /* @__PURE__ */ jsx3(CollapsiblePrimitive.CollapsibleContent, { "data-slot": "collapsible-content", ...props });
-}
-
-// src/atoms/primitives/Dialog.tsx
-import { Dialog as DialogPrimitive } from "radix-ui";
-import { XIcon } from "lucide-react";
-import { jsx as jsx4, jsxs } from "react/jsx-runtime";
-function Dialog(props) {
-  return /* @__PURE__ */ jsx4(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
-}
-function DialogTrigger(props) {
-  return /* @__PURE__ */ jsx4(DialogPrimitive.Trigger, { "data-slot": "dialog-trigger", ...props });
-}
-function DialogPortal(props) {
-  return /* @__PURE__ */ jsx4(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
-}
-function DialogClose(props) {
-  return /* @__PURE__ */ jsx4(DialogPrimitive.Close, { "data-slot": "dialog-close", ...props });
-}
-function DialogOverlay({ className, ...props }) {
-  return /* @__PURE__ */ jsx4(
-    DialogPrimitive.Overlay,
-    {
-      "data-slot": "dialog-overlay",
-      className: cn(
-        "fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DialogContent({
-  className,
-  children,
-  showCloseButton = true,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(DialogPortal, { children: [
-    /* @__PURE__ */ jsx4(DialogOverlay, {}),
-    /* @__PURE__ */ jsxs(
-      DialogPrimitive.Content,
-      {
-        "data-slot": "dialog-content",
-        className: cn(
-          "fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
-          className
-        ),
-        ...props,
-        children: [
-          children,
-          showCloseButton && /* @__PURE__ */ jsx4(DialogPrimitive.Close, { "data-slot": "dialog-close", asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "ghost", className: "absolute top-2 right-2", size: "icon-sm", children: [
-            /* @__PURE__ */ jsx4(XIcon, {}),
-            /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Close" })
-          ] }) })
-        ]
-      }
-    )
-  ] });
-}
-function DialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx4("div", { "data-slot": "dialog-header", className: cn("flex flex-col gap-2", className), ...props });
-}
-function DialogFooter({ className, showCloseButton = false, children, ...props }) {
-  return /* @__PURE__ */ jsxs(
+// src/atoms/UserMessageBubble.tsx
+import { UserMessage } from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx11, jsxs as jsxs3 } from "react/jsx-runtime";
+function UserMessageBubble({ text, attachments, editAction, className }) {
+  return /* @__PURE__ */ jsxs3(
     "div",
     {
-      "data-slot": "dialog-footer",
-      className: cn(
-        "-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 sm:flex-row sm:justify-end",
-        className
-      ),
-      ...props,
+      "data-slot": "aui_user-message-root",
+      className: cn("fade-in slide-in-from-bottom-1 animate-in duration-150", className),
       children: [
-        children,
-        showCloseButton && /* @__PURE__ */ jsx4(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx4(Button, { variant: "outline", children: "Close" }) })
+        attachments,
+        /* @__PURE__ */ jsx11(UserMessage, { text, editAction, actionsAlwaysVisible: true })
       ]
     }
   );
 }
-function DialogTitle({ className, ...props }) {
-  return /* @__PURE__ */ jsx4(
-    DialogPrimitive.Title,
-    {
-      "data-slot": "dialog-title",
-      className: cn("font-heading text-base leading-none font-medium", className),
-      ...props
-    }
-  );
-}
-function DialogDescription({ className, ...props }) {
-  return /* @__PURE__ */ jsx4(
-    DialogPrimitive.Description,
-    {
-      "data-slot": "dialog-description",
-      className: cn(
-        "text-sm text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground",
-        className
-      ),
-      ...props
-    }
-  );
-}
 
-// src/atoms/primitives/IconButton.tsx
+// src/atoms/UserMessageEdit.tsx
 import { forwardRef } from "react";
-import { Slot as Slot2 } from "radix-ui";
-
-// src/atoms/primitives/Tooltip.tsx
-import { Tooltip as TooltipPrimitive } from "radix-ui";
-import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
-function TooltipProvider({ delayDuration = 0, ...props }) {
-  return /* @__PURE__ */ jsx5(
-    TooltipPrimitive.Provider,
+import TfyUserMessageEdit from "tfy-web-components/components/molecules/agent-chat/UserMessageEdit";
+import { jsx as jsx12 } from "react/jsx-runtime";
+var UserMessageEdit = forwardRef(function UserMessageEdit2({ timestamp, attachments, input, footer, className, ...rest }, ref) {
+  return /* @__PURE__ */ jsx12(
+    TfyUserMessageEdit,
     {
-      "data-slot": "tooltip-provider",
-      delayDuration,
-      ...props
+      ref,
+      "data-slot": "aui_user-message-edit",
+      timestamp,
+      attachments,
+      input,
+      footer,
+      className: cn(className),
+      ...rest
     }
   );
-}
-function Tooltip(props) {
-  return /* @__PURE__ */ jsx5(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props });
-}
-function TooltipTrigger(props) {
-  return /* @__PURE__ */ jsx5(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
-}
-function TooltipContent({ className, sideOffset = 0, children, ...props }) {
-  return /* @__PURE__ */ jsx5(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs2(
-    TooltipPrimitive.Content,
-    {
-      "data-slot": "tooltip-content",
-      sideOffset,
-      className: cn(
-        "z-50 inline-flex w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
-        className
-      ),
-      ...props,
-      children: [
-        children,
-        /* @__PURE__ */ jsx5(TooltipPrimitive.Arrow, { className: "z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" })
-      ]
-    }
-  ) });
-}
+});
 
-// src/atoms/primitives/IconButton.tsx
-import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
-var IconButton = forwardRef(
-  ({ children, tooltip, side = "bottom", className, ...rest }, ref) => {
-    return /* @__PURE__ */ jsx6(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsxs3(Tooltip, { children: [
-      /* @__PURE__ */ jsx6(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs3(
-        Button,
-        {
-          variant: "ghost",
-          size: "icon",
-          ...rest,
-          className: cn("aui-button-icon size-6 p-1 active:scale-90", className),
-          ref,
-          children: [
-            /* @__PURE__ */ jsx6(Slot2.Slottable, { children }),
-            /* @__PURE__ */ jsx6("span", { className: "aui-sr-only sr-only", children: tooltip })
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ jsx6(TooltipContent, { side, children: tooltip })
-    ] }) });
-  }
-);
-IconButton.displayName = "IconButton";
-
-// src/atoms/primitives/Skeleton.tsx
-import { jsx as jsx7 } from "react/jsx-runtime";
-function Skeleton({ className, ...props }) {
-  return /* @__PURE__ */ jsx7("div", { "data-slot": "skeleton", className: cn("animate-pulse rounded-md bg-muted", className), ...props });
-}
-
-// src/atoms/BranchIndicator.tsx
-import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
-import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
-function BranchIndicator({ index, count, onPrevious, onNext, className }) {
-  if (count <= 1) return null;
-  return /* @__PURE__ */ jsxs4(
-    "div",
+// src/atoms/ToolCallCard.tsx
+import {
+  ToolCallCard as TfyToolCallCard
+} from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx13 } from "react/jsx-runtime";
+function ToolCallCard(props) {
+  const { mcpServerName, ...tfyProps } = props;
+  return /* @__PURE__ */ jsx13(
+    TfyToolCallCard,
     {
-      className: cn(
-        "aui-branch-picker-root text-muted-foreground -ms-2 me-2 inline-flex items-center text-xs",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsx8(IconButton, { tooltip: "Previous", onClick: onPrevious, children: /* @__PURE__ */ jsx8(ChevronLeftIcon, {}) }),
-        /* @__PURE__ */ jsxs4("span", { className: "aui-branch-picker-state font-medium", children: [
-          index,
-          " / ",
-          count
-        ] }),
-        /* @__PURE__ */ jsx8(IconButton, { tooltip: "Next", onClick: onNext, children: /* @__PURE__ */ jsx8(ChevronRightIcon, {}) })
-      ]
+      ...tfyProps,
+      className: cn("aui-tool-call-card", props.className)
     }
   );
 }
 
-// src/atoms/CodeBlockHeader.tsx
-import { useState } from "react";
-import { CheckIcon, CopyIcon } from "lucide-react";
-import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
-function CodeBlockHeader({ language, code }) {
-  const [isCopied, setIsCopied] = useState(false);
-  const onCopy = () => {
-    if (!code || isCopied || typeof navigator === "undefined" || !navigator.clipboard) {
-      return;
-    }
-    navigator.clipboard.writeText(code).then(
-      () => {
-        setIsCopied(true);
-        setTimeout(() => setIsCopied(false), 3e3);
-      },
-      () => {
-      }
-    );
-  };
-  return /* @__PURE__ */ jsxs5("div", { className: "aui-code-header-root border-border/50 bg-muted/50 mt-3 flex items-center justify-between rounded-t-xl border border-b-0 px-3.5 py-1.5 text-xs", children: [
-    /* @__PURE__ */ jsx9("span", { className: "aui-code-header-language text-muted-foreground font-medium lowercase", children: language }),
-    /* @__PURE__ */ jsxs5(IconButton, { tooltip: "Copy", onClick: onCopy, children: [
-      !isCopied && /* @__PURE__ */ jsx9(CopyIcon, { className: "animate-in zoom-in-75 fade-in duration-150" }),
-      isCopied && /* @__PURE__ */ jsx9(CheckIcon, { className: "animate-in zoom-in-50 fade-in duration-200 ease-out" })
-    ] })
-  ] });
-}
-
-// src/atoms/Markdown.tsx
-import { Children, isValidElement, useMemo } from "react";
-import ReactMarkdown from "react-markdown";
-import remarkGfm from "remark-gfm";
-
-// src/atoms/OpenUIBlock.tsx
-import { memo, useId } from "react";
-import { Renderer } from "@openuidev/react-lang";
-import { ThemeProvider } from "@openuidev/react-ui";
-import { openuiLibrary } from "@openuidev/react-ui/genui-lib";
-
-// src/theme/useClassDarkMode.ts
-import { useSyncExternalStore } from "react";
-function getThemeMode() {
-  if (typeof document === "undefined") {
-    return "light";
-  }
-  return document.documentElement.classList.contains("dark") ? "dark" : "light";
-}
-function subscribe(onStoreChange) {
-  const observer = new MutationObserver(onStoreChange);
-  observer.observe(document.documentElement, {
-    attributes: true,
-    attributeFilter: ["class"]
-  });
-  return () => observer.disconnect();
-}
-function useClassDarkMode() {
-  return useSyncExternalStore(subscribe, getThemeMode, () => "light");
-}
-
-// src/atoms/OpenUIBlock.tsx
-import { jsx as jsx10 } from "react/jsx-runtime";
-var OpenUIBlock = memo(
-  function OpenUIBlock2({ source, isStreaming, className, mode: modeProp }) {
-    const detectedMode = useClassDarkMode();
-    const mode = modeProp ?? detectedMode;
-    const scopeClass = `aui-openui-theme-${useId().replace(/:/g, "")}`;
-    return /* @__PURE__ */ jsx10(ThemeProvider, { mode, cssSelector: `.${scopeClass}`, children: /* @__PURE__ */ jsx10(
-      "div",
-      {
-        "data-slot": "openui-block",
-        className: cn("aui-openui-block my-3", scopeClass, className),
-        style: { contain: "layout paint" },
-        children: /* @__PURE__ */ jsx10(
-          Renderer,
-          {
-            response: source,
-            library: openuiLibrary,
-            isStreaming: !!isStreaming
-          }
-        )
-      }
-    ) });
-  },
-  (prev, next) => prev.source === next.source && !!prev.isStreaming === !!next.isStreaming && prev.mode === next.mode
-);
-
-// src/atoms/SandboxArtifactList.tsx
-import { useState as useState2 } from "react";
-import { DownloadIcon, FileIcon, LoaderIcon } from "lucide-react";
-import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
-function SandboxArtifactList({ artifacts, onDownload, className }) {
-  const [downloadingPath, setDownloadingPath] = useState2(null);
-  const handleClick = async (path) => {
-    if (downloadingPath != null) return;
-    setDownloadingPath(path);
-    try {
-      await onDownload?.(path);
-    } finally {
-      setDownloadingPath(null);
-    }
-  };
-  return /* @__PURE__ */ jsx11(
-    "div",
+// src/atoms/ToolCallContentBlock.tsx
+import {
+  ToolCallContentBlock as TfyToolCallContentBlock
+} from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx14 } from "react/jsx-runtime";
+function ToolCallContentBlock(props) {
+  return /* @__PURE__ */ jsx14(TfyToolCallContentBlock, { ...props });
+}
+
+// src/atoms/SubAgentCard.tsx
+import { SubAgentCard as TfySubAgentCard } from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx15 } from "react/jsx-runtime";
+function SubAgentCard({
+  agentName,
+  instruction,
+  stepCount,
+  status,
+  expanded,
+  onToggle,
+  durationText,
+  children,
+  className
+}) {
+  const Markdown2 = useSlot("Markdown");
+  return /* @__PURE__ */ jsx15(
+    TfySubAgentCard,
     {
-      "data-slot": "aui_sandbox-artifact-list",
-      className: cn("aui-sandbox-artifact-list my-3 flex w-fit max-w-full flex-wrap items-stretch text-sm", className),
-      children: artifacts.map((artifact, index) => {
-        const isDownloading = downloadingPath === artifact.path;
-        return /* @__PURE__ */ jsxs6(
-          "button",
-          {
-            type: "button",
-            className: cn(
-              "aui-sandbox-artifact-button text-muted-foreground hover:text-foreground flex min-w-0 items-center gap-1.5 py-1 pr-2 pl-2 transition-colors disabled:pointer-events-none disabled:opacity-70",
-              index > 0 && "border-border/60 ml-1 border-l pl-3"
-            ),
-            disabled: isDownloading,
-            onClick: () => handleClick(artifact.path),
-            children: [
-              /* @__PURE__ */ jsx11(FileIcon, { className: "size-4 shrink-0", "aria-hidden": true }),
-              /* @__PURE__ */ jsx11("span", { className: "max-w-40 truncate", children: artifact.label }),
-              isDownloading ? /* @__PURE__ */ jsx11(LoaderIcon, { className: "size-3.5 shrink-0 animate-spin [animation-duration:0.6s]", "aria-hidden": true }) : /* @__PURE__ */ jsx11(DownloadIcon, { className: "size-3.5 shrink-0", "aria-hidden": true })
-            ]
-          },
-          artifact.path
-        );
-      })
+      agentName,
+      instruction,
+      stepCount,
+      status,
+      expanded,
+      onToggle,
+      durationText,
+      renderInstruction: (content) => /* @__PURE__ */ jsx15(Markdown2, { content }),
+      className: cn("aui-sub-agent-card", className),
+      children
     }
   );
 }
 
-// src/atoms/Markdown.tsx
-import { Fragment, jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
-function extractCodeText(node) {
-  if (typeof node === "string") return node;
-  if (typeof node === "number") return String(node);
-  if (Array.isArray(node)) return node.map(extractCodeText).join("");
-  if (isValidElement(node)) {
-    return extractCodeText(node.props.children);
-  }
-  return "";
-}
-var SANDBOX_ARTIFACT_TOKEN = "sandbox_artifact";
-function parseSandboxArtifactCodeBlock(code) {
-  const links = [];
-  for (const match of code.matchAll(/\[([^\]]+)\]\(([^)]+)\)/g)) {
-    links.push({ label: match[1], path: match[2] });
-  }
-  return links.length > 0 ? links : null;
-}
-function parseSandboxArtifactParagraph(children) {
-  const items = Children.toArray(children);
-  if (items.length === 0) return null;
-  const first = items[0];
-  if (typeof first !== "string") return null;
-  const stripped = first.replace(/^\s*/, "");
-  if (!stripped.startsWith(SANDBOX_ARTIFACT_TOKEN)) return null;
-  if (!/^\s*$/.test(stripped.slice(SANDBOX_ARTIFACT_TOKEN.length))) return null;
-  const links = [];
-  for (let i = 1; i < items.length; i++) {
-    const item = items[i];
-    if (typeof item === "string") {
-      const trimmed = item.trim();
-      if (trimmed === "" || trimmed === SANDBOX_ARTIFACT_TOKEN) continue;
-      return null;
-    }
-    if (isValidElement(item) && typeof item.props.href === "string") {
-      links.push({
-        label: extractCodeText(item.props.children),
-        path: item.props.href
-      });
-      continue;
-    }
-    return null;
-  }
-  return links.length > 0 ? links : null;
-}
-function createMarkdownComponents(isStreaming, onDownloadArtifact) {
-  return {
-    h1: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "h1",
-      {
-        className: cn(
-          "aui-md-h1 mt-5 mb-2 scroll-m-20 text-xl font-semibold first:mt-0 last:mb-0",
-          className
-        ),
-        ...props
-      }
-    ),
-    h2: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "h2",
-      {
-        className: cn(
-          "aui-md-h2 mt-5 mb-2 scroll-m-20 text-lg font-semibold first:mt-0 last:mb-0",
-          className
-        ),
-        ...props
-      }
-    ),
-    h3: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "h3",
-      {
-        className: cn(
-          "aui-md-h3 mt-4 mb-1.5 scroll-m-20 text-base font-semibold first:mt-0 last:mb-0",
-          className
-        ),
-        ...props
-      }
-    ),
-    h4: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "h4",
-      {
-        className: cn(
-          "aui-md-h4 mt-3.5 mb-1 scroll-m-20 text-base font-medium first:mt-0 last:mb-0",
-          className
-        ),
-        ...props
-      }
-    ),
-    h5: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "h5",
-      {
-        className: cn("aui-md-h5 mt-3 mb-1 text-sm font-semibold first:mt-0 last:mb-0", className),
-        ...props
-      }
-    ),
-    h6: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "h6",
-      {
-        className: cn("aui-md-h6 mt-3 mb-1 text-sm font-medium first:mt-0 last:mb-0", className),
-        ...props
-      }
-    ),
-    p: ({ className, children, ...props }) => {
-      const artifacts = parseSandboxArtifactParagraph(children);
-      if (artifacts != null) {
-        return /* @__PURE__ */ jsx12(SandboxArtifactList, { artifacts, onDownload: onDownloadArtifact });
-      }
-      return /* @__PURE__ */ jsx12("p", { className: cn("aui-md-p my-3 leading-relaxed first:mt-0 last:mb-0", className), ...props, children });
-    },
-    a: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "a",
-      {
-        className: cn(
-          "aui-md-a text-primary hover:text-primary/80 underline underline-offset-2",
-          className
-        ),
-        target: "_blank",
-        rel: "noopener noreferrer",
-        ...props
-      }
-    ),
-    blockquote: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "blockquote",
-      {
-        className: cn(
-          "aui-md-blockquote border-muted-foreground/30 text-muted-foreground my-3 border-s-2 ps-4",
-          className
-        ),
-        ...props
-      }
-    ),
-    ul: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "ul",
-      {
-        className: cn(
-          "aui-md-ul marker:text-muted-foreground my-3 ms-5 list-disc [&>li]:mt-1",
-          className
-        ),
-        ...props
-      }
-    ),
-    ol: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "ol",
-      {
-        className: cn(
-          "aui-md-ol marker:text-muted-foreground my-3 ms-5 list-decimal [&>li]:mt-1",
-          className
-        ),
-        ...props
-      }
-    ),
-    hr: ({ className, ...props }) => /* @__PURE__ */ jsx12("hr", { className: cn("aui-md-hr border-muted-foreground/20 my-3", className), ...props }),
-    table: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "table",
-      {
-        className: cn(
-          "aui-md-table my-3 w-full border-separate border-spacing-0 overflow-y-auto",
-          className
-        ),
-        ...props
-      }
-    ),
-    th: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "th",
-      {
-        className: cn(
-          "aui-md-th bg-muted px-3 py-1.5 text-start font-medium first:rounded-ss-lg last:rounded-se-lg [[align=center]]:text-center [[align=right]]:text-right",
-          className
-        ),
-        ...props
-      }
-    ),
-    td: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "td",
-      {
-        className: cn(
-          "aui-md-td border-muted-foreground/20 border-s border-b px-3 py-1.5 text-start last:border-e [[align=center]]:text-center [[align=right]]:text-right",
-          className
-        ),
-        ...props
-      }
-    ),
-    tr: ({ className, ...props }) => /* @__PURE__ */ jsx12(
-      "tr",
-      {
-        className: cn(
-          "aui-md-tr m-0 border-b p-0 first:border-t [&:last-child>td:first-child]:rounded-es-lg [&:last-child>td:last-child]:rounded-ee-lg",
-          className
-        ),
-        ...props
-      }
-    ),
-    li: ({ className, ...props }) => /* @__PURE__ */ jsx12("li", { className: cn("aui-md-li leading-relaxed", className), ...props }),
-    strong: ({ className, ...props }) => /* @__PURE__ */ jsx12("strong", { className: cn("aui-md-strong font-semibold", className), ...props }),
-    sup: ({ className, ...props }) => /* @__PURE__ */ jsx12("sup", { className: cn("aui-md-sup [&>a]:text-xs [&>a]:no-underline", className), ...props }),
-    pre: ({ className, children, ...props }) => {
-      const codeElement = isValidElement(children) ? children : void 0;
-      const codeClassName = codeElement?.props?.className ?? "";
-      const language = /language-(\S+)/.exec(codeClassName)?.[1] ?? "text";
-      const code = extractCodeText(children);
-      if (language === "openui") {
-        return /* @__PURE__ */ jsx12(OpenUIBlock, { source: code, isStreaming });
-      }
-      if (language === "sandbox_artifact" || language === "sandbox_artifacts") {
-        const artifacts = parseSandboxArtifactCodeBlock(code);
-        if (artifacts != null) {
-          return /* @__PURE__ */ jsx12(SandboxArtifactList, { artifacts, onDownload: onDownloadArtifact });
-        }
-      }
-      return /* @__PURE__ */ jsxs7(Fragment, { children: [
-        /* @__PURE__ */ jsx12(CodeBlockHeader, { language, code }),
-        /* @__PURE__ */ jsx12(
-          "pre",
-          {
-            className: cn(
-              "aui-md-pre border-border/50 bg-muted/30 overflow-x-auto rounded-t-none rounded-b-xl border border-t-0 p-3.5 text-[13px] leading-relaxed",
-              className
-            ),
-            ...props,
-            children
-          }
-        )
-      ] });
-    },
-    code: ({ className, ...props }) => {
-      const isCodeBlock = /language-/.test(className ?? "");
-      return /* @__PURE__ */ jsx12(
-        "code",
-        {
-          className: cn(
-            !isCodeBlock && "aui-md-inline-code bg-muted rounded-md px-1.5 py-0.5 font-mono text-[0.85em]",
-            className
-          ),
-          ...props
-        }
-      );
+// src/atoms/SandboxToolCallCard.tsx
+import {
+  SandboxToolCall,
+  ToolCallCard as TfyToolCallCard2
+} from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx16 } from "react/jsx-runtime";
+function SandboxToolCallCard({
+  name,
+  intent,
+  status,
+  expanded,
+  onToggle,
+  command,
+  exitCode,
+  argsJson,
+  resultText,
+  resultJson,
+  viewMode,
+  hasContent,
+  onViewModeChange,
+  durationText,
+  className
+}) {
+  const awaiting = status === "running";
+  const sandboxContent = /* @__PURE__ */ jsx16(
+    SandboxToolCall,
+    {
+      command,
+      exitCode,
+      argsJson,
+      resultText,
+      resultJson,
+      viewMode,
+      hasContent,
+      onViewModeChange
     }
-  };
-}
-function Markdown({ content, className, isStreaming, onDownloadArtifact }) {
-  const components = useMemo(
-    () => createMarkdownComponents(isStreaming, onDownloadArtifact),
-    [isStreaming, onDownloadArtifact]
   );
-  return /* @__PURE__ */ jsx12("div", { className: cn("aui-md", className), children: /* @__PURE__ */ jsx12(ReactMarkdown, { remarkPlugins: [remarkGfm], components, children: content }) });
-}
-
-// src/atoms/MessageActionBar.tsx
-import { CheckIcon as CheckIcon2, CopyIcon as CopyIcon2, DownloadIcon as DownloadIcon2, MoreHorizontalIcon } from "lucide-react";
-import { DropdownMenu } from "radix-ui";
-import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
-function MessageActionBar({ isCopied, onCopy, onExportMarkdown, className }) {
-  return /* @__PURE__ */ jsxs8(
-    "div",
+  return /* @__PURE__ */ jsx16(
+    TfyToolCallCard2,
     {
-      className: cn(
-        "aui-assistant-action-bar-root text-muted-foreground animate-in fade-in flex gap-1 duration-200",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsx13(IconButton, { tooltip: "Copy", onClick: onCopy, children: isCopied ? /* @__PURE__ */ jsx13(CheckIcon2, { className: "animate-in zoom-in-50 fade-in duration-200 ease-out" }) : /* @__PURE__ */ jsx13(CopyIcon2, { className: "animate-in zoom-in-75 fade-in duration-150" }) }),
-        /* @__PURE__ */ jsxs8(DropdownMenu.Root, { children: [
-          /* @__PURE__ */ jsx13(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsx13(IconButton, { tooltip: "More", className: "data-[state=open]:bg-accent", children: /* @__PURE__ */ jsx13(MoreHorizontalIcon, {}) }) }),
-          /* @__PURE__ */ jsx13(DropdownMenu.Portal, { children: /* @__PURE__ */ jsx13(
-            DropdownMenu.Content,
-            {
-              side: "bottom",
-              align: "start",
-              sideOffset: 6,
-              className: "aui-action-bar-more-content bg-popover/95 text-popover-foreground data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-xl border p-1.5 shadow-lg backdrop-blur-sm",
-              children: /* @__PURE__ */ jsxs8(
-                DropdownMenu.Item,
-                {
-                  onSelect: onExportMarkdown,
-                  className: "aui-action-bar-more-item hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground flex cursor-pointer items-center gap-2 rounded-lg px-2.5 py-1.5 text-sm outline-none select-none",
-                  children: [
-                    /* @__PURE__ */ jsx13(DownloadIcon2, { className: "size-4" }),
-                    "Export as Markdown"
-                  ]
-                }
-              )
-            }
-          ) })
-        ] })
-      ]
+      toolName: intent || name,
+      icon: "cube",
+      iconClassName: "text-indigo-600 dark:text-gray-750 shrink-0",
+      expanded,
+      onToggle,
+      awaiting,
+      awaitingText: durationText ?? "Running\u2026",
+      showResponseLine: false,
+      requestSlot: sandboxContent,
+      className: cn("aui-sandbox-tool-call-card", className)
     }
   );
 }
 
-// src/atoms/UserMessageActionBar.tsx
-import { ActionBarPrimitive, useAui, useAuiState } from "@assistant-ui/react";
-import { useActionBarCopy } from "@assistant-ui/core/react";
-import { CheckIcon as CheckIcon3, CopyIcon as CopyIcon3, PencilIcon, RotateCcwIcon } from "lucide-react";
-import { trueFoundryExtras } from "@truefoundry/assistant-ui-runtime";
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
-function parseTurnIdFromMessageId(messageId) {
-  return messageId.replace(/-user$/, "");
-}
-function UserMessageActionBar({ className }) {
-  const IconButton2 = useSlot("IconButton");
-  const aui = useAui();
-  const messageId = useAuiState((s) => s.message.id);
-  const turnId = parseTurnIdFromMessageId(messageId);
-  const { isCopied } = useActionBarCopy();
-  return /* @__PURE__ */ jsxs9(
-    ActionBarPrimitive.Root,
+// src/atoms/ToolApprovalBar.tsx
+import {
+  ToolApprovalBlock
+} from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx17 } from "react/jsx-runtime";
+function ToolApprovalBar({ className, ...props }) {
+  return /* @__PURE__ */ jsx17(
+    ToolApprovalBlock,
     {
-      hideWhenRunning: true,
-      className: cn(
-        "aui-user-action-bar-root text-muted-foreground animate-in fade-in flex gap-1 duration-200",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsx14(ActionBarPrimitive.Edit, { asChild: true, children: /* @__PURE__ */ jsx14(IconButton2, { tooltip: "Edit", children: /* @__PURE__ */ jsx14(PencilIcon, {}) }) }),
-        /* @__PURE__ */ jsx14(
-          IconButton2,
-          {
-            tooltip: "Reset",
-            onClick: () => void trueFoundryExtras.get(aui).resetFromTurn(turnId),
-            children: /* @__PURE__ */ jsx14(RotateCcwIcon, {})
-          }
-        ),
-        /* @__PURE__ */ jsx14(ActionBarPrimitive.Copy, { asChild: true, children: /* @__PURE__ */ jsx14(IconButton2, { tooltip: "Copy", children: isCopied ? /* @__PURE__ */ jsx14(CheckIcon3, { className: "animate-in zoom-in-50 fade-in duration-200 ease-out" }) : /* @__PURE__ */ jsx14(CopyIcon3, { className: "animate-in zoom-in-75 fade-in duration-150" }) }) })
-      ]
+      ...props,
+      className: cn("aui-tool-approval-bar", className)
     }
   );
 }
 
-// src/atoms/MessageBubble.tsx
-import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
-function MessageBubble(props) {
-  if (props.variant === "assistant") {
-    const { children: children2, error, branchIndicator: branchIndicator2, actionBar: actionBar2, className: className2 } = props;
-    return /* @__PURE__ */ jsxs10(
-      "div",
-      {
-        "data-slot": "aui_assistant-message-root",
-        className: cn("fade-in slide-in-from-bottom-1 animate-in relative duration-150", className2),
-        children: [
-          /* @__PURE__ */ jsxs10(
-            "div",
-            {
-              "data-slot": "aui_assistant-message-content",
-              className: "text-foreground flex flex-col gap-3 px-2 leading-relaxed wrap-break-word [contain-intrinsic-size:auto_24px] [content-visibility:auto]",
-              children: [
-                children2,
-                error
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsxs10("div", { "data-slot": "aui_assistant-message-footer", className: "ms-2 -mb-7.5 min-h-7.5 pt-1.5 flex items-center", children: [
-            branchIndicator2,
-            actionBar2
-          ] })
-        ]
-      }
-    );
-  }
-  const { children, attachments, branchIndicator, actionBar, className } = props;
-  return /* @__PURE__ */ jsxs10(
-    "div",
+// src/atoms/ToolGroupCard.tsx
+import { ChevronDownIcon, LoaderIcon } from "lucide-react";
+import { Accordion, AccordionDetails, AccordionSummary } from "tfy-web-components/components/atoms/Accordion";
+import { jsx as jsx18, jsxs as jsxs4 } from "react/jsx-runtime";
+function ToolGroupCard({
+  toolCallCount,
+  expanded,
+  active = false,
+  onToggle,
+  children,
+  className
+}) {
+  const label = `${toolCallCount} tool ${toolCallCount === 1 ? "call" : "calls"}`;
+  return /* @__PURE__ */ jsxs4(
+    Accordion,
     {
-      "data-slot": "aui_user-message-root",
-      className: cn(
-        "fade-in slide-in-from-bottom-1 animate-in grid auto-rows-auto grid-cols-[minmax(72px,1fr)_auto] content-start gap-y-2 px-2 duration-150 [contain-intrinsic-size:auto_60px] [content-visibility:auto] [&:where(>*)]:col-start-2",
-        className
-      ),
+      "data-slot": "tool-group-card",
+      expanded,
+      onChange: () => onToggle(),
+      background: "transparent",
+      className: cn("aui-tool-group-card group/tool-group w-full", className),
+      sx: { margin: 0, border: "none", boxShadow: "none" },
       children: [
-        attachments,
-        /* @__PURE__ */ jsx15("div", { className: "aui-user-message-content-wrapper relative col-start-2 min-w-0", children: /* @__PURE__ */ jsx15("div", { className: "aui-user-message-content bg-muted text-foreground rounded-xl px-4 py-2 wrap-break-word empty:hidden", children }) }),
-        (branchIndicator != null || actionBar != null) && /* @__PURE__ */ jsxs10(
-          "div",
+        /* @__PURE__ */ jsx18(
+          AccordionSummary,
           {
-            "data-slot": "aui_user-message-footer",
-            className: "col-span-full col-start-1 row-start-3 -me-1 flex items-center justify-end gap-1",
-            children: [
-              branchIndicator,
-              actionBar
-            ]
+            hideIcon: true,
+            disableRipple: true,
+            sx: {
+              padding: 0,
+              minHeight: 0,
+              "&.Mui-expanded": { minHeight: 0 },
+              "&:hover": { backgroundColor: "transparent" },
+              "& .MuiAccordionSummary-content": { margin: 0, width: "100%" }
+            },
+            children: /* @__PURE__ */ jsxs4("div", { className: "text-muted-foreground hover:text-foreground flex origin-left items-center gap-2 py-1.5 text-sm transition-[color,scale] active:scale-[0.98]", children: [
+              active && /* @__PURE__ */ jsx18(LoaderIcon, { className: "size-3 shrink-0 animate-spin [animation-duration:0.6s]" }),
+              /* @__PURE__ */ jsx18("span", { className: "text-xs font-medium", children: label }),
+              /* @__PURE__ */ jsx18(
+                ChevronDownIcon,
+                {
+                  className: cn(
+                    "size-3 shrink-0 transition-transform duration-200 ease-[cubic-bezier(0.32,0.72,0,1)]",
+                    expanded ? "rotate-0" : "-rotate-90"
+                  )
+                }
+              )
+            ] })
           }
-        )
+        ),
+        /* @__PURE__ */ jsx18(AccordionDetails, { sx: { padding: 0 }, children: /* @__PURE__ */ jsx18("div", { className: "mt-1 flex flex-col gap-2 text-foreground", children }) })
       ]
     }
   );
 }
 
-// src/atoms/MessageErrorBanner.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
-function MessageErrorBanner({ message, className }) {
-  return /* @__PURE__ */ jsx16(
-    "div",
-    {
-      role: "alert",
-      className: cn(
-        "aui-message-error-root border-destructive bg-destructive/10 text-destructive dark:bg-destructive/5 mt-2 rounded-md border p-3 text-sm dark:text-red-200",
-        className
-      ),
-      children: /* @__PURE__ */ jsx16("span", { className: "aui-message-error-message line-clamp-2", children: message })
-    }
-  );
-}
-
-// src/atoms/MessageIndicator.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
-function MessageIndicator({ className }) {
-  return /* @__PURE__ */ jsx17(
-    "span",
-    {
-      "data-slot": "aui_assistant-message-indicator",
-      className: cn("animate-pulse font-sans", className),
-      "aria-label": "Assistant is working",
-      children: "\u25CF"
-    }
-  );
-}
-
-// src/atoms/ScrollToBottomButton.tsx
-import { forwardRef as forwardRef2 } from "react";
-import { ArrowDownIcon } from "lucide-react";
-import { jsx as jsx18 } from "react/jsx-runtime";
-var ScrollToBottomButton = forwardRef2(
-  ({ className, ...rest }, ref) => {
-    return /* @__PURE__ */ jsx18(
-      IconButton,
-      {
-        ref,
-        tooltip: "Scroll to bottom",
-        variant: "outline",
-        className: cn(
-          "aui-thread-scroll-to-bottom dark:border-border dark:bg-background dark:hover:bg-accent absolute -top-14 z-10 self-center rounded-full p-4 disabled:invisible",
-          className
-        ),
-        ...rest,
-        children: /* @__PURE__ */ jsx18(ArrowDownIcon, {})
-      }
-    );
-  }
-);
-ScrollToBottomButton.displayName = "ScrollToBottomButton";
-
 // src/atoms/Skeletons.tsx
-import { jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
+import Skeleton from "tfy-web-components/components/atoms/Skeleton";
+import { jsx as jsx19, jsxs as jsxs5 } from "react/jsx-runtime";
 function MessageListSkeleton({ className }) {
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs5(
     "div",
     {
       role: "status",
@@ -901,177 +392,152 @@ function MessageListSkeleton({ className }) {
       className: cn("mb-14 flex flex-col gap-y-6", className),
       children: [
         /* @__PURE__ */ jsx19("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx19(Skeleton, { className: "h-10 w-[min(85%,20rem)] rounded-xl" }) }),
-        /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-2 px-2", children: [
-          /* @__PURE__ */ jsx19(Skeleton, { className: "h-4 w-full max-w-md" }),
-          /* @__PURE__ */ jsx19(Skeleton, { className: "h-4 w-full max-w-sm" }),
-          /* @__PURE__ */ jsx19(Skeleton, { className: "h-4 w-2/3 max-w-xs" })
-        ] })
-      ]
-    }
-  );
-}
-
-// src/atoms/ThreadShell.tsx
-import { forwardRef as forwardRef3 } from "react";
-import { jsx as jsx20 } from "react/jsx-runtime";
-var THREAD_CSS_VARS = {
-  ["--thread-max-width"]: "44rem",
-  ["--composer-bg"]: "color-mix(in oklab, var(--color-muted) 30%, var(--color-background))",
-  ["--composer-radius"]: "1.5rem",
-  ["--composer-padding"]: "8px"
-};
-var ThreadRootShell = forwardRef3(
-  ({ className, style, ...rest }, ref) => /* @__PURE__ */ jsx20(
-    "div",
-    {
-      ref,
-      className: cn(
-        "aui-root aui-thread-root bg-background @container flex h-full min-h-0 flex-col overflow-hidden",
-        className
-      ),
-      style: { ...THREAD_CSS_VARS, ...style },
-      ...rest
-    }
-  )
-);
-ThreadRootShell.displayName = "ThreadRootShell";
-var ThreadViewportShell = forwardRef3(
-  ({ className, isEmpty, children, ...rest }, ref) => /* @__PURE__ */ jsx20(
-    "div",
-    {
-      ref,
-      "data-slot": "aui_thread-viewport",
-      className: cn("relative flex min-h-0 flex-1 flex-col overflow-x-auto overflow-y-auto scroll-smooth", className),
-      ...rest,
-      children: /* @__PURE__ */ jsx20(
-        "div",
-        {
-          className: cn(
-            "mx-auto flex w-full max-w-(--thread-max-width) flex-col px-4 pt-4 pb-4",
-            isEmpty && "min-h-full justify-center"
-          ),
-          children
-        }
-      )
-    }
-  )
-);
-ThreadViewportShell.displayName = "ThreadViewportShell";
-var ThreadComposerAreaShell = forwardRef3(
-  ({ className, isEmpty, ...rest }, ref) => /* @__PURE__ */ jsx20(
-    "div",
-    {
-      ref,
-      "data-slot": "aui_thread-composer",
-      className: cn(
-        "aui-thread-composer bg-background relative mx-auto flex w-full max-w-(--thread-max-width) shrink-0 flex-col gap-4 px-4 pb-4 md:pb-6",
-        !isEmpty && "rounded-t-(--composer-radius)",
-        className
-      ),
-      ...rest
-    }
-  )
-);
-ThreadComposerAreaShell.displayName = "ThreadComposerAreaShell";
-var MessageGroup = forwardRef3(({ className, ...rest }, ref) => /* @__PURE__ */ jsx20(
-  "div",
-  {
-    ref,
-    "data-slot": "aui_message-group",
-    className: cn("flex flex-col gap-y-6 empty:hidden", className),
-    ...rest
-  }
-));
-MessageGroup.displayName = "MessageGroup";
+        /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2 px-2", children: [
+          /* @__PURE__ */ jsx19(Skeleton, { className: "h-4 w-full max-w-md" }),
+          /* @__PURE__ */ jsx19(Skeleton, { className: "h-4 w-full max-w-sm" }),
+          /* @__PURE__ */ jsx19(Skeleton, { className: "h-4 w-2/3 max-w-xs" })
+        ] })
+      ]
+    }
+  );
+}
 
-// src/atoms/AskUserPrompt.tsx
-import { jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
-var OTHER_OPTION_ID = "__other";
-function AskUserPrompt({
-  question,
-  options,
-  allowOther,
-  selectedOptionId,
-  otherValue,
+// src/atoms/ComposerShell.tsx
+import { jsx as jsx20, jsxs as jsxs6 } from "react/jsx-runtime";
+function ComposerShell({
+  value,
+  placeholder,
   disabled,
-  onSelectOption,
-  onOtherValueChange,
+  isRunning = false,
+  attachments,
+  modelLabel,
+  modelIcon,
+  connectorStatusLabel,
+  onValueChange,
   onSubmit,
+  onCancel,
+  onAttach,
   className
 }) {
-  const canSubmit = selectedOptionId != null && selectedOptionId !== OTHER_OPTION_ID ? true : selectedOptionId === OTHER_OPTION_ID && otherValue.trim().length > 0;
-  return /* @__PURE__ */ jsxs12(
+  const ComposerLeftSection2 = useSlot("ComposerLeftSection");
+  const ComposerRightSection2 = useSlot("ComposerRightSection");
+  const ComposerSendButton2 = useSlot("ComposerSendButton");
+  return /* @__PURE__ */ jsxs6(
     "div",
     {
-      "data-slot": "aui_ask-user-prompt",
+      "data-slot": "aui_composer-shell",
       className: cn(
-        "border-border/60 flex w-full flex-col gap-3 rounded-[var(--composer-radius,1.5rem)] border bg-[var(--composer-bg,var(--muted))] p-[var(--composer-padding,8px)]",
+        "border-border/60 focus-within:border-ring focus-within:ring-ring/20 flex w-full flex-col gap-2 rounded-[var(--composer-radius,1.5rem)] border bg-[var(--composer-bg,var(--muted))] p-[var(--composer-padding,8px)] shadow-sm transition-colors focus-within:ring-3",
         className
       ),
       children: [
-        /* @__PURE__ */ jsx21("p", { className: "text-foreground px-2.5 text-sm font-medium", children: question }),
-        /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-1.5 px-2.5", children: [
-          options.map((option) => /* @__PURE__ */ jsxs12("label", { className: "flex items-center gap-2 text-sm", children: [
-            /* @__PURE__ */ jsx21(
-              "input",
-              {
-                type: "radio",
-                name: "ask-user-option",
-                checked: selectedOptionId === option.id,
-                disabled,
-                onChange: () => onSelectOption(option.id)
+        attachments,
+        /* @__PURE__ */ jsx20(
+          "textarea",
+          {
+            value,
+            placeholder,
+            disabled,
+            rows: 1,
+            "aria-label": "Message input",
+            onChange: (event) => onValueChange(event.target.value),
+            onKeyDown: (event) => {
+              if (event.key === "Enter" && !event.shiftKey) {
+                event.preventDefault();
+                onSubmit();
               }
-            ),
-            option.label
-          ] }, option.id)),
-          allowOther && /* @__PURE__ */ jsxs12("label", { className: "flex items-center gap-2 text-sm", children: [
-            /* @__PURE__ */ jsx21(
-              "input",
+            },
+            className: "placeholder:text-muted-foreground/80 max-h-32 min-h-10 w-full resize-none rounded-lg bg-transparent px-2.5 py-1 text-base outline-none"
+          }
+        ),
+        /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between px-1", children: [
+          /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx20(
+              ComposerLeftSection2,
               {
-                type: "radio",
-                name: "ask-user-option",
-                checked: selectedOptionId === OTHER_OPTION_ID,
                 disabled,
-                onChange: () => onSelectOption(OTHER_OPTION_ID)
+                isRunning,
+                onAttach
               }
             ),
-            /* @__PURE__ */ jsx21(
-              "input",
+            connectorStatusLabel && /* @__PURE__ */ jsx20("span", { className: "text-muted-foreground text-xs", children: connectorStatusLabel })
+          ] }),
+          /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
+            modelLabel && /* @__PURE__ */ jsxs6("span", { className: "bg-muted text-muted-foreground flex items-center gap-1 rounded-full px-2 py-0.5 text-xs", children: [
+              modelIcon,
+              modelLabel
+            ] }),
+            /* @__PURE__ */ jsx20(ComposerRightSection2, { disabled, isRunning }),
+            /* @__PURE__ */ jsx20(
+              ComposerSendButton2,
               {
-                type: "text",
-                value: otherValue,
-                placeholder: "Type your answer...",
                 disabled,
-                onFocus: () => onSelectOption(OTHER_OPTION_ID),
-                onChange: (event) => {
-                  onSelectOption(OTHER_OPTION_ID);
-                  onOtherValueChange(event.target.value);
-                },
-                "aria-label": "Other answer",
-                className: "border-border/60 flex-1 rounded-md border bg-transparent px-2 py-1 text-sm outline-none"
+                canSubmit: !disabled && value.trim().length > 0,
+                isRunning,
+                onSubmit,
+                onCancel
               }
             )
           ] })
-        ] }),
-        /* @__PURE__ */ jsx21("div", { className: "flex justify-end px-2.5", children: /* @__PURE__ */ jsx21(
-          Button,
-          {
-            type: "button",
-            className: "rounded-full px-4",
-            disabled: disabled || !canSubmit,
-            onClick: onSubmit,
-            children: "Submit"
-          }
-        ) })
+        ] })
       ]
     }
   );
 }
 
+// src/atoms/ComposerSections.tsx
+import Spinner from "tfy-web-components/components/atoms/Spinner";
+import { Fragment, jsx as jsx21, jsxs as jsxs7 } from "react/jsx-runtime";
+function ComposerLeftSection({ onAttach }) {
+  const IconButton5 = useSlot("IconButton");
+  if (!onAttach) return null;
+  return /* @__PURE__ */ jsx21(IconButton5, { icon: "plus", tooltip: "Attach", onClick: onAttach });
+}
+function ComposerRightSection(_) {
+  return null;
+}
+function ComposerSendButton({
+  canSubmit,
+  isRunning,
+  onSubmit,
+  onCancel
+}) {
+  const Button4 = useSlot("Button");
+  if (isRunning) {
+    return /* @__PURE__ */ jsx21(
+      Button4.Primary,
+      {
+        disabled: !onCancel,
+        onClick: onCancel,
+        text: /* @__PURE__ */ jsxs7(Fragment, { children: [
+          /* @__PURE__ */ jsx21(Spinner, { small: true }),
+          "Cancel"
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx21(
+    Button4.Primary,
+    {
+      disabled: !canSubmit,
+      onClick: onSubmit,
+      icon: "arrow-up",
+      tooltipProps: {
+        title: "Send message",
+        size: "fit"
+      }
+    }
+  );
+}
+
 // src/atoms/AttachmentCard.tsx
-import { FileTextIcon, XIcon as XIcon2 } from "lucide-react";
-import { jsx as jsx22, jsxs as jsxs13 } from "react/jsx-runtime";
+import { FileTextIcon } from "lucide-react";
+
+// src/constants/attachments.ts
 var USER_MESSAGE_ATTACHMENT_PREVIEW_REM = 12;
+
+// src/atoms/AttachmentCard.tsx
+import { jsx as jsx22, jsxs as jsxs8 } from "react/jsx-runtime";
 function AttachmentCard({
   name,
   previewSrc,
@@ -1081,6 +547,10 @@ function AttachmentCard({
   onRemove,
   className
 }) {
+  const IconButton5 = useSlot("IconButton");
+  const Avatar2 = useSlot("Avatar");
+  const AvatarImage2 = useSlot("AvatarImage");
+  const AvatarFallback2 = useSlot("AvatarFallback");
   if (size === "preview" && isImage && previewSrc) {
     const previewSize = previewRem != null ? { width: `${previewRem}rem`, height: `${previewRem}rem` } : void 0;
     return /* @__PURE__ */ jsx22(
@@ -1097,7 +567,7 @@ function AttachmentCard({
       }
     );
   }
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs8(
     "div",
     {
       "data-slot": "aui_attachment-chip",
@@ -1107,19 +577,18 @@ function AttachmentCard({
         className
       ),
       children: [
-        /* @__PURE__ */ jsx22("div", { className: "bg-background flex size-7 shrink-0 items-center justify-center overflow-hidden rounded-md border", children: isImage && previewSrc ? /* @__PURE__ */ jsxs13(Avatar, { className: "size-7 rounded-none", children: [
-          /* @__PURE__ */ jsx22(AvatarImage, { src: previewSrc, alt: name, className: "object-cover" }),
-          /* @__PURE__ */ jsx22(AvatarFallback, { children: /* @__PURE__ */ jsx22(FileTextIcon, { className: "text-muted-foreground size-4" }) })
+        /* @__PURE__ */ jsx22("div", { className: "bg-background flex size-7 shrink-0 items-center justify-center overflow-hidden rounded-md border", children: isImage && previewSrc ? /* @__PURE__ */ jsxs8(Avatar2, { className: "size-7 rounded-none", children: [
+          /* @__PURE__ */ jsx22(AvatarImage2, { src: previewSrc, alt: name, className: "object-cover" }),
+          /* @__PURE__ */ jsx22(AvatarFallback2, { children: /* @__PURE__ */ jsx22(FileTextIcon, { className: "text-muted-foreground size-4" }) })
         ] }) : /* @__PURE__ */ jsx22(FileTextIcon, { className: "text-muted-foreground size-4" }) }),
         /* @__PURE__ */ jsx22("span", { className: "text-foreground min-w-0 truncate text-sm", children: name }),
         onRemove && /* @__PURE__ */ jsx22(
-          IconButton,
+          IconButton5,
           {
+            icon: "xmark",
             tooltip: "Remove file",
-            side: "top",
-            className: "size-6 shrink-0 rounded-full [&_svg]:size-3",
-            onClick: onRemove,
-            children: /* @__PURE__ */ jsx22(XIcon2, {})
+            className: "size-6 shrink-0 rounded-full",
+            onClick: onRemove
           }
         )
       ]
@@ -1128,20 +597,47 @@ function AttachmentCard({
 }
 
 // src/atoms/AttachmentPickerButton.tsx
-import { PlusIcon } from "lucide-react";
+import IconButton from "tfy-web-components/components/atoms/IconButton";
 import { jsx as jsx23 } from "react/jsx-runtime";
 function AttachmentPickerButton(props) {
-  return /* @__PURE__ */ jsx23(IconButton, { tooltip: "Add Attachment", variant: "ghost", className: "size-7 rounded-full p-1", ...props, children: /* @__PURE__ */ jsx23(PlusIcon, { className: "size-4.5" }) });
+  return /* @__PURE__ */ jsx23(
+    IconButton,
+    {
+      icon: "plus",
+      tooltip: "Add Attachment",
+      className: "size-7 rounded-full p-1",
+      ...props
+    }
+  );
 }
 
 // src/atoms/AttachmentPreviewDialog.tsx
-import { Fragment as Fragment2, jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
+import { useState } from "react";
+import Modal from "tfy-web-components/components/atoms/Modal";
+import { Fragment as Fragment2, jsx as jsx24, jsxs as jsxs9 } from "react/jsx-runtime";
 function AttachmentPreviewDialog({ previewSrc, children }) {
+  const IconButton5 = useSlot("IconButton");
+  const [open, setOpen] = useState(false);
   if (!previewSrc) return /* @__PURE__ */ jsx24(Fragment2, { children });
-  return /* @__PURE__ */ jsxs14(Dialog, { children: [
-    /* @__PURE__ */ jsx24(DialogTrigger, { asChild: true, children }),
-    /* @__PURE__ */ jsxs14(DialogContent, { className: "p-2 sm:max-w-3xl", children: [
-      /* @__PURE__ */ jsx24(DialogTitle, { className: "sr-only", children: "Image Attachment Preview" }),
+  return /* @__PURE__ */ jsxs9(Fragment2, { children: [
+    /* @__PURE__ */ jsx24(
+      "div",
+      {
+        role: "button",
+        tabIndex: 0,
+        onClick: () => setOpen(true),
+        onKeyDown: (event) => {
+          if (event.key === "Enter" || event.key === " ") {
+            event.preventDefault();
+            setOpen(true);
+          }
+        },
+        className: "contents cursor-pointer",
+        children
+      }
+    ),
+    /* @__PURE__ */ jsx24(Modal, { open, onClose: () => setOpen(false), children: /* @__PURE__ */ jsxs9("div", { className: "bg-popover fixed top-1/2 left-1/2 z-50 w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 rounded-xl p-2 outline-none sm:max-w-3xl", children: [
+      /* @__PURE__ */ jsx24("span", { className: "absolute top-2 right-2 z-10 inline-flex", children: /* @__PURE__ */ jsx24(IconButton5, { icon: "xmark", tooltip: "Close", onClick: () => setOpen(false) }) }),
       /* @__PURE__ */ jsx24("div", { className: "bg-background relative mx-auto flex max-h-[80dvh] w-full items-center justify-center overflow-hidden", children: /* @__PURE__ */ jsx24(
         "img",
         {
@@ -1150,602 +646,541 @@ function AttachmentPreviewDialog({ previewSrc, children }) {
           className: "block h-auto max-h-[80vh] w-auto max-w-full object-contain"
         }
       ) })
-    ] })
+    ] }) })
   ] });
 }
 
-// src/atoms/ComposerShell.tsx
-import { ArrowUpIcon, LoaderIcon as LoaderIcon2, PlusIcon as PlusIcon2 } from "lucide-react";
-import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
-function ComposerShell({
-  value,
-  placeholder,
-  disabled,
-  isRunning = false,
-  attachments,
-  modelLabel,
-  modelIcon,
-  connectorStatusLabel,
-  onValueChange,
-  onSubmit,
-  onCancel,
-  onAttach,
-  className
-}) {
-  return /* @__PURE__ */ jsxs15(
+// src/atoms/ScrollToBottomButton.tsx
+import { forwardRef as forwardRef2 } from "react";
+import IconButton2 from "tfy-web-components/components/atoms/IconButton";
+import { jsx as jsx25 } from "react/jsx-runtime";
+var ScrollToBottomButton = forwardRef2(
+  ({ className, disabled, ...rest }, ref) => {
+    if (disabled) return null;
+    return /* @__PURE__ */ jsx25(
+      "span",
+      {
+        ref,
+        className: cn("absolute -top-14 z-10 inline-flex self-center"),
+        children: /* @__PURE__ */ jsx25(
+          IconButton2,
+          {
+            icon: "arrow-down",
+            tooltip: "Scroll to bottom",
+            disabled,
+            className: cn(
+              "aui-thread-scroll-to-bottom dark:border-border dark:bg-background dark:hover:bg-accent rounded-full p-4",
+              className
+            ),
+            ...rest
+          }
+        )
+      }
+    );
+  }
+);
+ScrollToBottomButton.displayName = "ScrollToBottomButton";
+
+// src/atoms/ThreadListRow.tsx
+import IconProvider from "tfy-web-components/components/atoms/IconProvider";
+import IconButton3 from "tfy-web-components/components/atoms/IconButton";
+import DropdownMenu from "tfy-web-components/components/molecules/DropdownMenu";
+import { jsx as jsx26, jsxs as jsxs10 } from "react/jsx-runtime";
+function ThreadListRow({ title, active, onSelect, onArchive, onDelete, className }) {
+  return /* @__PURE__ */ jsxs10(
     "div",
     {
-      "data-slot": "aui_composer-shell",
+      "data-slot": "aui_thread-list-item",
+      "data-active": active || void 0,
       className: cn(
-        "border-border/60 focus-within:border-ring focus-within:ring-ring/20 flex w-full flex-col gap-2 rounded-[var(--composer-radius,1.5rem)] border bg-[var(--composer-bg,var(--muted))] p-[var(--composer-padding,8px)] shadow-sm transition-colors focus-within:ring-3",
+        "group hover:bg-muted data-[active]:bg-muted relative flex min-h-9 items-center rounded-lg transition-colors",
         className
       ),
       children: [
-        attachments,
-        /* @__PURE__ */ jsx25(
-          "textarea",
+        /* @__PURE__ */ jsx26(
+          "button",
           {
-            value,
-            placeholder,
-            disabled,
-            rows: 1,
-            "aria-label": "Message input",
-            onChange: (event) => onValueChange(event.target.value),
-            onKeyDown: (event) => {
-              if (event.key === "Enter" && !event.shiftKey) {
-                event.preventDefault();
-                onSubmit();
-              }
-            },
-            className: "placeholder:text-muted-foreground/80 max-h-32 min-h-10 w-full resize-none rounded-lg bg-transparent px-2.5 py-1 text-base outline-none"
+            type: "button",
+            onClick: onSelect,
+            "data-slot": "aui_thread-list-item-trigger",
+            className: "flex min-h-9 min-w-0 flex-1 items-center rounded-lg px-2.5 py-2 text-start text-sm outline-none group-hover:pe-9",
+            children: /* @__PURE__ */ jsx26("span", { className: "min-w-0 flex-1 truncate", children: title })
           }
         ),
-        /* @__PURE__ */ jsxs15("div", { className: "flex items-center justify-between px-1", children: [
-          /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2", children: [
-            onAttach && /* @__PURE__ */ jsx25(IconButton, { tooltip: "Attach", onClick: onAttach, children: /* @__PURE__ */ jsx25(PlusIcon2, {}) }),
-            connectorStatusLabel && /* @__PURE__ */ jsx25("span", { className: "text-muted-foreground text-xs", children: connectorStatusLabel })
-          ] }),
-          /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2", children: [
-            modelLabel && /* @__PURE__ */ jsxs15("span", { className: "bg-muted text-muted-foreground flex items-center gap-1 rounded-full px-2 py-0.5 text-xs", children: [
-              modelIcon,
-              modelLabel
-            ] }),
-            isRunning ? /* @__PURE__ */ jsxs15(
-              Button,
-              {
-                variant: "default",
-                size: "sm",
-                className: "gap-1.5 rounded-full",
-                disabled: !onCancel,
-                onClick: onCancel,
-                children: [
-                  /* @__PURE__ */ jsx25(LoaderIcon2, { className: "size-3.5 animate-spin [animation-duration:0.6s]" }),
-                  "Cancel"
-                ]
-              }
-            ) : /* @__PURE__ */ jsx25(
-              IconButton,
+        (onArchive || onDelete) && /* @__PURE__ */ jsx26("div", { className: "absolute end-1.5 top-1/2 inline-flex -translate-y-1/2 opacity-0 group-hover:opacity-100", children: /* @__PURE__ */ jsxs10(
+          DropdownMenu,
+          {
+            trigger: /* @__PURE__ */ jsx26(
+              IconButton3,
               {
-                tooltip: "Send message",
-                variant: "default",
-                disabled: disabled || value.trim().length === 0,
-                onClick: onSubmit,
-                children: /* @__PURE__ */ jsx25(ArrowUpIcon, {})
+                icon: "ellipsis",
+                tooltip: "More options",
+                className: "size-6 p-0"
               }
-            )
-          ] })
-        ] })
+            ),
+            side: "right",
+            align: "start",
+            children: [
+              onArchive && /* @__PURE__ */ jsxs10(DropdownMenu.Item, { onClick: onArchive, children: [
+                /* @__PURE__ */ jsx26(IconProvider, { icon: "box-archive", size: 0.75 }),
+                "Archive"
+              ] }),
+              onDelete && /* @__PURE__ */ jsxs10(DropdownMenu.Item, { onClick: onDelete, className: "text-destructive hover:bg-destructive/10", children: [
+                /* @__PURE__ */ jsx26(IconProvider, { icon: "trash", size: 0.75 }),
+                "Delete"
+              ] })
+            ]
+          }
+        ) })
       ]
     }
   );
 }
 
-// src/atoms/McpAuthPrompt.tsx
-import { ExternalLinkIcon } from "lucide-react";
-import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
-function McpAuthPrompt({ servers, disabled, onContinue, className }) {
-  return /* @__PURE__ */ jsxs16("div", { "data-slot": "aui_mcp-auth-continue-composer", className: cn("flex w-full flex-col gap-3", className), children: [
-    /* @__PURE__ */ jsxs16("div", { className: "border-primary/20 bg-background overflow-hidden rounded-2xl border", children: [
-      /* @__PURE__ */ jsx26("div", { className: "bg-primary/10 border-primary/20 border-b px-4 py-2.5", children: /* @__PURE__ */ jsx26("p", { className: "text-primary text-sm font-semibold", children: "MCP Authentication Required" }) }),
-      /* @__PURE__ */ jsx26("ul", { className: "divide-border/60 divide-y", children: servers.map((server) => /* @__PURE__ */ jsxs16(
-        "li",
-        {
-          className: "flex items-center justify-between gap-3 px-4 py-2.5",
-          children: [
-            /* @__PURE__ */ jsxs16("p", { className: "text-sm", children: [
-              /* @__PURE__ */ jsx26("span", { className: "text-muted-foreground", children: "MCP Server Name" }),
-              /* @__PURE__ */ jsx26("span", { className: "text-muted-foreground mx-1.5", children: ":" }),
-              /* @__PURE__ */ jsx26("span", { className: "font-semibold", children: server.name })
-            ] }),
-            /* @__PURE__ */ jsx26(
-              Button,
-              {
-                asChild: true,
-                size: "sm",
-                className: "bg-foreground text-background hover:bg-foreground/80 rounded-full",
-                children: /* @__PURE__ */ jsxs16("a", { href: server.authUrl, target: "_blank", rel: "noopener noreferrer", children: [
-                  "Connect",
-                  /* @__PURE__ */ jsx26(ExternalLinkIcon, { className: "size-3.5" })
-                ] })
-              }
-            )
-          ]
-        },
-        server.id
-      )) })
-    ] }),
-    /* @__PURE__ */ jsx26("div", { className: "flex justify-end px-2.5", children: /* @__PURE__ */ jsx26(Button, { type: "button", className: "rounded-full px-4", disabled, onClick: onContinue, children: "Continue" }) })
+// src/atoms/ThreadListMisc.tsx
+import Button from "tfy-web-components/components/atoms/Button";
+import Skeleton2 from "tfy-web-components/components/atoms/Skeleton";
+import { jsx as jsx27, jsxs as jsxs11 } from "react/jsx-runtime";
+function ThreadListNewButton({ className, ...rest }) {
+  return /* @__PURE__ */ jsx27(
+    Button.Ghost,
+    {
+      "data-slot": "aui_thread-list-new",
+      className: cn("hover:bg-muted h-8 justify-start gap-2 rounded-md px-2.5 text-sm font-normal", className),
+      icon: "plus",
+      text: "New Thread",
+      ...rest
+    }
+  );
+}
+function ThreadListRowSkeleton({ count = 5, className }) {
+  return /* @__PURE__ */ jsx27("div", { className: cn("flex flex-col gap-1", className), role: "status", "aria-label": "Loading threads", children: Array.from({ length: count }, (_, i) => /* @__PURE__ */ jsx27("div", { className: "flex h-8 items-center px-2.5", children: /* @__PURE__ */ jsx27(Skeleton2, { className: "h-3.5 w-full" }) }, i)) });
+}
+function ThreadListEmptyState({ message = "No threads yet", className }) {
+  return /* @__PURE__ */ jsx27("div", { className: cn("text-muted-foreground flex flex-1 items-center justify-center px-4 text-center text-sm", className), children: message });
+}
+function ThreadListShell({ header, children, className }) {
+  return /* @__PURE__ */ jsxs11("div", { className: cn("font-sans-flex flex min-h-0 flex-1 flex-col gap-1 overflow-hidden p-3", className), children: [
+    header,
+    /* @__PURE__ */ jsx27("div", { className: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto pb-1", children })
   ] });
 }
 
-// src/atoms/ReasoningCard.tsx
-import { BrainIcon, ChevronDownIcon } from "lucide-react";
-import { jsx as jsx27, jsxs as jsxs17 } from "react/jsx-runtime";
-function ReasoningCard({ streaming, expanded, onToggle, children, className }) {
-  return /* @__PURE__ */ jsxs17(
-    Collapsible,
+// src/atoms/MessageActionBar.tsx
+import { jsx as jsx28, jsxs as jsxs12 } from "react/jsx-runtime";
+function MessageActionBar({ isCopied, onCopy, className }) {
+  const MessageTimestamp2 = useSlot("MessageTimestamp");
+  const IconButton5 = useSlot("IconButton");
+  return /* @__PURE__ */ jsxs12(
+    "div",
     {
-      "data-slot": "reasoning-card",
-      open: expanded,
-      onOpenChange: onToggle,
-      className: cn("aui-reasoning-card w-full rounded-lg border px-3 py-2", className),
+      className: cn(
+        "aui-assistant-action-bar-root text-muted-foreground animate-in fade-in flex items-center gap-3 duration-200",
+        className
+      ),
       children: [
-        /* @__PURE__ */ jsxs17(CollapsibleTrigger, { className: "text-muted-foreground hover:text-foreground flex max-w-[75%] origin-left items-center gap-2 py-1.5 text-sm transition-[color,scale] active:scale-[0.98]", children: [
-          /* @__PURE__ */ jsx27(BrainIcon, { className: "size-4 shrink-0" }),
-          /* @__PURE__ */ jsxs17("span", { className: "leading-none tabular-nums", children: [
-            "Reasoning",
-            streaming && /* @__PURE__ */ jsxs17("span", { "aria-hidden": true, className: "shimmer pointer-events-none", children: [
-              " ",
-              "\u2026"
-            ] })
-          ] }),
-          /* @__PURE__ */ jsx27(
-            ChevronDownIcon,
-            {
-              className: cn(
-                "mt-0.5 size-4 shrink-0 transition-transform duration-200 ease-[cubic-bezier(0.32,0.72,0,1)]",
-                expanded ? "rotate-0" : "-rotate-90"
-              )
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx27(CollapsibleContent, { className: "text-muted-foreground max-h-64 overflow-y-auto pt-2 pb-1 pl-6 text-sm leading-relaxed", children })
+        /* @__PURE__ */ jsx28(MessageTimestamp2, {}),
+        /* @__PURE__ */ jsx28(
+          IconButton5,
+          {
+            icon: isCopied ? "check" : ["far", "clone"],
+            tooltip: "Copy",
+            onClick: onCopy
+          }
+        )
       ]
     }
   );
 }
 
-// src/atoms/ToolApprovalBar.tsx
-import { useState as useState3 } from "react";
-import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
-function ToolApprovalBar({ options, onSelectOption, className }) {
-  const [confirmingId, setConfirmingId] = useState3(null);
-  const confirming = confirmingId != null ? options.find((o) => o.id === confirmingId) : void 0;
-  if (confirming) {
-    return /* @__PURE__ */ jsxs18("div", { className: cn("aui-tool-approval-confirm flex flex-col gap-2 pt-1", className), children: [
-      /* @__PURE__ */ jsx28("p", { className: "font-semibold", children: confirming.confirm?.title ?? `${confirming.label}?` }),
-      confirming.confirm?.description && /* @__PURE__ */ jsx28("p", { className: "text-muted-foreground", children: confirming.confirm.description }),
-      confirming.grants && confirming.grants.length > 0 && /* @__PURE__ */ jsx28("ul", { className: "flex flex-col gap-1", children: confirming.grants.map((grant) => /* @__PURE__ */ jsx28("li", { children: /* @__PURE__ */ jsx28("code", { className: "bg-muted rounded px-1.5 py-0.5 text-xs", children: grant }) }, grant)) }),
-      /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx28(
-          Button,
-          {
-            size: "sm",
-            className: "active:scale-[0.98]",
-            onClick: () => {
-              onSelectOption(confirming.id);
-              setConfirmingId(null);
-            },
-            children: "Confirm"
-          }
-        ),
-        /* @__PURE__ */ jsx28(
-          Button,
-          {
-            size: "sm",
-            variant: "outline",
-            className: "active:scale-[0.98]",
-            onClick: () => setConfirmingId(null),
-            children: "Back"
-          }
-        )
-      ] })
-    ] });
+// src/atoms/Markdown.tsx
+import { MarkdownWithOpenUI } from "tfy-web-components/components/molecules/Markdown";
+import { jsx as jsx29 } from "react/jsx-runtime";
+function Markdown({
+  content,
+  isStreaming,
+  fileDownloadBaseUrl,
+  onDownloadArtifact,
+  readOnly,
+  className
+}) {
+  const mode = useThemeMode();
+  return /* @__PURE__ */ jsx29(
+    MarkdownWithOpenUI,
+    {
+      isStreaming,
+      darkTheme: mode === "dark",
+      fileDownloadBaseUrl,
+      onDownloadArtifact,
+      readOnly,
+      className,
+      children: content
+    }
+  );
+}
+
+// src/atoms/AssistantMessageBubble.tsx
+import { AssistantMessage } from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx30 } from "react/jsx-runtime";
+function AssistantMessageBubble({
+  children,
+  error,
+  actionBar,
+  className
+}) {
+  return /* @__PURE__ */ jsx30(
+    "div",
+    {
+      "data-slot": "aui_assistant-message-root",
+      className: cn(
+        "group/assistant fade-in slide-in-from-bottom-1 animate-in relative duration-150",
+        className
+      ),
+      children: /* @__PURE__ */ jsx30(AssistantMessage, { error, actionBar, children })
+    }
+  );
+}
+
+// src/atoms/MessageErrorBanner.tsx
+import { jsx as jsx31 } from "react/jsx-runtime";
+function MessageErrorBanner({ message, className }) {
+  return /* @__PURE__ */ jsx31(
+    "div",
+    {
+      role: "alert",
+      className: cn(
+        "aui-message-error-root border-destructive bg-destructive/10 text-destructive dark:bg-destructive/5 mt-2 rounded-md border p-3 text-sm dark:text-red-200",
+        className
+      ),
+      children: /* @__PURE__ */ jsx31("span", { className: "aui-message-error-message line-clamp-2", children: message })
+    }
+  );
+}
+
+// src/atoms/MessageIndicator.tsx
+import { jsx as jsx32 } from "react/jsx-runtime";
+function MessageIndicator({ className }) {
+  return /* @__PURE__ */ jsx32(
+    "span",
+    {
+      "data-slot": "aui_assistant-message-indicator",
+      className: cn("animate-pulse font-sans", className),
+      "aria-label": "Assistant is working",
+      children: "\u25CF"
+    }
+  );
+}
+
+// src/atoms/MessageTimestamp.tsx
+import { useAuiState } from "@assistant-ui/react";
+import { jsx as jsx33 } from "react/jsx-runtime";
+function toDate(createdAt) {
+  if (createdAt == null) {
+    return null;
+  }
+  const date = createdAt instanceof Date ? createdAt : new Date(createdAt);
+  return Number.isNaN(date.getTime()) ? null : date;
+}
+function formatTime(date) {
+  return new Intl.DateTimeFormat(void 0, {
+    hour: "2-digit",
+    minute: "2-digit",
+    second: "2-digit",
+    hour12: true
+  }).format(date);
+}
+function formatFullDate(date) {
+  return new Intl.DateTimeFormat(void 0, {
+    month: "short",
+    day: "numeric",
+    year: "numeric",
+    hour: "numeric",
+    minute: "2-digit",
+    hour12: true
+  }).format(date);
+}
+function MessageTimestamp({ className }) {
+  const LightTooltip3 = useSlot("LightTooltip");
+  const createdAt = useAuiState((s) => s.message.createdAt);
+  const date = toDate(createdAt);
+  if (date == null) {
+    return null;
   }
-  const firstAllowId = options.find((o) => o.isAllow)?.id;
-  return /* @__PURE__ */ jsx28("div", { className: cn("aui-tool-approval-bar flex flex-wrap items-center gap-2 pt-1", className), children: options.map((option) => /* @__PURE__ */ jsx28(
-    Button,
+  return /* @__PURE__ */ jsx33(LightTooltip3, { title: formatFullDate(date), size: "fit", children: /* @__PURE__ */ jsx33(
+    "span",
     {
-      size: "sm",
-      variant: option.id === firstAllowId ? "default" : "outline",
-      className: "active:scale-[0.98]",
-      onClick: () => option.confirm ? setConfirmingId(option.id) : onSelectOption(option.id),
-      children: option.label
-    },
-    option.id
-  )) });
+      className: cn(
+        "text-xs font-medium cursor-pointer leading-normal shrink-0 text-muted-foreground",
+        className
+      ),
+      children: formatTime(date)
+    }
+  ) });
 }
 
-// src/atoms/ThreadListRow.tsx
-import { ArchiveIcon, MoreHorizontalIcon as MoreHorizontalIcon2, TrashIcon } from "lucide-react";
-import { DropdownMenu as DropdownMenu2 } from "radix-ui";
-import { jsx as jsx29, jsxs as jsxs19 } from "react/jsx-runtime";
-function ThreadListRow({ title, active, onSelect, onArchive, onDelete, className }) {
-  return /* @__PURE__ */ jsxs19(
-    "div",
+// src/atoms/UserMessageActionBar.tsx
+import { ActionBarPrimitive, useAuiState as useAuiState2 } from "@assistant-ui/react";
+import { useActionBarCopy, useActionBarEdit } from "@assistant-ui/core/react";
+import { useTrueFoundryResetFromTurn } from "@truefoundry/assistant-ui-runtime";
+import { jsx as jsx34, jsxs as jsxs13 } from "react/jsx-runtime";
+function parseTurnIdFromMessageId(messageId) {
+  return messageId.replace(/-user$/, "");
+}
+function UserMessageActionBar({ className }) {
+  const IconButton5 = useSlot("IconButton");
+  const MessageTimestamp2 = useSlot("MessageTimestamp");
+  const messageId = useAuiState2((s) => s.message.id);
+  const turnId = parseTurnIdFromMessageId(messageId);
+  const resetFromTurn = useTrueFoundryResetFromTurn();
+  const { edit, disabled: editDisabled } = useActionBarEdit();
+  const { copy, isCopied } = useActionBarCopy({
+    copyToClipboard: (text) => navigator.clipboard.writeText(text)
+  });
+  return /* @__PURE__ */ jsxs13(
+    ActionBarPrimitive.Root,
     {
-      "data-slot": "aui_thread-list-item",
-      "data-active": active || void 0,
+      hideWhenRunning: true,
       className: cn(
-        "group hover:bg-muted data-[active]:bg-muted relative flex min-h-9 items-center rounded-lg transition-colors",
+        "aui-user-action-bar-root text-muted-foreground animate-in fade-in flex items-center gap-2 duration-200",
         className
       ),
       children: [
-        /* @__PURE__ */ jsx29(
-          "button",
+        /* @__PURE__ */ jsx34(
+          IconButton5,
           {
-            type: "button",
-            onClick: onSelect,
-            "data-slot": "aui_thread-list-item-trigger",
-            className: "flex min-h-9 min-w-0 flex-1 items-center rounded-lg px-2.5 py-2 text-start text-sm outline-none group-hover:pe-9",
-            children: /* @__PURE__ */ jsx29("span", { className: "min-w-0 flex-1 truncate", children: title })
+            icon: "rotate-right",
+            tooltip: "Try again",
+            onClick: () => void resetFromTurn(turnId)
           }
         ),
-        (onArchive || onDelete) && /* @__PURE__ */ jsxs19(DropdownMenu2.Root, { children: [
-          /* @__PURE__ */ jsx29(DropdownMenu2.Trigger, { asChild: true, children: /* @__PURE__ */ jsx29(
-            IconButton,
-            {
-              tooltip: "More options",
-              className: "absolute end-1.5 top-1/2 size-6 -translate-y-1/2 p-0 opacity-0 group-hover:opacity-100 data-[state=open]:opacity-100",
-              children: /* @__PURE__ */ jsx29(MoreHorizontalIcon2, { className: "size-3.5" })
-            }
-          ) }),
-          /* @__PURE__ */ jsx29(DropdownMenu2.Portal, { children: /* @__PURE__ */ jsxs19(
-            DropdownMenu2.Content,
-            {
-              side: "right",
-              align: "start",
-              sideOffset: 6,
-              className: "bg-popover/95 text-popover-foreground z-50 min-w-32 overflow-hidden rounded-xl border p-1.5 shadow-lg backdrop-blur-sm",
-              children: [
-                onArchive && /* @__PURE__ */ jsxs19(
-                  DropdownMenu2.Item,
-                  {
-                    onSelect: onArchive,
-                    className: "hover:bg-accent hover:text-accent-foreground flex cursor-pointer items-center gap-2 rounded-lg px-2.5 py-1.5 text-sm outline-none select-none",
-                    children: [
-                      /* @__PURE__ */ jsx29(ArchiveIcon, { className: "size-4" }),
-                      "Archive"
-                    ]
-                  }
-                ),
-                onDelete && /* @__PURE__ */ jsxs19(
-                  DropdownMenu2.Item,
-                  {
-                    onSelect: onDelete,
-                    className: "text-destructive hover:bg-destructive/10 flex cursor-pointer items-center gap-2 rounded-lg px-2.5 py-1.5 text-sm outline-none select-none",
-                    children: [
-                      /* @__PURE__ */ jsx29(TrashIcon, { className: "size-4" }),
-                      "Delete"
-                    ]
-                  }
-                )
-              ]
-            }
-          ) })
-        ] })
+        /* @__PURE__ */ jsx34(
+          IconButton5,
+          {
+            icon: "pencil",
+            tooltip: "Edit",
+            disabled: editDisabled,
+            onClick: edit
+          }
+        ),
+        /* @__PURE__ */ jsx34(
+          IconButton5,
+          {
+            icon: isCopied ? "check" : ["far", "clone"],
+            tooltip: "Copy",
+            onClick: copy
+          }
+        ),
+        /* @__PURE__ */ jsx34(MessageTimestamp2, {})
       ]
     }
   );
 }
 
-// src/atoms/ThreadListMisc.tsx
-import { PlusIcon as PlusIcon3 } from "lucide-react";
-import { jsx as jsx30, jsxs as jsxs20 } from "react/jsx-runtime";
-function ThreadListNewButton({ className, ...rest }) {
-  return /* @__PURE__ */ jsxs20(
-    Button,
+// src/atoms/ThreadShell.tsx
+import { forwardRef as forwardRef3 } from "react";
+import { jsx as jsx35 } from "react/jsx-runtime";
+var THREAD_CSS_VARS = {
+  ["--thread-max-width"]: "44rem",
+  ["--composer-bg"]: "color-mix(in oklab, var(--color-muted) 30%, var(--color-background))",
+  ["--composer-radius"]: "1.5rem",
+  ["--composer-padding"]: "8px"
+};
+var ThreadRootShell = forwardRef3(
+  ({ className, style, ...rest }, ref) => /* @__PURE__ */ jsx35(
+    "div",
     {
-      variant: "ghost",
-      "data-slot": "aui_thread-list-new",
-      className: cn("hover:bg-muted h-8 justify-start gap-2 rounded-md px-2.5 text-sm font-normal", className),
+      ref,
+      className: cn(
+        "font-sans-flex aui-root aui-thread-root bg-background @container flex h-full min-h-0 flex-col overflow-hidden",
+        className
+      ),
+      style: { ...THREAD_CSS_VARS, ...style },
+      ...rest
+    }
+  )
+);
+ThreadRootShell.displayName = "ThreadRootShell";
+var ThreadViewportShell = forwardRef3(
+  ({ className, isEmpty, children, ...rest }, ref) => /* @__PURE__ */ jsx35(
+    "div",
+    {
+      ref,
+      "data-slot": "aui_thread-viewport",
+      className: cn("relative flex min-h-0 flex-1 flex-col overflow-x-auto overflow-y-auto scroll-smooth", className),
       ...rest,
-      children: [
-        /* @__PURE__ */ jsx30(PlusIcon3, { className: "size-4 shrink-0" }),
-        /* @__PURE__ */ jsx30("span", { className: "whitespace-nowrap", children: "New Thread" })
-      ]
+      children: /* @__PURE__ */ jsx35(
+        "div",
+        {
+          className: cn(
+            "mx-auto flex w-full max-w-(--thread-max-width) flex-col px-4 pt-4 pb-4",
+            isEmpty && "min-h-full justify-center"
+          ),
+          children
+        }
+      )
     }
-  );
-}
-function ThreadListRowSkeleton({ count = 5, className }) {
-  return /* @__PURE__ */ jsx30("div", { className: cn("flex flex-col gap-1", className), role: "status", "aria-label": "Loading threads", children: Array.from({ length: count }, (_, i) => /* @__PURE__ */ jsx30("div", { className: "flex h-8 items-center px-2.5", children: /* @__PURE__ */ jsx30(Skeleton, { className: "h-3.5 w-full" }) }, i)) });
-}
-function ThreadListEmptyState({ message = "No threads yet", className }) {
-  return /* @__PURE__ */ jsx30("div", { className: cn("text-muted-foreground flex flex-1 items-center justify-center px-4 text-center text-sm", className), children: message });
-}
-function ThreadListShell({ header, children, className }) {
-  return /* @__PURE__ */ jsxs20("div", { className: cn("flex min-h-0 flex-1 flex-col gap-1 overflow-hidden p-3", className), children: [
-    header,
-    /* @__PURE__ */ jsx30("div", { className: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto pb-1", children })
-  ] });
-}
-
-// src/atoms/Toast.tsx
-import { XIcon as XIcon3 } from "lucide-react";
-import { Toast as ToastPrimitive } from "radix-ui";
-import { jsx as jsx31, jsxs as jsxs21 } from "react/jsx-runtime";
-function Toast({ title, description, open, onOpenChange, className }) {
-  return /* @__PURE__ */ jsxs21(
-    ToastPrimitive.Root,
+  )
+);
+ThreadViewportShell.displayName = "ThreadViewportShell";
+var ThreadComposerAreaShell = forwardRef3(
+  ({ className, isEmpty, ...rest }, ref) => /* @__PURE__ */ jsx35(
+    "div",
     {
-      open,
-      onOpenChange,
+      ref,
+      "data-slot": "aui_thread-composer",
       className: cn(
-        "border-destructive bg-background text-destructive dark:bg-card pointer-events-auto relative flex max-h-[min(70vh,32rem)] w-full items-start gap-3 rounded-xl border p-4 shadow-lg dark:text-red-200",
-        "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:slide-in-from-bottom-4",
-        "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:slide-out-to-bottom-4",
+        "aui-thread-composer bg-background relative mx-auto flex w-full max-w-(--thread-max-width) shrink-0 flex-col gap-4 px-4 pb-4 md:pb-6",
+        !isEmpty && "rounded-t-(--composer-radius)",
         className
       ),
-      children: [
-        /* @__PURE__ */ jsxs21("div", { className: "grid min-h-0 min-w-0 flex-1 gap-1 overflow-y-auto pe-6", children: [
-          /* @__PURE__ */ jsx31(ToastPrimitive.Title, { className: "text-sm leading-none font-semibold", children: title }),
-          /* @__PURE__ */ jsx31(ToastPrimitive.Description, { className: "font-mono text-sm break-words whitespace-pre-wrap", children: description })
-        ] }),
-        /* @__PURE__ */ jsxs21(ToastPrimitive.Close, { className: "text-destructive hover:bg-muted focus-visible:ring-ring absolute top-3 right-3 rounded-md p-1 transition-colors focus:outline-none focus-visible:ring-2", children: [
-          /* @__PURE__ */ jsx31(XIcon3, { className: "size-4" }),
-          /* @__PURE__ */ jsx31("span", { className: "sr-only", children: "Close" })
-        ] })
-      ]
+      ...rest
     }
-  );
-}
-function ToastStack({ children, duration = Number.POSITIVE_INFINITY }) {
-  return /* @__PURE__ */ jsxs21(ToastPrimitive.Provider, { duration, children: [
-    children,
-    /* @__PURE__ */ jsx31(ToastPrimitive.Viewport, { className: "fixed inset-x-0 bottom-0 z-50 flex max-h-screen flex-col-reverse gap-2 p-4 sm:bottom-4 sm:left-1/2 sm:w-full sm:max-w-2xl sm:-translate-x-1/2" })
-  ] });
-}
-
-// src/atoms/ToolCallCard.tsx
-import { BriefcaseIcon, CheckIcon as CheckIcon4, ChevronDownIcon as ChevronDownIcon2, LoaderIcon as LoaderIcon3, PlugIcon, WrenchIcon, XCircleIcon } from "lucide-react";
-import { jsx as jsx32, jsxs as jsxs22 } from "react/jsx-runtime";
-var variantIcon = {
-  tool: WrenchIcon,
-  "sub-agent": BriefcaseIcon,
-  "mcp-listing": PlugIcon
-};
-function StatusIcon({ status }) {
-  if (status === "running") {
-    return /* @__PURE__ */ jsx32(
-      LoaderIcon3,
-      {
-        "data-slot": "tool-call-card-status-icon",
-        className: "text-muted-foreground size-4 shrink-0 animate-spin [animation-duration:0.6s]"
-      }
-    );
-  }
-  if (status === "success") {
-    return /* @__PURE__ */ jsx32(
-      CheckIcon4,
-      {
-        "data-slot": "tool-call-card-status-icon",
-        className: "size-4 shrink-0 text-emerald-600 dark:text-emerald-400"
-      }
-    );
+  )
+);
+ThreadComposerAreaShell.displayName = "ThreadComposerAreaShell";
+var MessageGroup = forwardRef3(({ className, ...rest }, ref) => /* @__PURE__ */ jsx35(
+  "div",
+  {
+    ref,
+    "data-slot": "aui_message-group",
+    className: cn("flex flex-col gap-y-6 empty:hidden", className),
+    ...rest
   }
-  return /* @__PURE__ */ jsx32(XCircleIcon, { "data-slot": "tool-call-card-status-icon", className: "text-destructive size-4 shrink-0" });
-}
-function IconChip({ Icon }) {
-  return /* @__PURE__ */ jsx32("span", { className: "bg-muted text-muted-foreground flex size-6 shrink-0 items-center justify-center rounded-md", children: /* @__PURE__ */ jsx32(Icon, { className: "size-3.5" }) });
-}
-function ToolCallCard(props) {
-  const { variant, name, status, expanded, onToggle, durationText, className } = props;
-  const VariantIcon = variantIcon[variant];
-  return /* @__PURE__ */ jsxs22(
-    Collapsible,
-    {
-      "data-slot": "tool-call-card",
-      "data-variant": variant,
-      open: expanded,
-      onOpenChange: onToggle,
-      className: cn("aui-tool-call-card w-full rounded-lg border py-2", className),
-      children: [
-        /* @__PURE__ */ jsxs22(CollapsibleTrigger, { className: "flex w-full items-center gap-2 px-3 text-left", children: [
-          /* @__PURE__ */ jsx32(IconChip, { Icon: VariantIcon }),
-          variant === "tool" && /* @__PURE__ */ jsx32("span", { className: "text-sm", children: name }),
-          variant === "sub-agent" && /* @__PURE__ */ jsxs22("span", { className: "flex min-w-0 flex-col items-start", children: [
-            /* @__PURE__ */ jsx32("span", { className: "text-muted-foreground text-[10px] font-semibold tracking-wide uppercase", children: "Sub-agent" }),
-            /* @__PURE__ */ jsx32("span", { className: "truncate text-sm font-medium", children: props.agentName })
-          ] }),
-          variant === "mcp-listing" && /* @__PURE__ */ jsxs22("span", { className: "truncate text-sm", children: [
-            "Listing tools \xB7 ",
-            props.serverName
-          ] }),
-          /* @__PURE__ */ jsxs22("span", { className: "ml-auto flex shrink-0 items-center gap-2", children: [
-            durationText && /* @__PURE__ */ jsx32("span", { className: "text-muted-foreground text-xs tabular-nums", children: durationText }),
-            /* @__PURE__ */ jsx32(StatusIcon, { status }),
-            /* @__PURE__ */ jsx32(
-              ChevronDownIcon2,
-              {
-                className: cn(
-                  "size-4 shrink-0 transition-transform duration-200 ease-[cubic-bezier(0.32,0.72,0,1)]",
-                  expanded ? "rotate-0" : "-rotate-90"
-                )
-              }
-            )
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxs22(CollapsibleContent, { className: "px-3 pt-2", children: [
-          variant === "tool" && /* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-2", children: [
-            props.approvalSlot,
-            props.argsText && /* @__PURE__ */ jsxs22("div", { children: [
-              /* @__PURE__ */ jsx32("p", { className: "text-muted-foreground text-xs font-medium", children: "Request:" }),
-              /* @__PURE__ */ jsx32("pre", { className: "bg-muted/50 text-foreground/90 mt-1 rounded-md p-2.5 text-xs break-words whitespace-pre-wrap", children: props.argsText })
-            ] }),
-            props.result !== void 0 && /* @__PURE__ */ jsxs22("div", { children: [
-              /* @__PURE__ */ jsx32("p", { className: "text-muted-foreground text-xs font-medium", children: "Result:" }),
-              /* @__PURE__ */ jsx32(
-                "pre",
-                {
-                  className: cn(
-                    "bg-muted/50 mt-1 rounded-md p-2.5 text-xs break-words whitespace-pre-wrap",
-                    props.isError ? "text-destructive" : "text-foreground/90"
-                  ),
-                  children: props.result
-                }
-              )
-            ] })
-          ] }),
-          variant === "sub-agent" && /* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-2", children: [
-            /* @__PURE__ */ jsx32("p", { className: "text-muted-foreground line-clamp-2 text-sm", children: props.instruction }),
-            /* @__PURE__ */ jsxs22("p", { className: "text-muted-foreground text-[10px] font-medium tracking-wide uppercase", children: [
-              "Steps \xB7 ",
-              props.stepCount,
-              " steps"
-            ] }),
-            /* @__PURE__ */ jsx32("div", { className: "border-border/60 flex flex-col gap-2 border-l pl-3", children: props.children })
-          ] }),
-          variant === "mcp-listing" && /* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-2", children: [
-            /* @__PURE__ */ jsx32("p", { className: "text-muted-foreground text-sm", children: props.description }),
-            /* @__PURE__ */ jsxs22("div", { children: [
-              /* @__PURE__ */ jsx32("p", { className: "text-muted-foreground text-xs font-medium", children: "Request:" }),
-              /* @__PURE__ */ jsx32("pre", { className: "bg-muted/50 text-foreground/90 mt-1 rounded-md p-2.5 text-xs break-words whitespace-pre-wrap", children: props.argsText })
-            ] }),
-            /* @__PURE__ */ jsxs22("div", { children: [
-              /* @__PURE__ */ jsx32("p", { className: "text-muted-foreground text-xs font-medium", children: "Result:" }),
-              /* @__PURE__ */ jsx32("pre", { className: "bg-muted/50 text-foreground/90 mt-1 rounded-md p-2.5 text-xs break-words whitespace-pre-wrap", children: props.resultText })
-            ] })
-          ] })
-        ] })
-      ]
-    }
-  );
+));
+MessageGroup.displayName = "MessageGroup";
+
+// src/atoms/WelcomeScreen.tsx
+import { jsx as jsx36 } from "react/jsx-runtime";
+function WelcomeScreen({ heading = "How can I help you today?", className }) {
+  return /* @__PURE__ */ jsx36("div", { className: cn("aui-thread-welcome-root mb-6 flex flex-col items-center px-4 text-center", className), children: /* @__PURE__ */ jsx36("h1", { className: "aui-thread-welcome-message-inner fade-in slide-in-from-bottom-1 animate-in fill-mode-both text-2xl font-semibold duration-200", children: heading }) });
 }
 
-// src/atoms/ToolGroupCard.tsx
-import { ChevronDownIcon as ChevronDownIcon3, LoaderIcon as LoaderIcon4 } from "lucide-react";
-import { jsx as jsx33, jsxs as jsxs23 } from "react/jsx-runtime";
-function ToolGroupCard({
-  toolCallCount,
-  expanded,
-  active = false,
-  onToggle,
-  children,
-  className
-}) {
-  const label = `${toolCallCount} tool ${toolCallCount === 1 ? "call" : "calls"}`;
-  return /* @__PURE__ */ jsxs23(
-    Collapsible,
+// src/atoms/Toast.tsx
+import { XIcon } from "lucide-react";
+import { jsx as jsx37, jsxs as jsxs14 } from "react/jsx-runtime";
+function Toast({ title, description, open, onOpenChange, className }) {
+  if (!open) return null;
+  return /* @__PURE__ */ jsxs14(
+    "div",
     {
-      "data-slot": "tool-group-card",
-      open: expanded,
-      onOpenChange: onToggle,
-      className: cn("aui-tool-group-card group/tool-group w-full", className),
+      className: cn(
+        "font-sans-flex border-destructive bg-background text-destructive dark:bg-card pointer-events-auto relative flex max-h-[min(70vh,32rem)] w-full items-start gap-3 rounded-xl border p-4 shadow-lg dark:text-red-200",
+        "animate-in fade-in-0 slide-in-from-bottom-4",
+        className
+      ),
       children: [
-        /* @__PURE__ */ jsxs23(CollapsibleTrigger, { className: "text-muted-foreground hover:text-foreground flex origin-left items-center gap-2 py-1.5 text-sm transition-[color,scale] active:scale-[0.98]", children: [
-          active && /* @__PURE__ */ jsx33(LoaderIcon4, { className: "size-3 shrink-0 animate-spin [animation-duration:0.6s]" }),
-          /* @__PURE__ */ jsx33("span", { className: "text-xs font-medium", children: label }),
-          /* @__PURE__ */ jsx33(
-            ChevronDownIcon3,
-            {
-              className: cn(
-                "size-3 shrink-0 transition-transform duration-200 ease-[cubic-bezier(0.32,0.72,0,1)]",
-                expanded ? "rotate-0" : "-rotate-90"
-              )
-            }
-          )
+        /* @__PURE__ */ jsxs14("div", { className: "grid min-h-0 min-w-0 flex-1 gap-1 overflow-y-auto pe-6", children: [
+          /* @__PURE__ */ jsx37("div", { className: "text-sm leading-none font-semibold", children: title }),
+          /* @__PURE__ */ jsx37("div", { className: "font-mono text-sm break-words whitespace-pre-wrap", children: description })
         ] }),
-        /* @__PURE__ */ jsx33(CollapsibleContent, { className: "mt-1 flex flex-col gap-1", children })
+        /* @__PURE__ */ jsxs14(
+          "button",
+          {
+            onClick: () => onOpenChange(false),
+            className: "text-destructive hover:bg-muted focus-visible:ring-ring absolute top-3 right-3 rounded-md p-1 transition-colors focus:outline-none focus-visible:ring-2",
+            children: [
+              /* @__PURE__ */ jsx37(XIcon, { className: "size-4" }),
+              /* @__PURE__ */ jsx37("span", { className: "sr-only", children: "Close" })
+            ]
+          }
+        )
       ]
     }
   );
 }
-
-// src/atoms/WelcomeScreen.tsx
-import { jsx as jsx34 } from "react/jsx-runtime";
-function WelcomeScreen({ heading = "How can I help you today?", className }) {
-  return /* @__PURE__ */ jsx34("div", { className: cn("aui-thread-welcome-root mb-6 flex flex-col items-center px-4 text-center", className), children: /* @__PURE__ */ jsx34("h1", { className: "aui-thread-welcome-message-inner fade-in slide-in-from-bottom-1 animate-in fill-mode-both text-2xl font-semibold duration-200", children: heading }) });
+function ToastStack({ children, duration = Number.POSITIVE_INFINITY }) {
+  return /* @__PURE__ */ jsx37("div", { className: "pointer-events-none fixed bottom-4 left-1/2 z-50 flex h-full max-h-screen w-full max-w-2xl -translate-x-1/2 flex-col-reverse gap-2 px-4", children });
 }
 
 // src/theme/defaultSlots.ts
 var defaultSlots = {
-  Button,
-  IconButton,
+  // tfy-web-components — direct slot defaults
+  Button: Button2,
+  IconButton: IconButton4,
+  LightTooltip,
+  Modal: Modal2,
+  Dialog,
+  Accordion: Accordion2,
+  AccordionSummary: AccordionSummary2,
+  AccordionDetails: AccordionDetails2,
+  Skeleton: Skeleton3,
+  ReasoningCard,
+  AskUserPrompt,
+  McpAuthPrompt,
+  // SDK atoms — wrap or compose tfy-web-components internally
   Avatar,
   AvatarImage,
   AvatarFallback,
-  Tooltip,
-  TooltipProvider,
-  TooltipTrigger,
-  TooltipContent,
-  Dialog,
-  DialogTrigger,
-  DialogPortal,
-  DialogClose,
-  DialogOverlay,
-  DialogContent,
-  DialogHeader,
-  DialogFooter,
-  DialogTitle,
-  DialogDescription,
-  Collapsible,
-  CollapsibleTrigger,
-  CollapsibleContent,
-  Skeleton,
-  Markdown,
-  OpenUIBlock,
-  SandboxArtifactList,
-  CodeBlockHeader,
-  MessageBubble,
-  MessageErrorBanner,
-  MessageActionBar,
-  UserMessageActionBar,
-  BranchIndicator,
-  MessageIndicator,
-  WelcomeScreen,
-  MessageListSkeleton,
-  ScrollToBottomButton,
-  ThreadRootShell,
-  ThreadViewportShell,
-  ThreadComposerAreaShell,
-  MessageGroup,
+  UserMessageBubble,
+  UserMessageEdit,
   ToolCallCard,
+  ToolCallContentBlock,
+  SubAgentCard,
+  SandboxToolCallCard,
   ToolApprovalBar,
   ToolGroupCard,
-  ReasoningCard,
+  MessageListSkeleton,
   ComposerShell,
-  AskUserPrompt,
-  McpAuthPrompt,
+  ComposerLeftSection,
+  ComposerRightSection,
+  ComposerSendButton,
   AttachmentCard,
   AttachmentPreviewDialog,
   AttachmentPickerButton,
+  ScrollToBottomButton,
   ThreadListRow,
   ThreadListNewButton,
   ThreadListRowSkeleton,
   ThreadListEmptyState,
   ThreadListShell,
+  MessageActionBar,
+  Markdown,
+  // SDK atoms — SDK-owned (no tfy slot component)
+  AssistantMessageBubble,
+  MessageErrorBanner,
+  MessageTimestamp,
+  UserMessageActionBar,
+  MessageIndicator,
+  WelcomeScreen,
+  ThreadRootShell,
+  ThreadViewportShell,
+  ThreadComposerAreaShell,
+  MessageGroup,
   Toast,
   ToastStack
 };
 
 // src/theme/SlotsProvider.tsx
-import { jsx as jsx35 } from "react/jsx-runtime";
+import { jsx as jsx38 } from "react/jsx-runtime";
 var SlotsContext = createContext(defaultSlots);
+var ThemeModeContext = createContext(void 0);
 function SlotsProvider({
   overrides,
+  theme,
   children
 }) {
   const parentSlots = useContext(SlotsContext);
-  const resolved = useMemo2(
+  const inheritedTheme = useContext(ThemeModeContext);
+  const resolved = useMemo(
     () => ({ ...parentSlots, ...overrides }),
     [parentSlots, overrides]
   );
-  return /* @__PURE__ */ jsx35(SlotsContext.Provider, { value: resolved, children });
+  return /* @__PURE__ */ jsx38(TfyThemeProvider, { theme: theme ?? inheritedTheme, children: /* @__PURE__ */ jsx38(SlotsProviderContents, { slots: resolved, children }) });
+}
+function SlotsProviderContents({
+  slots,
+  children
+}) {
+  const { mode } = useTfyTheme();
+  return /* @__PURE__ */ jsx38(ThemeModeContext.Provider, { value: mode, children: /* @__PURE__ */ jsx38(SlotsContext.Provider, { value: slots, children }) });
 }
 function useSlot(name) {
   const slots = useContext(SlotsContext);
   return slots[name];
 }
+function useThemeMode() {
+  return useContext(ThemeModeContext) ?? "light";
+}
 
 // src/theme/tokens.ts
 import { createContext as createContext2, createElement, useContext as useContext2 } from "react";
@@ -1798,16 +1233,43 @@ function useTokens() {
   return useContext2(TokensContext);
 }
 
+// src/index.ts
+import {
+  Button as Button3,
+  DestructiveButton,
+  GhostButton,
+  PrimaryButton,
+  SecondaryButton,
+  TertiaryButton
+} from "tfy-web-components/components/atoms/Button";
+import { default as default2 } from "tfy-web-components/components/atoms/IconButton";
+import {
+  default as default3,
+  registerIcons as registerIcons2,
+  registerImgIcons
+} from "tfy-web-components/components/atoms/IconProvider";
+import { LightTooltip as LightTooltip2 } from "tfy-web-components/components/atoms/Tooltip";
+import { default as default4 } from "tfy-web-components/components/atoms/Modal";
+import { default as default5 } from "tfy-web-components/components/molecules/Dialog";
+import {
+  Accordion as Accordion3,
+  AccordionSummary as AccordionSummary3,
+  AccordionDetails as AccordionDetails3
+} from "tfy-web-components/components/atoms/Accordion";
+import { default as default6 } from "tfy-web-components/components/atoms/Skeleton";
+
 // src/containers/ThreadContainer.tsx
-import { ThreadPrimitive, useAuiState as useAuiState8 } from "@assistant-ui/react";
+import { useEffect as useEffect4 } from "react";
+import { preloadMarkdownOpenUI } from "tfy-web-components/components/molecules/Markdown";
+import { ThreadPrimitive, useAuiState as useAuiState11 } from "@assistant-ui/react";
 
 // src/hooks/useComposerBusyState.ts
 import { useThreadIsRunning } from "@assistant-ui/core/react";
-import { createContext as createContext3, createElement as createElement2, useCallback, useContext as useContext3, useEffect, useState as useState4 } from "react";
+import { createContext as createContext3, createElement as createElement2, useCallback, useContext as useContext3, useEffect, useState as useState2 } from "react";
 var ComposerBusyContext = createContext3(null);
 function useComposerBusyStateValue() {
   const isRunning = useThreadIsRunning();
-  const [isSubmitting, setIsSubmitting] = useState4(false);
+  const [isSubmitting, setIsSubmitting] = useState2(false);
   useEffect(() => {
     if (!isRunning) {
       setIsSubmitting(false);
@@ -1845,23 +1307,18 @@ function useComposerBusyState() {
 }
 
 // src/containers/AssistantMessageContainer.tsx
-import { groupPartByType, MessagePrimitive as MessagePrimitive2, useAui as useAui2 } from "@assistant-ui/react";
-import {
-  useActionBarCopy as useActionBarCopy2,
-  useMessageBranching,
-  useMessageError,
-  useThreadIsRunning as useThreadIsRunning2
-} from "@assistant-ui/core/react";
+import { groupPartByType, MessagePrimitive as MessagePrimitive2 } from "@assistant-ui/react";
+import { useActionBarCopy as useActionBarCopy2, useMessageError, useThreadIsRunning as useThreadIsRunning2 } from "@assistant-ui/core/react";
 
 // src/containers/AssistantTextContainer.tsx
 import { useCallback as useCallback3 } from "react";
-import { useAuiState as useAuiState2 } from "@assistant-ui/react";
+import { useAuiState as useAuiState3 } from "@assistant-ui/react";
 import { useTrueFoundryDownloadSandboxFile } from "@truefoundry/assistant-ui-runtime";
 
 // src/containers/ErrorToasterContainer.tsx
-import { createContext as createContext4, useCallback as useCallback2, useContext as useContext4, useMemo as useMemo3, useState as useState5 } from "react";
+import { createContext as createContext4, useCallback as useCallback2, useContext as useContext4, useMemo as useMemo2, useState as useState3 } from "react";
 import { TrueFoundryGatewayError } from "truefoundry-gateway-sdk";
-import { jsx as jsx36, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs15 } from "react/jsx-runtime";
 var ErrorToasterContext = createContext4(null);
 function formatErrorBody(body) {
   if (body == null) return void 0;
@@ -1887,17 +1344,17 @@ function normalizeError(error) {
 function ErrorToasterProvider({ children }) {
   const ToastStack2 = useSlot("ToastStack");
   const Toast2 = useSlot("Toast");
-  const [toast, setToast] = useState5(null);
-  const [open, setOpen] = useState5(false);
+  const [toast, setToast] = useState3(null);
+  const [open, setOpen] = useState3(false);
   const showError = useCallback2((error) => {
     setToast(normalizeError(error));
     setOpen(true);
   }, []);
-  const value = useMemo3(() => ({ showError }), [showError]);
-  return /* @__PURE__ */ jsx36(ErrorToasterContext.Provider, { value, children: /* @__PURE__ */ jsxs24(ToastStack2, { children: [
+  const value = useMemo2(() => ({ showError }), [showError]);
+  return /* @__PURE__ */ jsxs15(ErrorToasterContext.Provider, { value, children: [
     children,
-    toast != null && /* @__PURE__ */ jsx36(Toast2, { title: toast.title, description: toast.description, open, onOpenChange: setOpen })
-  ] }) });
+    /* @__PURE__ */ jsx39(ToastStack2, { children: toast != null && /* @__PURE__ */ jsx39(Toast2, { title: toast.title, description: toast.description, open, onOpenChange: setOpen }) })
+  ] });
 }
 function useErrorToaster() {
   const context = useContext4(ErrorToasterContext);
@@ -1911,7 +1368,7 @@ function useErrorToasterOptional() {
 }
 
 // src/containers/AssistantTextContainer.tsx
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { jsx as jsx40 } from "react/jsx-runtime";
 function filenameFromPath(path) {
   return path.split("/").pop() || "download";
 }
@@ -1928,10 +1385,10 @@ function AssistantTextContainer() {
   const Markdown2 = useSlot("Markdown");
   const downloadSandboxFile = useTrueFoundryDownloadSandboxFile();
   const errorToaster = useErrorToasterOptional();
-  const text = useAuiState2(
+  const text = useAuiState3(
     (s) => s.part.type === "text" || s.part.type === "reasoning" ? s.part.text : ""
   );
-  const isStreaming = useAuiState2((s) => {
+  const isStreaming = useAuiState3((s) => {
     if (s.message.status?.type !== "running") return false;
     const lastIndex = s.message.parts.length - 1;
     if (lastIndex < 0) return false;
@@ -1948,23 +1405,24 @@ function AssistantTextContainer() {
     }),
     [downloadSandboxFile, errorToaster]
   );
-  return /* @__PURE__ */ jsx37(Markdown2, { content: text, isStreaming, onDownloadArtifact: handleDownloadArtifact });
+  return /* @__PURE__ */ jsx40(Markdown2, { content: text, isStreaming, onDownloadArtifact: handleDownloadArtifact });
 }
 
 // src/containers/MessageImageContainer.tsx
-import { useAuiState as useAuiState3 } from "@assistant-ui/react";
-import { jsx as jsx38 } from "react/jsx-runtime";
+import { useAuiState as useAuiState4 } from "@assistant-ui/react";
+import { jsx as jsx41 } from "react/jsx-runtime";
 function MessageImageContainer() {
+  const AttachmentCard2 = useSlot("AttachmentCard");
   const AttachmentPreviewDialog2 = useSlot("AttachmentPreviewDialog");
-  const image = useAuiState3((s) => s.part.type === "image" ? s.part.image : "");
-  const filename = useAuiState3(
+  const image = useAuiState4((s) => s.part.type === "image" ? s.part.image : "");
+  const filename = useAuiState4(
     (s) => s.part.type === "image" ? s.part.filename : void 0
   );
   if (!image) {
     return null;
   }
-  const card = /* @__PURE__ */ jsx38(
-    AttachmentCard,
+  const card = /* @__PURE__ */ jsx41(
+    AttachmentCard2,
     {
       name: filename ?? "image",
       previewSrc: image,
@@ -1973,34 +1431,73 @@ function MessageImageContainer() {
       previewRem: USER_MESSAGE_ATTACHMENT_PREVIEW_REM
     }
   );
-  return /* @__PURE__ */ jsx38(AttachmentPreviewDialog2, { previewSrc: image, children: /* @__PURE__ */ jsx38("div", { className: "aui-message-image", children: card }) });
+  return /* @__PURE__ */ jsx41(AttachmentPreviewDialog2, { previewSrc: image, children: /* @__PURE__ */ jsx41("div", { className: "aui-message-image", children: card }) });
 }
 
 // src/containers/ReasoningContainer.tsx
-import { useState as useState6 } from "react";
-import { useAuiState as useAuiState4 } from "@assistant-ui/react";
-import { jsx as jsx39 } from "react/jsx-runtime";
-function ReasoningContainer({ group, children }) {
+import { useCallback as useCallback4, useRef, useState as useState4 } from "react";
+import { useAuiState as useAuiState5 } from "@assistant-ui/react";
+import { jsx as jsx42 } from "react/jsx-runtime";
+function ReasoningContainer({ group }) {
   const ReasoningCard2 = useSlot("ReasoningCard");
-  const streaming = useAuiState4((s) => {
+  const content = useAuiState5(
+    (s) => group.indices.map((i) => s.message.parts[i]).filter((p) => p != null && p.type === "reasoning").map((p) => p.text ?? "").join("")
+  );
+  const streaming = useAuiState5((s) => {
     if (s.message.status?.type !== "running") return false;
     const lastIndex = s.message.parts.length - 1;
     if (lastIndex < 0) return false;
     if (s.message.parts[lastIndex]?.type !== "reasoning") return false;
-    return lastIndex >= group.indices[0] && lastIndex <= group.indices[group.indices.length - 1];
+    const lastGroupIndex = group.indices[group.indices.length - 1];
+    return lastGroupIndex !== void 0 && lastIndex >= group.indices[0] && lastIndex <= lastGroupIndex;
   });
-  const [expanded, setExpanded] = useState6(streaming);
-  const [prevStreaming, setPrevStreaming] = useState6(streaming);
+  const [expanded, setExpanded] = useState4(streaming);
+  const [prevStreaming, setPrevStreaming] = useState4(streaming);
+  const [isMultiLine, setIsMultiLine] = useState4(false);
+  const observerRef = useRef(null);
   if (streaming !== prevStreaming) {
     setPrevStreaming(streaming);
     if (streaming) setExpanded(true);
   }
-  return /* @__PURE__ */ jsx39(ReasoningCard2, { streaming, expanded, onToggle: () => setExpanded((prev) => !prev), children });
+  const contentRef = useCallback4(
+    (node) => {
+      observerRef.current?.disconnect();
+      observerRef.current = null;
+      if (node == null || streaming) return;
+      const check = () => {
+        const lineHeight = Number.parseFloat(getComputedStyle(node).lineHeight) || 24;
+        setIsMultiLine(node.scrollHeight > lineHeight * 1.5);
+      };
+      check();
+      observerRef.current = new ResizeObserver(check);
+      observerRef.current.observe(node);
+    },
+    [streaming]
+  );
+  const reasoningTimeText = null;
+  const previewText = content.replace(/\s+/g, " ").trim();
+  const isShortText = !streaming && content.length > 0 && !isMultiLine;
+  const headingText = streaming && !content ? expanded ? "Reasoning" : "Show Reasoning" : reasoningTimeText ?? (expanded ? "Hide Reasoning" : "Show Reasoning");
+  return /* @__PURE__ */ jsx42(
+    ReasoningCard2,
+    {
+      content,
+      isStreaming: streaming,
+      expanded,
+      isMultiLine,
+      reasoningTimeText,
+      previewText,
+      headingText,
+      contentRef: isShortText ? contentRef : void 0,
+      onToggle: () => setExpanded((prev) => !prev)
+    }
+  );
 }
 
 // src/containers/ToolCallContainer.tsx
-import { useState as useState7 } from "react";
+import { useState as useState8 } from "react";
 import {
+  MessagePartPrimitive,
   MessagePrimitive,
   useToolCallElapsed
 } from "@assistant-ui/react";
@@ -2015,9 +1512,192 @@ function useNestedApprovalBridge() {
   return useContext5(NestedApprovalBridgeContext);
 }
 
+// src/containers/SandboxToolCallContainer.tsx
+import { useMemo as useMemo3, useState as useState5 } from "react";
+import { jsx as jsx43 } from "react/jsx-runtime";
+function SandboxToolCallContainer(props) {
+  const SandboxToolCallCard2 = useSlot("SandboxToolCallCard");
+  const [viewMode, setViewMode] = useState5("terminal");
+  const hasContent = useMemo3(() => {
+    if (viewMode === "code") return Boolean(props.argsJson || props.resultJson);
+    return Boolean(props.command || props.resultText || props.resultJson);
+  }, [
+    props.argsJson,
+    props.command,
+    props.resultJson,
+    props.resultText,
+    viewMode
+  ]);
+  return /* @__PURE__ */ jsx43(
+    SandboxToolCallCard2,
+    {
+      ...props,
+      viewMode,
+      hasContent,
+      onViewModeChange: setViewMode
+    }
+  );
+}
+
+// src/containers/ToolApprovalContainer.tsx
+import { useCallback as useCallback5, useMemo as useMemo4, useState as useState6 } from "react";
+import { jsx as jsx44 } from "react/jsx-runtime";
+function ToolApprovalContainer({
+  toolName = "",
+  options,
+  onSelectOption
+}) {
+  const ToolApprovalBar2 = useSlot("ToolApprovalBar");
+  const [selectedDenyOptionId, setSelectedDenyOptionId] = useState6(null);
+  const [denialReason, setDenialReason] = useState6("");
+  const [showReasonError, setShowReasonError] = useState6(false);
+  const approveOptions = useMemo4(
+    () => options.filter((option) => option.isAllow).map((option, index) => ({
+      ...option,
+      variant: index === 0 ? "primary" : "secondary",
+      requiresReason: false
+    })),
+    [options]
+  );
+  const denyOptions = useMemo4(
+    () => options.filter((option) => !option.isAllow).map((option) => ({
+      ...option,
+      variant: "secondary",
+      requiresReason: option.confirm != null
+    })),
+    [options]
+  );
+  const selectedDenyOption = denyOptions.find(
+    (option) => option.id === selectedDenyOptionId
+  );
+  const onDenyOptionChange = useCallback5((optionId) => {
+    setSelectedDenyOptionId(optionId);
+    setDenialReason("");
+    setShowReasonError(false);
+  }, []);
+  const onDenialReasonChange = useCallback5((reason) => {
+    setDenialReason(reason);
+    setShowReasonError(false);
+  }, []);
+  const onReasonSubmit = useCallback5(() => {
+    const reason = denialReason.trim();
+    if (!reason) {
+      setShowReasonError(true);
+      return;
+    }
+    if (selectedDenyOptionId) {
+      onSelectOption(selectedDenyOptionId, reason);
+      onDenyOptionChange(null);
+    }
+  }, [denialReason, onDenyOptionChange, onSelectOption, selectedDenyOptionId]);
+  return /* @__PURE__ */ jsx44(
+    ToolApprovalBar2,
+    {
+      toolName,
+      approveOptions: approveOptions.length > 0 ? approveOptions : void 0,
+      denyOptions: denyOptions.length > 0 ? denyOptions : void 0,
+      selectedDenyOption,
+      denialReason,
+      showReasonError,
+      onSelect: onSelectOption,
+      onDenyOptionChange,
+      onDenialReasonChange,
+      onReasonSubmit
+    }
+  );
+}
+
+// src/containers/ToolCallContentBlockContainer.tsx
+import { useCallback as useCallback6, useEffect as useEffect2, useRef as useRef2, useState as useState7 } from "react";
+import { jsx as jsx45 } from "react/jsx-runtime";
+function ToolCallContentBlockContainer(props) {
+  const ToolCallContentBlock2 = useSlot("ToolCallContentBlock");
+  const [fullscreen, setFullscreen] = useState7(false);
+  const [contentHeightRem, setContentHeightRem] = useState7(1.5);
+  const observerRef = useRef2(null);
+  const contentRef = useCallback6(
+    (node) => {
+      observerRef.current?.disconnect();
+      observerRef.current = null;
+      if (!props.resizable || node == null) return;
+      const updateHeight = () => setContentHeightRem(node.scrollHeight / 16);
+      updateHeight();
+      observerRef.current = new ResizeObserver(updateHeight);
+      observerRef.current.observe(node);
+    },
+    [props.resizable]
+  );
+  useEffect2(
+    () => () => {
+      observerRef.current?.disconnect();
+    },
+    []
+  );
+  return /* @__PURE__ */ jsx45(
+    ToolCallContentBlock2,
+    {
+      ...props,
+      fullscreen,
+      onFullscreenChange: setFullscreen,
+      contentHeightRem,
+      contentRef
+    }
+  );
+}
+
 // src/containers/ToolCallContainer.tsx
-import { jsx as jsx40 } from "react/jsx-runtime";
+import { jsx as jsx46 } from "react/jsx-runtime";
 var SUB_AGENT_TOOL_NAME = "create_sub_agent";
+var ASK_USER_TOOL_NAME = "ask_user_question";
+function NestedSubAgentAssistantMessage() {
+  const AssistantMessageBubble2 = useSlot("AssistantMessageBubble");
+  return /* @__PURE__ */ jsx46("div", { className: "mb-3 min-w-0", children: /* @__PURE__ */ jsx46(MessagePrimitive.Root, { "data-role": "assistant", children: /* @__PURE__ */ jsx46(AssistantMessageBubble2, { children: /* @__PURE__ */ jsx46(
+    MessagePrimitive.Parts,
+    {
+      components: {
+        Text: AssistantTextContainer,
+        Reasoning: AssistantTextContainer,
+        tools: { Fallback: ToolCallContainer }
+      }
+    }
+  ) }) }) });
+}
+function parseAskUserQuestionArgs(argsText) {
+  if (!argsText) return {};
+  try {
+    const parsed = JSON.parse(argsText);
+    if (parsed == null || typeof parsed !== "object" || Array.isArray(parsed)) {
+      return {};
+    }
+    const record = parsed;
+    const question = typeof record.question === "string" ? record.question : void 0;
+    const options = Array.isArray(record.options) ? record.options.filter(
+      (item) => typeof item === "string"
+    ) : void 0;
+    return { question, options };
+  } catch {
+    return {};
+  }
+}
+function getAskUserAnswerResult(result) {
+  if (result === void 0 || result === null) return void 0;
+  if (typeof result === "string") {
+    const trimmed = result.trim();
+    return trimmed.length > 0 ? trimmed : void 0;
+  }
+  if (typeof result === "object" && "content" in result) {
+    const content = result.content;
+    if (typeof content === "string" && content.trim()) {
+      return content.trim();
+    }
+  }
+  return void 0;
+}
+function hasPendingAskUserResponse(part) {
+  return part.interrupt != null && part.result === void 0;
+}
+var SANDBOX_TOOL_NAMES = /* @__PURE__ */ new Set(["exec", "sandbox_exec"]);
+var MCP_META_TOOLS = /* @__PURE__ */ new Set(["call_tool", "list_tools", "get_tool_info"]);
 var APPROVAL_OPTION_DEFAULT_LABELS = {
   "allow-once": "Allow",
   "allow-always": "Always allow",
@@ -2029,7 +1709,9 @@ function hasPendingToolApproval(approval) {
   return approval != null && approval.approved === void 0 && approval.resolution === void 0;
 }
 function buildApprovalOptions(options) {
-  const declared = options?.filter((o) => Object.hasOwn(APPROVAL_OPTION_DEFAULT_LABELS, o.kind));
+  const declared = options?.filter(
+    (o) => Object.hasOwn(APPROVAL_OPTION_DEFAULT_LABELS, o.kind)
+  );
   if (declared && declared.length > 0) {
     const allow = declared.filter((o) => isAllowKind(o.kind));
     const reject = declared.filter((o) => !isAllowKind(o.kind));
@@ -2041,13 +1723,13 @@ function buildApprovalOptions(options) {
       confirm: o.confirm != null ? typeof o.confirm === "object" ? o.confirm : {} : void 0
     }));
     if (reject.length === 0) {
-      mapped.push({ id: "__deny", label: "Deny", isAllow: false });
+      mapped.push({ id: "__deny", label: "Deny", isAllow: false, confirm: {} });
     }
     return mapped;
   }
   return [
     { id: "__allow", label: "Allow", isAllow: true },
-    { id: "__deny", label: "Deny", isAllow: false }
+    { id: "__deny", label: "Deny", isAllow: false, confirm: {} }
   ];
 }
 function formatDuration(ms) {
@@ -2062,8 +1744,80 @@ function toStatus(statusType) {
   if (statusType === "incomplete") return "error";
   return "running";
 }
+function parseSandboxArgs(argsText) {
+  if (!argsText) return {};
+  try {
+    const parsed = JSON.parse(argsText);
+    return {
+      command: parsed.command,
+      intent: parsed.intent,
+      argsJson: JSON.stringify(parsed, null, 2)
+    };
+  } catch {
+    return { argsJson: argsText };
+  }
+}
+function parseSandboxResult(result) {
+  if (result === void 0) return {};
+  try {
+    const parsed = JSON.parse(result);
+    const exitCode = parsed.response?.exitCode ?? null;
+    const resultText = parsed.response?.result;
+    return {
+      exitCode,
+      resultText,
+      resultJson: JSON.stringify(parsed, null, 2)
+    };
+  } catch {
+    return { resultText: result };
+  }
+}
+function parseMcpToolArgs(argsText) {
+  if (!argsText) return {};
+  try {
+    const parsed = JSON.parse(argsText);
+    return {
+      mcpServer: parsed.mcp_server,
+      innerToolName: parsed.tool_name,
+      input: parsed.input
+    };
+  } catch {
+    return {};
+  }
+}
+function getJsonDisplayValue(content) {
+  if (!content?.trim()) return { value: "", isJson: false };
+  const trimmed = content.trim();
+  if (trimmed[0] !== "{" && trimmed[0] !== "[") {
+    return { value: content, isJson: false };
+  }
+  try {
+    const parsed = JSON.parse(content);
+    return { value: JSON.stringify(parsed, null, 2), isJson: true };
+  } catch {
+    return { value: content, isJson: false };
+  }
+}
+function getToolResultContent(content) {
+  try {
+    if (!content) return { isJson: false, data: "" };
+    const parsedResult = typeof content === "string" && content.trim().startsWith("{") ? JSON.parse(content) : content;
+    if (Array.isArray(parsedResult.content)) {
+      const text = parsedResult.content[0]?.text || "";
+      const display2 = getJsonDisplayValue(
+        typeof text === "string" ? text : JSON.stringify(text)
+      );
+      return { data: display2.value, isJson: display2.isJson };
+    }
+    const display = getJsonDisplayValue(
+      typeof parsedResult === "string" ? parsedResult : JSON.stringify(parsedResult)
+    );
+    return { data: display.value, isJson: display.isJson };
+  } catch (error) {
+    return { data: String(content), isJson: false };
+  }
+}
 function ToolApprovalSlot({ part }) {
-  const ToolApprovalBar2 = useSlot("ToolApprovalBar");
   const nestedBridge = useNestedApprovalBridge();
   const respond = (response) => {
     if (nestedBridge) {
@@ -2072,33 +1826,73 @@ function ToolApprovalSlot({ part }) {
     }
     part.respondToApproval(response);
   };
-  const onSelectOption = (optionId) => {
+  const onSelectOption = (optionId, reason) => {
     if (optionId === "__allow") return respond({ approved: true });
-    if (optionId === "__deny") return respond({ approved: false });
-    return respond({ optionId });
+    if (optionId === "__deny") return respond({ approved: false, reason });
+    return respond({ optionId, reason });
   };
-  return /* @__PURE__ */ jsx40(ToolApprovalBar2, { options: buildApprovalOptions(part.approval?.options), onSelectOption });
+  return /* @__PURE__ */ jsx46(
+    ToolApprovalContainer,
+    {
+      toolName: part.toolName,
+      options: buildApprovalOptions(part.approval?.options),
+      onSelectOption
+    }
+  );
 }
 var ToolCallContainer = (part) => {
   const ToolCallCard2 = useSlot("ToolCallCard");
+  const SubAgentCard2 = useSlot("SubAgentCard");
+  const AskUserPrompt2 = useSlot("AskUserPrompt");
   const respondToNestedApproval = useTrueFoundryRespondToToolApproval();
   const elapsedMs = useToolCallElapsed();
   const isRequiresAction = part.status?.type === "requires-action";
-  const [expanded, setExpanded] = useState7(isRequiresAction);
-  const [prevRequiresAction, setPrevRequiresAction] = useState7(isRequiresAction);
+  const isSubAgent = part.toolName === SUB_AGENT_TOOL_NAME;
+  const isSandbox = SANDBOX_TOOL_NAMES.has(part.toolName);
+  const [expanded, setExpanded] = useState8(isRequiresAction || isSubAgent);
+  const [prevRequiresAction, setPrevRequiresAction] = useState8(isRequiresAction);
   if (isRequiresAction !== prevRequiresAction) {
     setPrevRequiresAction(isRequiresAction);
     if (isRequiresAction) setExpanded(true);
   }
   const showApproval = isRequiresAction && hasPendingToolApproval(part.approval);
-  const isSubAgent = part.toolName === SUB_AGENT_TOOL_NAME;
   const durationText = elapsedMs === void 0 ? void 0 : formatDuration(elapsedMs);
   const status = toStatus(part.status?.type);
+  if (part.toolName === ASK_USER_TOOL_NAME) {
+    if (hasPendingAskUserResponse(part)) {
+      return null;
+    }
+    const answer = getAskUserAnswerResult(part.result);
+    if (answer == null) {
+      return null;
+    }
+    const { question, options = [] } = parseAskUserQuestionArgs(part.argsText);
+    const isCustom = options.length > 0 && !options.includes(answer);
+    return /* @__PURE__ */ jsx46(
+      AskUserPrompt2,
+      {
+        questions: [],
+        answeredQuestions: [
+          {
+            id: part.toolCallId,
+            question: question ?? "Question",
+            options,
+            answer,
+            isCustom
+          }
+        ],
+        onSubmit: () => {
+        },
+        readOnly: true
+      }
+    );
+  }
   if (isSubAgent) {
+    const artifactSubAgent = part.artifact?.subAgents?.[0];
     const firstNested = part.messages?.[0];
     const subAgent = firstNested?.metadata?.custom?.subAgent;
-    const agentName = subAgent?.title ?? subAgent?.name ?? part.toolName;
-    const instruction = subAgent?.input ?? "";
+    const agentName = subAgent?.title ?? subAgent?.name ?? artifactSubAgent?.title ?? artifactSubAgent?.agentInfo?.name ?? part.toolName;
+    const instruction = subAgent?.input ?? artifactSubAgent?.agentInfo?.input ?? "";
     const stepCount = part.messages?.length ?? 0;
     const bridge = (response) => {
       if (part.approval == null) return;
@@ -2106,51 +1900,223 @@ var ToolCallContainer = (part) => {
       if (approved === void 0) return;
       respondToNestedApproval({ approvalId: part.approval.id, approved });
     };
-    return /* @__PURE__ */ jsx40(
-      ToolCallCard2,
+    return /* @__PURE__ */ jsx46(
+      "div",
+      {
+        "data-slot": "tool-call-card",
+        "data-variant": "sub-agent",
+        className: "w-full py-2",
+        children: /* @__PURE__ */ jsx46(
+          SubAgentCard2,
+          {
+            status,
+            expanded,
+            onToggle: () => setExpanded((prev) => !prev),
+            durationText,
+            agentName,
+            instruction,
+            stepCount,
+            children: /* @__PURE__ */ jsx46(NestedApprovalBridgeContext.Provider, { value: bridge, children: /* @__PURE__ */ jsx46(
+              MessagePartPrimitive.Messages,
+              {
+                components: {
+                  AssistantMessage: NestedSubAgentAssistantMessage,
+                  UserMessage: () => null
+                }
+              }
+            ) })
+          }
+        )
+      }
+    );
+  }
+  const resultString = part.result === void 0 ? void 0 : typeof part.result === "string" ? part.result : JSON.stringify(part.result, null, 2);
+  if (isSandbox) {
+    const { command, intent, argsJson } = parseSandboxArgs(part.argsText);
+    const { exitCode, resultText, resultJson } = parseSandboxResult(resultString);
+    return /* @__PURE__ */ jsx46(
+      SandboxToolCallContainer,
       {
-        variant: "sub-agent",
         name: part.toolName,
+        intent,
         status,
         expanded,
         onToggle: () => setExpanded((prev) => !prev),
         durationText,
-        agentName,
-        instruction,
-        stepCount,
-        children: /* @__PURE__ */ jsx40(NestedApprovalBridgeContext.Provider, { value: bridge, children: /* @__PURE__ */ jsx40(MessagePrimitive.Root, { "data-role": "assistant", children: /* @__PURE__ */ jsx40(MessagePrimitive.Parts, { components: { tools: { Fallback: ToolCallContainer } } }) }) })
+        command,
+        exitCode,
+        argsJson,
+        resultText,
+        resultJson
+      }
+    );
+  }
+  const isMcpMetaTool = MCP_META_TOOLS.has(part.toolName);
+  if (isMcpMetaTool) {
+    const { mcpServer, innerToolName, input } = parseMcpToolArgs(part.argsText);
+    const argsDisplay2 = getJsonDisplayValue(part.argsText);
+    const resultDisplay2 = getToolResultContent(part.result);
+    if (part.toolName === "list_tools" && mcpServer) {
+      return /* @__PURE__ */ jsx46(
+        ToolCallCard2,
+        {
+          toolName: `Listing tools \xB7 ${mcpServer}`,
+          icon: "mcp-server",
+          expanded,
+          onToggle: () => setExpanded((prev) => !prev),
+          awaiting: status === "running",
+          awaitingText: durationText ?? "Awaiting Response\u2026",
+          showResponseLine: status !== "running" && !!resultDisplay2.data,
+          mcpServerName: mcpServer,
+          requestSlot: argsDisplay2.value ? /* @__PURE__ */ jsx46(
+            ToolCallContentBlockContainer,
+            {
+              title: "Request",
+              content: argsDisplay2.value,
+              isJson: argsDisplay2.isJson,
+              maxHeight: "10.5rem"
+            }
+          ) : resultDisplay2.data ? /* @__PURE__ */ jsx46(
+            ToolCallContentBlockContainer,
+            {
+              title: "Request",
+              content: "{}",
+              isJson: true,
+              maxHeight: "10.5rem"
+            }
+          ) : void 0,
+          responseSlot: resultDisplay2.data ? /* @__PURE__ */ jsx46(
+            ToolCallContentBlockContainer,
+            {
+              title: "Response",
+              content: resultDisplay2.data,
+              isJson: resultDisplay2.isJson,
+              resizable: true
+            }
+          ) : void 0
+        }
+      );
+    }
+    let displayName = part.toolName;
+    if (part.toolName === "call_tool" && innerToolName) {
+      displayName = mcpServer ? `call_tool: ${innerToolName} (${mcpServer})` : `call_tool: ${innerToolName}`;
+    } else if (part.toolName === "get_tool_info" && innerToolName && mcpServer) {
+      displayName = `get_tool_info: ${innerToolName} (${mcpServer})`;
+    }
+    const inputDisplay = input !== void 0 ? getJsonDisplayValue(JSON.stringify(input, null, 2)) : argsDisplay2;
+    return /* @__PURE__ */ jsx46(
+      ToolCallCard2,
+      {
+        toolName: displayName,
+        icon: "mcp-server",
+        expanded,
+        onToggle: () => setExpanded((prev) => !prev),
+        awaiting: status === "running",
+        awaitingText: durationText ?? "Awaiting Response\u2026",
+        showResponseLine: status !== "running" && resultDisplay2.data !== void 0,
+        mcpServerName: mcpServer,
+        requestSlot: inputDisplay.value ? /* @__PURE__ */ jsx46(
+          ToolCallContentBlockContainer,
+          {
+            title: "Request",
+            content: inputDisplay.value,
+            isJson: inputDisplay.isJson,
+            maxHeight: "10.5rem"
+          }
+        ) : resultDisplay2.data !== void 0 ? /* @__PURE__ */ jsx46(
+          ToolCallContentBlockContainer,
+          {
+            title: "Request",
+            content: "{}",
+            isJson: true,
+            maxHeight: "10.5rem"
+          }
+        ) : void 0,
+        responseSlot: resultDisplay2.data !== void 0 ? /* @__PURE__ */ jsx46(
+          ToolCallContentBlockContainer,
+          {
+            title: "Response",
+            content: resultDisplay2.data,
+            isJson: resultDisplay2.isJson,
+            resizable: true
+          }
+        ) : void 0,
+        approvalSlot: showApproval ? /* @__PURE__ */ jsx46(ToolApprovalSlot, { part }) : void 0
       }
     );
   }
-  return /* @__PURE__ */ jsx40(
+  const argsDisplay = getJsonDisplayValue(part.argsText);
+  const resultDisplay = getToolResultContent(part.result);
+  return /* @__PURE__ */ jsx46(
     ToolCallCard2,
     {
-      variant: "tool",
-      name: part.toolName,
-      status,
+      toolName: part.toolName,
       expanded,
       onToggle: () => setExpanded((prev) => !prev),
-      durationText,
-      argsText: part.argsText,
-      result: part.result === void 0 ? void 0 : typeof part.result === "string" ? part.result : JSON.stringify(part.result, null, 2),
-      isError: part.isError,
-      approvalSlot: showApproval ? /* @__PURE__ */ jsx40(ToolApprovalSlot, { part }) : void 0
+      awaiting: status === "running",
+      awaitingText: durationText ?? "Awaiting Response\u2026",
+      showResponseLine: status !== "running" && resultDisplay.data !== void 0,
+      requestSlot: argsDisplay.value ? /* @__PURE__ */ jsx46(
+        ToolCallContentBlockContainer,
+        {
+          title: "Request",
+          content: argsDisplay.value,
+          isJson: argsDisplay.isJson,
+          maxHeight: "10.5rem"
+        }
+      ) : resultDisplay.data !== void 0 ? /* @__PURE__ */ jsx46(
+        ToolCallContentBlockContainer,
+        {
+          title: "Request",
+          content: "{}",
+          isJson: true,
+          maxHeight: "10.5rem"
+        }
+      ) : void 0,
+      responseSlot: resultDisplay.data !== void 0 ? /* @__PURE__ */ jsx46(
+        ToolCallContentBlockContainer,
+        {
+          title: "Response",
+          content: resultDisplay.data,
+          isJson: resultDisplay.isJson,
+          resizable: true
+        }
+      ) : void 0,
+      approvalSlot: showApproval ? /* @__PURE__ */ jsx46(ToolApprovalSlot, { part }) : void 0
     }
   );
 };
 
 // src/containers/ToolGroupContainer.tsx
-import { useState as useState8 } from "react";
-import { jsx as jsx41 } from "react/jsx-runtime";
-function ToolGroupContainer({ group, children }) {
+import { useState as useState9 } from "react";
+import { useAuiState as useAuiState6 } from "@assistant-ui/react";
+import { jsx as jsx47 } from "react/jsx-runtime";
+function ToolGroupContainer({
+  children,
+  group
+}) {
   const ToolGroupCard2 = useSlot("ToolGroupCard");
-  const [expanded, setExpanded] = useState8(true);
-  return /* @__PURE__ */ jsx41(
+  const toolCallCount = group.indices.length;
+  const active = useAuiState6((s) => {
+    if (s.message.status?.type !== "running") return false;
+    const lastIndex = s.message.parts.length - 1;
+    if (lastIndex < 0) return false;
+    if (s.message.parts[lastIndex]?.type !== "tool-call") return false;
+    const lastGroupIndex = group.indices[group.indices.length - 1];
+    return lastGroupIndex !== void 0 && lastIndex >= group.indices[0] && lastIndex <= lastGroupIndex;
+  });
+  const [expanded, setExpanded] = useState9(true);
+  const [prevActive, setPrevActive] = useState9(active);
+  if (active !== prevActive) {
+    setPrevActive(active);
+    if (active) setExpanded(true);
+  }
+  return /* @__PURE__ */ jsx47(
     ToolGroupCard2,
     {
-      toolCallCount: group.indices.length,
-      active: group.status.type === "running",
+      toolCallCount,
       expanded,
+      active,
       onToggle: () => setExpanded((prev) => !prev),
       children
     }
@@ -2158,66 +2124,36 @@ function ToolGroupContainer({ group, children }) {
 }
 
 // src/containers/AssistantMessageContainer.tsx
-import { jsx as jsx42 } from "react/jsx-runtime";
+import { jsx as jsx48 } from "react/jsx-runtime";
 function AssistantLeafPartContainer({ part }) {
   switch (part.type) {
     case "text":
     case "reasoning":
-      return /* @__PURE__ */ jsx42(AssistantTextContainer, {});
+      return /* @__PURE__ */ jsx48(AssistantTextContainer, {});
     case "image":
-      return /* @__PURE__ */ jsx42(MessageImageContainer, {});
+      return /* @__PURE__ */ jsx48(MessageImageContainer, {});
     case "tool-call":
-      return /* @__PURE__ */ jsx42(ToolCallContainer, { ...part });
+      return /* @__PURE__ */ jsx48(ToolCallContainer, { ...part });
     default:
       return null;
   }
 }
-function downloadMarkdown(text) {
-  if (typeof document === "undefined") return;
-  const blob = new Blob([text], { type: "text/markdown" });
-  const url = URL.createObjectURL(blob);
-  const anchor = document.createElement("a");
-  anchor.href = url;
-  anchor.download = "message.md";
-  anchor.click();
-  URL.revokeObjectURL(url);
-}
 function AssistantMessageContainer() {
-  const MessageBubble2 = useSlot("MessageBubble");
+  const AssistantMessageBubble2 = useSlot("AssistantMessageBubble");
   const MessageIndicator2 = useSlot("MessageIndicator");
   const MessageErrorBanner2 = useSlot("MessageErrorBanner");
   const MessageActionBar2 = useSlot("MessageActionBar");
-  const BranchIndicator2 = useSlot("BranchIndicator");
-  const aui = useAui2();
   const isRunning = useThreadIsRunning2();
   const error = useMessageError();
   const { copy, isCopied } = useActionBarCopy2({
     copyToClipboard: (text) => navigator.clipboard.writeText(text)
   });
-  const { branchNumber, branchCount, goToPrev, goToNext } = useMessageBranching();
-  return /* @__PURE__ */ jsx42(MessagePrimitive2.Root, { "data-role": "assistant", children: /* @__PURE__ */ jsx42(
-    MessageBubble2,
+  return /* @__PURE__ */ jsx48(MessagePrimitive2.Root, { "data-role": "assistant", children: /* @__PURE__ */ jsx48(
+    AssistantMessageBubble2,
     {
-      variant: "assistant",
-      error: error !== void 0 ? /* @__PURE__ */ jsx42(MessageErrorBanner2, { message: String(error) }) : void 0,
-      branchIndicator: /* @__PURE__ */ jsx42(
-        BranchIndicator2,
-        {
-          index: branchNumber,
-          count: branchCount,
-          onPrevious: goToPrev,
-          onNext: goToNext
-        }
-      ),
-      actionBar: !isRunning ? /* @__PURE__ */ jsx42(
-        MessageActionBar2,
-        {
-          isCopied,
-          onCopy: copy,
-          onExportMarkdown: () => downloadMarkdown(aui.message().getCopyText())
-        }
-      ) : void 0,
-      children: /* @__PURE__ */ jsx42(
+      error: error !== void 0 ? /* @__PURE__ */ jsx48(MessageErrorBanner2, { message: String(error) }) : void 0,
+      actionBar: !isRunning ? /* @__PURE__ */ jsx48(MessageActionBar2, { isCopied, onCopy: copy }) : void 0,
+      children: /* @__PURE__ */ jsx48(
         MessagePrimitive2.GroupedParts,
         {
           groupBy: groupPartByType({
@@ -2228,19 +2164,19 @@ function AssistantMessageContainer() {
           children: ({ part, children }) => {
             switch (part.type) {
               case "group-chainOfThought":
-                return /* @__PURE__ */ jsx42("div", { "data-slot": "aui_chain-of-thought", className: "flex flex-col gap-3", children });
+                return /* @__PURE__ */ jsx48("div", { "data-slot": "aui_chain-of-thought", className: "flex flex-col gap-3", children });
               case "group-tool":
-                return /* @__PURE__ */ jsx42(ToolGroupContainer, { group: part, children });
+                return /* @__PURE__ */ jsx48(ToolGroupContainer, { group: part, children });
               case "group-reasoning":
-                return /* @__PURE__ */ jsx42(ReasoningContainer, { group: part, children });
+                return /* @__PURE__ */ jsx48(ReasoningContainer, { group: part });
               case "text":
               case "reasoning":
               case "tool-call":
               case "image":
               case "data":
-                return /* @__PURE__ */ jsx42(AssistantLeafPartContainer, { part });
+                return /* @__PURE__ */ jsx48(AssistantLeafPartContainer, { part });
               case "indicator":
-                return /* @__PURE__ */ jsx42(MessageIndicator2, {});
+                return /* @__PURE__ */ jsx48(MessageIndicator2, {});
               default:
                 return null;
             }
@@ -2255,22 +2191,22 @@ function AssistantMessageContainer() {
 import {
   ComposerPrimitive as ComposerPrimitive2,
   MessagePrimitive as MessagePrimitive4,
-  useAuiState as useAuiState7
+  useAuiState as useAuiState9
 } from "@assistant-ui/react";
-import { useThreadIsRunning as useThreadIsRunning3 } from "@assistant-ui/core/react";
+import { useComposerCancel, useComposerSend, useThreadIsRunning as useThreadIsRunning3 } from "@assistant-ui/core/react";
 
 // src/containers/AttachmentsContainer.tsx
-import { ComposerPrimitive, MessagePrimitive as MessagePrimitive3, useAui as useAui3, useAuiState as useAuiState6 } from "@assistant-ui/react";
+import { ComposerPrimitive, MessagePrimitive as MessagePrimitive3, useAui, useAuiState as useAuiState8 } from "@assistant-ui/react";
 
 // src/containers/useAttachmentPreviewSrc.ts
-import { useEffect as useEffect2, useState as useState9 } from "react";
-import { useAuiState as useAuiState5 } from "@assistant-ui/react";
+import { useEffect as useEffect3, useState as useState10 } from "react";
+import { useAuiState as useAuiState7 } from "@assistant-ui/react";
 function isImageAttachment(type, contentType) {
   return type === "image" || (contentType?.startsWith("image/") ?? false);
 }
 function useFileObjectUrl(file) {
-  const [src, setSrc] = useState9(void 0);
-  useEffect2(() => {
+  const [src, setSrc] = useState10(void 0);
+  useEffect3(() => {
     if (!file) {
       setSrc(void 0);
       return;
@@ -2282,10 +2218,10 @@ function useFileObjectUrl(file) {
   return src;
 }
 function useAttachmentPreviewSrc() {
-  const type = useAuiState5((s) => s.attachment.type);
-  const contentType = useAuiState5((s) => s.attachment.contentType);
-  const file = useAuiState5((s) => "file" in s.attachment ? s.attachment.file : void 0);
-  const contentSrc = useAuiState5((s) => {
+  const type = useAuiState7((s) => s.attachment.type);
+  const contentType = useAuiState7((s) => s.attachment.contentType);
+  const file = useAuiState7((s) => "file" in s.attachment ? s.attachment.file : void 0);
+  const contentSrc = useAuiState7((s) => {
     if (!isImageAttachment(s.attachment.type, s.attachment.contentType)) return void 0;
     const imagePart = s.attachment.content?.find((part) => part.type === "image");
     if (imagePart?.type === "image" && imagePart.image) return imagePart.image;
@@ -2298,17 +2234,17 @@ function useAttachmentPreviewSrc() {
 }
 
 // src/containers/AttachmentsContainer.tsx
-import { jsx as jsx43 } from "react/jsx-runtime";
+import { jsx as jsx49 } from "react/jsx-runtime";
 function ComposerAttachmentItem() {
   const AttachmentCard2 = useSlot("AttachmentCard");
   const AttachmentPreviewDialog2 = useSlot("AttachmentPreviewDialog");
-  const aui = useAui3();
-  const name = useAuiState6((s) => s.attachment.name);
-  const contentType = useAuiState6((s) => s.attachment.contentType);
-  const type = useAuiState6((s) => s.attachment.type);
+  const aui = useAui();
+  const name = useAuiState8((s) => s.attachment.name);
+  const contentType = useAuiState8((s) => s.attachment.contentType);
+  const type = useAuiState8((s) => s.attachment.type);
   const isImage = isImageAttachment(type, contentType);
   const previewSrc = useAttachmentPreviewSrc();
-  return /* @__PURE__ */ jsx43(AttachmentPreviewDialog2, { previewSrc, children: /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx49(AttachmentPreviewDialog2, { previewSrc, children: /* @__PURE__ */ jsx49(
     AttachmentCard2,
     {
       name,
@@ -2323,12 +2259,12 @@ function ComposerAttachmentItem() {
 function MessageAttachmentItem() {
   const AttachmentCard2 = useSlot("AttachmentCard");
   const AttachmentPreviewDialog2 = useSlot("AttachmentPreviewDialog");
-  const name = useAuiState6((s) => s.attachment.name);
-  const contentType = useAuiState6((s) => s.attachment.contentType);
-  const type = useAuiState6((s) => s.attachment.type);
+  const name = useAuiState8((s) => s.attachment.name);
+  const contentType = useAuiState8((s) => s.attachment.contentType);
+  const type = useAuiState8((s) => s.attachment.type);
   const isImage = isImageAttachment(type, contentType);
   const previewSrc = useAttachmentPreviewSrc();
-  const card = /* @__PURE__ */ jsx43(
+  const card = /* @__PURE__ */ jsx49(
     AttachmentCard2,
     {
       name,
@@ -2340,122 +2276,120 @@ function MessageAttachmentItem() {
     }
   );
   if (isImage && previewSrc) {
-    return /* @__PURE__ */ jsx43(AttachmentPreviewDialog2, { previewSrc, children: card });
+    return /* @__PURE__ */ jsx49(AttachmentPreviewDialog2, { previewSrc, children: card });
   }
   return card;
 }
 function ComposerAttachmentsContainer() {
-  return /* @__PURE__ */ jsx43("div", { className: "aui-composer-attachments flex w-full flex-row flex-wrap items-center gap-2 empty:hidden", children: /* @__PURE__ */ jsx43(ComposerPrimitive.Attachments, { children: () => /* @__PURE__ */ jsx43(ComposerAttachmentItem, {}) }) });
+  return /* @__PURE__ */ jsx49("div", { className: "aui-composer-attachments flex w-full flex-row flex-wrap items-center gap-2 empty:hidden", children: /* @__PURE__ */ jsx49(ComposerPrimitive.Attachments, { children: () => /* @__PURE__ */ jsx49(ComposerAttachmentItem, {}) }) });
 }
 function MessageAttachmentsContainer() {
-  return /* @__PURE__ */ jsx43("div", { className: "aui-user-message-attachments-end col-span-full col-start-1 row-start-1 flex w-full flex-row justify-end gap-2", children: /* @__PURE__ */ jsx43(MessagePrimitive3.Attachments, { children: () => /* @__PURE__ */ jsx43(MessageAttachmentItem, {}) }) });
+  return /* @__PURE__ */ jsx49("div", { className: "aui-user-message-attachments-end col-span-full col-start-1 row-start-1 flex w-full flex-row justify-end gap-2", children: /* @__PURE__ */ jsx49(MessagePrimitive3.Attachments, { children: () => /* @__PURE__ */ jsx49(MessageAttachmentItem, {}) }) });
 }
 function ComposerAttachmentPickerContainer() {
   const AttachmentPickerButton2 = useSlot("AttachmentPickerButton");
-  return /* @__PURE__ */ jsx43(ComposerPrimitive.AddAttachment, { asChild: true, children: /* @__PURE__ */ jsx43(AttachmentPickerButton2, {}) });
+  return /* @__PURE__ */ jsx49(ComposerPrimitive.AddAttachment, { asChild: true, children: /* @__PURE__ */ jsx49(AttachmentPickerButton2, {}) });
 }
 
 // src/containers/UserEditComposerContainer.tsx
-import { jsx as jsx44, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs16 } from "react/jsx-runtime";
 function ReadOnlyMessageAttachments() {
-  const hasAttachments = useAuiState7(
+  const hasAttachments = useAuiState9(
     (s) => (s.message.attachments?.length ?? 0) > 0
   );
   if (!hasAttachments) {
     return null;
   }
-  return /* @__PURE__ */ jsx44("div", { className: "pointer-events-none opacity-90", children: /* @__PURE__ */ jsx44(MessageAttachmentsContainer, {}) });
+  return /* @__PURE__ */ jsx50("div", { className: "pointer-events-none mb-2 opacity-90", children: /* @__PURE__ */ jsx50(MessageAttachmentsContainer, {}) });
 }
 function UserEditComposerContainer() {
-  const Button2 = useSlot("Button");
+  const Button4 = useSlot("Button");
+  const MessageTimestamp2 = useSlot("MessageTimestamp");
+  const UserMessageEdit3 = useSlot("UserMessageEdit");
   const isRunning = useThreadIsRunning3();
-  return /* @__PURE__ */ jsx44(MessagePrimitive4.Root, { "data-role": "user", children: /* @__PURE__ */ jsxs25(
+  const { cancel, disabled: cancelDisabled } = useComposerCancel();
+  const { send, disabled: sendDisabled } = useComposerSend();
+  return /* @__PURE__ */ jsx50(MessagePrimitive4.Root, { "data-role": "user", children: /* @__PURE__ */ jsx50(
     "div",
     {
       "data-slot": "aui_user-edit-composer-root",
-      className: "fade-in slide-in-from-bottom-1 animate-in grid auto-rows-auto grid-cols-[minmax(72px,1fr)_auto] content-start gap-y-2 px-2 duration-150 [&:where(>*)]:col-start-2",
-      children: [
-        /* @__PURE__ */ jsx44(ReadOnlyMessageAttachments, {}),
-        /* @__PURE__ */ jsx44(ComposerPrimitive2.Root, { asChild: true, children: /* @__PURE__ */ jsx44("div", { className: "aui-user-edit-composer col-start-2 min-w-0", children: /* @__PURE__ */ jsxs25("div", { className: "ring-primary/60 bg-muted rounded-xl px-4 py-3 ring-2", children: [
-          /* @__PURE__ */ jsx44(
+      className: "fade-in slide-in-from-bottom-1 animate-in flex w-full justify-end px-2 duration-150",
+      children: /* @__PURE__ */ jsx50(ComposerPrimitive2.Root, { asChild: true, children: /* @__PURE__ */ jsx50(
+        UserMessageEdit3,
+        {
+          timestamp: /* @__PURE__ */ jsx50(MessageTimestamp2, { className: "text-gray-500" }),
+          attachments: /* @__PURE__ */ jsx50(ReadOnlyMessageAttachments, {}),
+          input: /* @__PURE__ */ jsx50("div", { className: "mt-1 rounded border border-gray-250 bg-gray-100 p-2 text-gray-750 dark:border-gray-275 dark:bg-gray-275", children: /* @__PURE__ */ jsx50(
             ComposerPrimitive2.Input,
             {
               disabled: isRunning,
-              className: "placeholder:text-muted-foreground/80 max-h-32 min-h-10 w-full resize-none bg-transparent text-base outline-none"
+              className: "max-h-32 min-h-10 w-full resize-none border-none bg-transparent p-0 text-base leading-[1.34] outline-none focus:shadow-none"
             }
-          ),
-          /* @__PURE__ */ jsxs25("div", { className: "mt-3 flex items-end justify-between gap-3", children: [
-            /* @__PURE__ */ jsxs25("p", { className: "text-muted-foreground text-xs", children: [
-              /* @__PURE__ */ jsx44("kbd", { className: "bg-background/60 rounded border px-1 py-0.5 font-sans text-[10px]", children: "Enter" }),
-              " ",
-              "to save",
-              " ",
-              /* @__PURE__ */ jsx44("kbd", { className: "bg-background/60 rounded border px-1 py-0.5 font-sans text-[10px]", children: "Esc" }),
-              " ",
-              "to cancel"
-            ] }),
-            /* @__PURE__ */ jsxs25("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx44(ComposerPrimitive2.Cancel, { asChild: true, children: /* @__PURE__ */ jsx44(
-                Button2,
-                {
-                  type: "button",
-                  variant: "ghost",
-                  size: "sm",
-                  className: "text-muted-foreground h-8 px-2",
-                  children: "Cancel"
-                }
-              ) }),
-              /* @__PURE__ */ jsx44(ComposerPrimitive2.Send, { asChild: true, children: /* @__PURE__ */ jsx44(
-                Button2,
-                {
-                  type: "button",
-                  size: "sm",
-                  className: cn("h-8 rounded-lg px-3"),
-                  disabled: isRunning,
-                  children: "Send"
-                }
-              ) })
-            ] })
+          ) }),
+          footer: /* @__PURE__ */ jsxs16("div", { className: "flex items-center justify-end gap-2", children: [
+            /* @__PURE__ */ jsx50(
+              Button4.Secondary,
+              {
+                type: "button",
+                disabled: cancelDisabled,
+                onClick: cancel,
+                text: "Cancel"
+              }
+            ),
+            /* @__PURE__ */ jsx50(
+              Button4.Primary,
+              {
+                type: "button",
+                disabled: sendDisabled || isRunning,
+                onClick: () => send(),
+                text: "Save & Rerun"
+              }
+            )
           ] })
-        ] }) }) })
-      ]
+        }
+      ) })
     }
   ) });
 }
 
 // src/containers/UserMessageContainer.tsx
-import { MessagePrimitive as MessagePrimitive5 } from "@assistant-ui/react";
+import { MessagePrimitive as MessagePrimitive5, useAuiState as useAuiState10 } from "@assistant-ui/react";
 import { useThreadIsRunning as useThreadIsRunning4 } from "@assistant-ui/core/react";
-import { jsx as jsx45 } from "react/jsx-runtime";
+import { jsx as jsx51 } from "react/jsx-runtime";
 function UserMessageContainer() {
-  const MessageBubble2 = useSlot("MessageBubble");
+  const UserMessageBubble2 = useSlot("UserMessageBubble");
   const UserMessageActionBar2 = useSlot("UserMessageActionBar");
   const isRunning = useThreadIsRunning4();
-  return /* @__PURE__ */ jsx45(MessagePrimitive5.Root, { "data-role": "user", children: /* @__PURE__ */ jsx45(
-    MessageBubble2,
+  const text = useAuiState10(
+    (s) => s.message.content.filter((part) => part.type === "text").map((part) => part.text).join("\n")
+  );
+  return /* @__PURE__ */ jsx51(MessagePrimitive5.Root, { "data-role": "user", children: /* @__PURE__ */ jsx51(
+    UserMessageBubble2,
     {
-      variant: "user",
-      attachments: /* @__PURE__ */ jsx45(MessageAttachmentsContainer, {}),
-      actionBar: !isRunning ? /* @__PURE__ */ jsx45(UserMessageActionBar2, {}) : void 0,
-      children: /* @__PURE__ */ jsx45(MessagePrimitive5.Parts, { components: { Text: AssistantTextContainer } })
+      text,
+      attachments: /* @__PURE__ */ jsx51(MessageAttachmentsContainer, {}),
+      editAction: !isRunning ? /* @__PURE__ */ jsx51(UserMessageActionBar2, {}) : void 0
     }
   ) });
 }
 
 // src/containers/ThreadContainer.tsx
-import { jsx as jsx46, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs17 } from "react/jsx-runtime";
 var isNewChatView = (s) => s.thread.messages.length === 0 && (!s.thread.isLoading || s.threads.isLoading);
 function ThreadMessage({ isEditing }) {
-  const role = useAuiState8((s) => s.message.role);
+  const role = useAuiState11((s) => s.message.role);
   if (role === "user") {
     if (isEditing) {
-      return /* @__PURE__ */ jsx46(UserEditComposerContainer, {});
+      return /* @__PURE__ */ jsx52(UserEditComposerContainer, {});
     }
-    return /* @__PURE__ */ jsx46(UserMessageContainer, {});
+    return /* @__PURE__ */ jsx52(UserMessageContainer, {});
   }
-  return /* @__PURE__ */ jsx46(AssistantMessageContainer, {});
+  return /* @__PURE__ */ jsx52(AssistantMessageContainer, {});
 }
 function ThreadContainer({ composer }) {
+  useEffect4(() => {
+    void preloadMarkdownOpenUI();
+  }, []);
   const ThreadRootShell2 = useSlot("ThreadRootShell");
   const ThreadViewportShell2 = useSlot("ThreadViewportShell");
   const ThreadComposerAreaShell2 = useSlot("ThreadComposerAreaShell");
@@ -2463,64 +2397,139 @@ function ThreadContainer({ composer }) {
   const WelcomeScreen2 = useSlot("WelcomeScreen");
   const MessageListSkeleton2 = useSlot("MessageListSkeleton");
   const ScrollToBottomButton2 = useSlot("ScrollToBottomButton");
-  const isEmpty = useAuiState8(isNewChatView);
-  const isLoading = useAuiState8((s) => s.thread.isLoading);
-  return /* @__PURE__ */ jsx46(ComposerBusyProvider, { children: /* @__PURE__ */ jsx46(ThreadPrimitive.Root, { asChild: true, children: /* @__PURE__ */ jsxs26(ThreadRootShell2, { children: [
-    /* @__PURE__ */ jsx46(ThreadPrimitive.Viewport, { asChild: true, turnAnchor: "top", autoScroll: true, children: /* @__PURE__ */ jsxs26(ThreadViewportShell2, { isEmpty, children: [
-      isEmpty && /* @__PURE__ */ jsx46(WelcomeScreen2, {}),
-      isLoading ? /* @__PURE__ */ jsx46(MessageListSkeleton2, {}) : /* @__PURE__ */ jsx46(MessageGroup2, { children: /* @__PURE__ */ jsx46(ThreadPrimitive.Messages, { children: ({ message }) => /* @__PURE__ */ jsx46(
+  const isEmpty = useAuiState11(isNewChatView);
+  const isLoading = useAuiState11((s) => s.thread.isLoading);
+  return /* @__PURE__ */ jsx52(ComposerBusyProvider, { children: /* @__PURE__ */ jsx52(ThreadPrimitive.Root, { asChild: true, children: /* @__PURE__ */ jsxs17(ThreadRootShell2, { children: [
+    /* @__PURE__ */ jsx52(ThreadPrimitive.Viewport, { asChild: true, turnAnchor: "top", autoScroll: true, children: /* @__PURE__ */ jsxs17(ThreadViewportShell2, { isEmpty, children: [
+      isEmpty && /* @__PURE__ */ jsx52(WelcomeScreen2, {}),
+      isLoading ? /* @__PURE__ */ jsx52(MessageListSkeleton2, {}) : /* @__PURE__ */ jsx52(MessageGroup2, { children: /* @__PURE__ */ jsx52(ThreadPrimitive.Messages, { children: ({ message }) => /* @__PURE__ */ jsx52(
         ThreadMessage,
         {
           isEditing: message.role === "user" && message.composer.isEditing
         }
       ) }) })
     ] }) }),
-    !isLoading && /* @__PURE__ */ jsxs26(ThreadComposerAreaShell2, { isEmpty, children: [
-      /* @__PURE__ */ jsx46(ThreadPrimitive.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ jsx46(ScrollToBottomButton2, {}) }),
+    !isLoading && /* @__PURE__ */ jsxs17(ThreadComposerAreaShell2, { isEmpty, children: [
+      !isEmpty && /* @__PURE__ */ jsx52(ThreadPrimitive.ScrollToBottom, { asChild: true, children: /* @__PURE__ */ jsx52(ScrollToBottomButton2, {}) }),
       composer
     ] })
   ] }) }) });
 }
 
 // src/containers/ComposerContainer.tsx
-import { useRef } from "react";
-import { useAui as useAui4, useAuiState as useAuiState9 } from "@assistant-ui/react";
-import { useTrueFoundryCancel, useTrueFoundryToolResponses as useTrueFoundryToolResponses2 } from "@truefoundry/assistant-ui-runtime";
+import { useRef as useRef3 } from "react";
+import { useAui as useAui2, useAuiState as useAuiState13 } from "@assistant-ui/react";
+import { useTrueFoundryCancel } from "@truefoundry/assistant-ui-runtime";
 
-// src/containers/AskUserContainer.tsx
-import { useState as useState10 } from "react";
+// src/hooks/useComposerPauseView.ts
+import { useAuiState as useAuiState12 } from "@assistant-ui/react";
 import { useTrueFoundryToolResponses } from "@truefoundry/assistant-ui-runtime";
+function threadHasPendingMcpAuth(s) {
+  const messages = s.thread.messages;
+  const last = messages[messages.length - 1];
+  if (last?.role !== "assistant") return false;
+  if (last.status?.type !== "requires-action") return false;
+  return last.metadata?.custom?.pendingMcpAuth === true;
+}
+function useComposerPauseView() {
+  const mcpPending = useAuiState12(threadHasPendingMcpAuth);
+  const { pending: toolResponsesPending } = useTrueFoundryToolResponses();
+  if (mcpPending) {
+    return { kind: "mcp" };
+  }
+  if (toolResponsesPending.length > 0) {
+    return { kind: "ask-user" };
+  }
+  return { kind: "compose" };
+}
+
+// src/containers/AskUserContainer.tsx
+import { useTrueFoundryToolResponses as useTrueFoundryToolResponses2 } from "@truefoundry/assistant-ui-runtime";
 import { useThreadIsRunning as useThreadIsRunning5 } from "@assistant-ui/core/react";
-import { jsx as jsx47 } from "react/jsx-runtime";
-var OTHER_OPTION_ID2 = "__other";
+import { useCallback as useCallback7, useEffect as useEffect5, useMemo as useMemo5, useState as useState11 } from "react";
+import {
+  ASK_USER_CUSTOM_OPTION
+} from "tfy-web-components/components/molecules/agent-chat";
+import { jsx as jsx53 } from "react/jsx-runtime";
+var EMPTY_ANSWER = { radioValue: "", custom: "" };
 function AskUserContainer() {
   const AskUserPrompt2 = useSlot("AskUserPrompt");
-  const { pending, respond } = useTrueFoundryToolResponses();
+  const { pending, respond } = useTrueFoundryToolResponses2();
   const isRunning = useThreadIsRunning5();
-  const [selectedOptionId, setSelectedOptionId] = useState10(void 0);
-  const [otherValue, setOtherValue] = useState10("");
   const item = pending[0];
-  if (item == null) return null;
-  const options = (item.options ?? []).map((option) => ({ id: option, label: option }));
-  const allowOther = options.length === 0;
-  const onSubmit = () => {
-    const content = selectedOptionId != null && selectedOptionId !== OTHER_OPTION_ID2 ? options.find((o) => o.id === selectedOptionId)?.label ?? "" : otherValue.trim();
+  const questions = useMemo5(
+    () => item == null ? [] : [
+      {
+        id: item.toolCallId,
+        question: item.question ?? "Answer required",
+        options: item.options ?? []
+      }
+    ],
+    [item]
+  );
+  const [currentQuestionIndex, setCurrentQuestionIndex] = useState11(0);
+  const [answers, setAnswers] = useState11(
+    {}
+  );
+  useEffect5(() => {
+    setCurrentQuestionIndex(0);
+    setAnswers({});
+  }, [item?.toolCallId]);
+  const safeIndex = Math.min(
+    currentQuestionIndex,
+    Math.max(questions.length - 1, 0)
+  );
+  const currentQuestion = questions[safeIndex];
+  const currentAnswer = currentQuestion == null ? EMPTY_ANSWER : answers[currentQuestion.id] ?? EMPTY_ANSWER;
+  const getResponseForQuestion = useCallback7(
+    (questionId) => {
+      const answer = answers[questionId] ?? EMPTY_ANSWER;
+      return answer.radioValue === ASK_USER_CUSTOM_OPTION ? answer.custom.trim() : answer.radioValue.trim();
+    },
+    [answers]
+  );
+  const allQuestionsAnswered = useMemo5(
+    () => questions.every((question) => getResponseForQuestion(question.id)),
+    [getResponseForQuestion, questions]
+  );
+  const selectedResponse = currentAnswer.radioValue === ASK_USER_CUSTOM_OPTION ? currentAnswer.custom.trim() : currentAnswer.radioValue.trim();
+  const isSubmitDisabled = isRunning || currentQuestion == null || selectedResponse.length === 0;
+  const isSubmitAllDisabled = isSubmitDisabled || !allQuestionsAnswered;
+  const onCurrentAnswerChange = useCallback7(
+    (questionId, update) => {
+      setAnswers((previous) => ({
+        ...previous,
+        [questionId]: {
+          ...previous[questionId] ?? EMPTY_ANSWER,
+          ...update
+        }
+      }));
+    },
+    []
+  );
+  const onSubmit = useCallback7(() => {
+    if (item == null || !allQuestionsAnswered) return;
+    const content = getResponseForQuestion(item.toolCallId);
     if (!content) return;
     respond({ toolCallId: item.toolCallId, content });
-    setSelectedOptionId(void 0);
-    setOtherValue("");
-  };
-  return /* @__PURE__ */ jsx47(
+  }, [allQuestionsAnswered, getResponseForQuestion, item, respond]);
+  if (item == null || currentQuestion == null) return null;
+  return /* @__PURE__ */ jsx53(
     AskUserPrompt2,
     {
-      question: item.question ?? "Answer required",
-      options,
-      allowOther,
-      selectedOptionId,
-      otherValue,
-      disabled: isRunning,
-      onSelectOption: setSelectedOptionId,
-      onOtherValueChange: setOtherValue,
+      questions,
+      readOnly: isRunning,
+      currentQuestion,
+      currentQuestionIndex: safeIndex,
+      currentAnswer,
+      totalQuestions: questions.length,
+      isMultiQuestion: questions.length > 1,
+      isLastQuestion: safeIndex === questions.length - 1,
+      allQuestionsAnswered,
+      isSubmitDisabled,
+      isSubmitAllDisabled,
+      onCurrentQuestionIndexChange: setCurrentQuestionIndex,
+      onCurrentAnswerChange,
       onSubmit
     }
   );
@@ -2529,66 +2538,72 @@ function AskUserContainer() {
 // src/containers/McpAuthContainer.tsx
 import { useTrueFoundryMcpAuth } from "@truefoundry/assistant-ui-runtime";
 import { useThreadIsRunning as useThreadIsRunning6 } from "@assistant-ui/core/react";
-import { jsx as jsx48 } from "react/jsx-runtime";
+import { jsx as jsx54 } from "react/jsx-runtime";
 function McpAuthContainer() {
   const McpAuthPrompt2 = useSlot("McpAuthPrompt");
   const { pending, resume } = useTrueFoundryMcpAuth();
   const isRunning = useThreadIsRunning6();
   if (!pending) return null;
-  return /* @__PURE__ */ jsx48(
+  const handleConnect = (serverId) => {
+    const server = pending.mcpServers.find((s) => s.id === serverId);
+    if (server?.authUrl) {
+      window.open(server.authUrl, "_blank", "noopener,noreferrer");
+    }
+  };
+  return /* @__PURE__ */ jsx54(
     McpAuthPrompt2,
     {
       servers: pending.mcpServers,
-      disabled: isRunning,
-      onContinue: () => void resume()
+      onConnect: handleConnect,
+      onContinue: () => void resume(),
+      readOnly: isRunning
     }
   );
 }
 
 // src/containers/ComposerContainer.tsx
-import { Fragment as Fragment3, jsx as jsx49, jsxs as jsxs27 } from "react/jsx-runtime";
-var threadHasPendingMcpAuth = (s) => {
-  const messages = s.thread.messages;
-  const last = messages[messages.length - 1];
-  if (last?.role !== "assistant") return false;
-  if (last.status?.type !== "requires-action") return false;
-  return last.metadata?.custom?.pendingMcpAuth === true;
-};
-function ComposerContainer() {
+import { Fragment as Fragment3, jsx as jsx55, jsxs as jsxs18 } from "react/jsx-runtime";
+function ComposerContainer({
+  placeholder = "Ask anything... (Shift+Enter for new line)"
+}) {
   const ComposerShell2 = useSlot("ComposerShell");
-  const aui = useAui4();
-  const text = useAuiState9((s) => s.composer.text);
+  const aui = useAui2();
+  const text = useAuiState13((s) => s.composer.text);
   const { isBusy, send, resetBusy } = useComposerBusyState();
-  const mcpPending = useAuiState9(threadHasPendingMcpAuth);
-  const { pending: toolResponsesPending } = useTrueFoundryToolResponses2();
+  const pauseView = useComposerPauseView();
   const cancel = useTrueFoundryCancel();
-  const fileInputRef = useRef(null);
-  if (mcpPending) {
-    return /* @__PURE__ */ jsx49(McpAuthContainer, {});
+  const fileInputRef = useRef3(null);
+  if (pauseView.kind === "mcp") {
+    return /* @__PURE__ */ jsx55(McpAuthContainer, {});
   }
-  if (toolResponsesPending.length > 0) {
-    return /* @__PURE__ */ jsx49(AskUserContainer, {});
+  if (pauseView.kind === "ask-user") {
+    return /* @__PURE__ */ jsx55(AskUserContainer, {});
   }
-  return /* @__PURE__ */ jsxs27(Fragment3, { children: [
-    /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsxs18(Fragment3, { children: [
+    /* @__PURE__ */ jsx55(
       "input",
       {
         ref: fileInputRef,
         type: "file",
+        multiple: true,
         hidden: true,
         onChange: (event) => {
-          const file = event.target.files?.[0];
-          if (file) void aui.composer().addAttachment(file);
+          const files = event.target.files;
+          if (files) {
+            for (const file of files) {
+              void aui.composer().addAttachment(file);
+            }
+          }
           event.target.value = "";
         }
       }
     ),
-    /* @__PURE__ */ jsx49(
+    /* @__PURE__ */ jsx55(
       ComposerShell2,
       {
-        attachments: /* @__PURE__ */ jsx49(ComposerAttachmentsContainer, {}),
+        attachments: /* @__PURE__ */ jsx55(ComposerAttachmentsContainer, {}),
         value: text,
-        placeholder: "Ask anything... (Shift+Enter for new line)",
+        placeholder,
         disabled: isBusy,
         isRunning: isBusy,
         onValueChange: (value) => aui.composer().setText(value),
@@ -2604,27 +2619,39 @@ function ComposerContainer() {
 }
 
 // src/containers/ThreadListContainer.tsx
-import { useAui as useAui5, useAuiState as useAuiState10 } from "@assistant-ui/react";
-import { jsx as jsx50, jsxs as jsxs28 } from "react/jsx-runtime";
+import { useAui as useAui3, useAuiState as useAuiState14 } from "@assistant-ui/react";
+import { useEffect as useEffect6, useRef as useRef4 } from "react";
+import { Fragment as Fragment4, jsx as jsx56, jsxs as jsxs19 } from "react/jsx-runtime";
 function ThreadListContainer() {
   const ThreadListShell2 = useSlot("ThreadListShell");
   const ThreadListNewButton2 = useSlot("ThreadListNewButton");
   const ThreadListRow2 = useSlot("ThreadListRow");
   const ThreadListRowSkeleton2 = useSlot("ThreadListRowSkeleton");
   const ThreadListEmptyState2 = useSlot("ThreadListEmptyState");
-  const Button2 = useSlot("Button");
-  const aui = useAui5();
-  const isLoading = useAuiState10((s) => s.threads.isLoading);
-  const isLoadingMore = useAuiState10((s) => s.threads.isLoadingMore);
-  const hasMore = useAuiState10((s) => s.threads.hasMore);
-  const threadIds = useAuiState10((s) => s.threads.threadIds);
-  const threadItems = useAuiState10((s) => s.threads.threadItems);
-  const mainThreadId = useAuiState10((s) => s.threads.mainThreadId);
+  const aui = useAui3();
+  const isLoading = useAuiState14((s) => s.threads.isLoading);
+  const isLoadingMore = useAuiState14((s) => s.threads.isLoadingMore);
+  const hasMore = useAuiState14((s) => s.threads.hasMore);
+  const threadIds = useAuiState14((s) => s.threads.threadIds);
+  const threadItems = useAuiState14((s) => s.threads.threadItems);
+  const mainThreadId = useAuiState14((s) => s.threads.mainThreadId);
+  const sentinelRef = useRef4(null);
+  useEffect6(() => {
+    const node = sentinelRef.current;
+    if (!node || !hasMore) return;
+    const observer = new IntersectionObserver((entries) => {
+      if (entries.some((e) => e.isIntersecting) && hasMore && !isLoadingMore) {
+        void aui.threads().loadMore();
+      }
+    });
+    observer.observe(node);
+    return () => observer.disconnect();
+  }, [aui, hasMore, isLoadingMore]);
   const itemsById = new Map(threadItems.map((item) => [item.id, item]));
-  return /* @__PURE__ */ jsxs28(ThreadListShell2, { header: /* @__PURE__ */ jsx50(ThreadListNewButton2, { onClick: () => aui.threads().switchToNewThread() }), children: [
-    isLoading ? /* @__PURE__ */ jsx50(ThreadListRowSkeleton2, {}) : threadIds.length === 0 ? /* @__PURE__ */ jsx50(ThreadListEmptyState2, {}) : threadIds.map((id) => {
+  return /* @__PURE__ */ jsxs19(ThreadListShell2, { header: /* @__PURE__ */ jsx56(ThreadListNewButton2, { onClick: () => aui.threads().switchToNewThread() }), children: [
+    isLoading ? /* @__PURE__ */ jsx56(ThreadListRowSkeleton2, {}) : threadIds.length === 0 ? /* @__PURE__ */ jsx56(ThreadListEmptyState2, {}) : threadIds.map((id) => {
       const item = itemsById.get(id);
-      return /* @__PURE__ */ jsx50(
+      return /* @__PURE__ */ jsx56(
         ThreadListRow2,
         {
           title: item?.title ?? "New Chat",
@@ -2636,18 +2663,24 @@ function ThreadListContainer() {
         id
       );
     }),
-    !isLoading && hasMore && (isLoadingMore ? /* @__PURE__ */ jsx50(ThreadListRowSkeleton2, { count: 1 }) : /* @__PURE__ */ jsx50(Button2, { variant: "ghost", onClick: () => void aui.threads().loadMore(), children: "Load more" }))
+    !isLoading && hasMore && /* @__PURE__ */ jsxs19(Fragment4, { children: [
+      isLoadingMore && /* @__PURE__ */ jsx56(ThreadListRowSkeleton2, { count: 1 }),
+      /* @__PURE__ */ jsx56("div", { ref: sentinelRef, "aria-hidden": true })
+    ] })
   ] });
 }
 
 // src/containers/Thread.tsx
-import { jsx as jsx51 } from "react/jsx-runtime";
+import { jsx as jsx57 } from "react/jsx-runtime";
 function Thread() {
-  return /* @__PURE__ */ jsx51(ThreadContainer, { composer: /* @__PURE__ */ jsx51(ComposerContainer, {}) });
+  return /* @__PURE__ */ jsx57(ThreadContainer, { composer: /* @__PURE__ */ jsx57(ComposerContainer, {}) });
 }
 export {
+  Accordion3 as Accordion,
+  AccordionDetails3 as AccordionDetails,
+  AccordionSummary3 as AccordionSummary,
   AskUserContainer,
-  AskUserPrompt,
+  AssistantMessageBubble,
   AssistantMessageContainer,
   AssistantTextContainer,
   AttachmentCard,
@@ -2656,46 +2689,41 @@ export {
   Avatar,
   AvatarFallback,
   AvatarImage,
-  BranchIndicator,
-  Button,
-  CodeBlockHeader,
-  Collapsible,
-  CollapsibleContent,
-  CollapsibleTrigger,
+  Button3 as Button,
   ComposerAttachmentPickerContainer,
   ComposerAttachmentsContainer,
   ComposerBusyProvider,
   ComposerContainer,
+  ComposerLeftSection,
+  ComposerRightSection,
+  ComposerSendButton,
   ComposerShell,
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogOverlay,
-  DialogPortal,
-  DialogTitle,
-  DialogTrigger,
+  DestructiveButton,
+  default5 as Dialog,
   ErrorToasterProvider,
-  IconButton,
+  GhostButton,
+  default2 as IconButton,
+  default3 as IconProvider,
+  LightTooltip2 as LightTooltip,
   Markdown,
   McpAuthContainer,
-  McpAuthPrompt,
   MessageActionBar,
   MessageAttachmentsContainer,
-  MessageBubble,
   MessageErrorBanner,
   MessageGroup,
   MessageIndicator,
   MessageListSkeleton,
-  OpenUIBlock,
-  ReasoningCard,
+  MessageTimestamp,
+  default4 as Modal,
+  PrimaryButton,
   ReasoningContainer,
-  SandboxArtifactList,
+  SandboxToolCallCard,
   ScrollToBottomButton,
-  Skeleton,
+  SecondaryButton,
+  default6 as Skeleton,
   SlotsProvider,
+  SubAgentCard,
+  TertiaryButton,
   Thread,
   ThreadComposerAreaShell,
   ThreadContainer,
@@ -2711,26 +2739,31 @@ export {
   ToastStack,
   TokensProvider,
   ToolApprovalBar,
+  ToolApprovalContainer,
   ToolCallCard,
   ToolCallContainer,
+  ToolCallContentBlock,
+  ToolCallContentBlockContainer,
   ToolGroupCard,
   ToolGroupContainer,
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
   USER_MESSAGE_ATTACHMENT_PREVIEW_REM,
   UserEditComposerContainer,
   UserMessageActionBar,
+  UserMessageBubble,
   UserMessageContainer,
+  UserMessageEdit,
   WelcomeScreen,
-  buttonVariants,
   defaultSlots,
   defaultTokens,
+  registerIcons2 as registerIcons,
+  registerImgIcons,
+  threadHasPendingMcpAuth,
   useComposerBusyState,
+  useComposerPauseView,
   useErrorToaster,
   useErrorToasterOptional,
   useSlot,
+  useThemeMode,
   useTokens
 };
 //# sourceMappingURL=index.js.map