@alexkroman1/aai-ui 3.2.0 → 5.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/dist/audio.d.ts +0 -33
  2. package/dist/audio.js +2 -20
  3. package/dist/{chat-view-C1oJxsWz.js → chat-view-CW-tZCMm.js} +1 -4
  4. package/dist/components/chat-view.js +1 -1
  5. package/dist/components/console-shell.d.ts +0 -9
  6. package/dist/components/markdown.d.ts +21 -0
  7. package/dist/components/message-list.d.ts +0 -8
  8. package/dist/components/message-list.js +3 -230
  9. package/dist/components/url-chips.d.ts +0 -15
  10. package/dist/context.d.ts +1 -1
  11. package/dist/default-client/assets/audio-Bu1LSuiR.js +1 -0
  12. package/dist/default-client/assets/{capture-processor-DYl6YIu5.js → capture-processor-ssRD81Mo.js} +1 -1
  13. package/dist/default-client/assets/index-0-DXv-S4.js +192 -0
  14. package/dist/default-client/assets/index-CRfdZPH1.css +2 -0
  15. package/dist/default-client/assets/{playback-processor-CeEGzgVT.js → playback-processor-CRwbxC1v.js} +1 -1
  16. package/dist/default-client/index.html +2 -2
  17. package/dist/define-client.d.ts +13 -2
  18. package/dist/define-client.js +120 -4
  19. package/dist/hooks.d.ts +40 -2
  20. package/dist/hooks.js +24 -1
  21. package/dist/index.d.ts +4 -4
  22. package/dist/index.js +7 -8
  23. package/dist/message-list-q2lTiFhF.js +381 -0
  24. package/dist/{session-core-DgioOYyx.js → session-core-Bjkr4PAP.js} +112 -57
  25. package/dist/session-core-audio-setup.d.ts +3 -6
  26. package/dist/session-core-messages.d.ts +2 -1
  27. package/dist/session-core-reconnect.d.ts +4 -3
  28. package/dist/session-core-types.d.ts +11 -12
  29. package/dist/session-core-url.d.ts +5 -0
  30. package/dist/session-core.d.ts +0 -1
  31. package/dist/session-core.js +1 -1
  32. package/dist/types.d.ts +18 -2
  33. package/dist/types.js +2 -2
  34. package/package.json +4 -2
  35. package/dist/default-client/assets/audio-CIZMTfDQ.js +0 -1
  36. package/dist/default-client/assets/index-BeVXjGwG.js +0 -344
  37. package/dist/default-client/assets/index-Dv-Q5VRL.css +0 -2
  38. package/dist/define-client-fjNCp9be.js +0 -150
