@blukavantui/community 0.0.0-stage → 1.1.0

package/src/runtime/chat-widget.js

@@ -0,0 +1,630 @@
+// ../blu-grid/docs/scripts/chat/shared.js
+import { state, register } from "./kernel.js";
+var shared = state("chat", () => ({ instances: /* @__PURE__ */ new Map(), serial: 0 }));
+var uid = (prefix) => prefix + "-" + ++shared.serial;
+function node(tag, cls, text) {
+  const n = document.createElement(tag);
+  if (cls) n.className = cls;
+  if (text !== void 0) n.textContent = String(text);
+  return n;
+}
+function attr(n, name, value) {
+  n.setAttribute(name, String(value));
+  return n;
+}
+function button(label, action, cls = "blu-chat__button") {
+  const n = node("button", cls, label);
+  n.type = "button";
+  n.addEventListener("click", action);
+  return n;
+}
+function emit(s, name, ...args) {
+  if (s.dead || !s.events[name]) return;
+  try {
+    Promise.resolve(s.events[name](...args)).catch((e) => report(s, e));
+  } catch (e) {
+    report(s, e);
+  }
+}
+function report(s, e) {
+  if (s.dead) return;
+  const message = e?.message || String(e);
+  s.notice.textContent = message;
+  if (s.lastError !== message) {
+    s.lastError = message;
+    emit(s, "Error", message);
+  }
+}
+function announce(s, text) {
+  s.notice.textContent = text;
+}
+function createAPI(kind, init, update) {
+  const destroy = (key) => {
+    const s = shared.instances.get(key);
+    if (!s || s.kind !== kind) return;
+    s.dead = true;
+    s.dispose?.();
+    s.root.remove();
+    s.notice.remove();
+    if (s.host._bluChatOwner === key) delete s.host._bluChatOwner;
+    shared.instances.delete(key);
+  };
+  return register(kind, () => ({ sync(id, options = {}, events = {}, owner) {
+    const host = document.getElementById(id);
+    if (!host) return "Chat component host was not found.";
+    const key = owner || id;
+    let s = shared.instances.get(key);
+    if (s && (s.host !== host || s.kind !== kind)) {
+      s.destroy(s.key);
+      s = null;
+    }
+    const old = shared.instances.get(host._bluChatOwner);
+    if (old && old !== s) old.destroy(old.key);
+    if (!s) {
+      s = { key, host, kind, uid: uid("blu-chat"), events, options, dead: false, destroy };
+      s.root = node("div");
+      s.notice = attr(node("div", "blu-chat-sr"), "role", "status");
+      attr(s.notice, "aria-atomic", "true");
+      host.append(s.root, s.notice);
+      shared.instances.set(key, s);
+      host._bluChatOwner = key;
+      try {
+        init(s);
+      } catch (e) {
+        destroy(key);
+        throw e;
+      }
+    }
+    s.events = events;
+    s.options = options;
+    try {
+      update(s);
+      s.lastError = "";
+      host.dataset.bluRuntimeReady = "true";
+      return "";
+    } catch (e) {
+      report(s, e);
+      return e.message || String(e);
+    }
+  }, destroy }));
+}
+function array(value, name) {
+  const parsed = typeof value === "string" ? JSON.parse(value || "[]") : value || [];
+  if (!Array.isArray(parsed)) throw Error(name + " must be a list.");
+  const keys = /* @__PURE__ */ new Set();
+  return parsed.map((item) => {
+    if (!item || typeof item.Key !== "string" || !item.Key || keys.has(item.Key)) throw Error(name + " requires unique, nonempty Keys.");
+    keys.add(item.Key);
+    return item;
+  });
+}
+function safeUrl(value) {
+  try {
+    const u = new URL(String(value), document.baseURI);
+    return ["https:", "http:", "mailto:"].includes(u.protocol) ? u.href : null;
+  } catch (_) {
+    return null;
+  }
+}
+function icon(name) {
+  const paths = { Chat: "M21 11.5a8.4 8.4 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.4 8.4 0 0 1-3.8-.9L3 21l1.9-5.7a8.4 8.4 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.4 8.4 0 0 1 3.8-.9H13a8.5 8.5 0 0 1 8 8v.5Z", Plus: "M12 5v14M5 12h14", Up: "m5 12 7-7 7 7M12 5v14", Help: "M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3m.1 4h.01M22 12a10 10 0 1 1-20 0 10 10 0 0 1 20 0", Feedback: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2ZM7 8h10M7 12h6", Close: "m6 6 12 12M6 18 18 6", Expand: "M8 3H3v5m13-5h5v5M3 16v5h5m13-5v5h-5", Send: "m22 2-7 20-4-9-9-4 20-7ZM22 2 11 13", Stop: "M6 6h12v12H6Z" };
+  const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+  for (const [k, v] of Object.entries({ viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "1.8", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true", focusable: "false" })) svg.setAttribute(k, v);
+  const p = document.createElementNS(svg.namespaceURI, "path");
+  p.setAttribute("d", paths[name] || paths.Chat);
+  svg.append(p);
+  return svg;
+}
+
+// ../blu-grid/docs/scripts/chat/markdown.js
+function inline(parent, text) {
+  const pattern = /(`[^`\n]+`|\*\*[^*\n]+\*\*|\*[^*\n]+\*|\[[^\]\n]+\]\([^\s)]+\))/g;
+  let start = 0;
+  for (const match of text.matchAll(pattern)) {
+    parent.append(document.createTextNode(text.slice(start, match.index)));
+    const t = match[0];
+    let n;
+    if (t.startsWith("`")) n = node("code", "", t.slice(1, -1));
+    else if (t.startsWith("**")) n = node("strong", "", t.slice(2, -2));
+    else if (t.startsWith("*")) n = node("em", "", t.slice(1, -1));
+    else {
+      const split = t.indexOf("]("), url = safeUrl(t.slice(split + 2, -1));
+      n = node(url ? "a" : "span", "", t.slice(1, split));
+      if (url) {
+        n.href = url;
+        n.target = "_blank";
+        n.rel = "noopener noreferrer";
+      }
+    }
+    parent.append(n);
+    start = match.index + t.length;
+  }
+  parent.append(document.createTextNode(text.slice(start)));
+}
+function markdown(parent, value, enabled = true) {
+  parent.replaceChildren();
+  const text = String(value || "");
+  if (!enabled) {
+    parent.append(node("p", "", text));
+    return;
+  }
+  let code = null, lines = [], list = null;
+  const flush = () => {
+    if (code) {
+      code.textContent = lines.join("\n");
+      code = null;
+      lines = [];
+    }
+  };
+  for (const line of text.split("\n")) {
+    if (/^\s*```/.test(line)) {
+      if (code) {
+        flush();
+      } else {
+        const pre = node("pre");
+        code = node("code");
+        pre.append(code);
+        parent.append(pre);
+      }
+      list = null;
+      continue;
+    }
+    if (code) {
+      lines.push(line);
+      continue;
+    }
+    if (!line.trim()) {
+      list = null;
+      continue;
+    }
+    const bullet = /^\s*([-*]|\d+\.)\s+(.+)$/.exec(line);
+    if (bullet) {
+      const tag = /\d/.test(bullet[1]) ? "ol" : "ul";
+      if (!list || list.tagName.toLowerCase() !== tag) {
+        list = node(tag);
+        parent.append(list);
+      }
+      const li = node("li");
+      inline(li, bullet[2]);
+      list.append(li);
+      continue;
+    }
+    list = null;
+    const heading = /^#{1,6}\s+(.+)$/.exec(line);
+    const p = node(heading ? "h3" : "p");
+    inline(p, heading ? heading[1] : line);
+    parent.append(p);
+  }
+  flush();
+}
+
+// ../blu-grid/docs/scripts/chat/chat.js
+var busy = (s) => s.status === "Waiting" || s.status === "Streaming";
+function send(s, text, retry = false) {
+  if (s.options.IsDisabled || busy(s) || !text.trim()) return;
+  const limit = Math.max(1, Number(s.options.MaxLength) || 4e3);
+  if (text.length > limit) {
+    announce(s, "Message exceeds the character limit.");
+    return;
+  }
+  s.lastText = text.trim();
+  s.request = uid("chat-request");
+  s.active = s.request;
+  s.cancelled = false;
+  s.status = "Waiting";
+  s.error = "";
+  s.input.value = "";
+  s.input.style.height = "";
+  renderState(s);
+  announce(s, "Waiting for a response.");
+  emit(s, retry ? "Retry" : "Send", s.request, s.lastText);
+}
+function renderState(s) {
+  const o = s.options, isBusy = busy(s);
+  const focus = document.activeElement;
+  const restoreFocus = focus === s.send && isBusy || focus === s.stop && !isBusy || s.failure.contains(focus) && s.status !== "Error" || s.suggestions.contains(focus) && isBusy;
+  s.input.disabled = !!o.IsDisabled;
+  s.send.disabled = !!o.IsDisabled || isBusy || !s.input.value.trim();
+  s.send.hidden = isBusy;
+  s.stop.hidden = !isBusy;
+  s.stop.disabled = !!o.IsDisabled;
+  s.wait.hidden = !isBusy;
+  s.waitText.textContent = s.status === "Streaming" ? "Writing a response" : "Waiting for a response";
+  s.failure.hidden = s.status !== "Error";
+  s.errorText.textContent = s.error || "The response could not be completed.";
+  s.retry.disabled = !!o.IsDisabled || !s.lastText;
+  s.suggestions.querySelectorAll("button").forEach((b) => b.disabled = !!o.IsDisabled || isBusy);
+  attr(s.list, "aria-busy", isBusy);
+  if (restoreFocus && !s.input.disabled) s.input.focus({ preventScroll: true });
+}
+function createMessage(s, m, animate) {
+  const row = node("li", "blu-chat__message");
+  row.dataset.key = m.Key;
+  row.dataset.role = m.Role;
+  if (animate) row.classList.add("blu-chat__message--new");
+  const avatar = node("span", "blu-chat__avatar");
+  attr(avatar, "aria-hidden", "true");
+  const column = node("div", "blu-chat__message-column"), meta = node("div", "blu-chat__meta"), name = node("strong"), time = node("span"), body = node("div", "blu-chat__prose");
+  const copy = button("Copy", async () => {
+    try {
+      await navigator.clipboard.writeText(row._message.Content);
+      if (s.dead) return;
+      announce(s, "Message copied.");
+      emit(s, "Copy", row._message.Key);
+    } catch (_) {
+      announce(s, "Copy is unavailable. Select the message text to copy it.");
+    }
+  });
+  copy.classList.add("blu-chat__copy");
+  meta.append(name, time);
+  column.append(meta, body, copy);
+  row.append(avatar, column);
+  return { row, avatar, name, time, body, copy };
+}
+function renderMessages(s, messages) {
+  const bottom = s.scroller.scrollHeight - s.scroller.scrollTop - s.scroller.clientHeight < 64;
+  const focus = document.activeElement, hadFocus = s.list.contains(focus), keys = new Set(messages.map((m) => m.Key));
+  for (const [key, r] of s.rows) if (!keys.has(key)) {
+    r.row.remove();
+    s.rows.delete(key);
+  }
+  messages.forEach((m, i) => {
+    let r = s.rows.get(m.Key);
+    if (!r) {
+      r = createMessage(s, m, s.initialized && s.options.Animate !== false);
+      s.rows.set(m.Key, r);
+    }
+    r.row._message = m;
+    r.row.dataset.role = m.Role;
+    const author = m.Name || (m.Role === "User" ? "You" : m.Role === "System" ? "Notice" : s.options.AssistantName || "Assistant");
+    r.name.textContent = author;
+    r.time.textContent = m.Timestamp || "";
+    r.time.hidden = !s.options.ShowTimestamps || !m.Timestamp;
+    r.avatar.hidden = s.options.ShowAvatars === false;
+    const avatarUrl = m.AvatarUrl && safeUrl(m.AvatarUrl);
+    const avatarSignature = avatarUrl || author;
+    if (r.avatarSignature !== avatarSignature) {
+      r.avatarSignature = avatarSignature;
+      r.avatar.replaceChildren();
+      if (avatarUrl && /^https?:/.test(avatarUrl)) {
+        const img = node("img");
+        img.src = avatarUrl;
+        img.alt = "";
+        r.avatar.append(img);
+      } else r.avatar.textContent = author.slice(0, 1).toUpperCase();
+    }
+    const signature = JSON.stringify([m.Content, s.options.EnableMarkdown]);
+    if (r.signature !== signature) {
+      r.signature = signature;
+      markdown(r.body, m.Content, s.options.EnableMarkdown !== false);
+    }
+    r.copy.hidden = s.options.AllowCopy === false || !m.Content;
+    attr(r.copy, "aria-label", "Copy message from " + author);
+    if (s.list.children[i] !== r.row) s.list.insertBefore(r.row, s.list.children[i] || null);
+  });
+  s.empty.hidden = !!messages.length;
+  if (hadFocus && !focus.isConnected) s.input.focus({ preventScroll: true });
+  if (bottom || !s.initialized) {
+    s.scroller.scrollTop = s.scroller.scrollHeight;
+    s.jump.hidden = true;
+  } else s.jump.hidden = false;
+  s.initialized = true;
+}
+function installChat() {
+  return createAPI("Chat", (s) => {
+    s.root.className = "blu-chat";
+    s.rows = /* @__PURE__ */ new Map();
+    s.status = "Idle";
+    s.messages = [];
+    s.suggestionSignature = "";
+    const header = node("header", "blu-chat__header");
+    s.heading = node("h2");
+    s.subtitle = node("p");
+    const headText = node("div");
+    headText.append(s.heading, s.subtitle);
+    s.header = header;
+    header.append(headText);
+    s.scroller = attr(node("div", "blu-chat__scroll"), "tabindex", "0");
+    attr(s.scroller, "role", "region");
+    attr(s.scroller, "aria-label", "Conversation messages");
+    s.empty = node("div", "blu-chat__empty");
+    s.empty.append(icon("Chat"));
+    s.welcome = node("h3");
+    s.description = node("p");
+    s.empty.append(s.welcome, s.description);
+    s.list = attr(node("ol", "blu-chat__messages"), "aria-label", "Messages");
+    s.scroller.append(s.empty, s.list);
+    s.wait = node("div", "blu-chat__waiting");
+    const dots = node("span", "blu-chat__dots");
+    attr(dots, "aria-hidden", "true");
+    for (let i = 0; i < 3; i++) dots.append(node("i"));
+    s.waitText = node("span");
+    s.wait.append(dots, s.waitText);
+    s.wait.hidden = true;
+    s.jump = button("\u2193 Latest messages", () => {
+      s.scroller.scrollTop = s.scroller.scrollHeight;
+      s.jump.hidden = true;
+    });
+    s.jump.classList.add("blu-chat__jump");
+    s.jump.hidden = true;
+    s.scroller.addEventListener("scroll", () => {
+      if (s.scroller.scrollHeight - s.scroller.scrollTop - s.scroller.clientHeight < 64) s.jump.hidden = true;
+    });
+    s.failure = node("div", "blu-chat__failure");
+    s.errorText = node("span");
+    s.retry = button("Retry", () => send(s, s.lastText || "", true));
+    s.failure.append(s.errorText, s.retry);
+    s.failure.hidden = true;
+    s.suggestions = node("div", "blu-chat__suggestions");
+    const form = node("form", "blu-chat__composer");
+    s.input = attr(node("textarea"), "aria-label", "Message");
+    s.input.rows = 2;
+    s.input.placeholder = "Write a message\u2026";
+    const actions = node("div", "blu-chat__composer-actions");
+    s.hint = node("span", "blu-chat__hint", "Enter to send \xB7 Shift+Enter for a new line");
+    s.send = button("Send", () => {
+    });
+    s.send.replaceChildren(icon("Send"));
+    attr(s.send, "aria-label", "Send message");
+    s.send.type = "submit";
+    s.send.classList.add("blu-chat__send");
+    s.stop = button("Stop", () => {
+      const id = s.active;
+      if (!id) return;
+      s.active = null;
+      s.cancelled = true;
+      s.status = "Idle";
+      renderState(s);
+      announce(s, "Response stopped.");
+      emit(s, "Stop", id);
+      s.input.focus();
+    });
+    s.stop.prepend(icon("Stop"));
+    s.stop.hidden = true;
+    actions.append(s.hint, s.send, s.stop);
+    form.append(s.input, actions);
+    form.addEventListener("submit", (e) => {
+      e.preventDefault();
+      send(s, s.input.value);
+    });
+    s.input.addEventListener("input", () => {
+      s.input.style.height = "auto";
+      s.input.style.height = Math.min(160, s.input.scrollHeight) + "px";
+      renderState(s);
+    });
+    s.input.addEventListener("keydown", (e) => {
+      if (e.key === "Enter" && !e.shiftKey && !e.isComposing && e.keyCode !== 229) {
+        e.preventDefault();
+        send(s, s.input.value);
+      }
+    });
+    s.root.append(header, s.scroller, s.jump, s.wait, s.failure, s.suggestions, form);
+  }, (s) => {
+    const o = s.options, previousStatus = s.status;
+    const reset = s.reset !== o.ResetKey;
+    if (reset) {
+      s.request = null;
+      s.active = null;
+      s.cancelled = false;
+      s.lastText = "";
+      s.input.value = "";
+      s.initialized = false;
+      s.reset = o.ResetKey;
+      announce(s, "");
+    }
+    const response = o.ResponseRequestId || "";
+    const accept = response ? response === s.request && !s.cancelled : !s.active;
+    if (accept) {
+      const messages = array(o.MessagesJson, "Messages").map((m) => {
+        if (!["User", "Assistant", "System"].includes(m.Role) || typeof m.Content !== "string") throw Error("Each message needs Role (User, Assistant, System) and Content.");
+        return m;
+      });
+      const status = ["Waiting", "Streaming", "Error"].includes(o.Status) ? o.Status : "Idle";
+      s.messages = messages;
+      s.status = status;
+      s.error = String(o.ErrorMessage || "");
+      if (!busy(s)) s.active = null;
+    }
+    s.root.dataset.animate = String(o.Animate !== false);
+    s.root.style.height = Math.max(280, Math.min(1200, Number(o.Height) || 520)) + "px";
+    s.heading.textContent = o.Title || "Chat";
+    s.subtitle.textContent = o.Subtitle || "";
+    s.subtitle.hidden = !o.Subtitle;
+    s.header.hidden = o.ShowHeader === false;
+    attr(s.scroller, "aria-label", o.AccessibleLabel || (o.Title || "Chat") + " messages");
+    s.welcome.textContent = o.WelcomeTitle || "How can I help?";
+    s.description.textContent = o.WelcomeMessage || "Ask a question to start a conversation.";
+    s.input.placeholder = o.Placeholder || "Write a message\u2026";
+    s.input.maxLength = Math.max(1, Number(o.MaxLength) || 4e3);
+    const suggestions = array(o.SuggestionsJson, "Suggestions"), signature = JSON.stringify(suggestions);
+    if (signature !== s.suggestionSignature) {
+      s.suggestionSignature = signature;
+      s.suggestions.replaceChildren();
+      suggestions.forEach((p) => {
+        const b = button(p.Label || p.Text, () => send(s, p.Text || p.Label));
+        s.suggestions.append(b);
+      });
+    }
+    renderMessages(s, s.messages);
+    renderState(s);
+    if (previousStatus !== s.status) {
+      if (s.status === "Error") announce(s, s.error || "Response failed. Retry is available.");
+      else if (!reset && !busy(s) && busy({ status: previousStatus })) {
+        const last = [...s.messages].reverse().find((m) => m.Role === "Assistant");
+        announce(s, last ? "Assistant: " + last.Content : "Response complete.");
+      } else if (s.status === "Waiting") announce(s, "Waiting for a response.");
+    }
+  });
+}
+
+// ../blu-grid/docs/scripts/chat/float-button.js
+function syncIcon(s) {
+  const name = s.options.Icon || "Chat", url = String(s.options.IconUrl || "").trim();
+  if (s.iconName === name && s.iconUrl === url) return;
+  if (s.iconImage) s.iconImage.onload = s.iconImage.onerror = null;
+  s.iconName = name;
+  s.iconUrl = url;
+  s.iconImage = null;
+  s.glyph.replaceChildren(icon(name));
+  if (!url) return;
+  let source;
+  try {
+    source = new URL(url, document.baseURI);
+    if (!["https:", "http:"].includes(source.protocol)) throw Error();
+  } catch (_) {
+    report(s, "FloatButton IconUrl must be an HTTP(S) or relative image URL. Using the built-in Icon.");
+    return;
+  }
+  const img = node("img");
+  s.iconImage = img;
+  img.alt = "";
+  img.width = 24;
+  img.height = 24;
+  img.draggable = false;
+  img.onload = () => {
+    if (!s.dead && s.iconImage === img) s.glyph.replaceChildren(img);
+  };
+  img.onerror = () => {
+    if (!s.dead && s.iconImage === img) report(s, "FloatButton could not load IconUrl. Using the built-in Icon.");
+  };
+  img.src = source.href;
+}
+function installFloatButton() {
+  return createAPI("FloatButton", (s) => {
+    s.root.className = "blu-float";
+    s.button = button("", () => {
+      if (!s.options.IsDisabled) emit(s, "Click");
+    }, "blu-float__button");
+    s.glyph = node("span", "blu-float__icon");
+    s.label = node("span", "blu-float__label");
+    s.badge = node("span", "blu-float__badge");
+    attr(s.glyph, "aria-hidden", "true");
+    s.dispose = () => {
+      if (s.iconImage) s.iconImage.onload = s.iconImage.onerror = null;
+    };
+    attr(s.badge, "aria-hidden", "true");
+    s.button.append(s.glyph, s.label, s.badge);
+    s.root.append(s.button);
+  }, (s) => {
+    const o = s.options, label = String(o.Label || "Open chat"), placement = ["BottomLeft", "TopLeft", "TopRight"].includes(o.Placement) ? o.Placement : "BottomRight";
+    s.root.dataset.placement = placement;
+    s.root.dataset.position = o.Position === "Container" ? "Container" : "Viewport";
+    s.root.dataset.animate = String(o.Animate !== false);
+    s.root.dataset.shape = o.Shape === "Square" ? "Square" : "Circle";
+    s.root.style.setProperty("--blu-float-offset", Math.max(8, Math.min(160, Number(o.Offset) || 24)) + "px");
+    const color = String(o.Color || "Primary").toLowerCase().replace(/[^a-z]/g, "");
+    s.root.style.setProperty("--blu-float-solid", `var(--bluui-color-${color}-solid,var(--bluui-color-primary-solid,#4f46e5))`);
+    s.root.style.setProperty("--blu-float-contrast", `var(--bluui-color-${color}-contrast,#fff)`);
+    const target = o.Position === "Container" ? s.host : document.body;
+    if (s.root.parentNode !== target) target.append(s.root);
+    s.button.disabled = !!o.IsDisabled;
+    s.button.title = label;
+    const badge = Math.max(0, Math.floor(Number(o.BadgeCount) || 0));
+    attr(s.button, "aria-label", label + (badge ? `, ${badge} unread` : ""));
+    s.label.textContent = label;
+    s.label.hidden = !o.ShowLabel;
+    s.badge.textContent = badge > 99 ? "99+" : String(badge);
+    s.badge.hidden = !badge;
+    syncIcon(s);
+  });
+}
+
+// ../blu-grid/docs/scripts/chat/chat-widget.js
+function installChatWidget() {
+  const chat = installChat(), floating = installFloatButton();
+  return createAPI("ChatWidget", (s) => {
+    s.root.className = "blu-chat-widget";
+    s.panel = attr(node("section", "blu-chat-widget__panel"), "role", "dialog");
+    s.panel.id = s.uid + "-panel";
+    attr(s.panel, "aria-modal", "false");
+    const top = node("header", "blu-chat-widget__header");
+    s.title = node("h2");
+    const commands = node("div");
+    s.expand = button("", () => setExpanded(s, !s.expanded));
+    s.expand.append(icon("Expand"));
+    attr(s.expand, "aria-label", "Expand chat");
+    s.close = button("", () => setOpen(s, false, "Close"));
+    s.close.append(icon("Close"));
+    attr(s.close, "aria-label", "Minimize chat");
+    commands.append(s.expand, s.close);
+    top.append(s.title, commands);
+    s.chatHost = node("div", "blu-chat-widget__content");
+    s.chatHost.id = s.uid + "-chat";
+    s.floatHost = node("div");
+    s.floatHost.id = s.uid + "-float";
+    s.panel.append(top, s.chatHost);
+    s.root.append(s.panel, s.floatHost);
+    s.root.addEventListener("keydown", (e) => {
+      if (e.key === "Escape" && s.open) {
+        e.preventDefault();
+        e.stopPropagation();
+        setOpen(s, false, "Escape");
+      }
+    });
+    s.dispose = () => {
+      chat.destroy(s.uid + "-chat");
+      floating.destroy(s.uid + "-float");
+    };
+  }, (s) => {
+    const o = s.options;
+    if (s.open === void 0 || o.IsOpen !== s.openInput) {
+      s.openInput = o.IsOpen;
+      s.open = !!o.IsOpen;
+    }
+    if (o.IsExpanded !== s.expandedInput) {
+      s.expandedInput = o.IsExpanded;
+      s.expanded = !!o.IsExpanded;
+    }
+    const target = o.Position === "Container" ? s.host : document.body;
+    if (s.root.parentNode !== target) target.append(s.root);
+    s.root.dataset.position = o.Position === "Container" ? "Container" : "Viewport";
+    s.root.dataset.placement = o.Placement === "BottomLeft" ? "BottomLeft" : "BottomRight";
+    s.root.dataset.animate = String(o.Animate !== false);
+    s.root.style.setProperty("--blu-widget-offset", Math.max(8, Math.min(160, Number(o.Offset) || 24)) + "px");
+    s.title.textContent = o.Title || "Assistant";
+    attr(s.panel, "aria-label", o.Title || "Assistant");
+    const callbacks = {};
+    for (const n of ["Send", "Stop", "Retry", "Copy", "Error"]) callbacks[n] = (...args) => emit(s, n, ...args);
+    chat.sync(s.chatHost.id, { ...o, ShowHeader: false }, callbacks, s.uid + "-chat");
+    floating.sync(s.floatHost.id, { Label: s.open ? "Minimize chat" : o.LauncherLabel || "Open chat", Icon: s.open ? "Close" : "Chat", BadgeCount: s.open ? 0 : o.UnreadCount, Position: "Container", Placement: o.Placement, Offset: 8, Animate: o.Animate, Color: o.Color }, { Click: () => setOpen(s, !s.open, "Launcher"), Error: (e) => emit(s, "Error", e) }, s.uid + "-float");
+    const launcher = s.floatHost.querySelector("button");
+    attr(launcher, "aria-expanded", !!s.open);
+    attr(launcher, "aria-controls", s.panel.id);
+    attr(launcher, "aria-haspopup", "dialog");
+    render(s);
+  });
+  function setOpen(s, open, reason) {
+    s.open = open;
+    render(s);
+    emit(s, "OpenChanged", open, reason);
+  }
+  function setExpanded(s, expanded) {
+    s.expanded = expanded;
+    render(s);
+    emit(s, "ExpandedChanged", expanded);
+  }
+  function render(s) {
+    const changed = s.lastOpen !== s.open;
+    s.lastOpen = s.open;
+    s.root.dataset.open = String(!!s.open);
+    s.root.dataset.expanded = String(!!s.expanded);
+    s.panel.inert = !s.open;
+    attr(s.panel, "aria-hidden", !s.open);
+    attr(s.expand, "aria-label", s.expanded ? "Restore chat size" : "Expand chat");
+    attr(s.expand, "aria-pressed", !!s.expanded);
+    floating.sync(s.floatHost.id, { Label: s.open ? "Minimize chat" : s.options.LauncherLabel || "Open chat", Icon: s.open ? "Close" : "Chat", BadgeCount: s.open ? 0 : s.options.UnreadCount, Position: "Container", Placement: s.options.Placement, Offset: 8, Animate: s.options.Animate, Color: s.options.Color }, { Click: () => setOpen(s, !s.open, "Launcher"), Error: (e) => emit(s, "Error", e) }, s.uid + "-float");
+    const launcher = s.floatHost.querySelector("button");
+    if (launcher) {
+      attr(launcher, "aria-expanded", !!s.open);
+      attr(launcher, "aria-controls", s.panel.id);
+      attr(launcher, "aria-haspopup", "dialog");
+    }
+    if (changed && s.open) {
+      const input = s.chatHost.querySelector("textarea");
+      (input && !input.disabled ? input : s.close).focus({ preventScroll: true });
+    } else if (changed && s.open === false && s.panel.contains(document.activeElement)) launcher?.focus({ preventScroll: true });
+  }
+}
+export {
+  installChatWidget
+};

package/src/runtime/chat.d.ts

@@ -0,0 +1 @@
+export function installChat():any;