@@ -1,2 +0,0 @@
1
- /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
2
- @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--font-weight-normal:400;--font-weight-medium:500;--tracking-wide:.025em;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--ease-in-out:cubic-bezier(.4, 0, .2, 1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--font-aai:"Monument Grotesk", "ABC Monument Grotesk", ui-sans-serif, system-ui, -apple-system, sans-serif;--font-aai-serif:"Source Serif 4", "Source Serif Pro", Charter, "Iowan Old Style", Georgia, serif;--font-aai-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--radius-aai:4px}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}html,body{margin:0;padding:0}}@layer components;@layer utilities{.collapse{visibility:collapse}.invisible{visibility:hidden}.absolute{position:absolute}.relative{position:relative}.static{position:static}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.m-0{margin:0}.mx-auto{margin-inline:auto}.mt-2{margin-top:calc(var(--spacing) * 2)}.ml-auto{margin-left:auto}.box-border{box-sizing:border-box}.block{display:block}.flex{display:flex}.grid{display:grid}.inline{display:inline}.inline-flex{display:inline-flex}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-4{height:calc(var(--spacing) * 4)}.h-9{height:calc(var(--spacing) * 9)}.h-11{height:calc(var(--spacing) * 11)}.h-\[7px\]{height:7px}.h-screen{height:100vh}.max-h-64{max-height:calc(var(--spacing) * 64)}.min-h-0{min-height:0}.min-h-5{min-height:calc(var(--spacing) * 5)}.w-1\.5{width:calc(var(--spacing) * 1.5)}.w-4{width:calc(var(--spacing) * 4)}.w-\[7px\]{width:7px}.w-fit{width:fit-content}.w-full{width:100%}.max-w-75{max-width:calc(var(--spacing) * 75)}.max-w-105{max-width:calc(var(--spacing) * 105)}.max-w-190{max-width:calc(var(--spacing) * 190)}.max-w-\[60\%\]{max-width:60%}.max-w-\[82\%\]{max-width:82%}.max-w-\[min\(78\%\,64ch\)\]{max-width:min(78%,64ch)}.min-w-0{min-width:0}.flex-1{flex:1}.shrink-0{flex-shrink:0}.rotate-90{rotate:90deg}.cursor-pointer{cursor:pointer}.\[scrollbar-width\:none\]{scrollbar-width:none}.appearance-none{appearance:none}.flex-col{flex-direction:column}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.rounded-aai{border-radius:var(--radius-aai)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-none{--tw-border-style:none;border-style:none}.bg-transparent{background-color:#0000}.p-7{padding:calc(var(--spacing) * 7)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-7{padding-inline:calc(var(--spacing) * 7)}.px-10{padding-inline:calc(var(--spacing) * 10)}.py-1{padding-block:var(--spacing)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-12{padding-block:calc(var(--spacing) * 12)}.text-center{text-align:center}.text-left{text-align:left}.font-aai{font-family:var(--font-aai)}.font-aai-mono{font-family:var(--font-aai-mono)}.font-aai-serif{font-family:var(--font-aai-serif)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.text-\[22px\]{font-size:22px}.text-\[32px\]{font-size:32px}.leading-4{--tw-leading:calc(var(--spacing) * 4);line-height:calc(var(--spacing) * 4)}.leading-\[1\.2\]{--tw-leading:1.2;line-height:1.2}.leading-\[1\.15\]{--tw-leading:1.15;line-height:1.15}.leading-\[22px\]{--tw-leading:22px;line-height:22px}.leading-\[23px\]{--tw-leading:23px;line-height:23px}.leading-\[130\%\]{--tw-leading:130%;line-height:130%}.leading-none{--tw-leading:1;line-height:1}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.tracking-\[-0\.2px\]{--tw-tracking:-.2px;letter-spacing:-.2px}.tracking-\[1\.2px\]{--tw-tracking:1.2px;letter-spacing:1.2px}.tracking-\[1\.4px\]{--tw-tracking:1.4px;letter-spacing:1.4px}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-balance{text-wrap:balance}.wrap-break-word{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.uppercase{text-transform:uppercase}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}@media (width>=40rem){.sm\:px-16{padding-inline:calc(var(--spacing) * 16)}.sm\:py-14{padding-block:calc(var(--spacing) * 14)}}}@keyframes aai-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.82)}}@keyframes aai-bounce{0%,80%,to{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}@keyframes aai-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.tool-shimmer{-webkit-text-fill-color:transparent;background:linear-gradient(90deg,currentColor 25%,#0000 50%,currentColor 75%) 0 0/200% 100%;-webkit-background-clip:text;background-clip:text;animation:2s infinite aai-shimmer}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}
@@ -1,150 +0,0 @@
1
- import { SessionProvider, ThemeProvider } from "./context.js";
2
- import { t as ChatView } from "./chat-view-C1oJxsWz.js";
3
- import { n as ToolConfigContext } from "./tool-call-block-DIxpG8GM.js";
4
- import { SidebarLayout } from "./components/sidebar-layout.js";
5
- import { StartScreen } from "./components/start-screen.js";
6
- import { t as createSessionCore } from "./session-core-DgioOYyx.js";
7
- import { CLIENT_CONFIG_PATH, ClientConfigResponseSchema } from "@alexkroman1/aai/protocol";
8
- import { createElement, useEffect, useState } from "react";
9
- import { jsx } from "react/jsx-runtime";
10
- import { flushSync } from "react-dom";
11
- import { createRoot } from "react-dom/client";
12
- //#region client-config.ts
13
- /**
14
- * Pre-connection client-config lookup.
15
- *
16
- * `GET client-config` (relative to the agent's base URL — see
17
- * `sdk/client-config.ts` in `@alexkroman1/aai`) gives the default client the
18
- * agent's display name and greeting before any connection exists. Every
19
- * failure path — network error, 404 from an older server, malformed body —
20
- * degrades to the empty default, so this lookup can never break an existing
21
- * agent.
22
- */
23
- /** Resolve a relative endpoint path against the agent's base URL. */
24
- function buildAgentUrl(platformUrl, endpointPath) {
25
- return new URL(endpointPath, platformUrl.endsWith("/") ? platformUrl : `${platformUrl}/`);
26
- }
27
- const AGENT_DEFAULT = {};
28
- /** Fetch the agent's client config; any failure yields the agent default. */
29
- async function fetchClientConfig(platformUrl, fetchFn) {
30
- const doFetch = fetchFn ?? ((input, init) => globalThis.fetch(input, init));
31
- try {
32
- const resp = await doFetch(buildAgentUrl(platformUrl, CLIENT_CONFIG_PATH).href);
33
- if (!resp.ok) return AGENT_DEFAULT;
34
- const parsed = ClientConfigResponseSchema.safeParse(await resp.json());
35
- return parsed.success ? parsed.data : AGENT_DEFAULT;
36
- } catch {
37
- return AGENT_DEFAULT;
38
- }
39
- }
40
- //#endregion
41
- //#region define-client.tsx
42
- /** @jsxImportSource react */
43
- function resolveContainer(target = "#app") {
44
- if (typeof target !== "string") return target;
45
- const el = document.querySelector(target);
46
- if (!el) throw new Error(`Element not found: ${target}`);
47
- return el;
48
- }
49
- /**
50
- * Default shell rendered in config tier.
51
- * Wraps StartScreen → (SidebarLayout →) ChatView.
52
- */
53
- function DefaultShell({ name, Sidebar, sidebarWidth }) {
54
- const chat = /* @__PURE__ */ jsx(ChatView, { title: name });
55
- return /* @__PURE__ */ jsx(StartScreen, {
56
- title: name,
57
- children: Sidebar ? /* @__PURE__ */ jsx(SidebarLayout, {
58
- sidebar: /* @__PURE__ */ jsx(Sidebar, {}),
59
- sidebarWidth,
60
- children: chat
61
- }) : chat
62
- });
63
- }
64
- /**
65
- * Config-tier root: fetches the server-declared display name via
66
- * `GET client-config` and renders the chat shell. The shell renders
67
- * immediately — optimistically — while the lookup is in flight; servers
68
- * without the endpoint (every lookup failure resolves to the empty default)
69
- * work exactly as before.
70
- */
71
- function DefaultRoot({ platformUrl, name, Sidebar, sidebarWidth }) {
72
- const [resolved, setResolved] = useState(null);
73
- useEffect(() => {
74
- let cancelled = false;
75
- fetchClientConfig(platformUrl).then((cfg) => {
76
- if (!cancelled) setResolved(cfg);
77
- });
78
- return () => {
79
- cancelled = true;
80
- };
81
- }, [platformUrl]);
82
- return /* @__PURE__ */ jsx(DefaultShell, {
83
- name: name ?? resolved?.name,
84
- Sidebar,
85
- sidebarWidth
86
- });
87
- }
88
- /**
89
- * Define and mount a client UI for a voice agent.
90
- *
91
- * **Tier 1 (config-only):** Pass options without `component` to get the
92
- * default shell (StartScreen + ChatView, optional sidebar).
93
- *
94
- * **Tier 2 (custom component):** Pass `component` to render a fully custom
95
- * root component inside the providers.
96
- *
97
- * @example Tier 1
98
- * ```tsx
99
- * client({
100
- * name: "Pizza Ordering",
101
- * theme: { bg: "#1a1a1a", primary: "#e55" },
102
- * sidebar: OrderPanel,
103
- * tools: { add_pizza: { icon: "🍕", label: "Adding pizza" } },
104
- * });
105
- * ```
106
- *
107
- * @example Tier 2
108
- * ```tsx
109
- * client({ component: MyCustomApp });
110
- * ```
111
- *
112
- * @returns A {@link ClientHandle} for cleanup.
113
- * @throws If the target element is not found in the DOM.
114
- *
115
- * @public
116
- */
117
- function client(config) {
118
- const container = resolveContainer(config.target);
119
- const platformUrl = config.platformUrl ?? globalThis.location.origin + globalThis.location.pathname;
120
- const session = createSessionCore({
121
- platformUrl,
122
- onSessionId: config.onSessionId,
123
- resumeSessionId: config.resumeSessionId,
124
- WebSocket: config.WebSocket
125
- });
126
- const rootNode = config.component ? createElement(config.component) : createElement(DefaultRoot, {
127
- platformUrl,
128
- name: config.name,
129
- Sidebar: config.sidebar,
130
- sidebarWidth: config.sidebarWidth
131
- });
132
- const toolConfig = config.tools ?? {};
133
- const root = createRoot(container);
134
- flushSync(() => {
135
- root.render(createElement(ToolConfigContext.Provider, { value: toolConfig }, createElement(ThemeProvider, { value: config.theme }, createElement(SessionProvider, { value: session }, rootNode))));
136
- });
137
- const handle = {
138
- session,
139
- dispose() {
140
- root.unmount();
141
- session[Symbol.dispose]();
142
- },
143
- [Symbol.dispose]() {
144
- handle.dispose();
145
- }
146
- };
147
- return handle;
148
- }
149
- //#endregion
150
- export { buildAgentUrl as n, fetchClientConfig as r, client as t };