@noodleseed/assistant 1.1.1 → 1.2.0

package/dist/chunk-J2YDKISA.js

@@ -0,0 +1,1113 @@
+import {
+  AssistantClientError,
+  copyAssistantModelContext,
+  createAssistantClient
+} from "./chunk-WUDHE5BD.js";
+
+// src/appearance.ts
+var common = {
+  fontFamily: "inherit",
+  monoFontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace",
+  baseFontSize: 15,
+  messageFontSize: 15,
+  lineHeight: 1.5,
+  panelRadius: 20,
+  cardRadius: 14,
+  inputRadius: 14,
+  buttonRadius: 12,
+  launcherRadius: 999,
+  spacing: 12,
+  backdropBlur: 18,
+  motionScale: 1
+};
+var DEFAULT_APPEARANCE = {
+  brand: { name: "Assistant", logo: {}, avatar: {}, mark: {} },
+  theme: {
+    defaultMode: "auto",
+    light: {
+      ...common,
+      page: "#F7F7F8",
+      panel: "#FFFFFF",
+      elevated: "#FFFFFF",
+      input: "#F1F1F3",
+      hover: "#ECECEF",
+      selected: "#E4E2FF",
+      text: "#18181B",
+      mutedText: "#71717A",
+      accent: "#5B4CF0",
+      accentText: "#FFFFFF",
+      link: "#4A3BD5",
+      divider: "#E4E4E7",
+      focus: "#5B4CF0",
+      success: "#16835D",
+      warning: "#A45B00",
+      danger: "#C92A45",
+      overlay: "#18181B66",
+      code: "#F1F1F3",
+      widgetFrame: "#E4E4E7",
+      shadow: "0 24px 80px rgba(24, 24, 27, 0.18)"
+    },
+    dark: {
+      ...common,
+      page: "#111113",
+      panel: "#19191D",
+      elevated: "#222228",
+      input: "#26262C",
+      hover: "#303038",
+      selected: "#37315F",
+      text: "#FAFAFA",
+      mutedText: "#A1A1AA",
+      accent: "#A99FFF",
+      accentText: "#17131F",
+      link: "#B9B1FF",
+      divider: "#34343B",
+      focus: "#B9B1FF",
+      success: "#58C69A",
+      warning: "#F2B45F",
+      danger: "#FF8094",
+      overlay: "#00000099",
+      code: "#26262C",
+      widgetFrame: "#34343B",
+      shadow: "0 24px 90px rgba(0, 0, 0, 0.55)"
+    }
+  },
+  layout: {
+    mode: "floating",
+    position: "bottom-right",
+    panelWidth: 400,
+    panelMinHeight: 420,
+    panelMaxHeight: 720,
+    zIndex: 2147483e3,
+    density: "comfortable",
+    mobileFullscreen: true
+  },
+  behavior: {
+    startOpen: false,
+    closeOnEscape: true,
+    closeOnOutsideClick: false,
+    showLauncher: true,
+    showHeader: true,
+    showAvatars: true,
+    showTimestamps: false
+  },
+  labels: {
+    welcomeHeading: "How can I help?",
+    welcomeMessage: "",
+    composerPlaceholder: "Ask a question\u2026",
+    send: "Send",
+    stop: "Stop",
+    close: "Close assistant",
+    open: "Open assistant",
+    confirm: "Confirm",
+    cancel: "Cancel",
+    retry: "Try again",
+    unavailable: "The assistant is temporarily unavailable.",
+    sessionExpired: "Your assistant session expired. Reopen it to continue."
+  },
+  suggestedPrompts: [],
+  locale: "en",
+  direction: "auto"
+};
+function resolveAppearance(input = {}) {
+  const branding = input.branding;
+  const assistant = input.assistant;
+  return {
+    brand: {
+      ...DEFAULT_APPEARANCE.brand,
+      ...branding?.name ? { name: branding.name } : {},
+      logo: themedAsset(branding?.logo),
+      avatar: themedAsset(branding?.avatar),
+      mark: themedAsset(branding?.mark)
+    },
+    theme: {
+      defaultMode: branding?.colorScheme ?? DEFAULT_APPEARANCE.theme.defaultMode,
+      light: resolveTheme("light", branding),
+      dark: resolveTheme("dark", branding)
+    },
+    layout: {
+      ...DEFAULT_APPEARANCE.layout,
+      ...branding?.density ? { density: branding.density } : {},
+      ...assistant?.layout
+    },
+    behavior: { ...DEFAULT_APPEARANCE.behavior, ...assistant?.behavior },
+    labels: { ...DEFAULT_APPEARANCE.labels, ...assistant?.labels },
+    suggestedPrompts: assistant?.suggestedPrompts ?? DEFAULT_APPEARANCE.suggestedPrompts,
+    ...assistant?.privacyUrl ? { privacyUrl: assistant.privacyUrl } : {},
+    ...assistant?.termsUrl ? { termsUrl: assistant.termsUrl } : {},
+    locale: assistant?.locale ?? DEFAULT_APPEARANCE.locale,
+    direction: assistant?.direction ?? DEFAULT_APPEARANCE.direction
+  };
+}
+function themedAsset(asset) {
+  return asset ? { light: asset.uri, dark: asset.darkUri ?? asset.uri } : {};
+}
+function resolveTheme(mode, branding) {
+  const defaults = DEFAULT_APPEARANCE.theme[mode];
+  const surface = mode === "light" ? branding?.surface : branding?.surfaceDark;
+  const portable = branding?.theme?.[mode];
+  const radius = branding?.radius ? radiusValue(branding.radius) : void 0;
+  return {
+    ...defaults,
+    ...branding?.accent ? { accent: branding.accent } : {},
+    ...surface ? { page: surface, panel: surface } : {},
+    ...mapPortableTheme(portable),
+    ...radius === void 0 ? {} : {
+      panelRadius: radius,
+      cardRadius: radius,
+      inputRadius: Math.max(0, radius - 2),
+      buttonRadius: Math.max(0, radius - 2)
+    },
+    ...branding?.typography === "serif" ? { fontFamily: "ui-serif, Georgia, serif" } : branding?.typography === "mono" ? { fontFamily: defaults.monoFontFamily } : {}
+  };
+}
+function mapPortableTheme(input) {
+  if (!input) return {};
+  return {
+    ...input.surface ? { page: input.surface, panel: input.surface } : {},
+    ...input.surfaceRaised ? { elevated: input.surfaceRaised } : {},
+    ...input.surfaceMuted ? { input: input.surfaceMuted, hover: input.surfaceMuted, selected: input.surfaceMuted } : {},
+    ...input.text ? { text: input.text } : {},
+    ...input.textMuted ? { mutedText: input.textMuted } : {},
+    ...input.accent ? { accent: input.accent } : {},
+    ...input.accentText ? { accentText: input.accentText } : {},
+    ...input.link ? { link: input.link } : {},
+    ...input.border ? { divider: input.border, widgetFrame: input.border } : {},
+    ...input.focus ? { focus: input.focus } : {},
+    ...input.success ? { success: input.success } : {},
+    ...input.warning ? { warning: input.warning } : {},
+    ...input.danger ? { danger: input.danger } : {},
+    ...input.code ? { code: input.code } : {}
+  };
+}
+function radiusValue(radius) {
+  if (radius === "none") return 0;
+  if (radius === "sm") return 8;
+  if (radius === "lg") return 18;
+  return 14;
+}
+
+// src/browser-context.ts
+function browserClientContext() {
+  let timeZone;
+  try {
+    timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+  } catch {
+  }
+  const locale = globalThis.navigator?.language;
+  return {
+    ...locale ? { locale } : {},
+    ...timeZone ? { timeZone } : {}
+  };
+}
+
+// src/input-request-card.ts
+function createInputRequestCard(options) {
+  const card = document.createElement("section");
+  card.className = "tool-proposal input-request";
+  card.dataset.kind = "input";
+  const form = document.createElement("form");
+  const heading = document.createElement("strong");
+  heading.textContent = options.message;
+  form.append(heading);
+  const properties = record(options.requestedSchema.properties);
+  const required = new Set(
+    Array.isArray(options.requestedSchema.required) ? options.requestedSchema.required.filter(
+      (value) => typeof value === "string"
+    ) : []
+  );
+  const controls = /* @__PURE__ */ new Map();
+  const touched = /* @__PURE__ */ new WeakSet();
+  for (const [name, rawProperty] of Object.entries(properties)) {
+    const property = record(rawProperty);
+    const label = document.createElement("label");
+    const caption = document.createElement("span");
+    caption.textContent = typeof property.title === "string" && property.title ? property.title : humanize(name);
+    const control = createControl(name, property, required.has(name));
+    const markTouched = () => {
+      touched.add(control);
+      updateControlValidity(control, property, required.has(name), touched.has(control));
+    };
+    control.addEventListener("input", markTouched);
+    control.addEventListener("change", markTouched);
+    label.append(caption, control);
+    form.append(label);
+    controls.set(name, control);
+  }
+  const actions = document.createElement("div");
+  actions.className = "proposal-actions";
+  const submit = button(options.labels.submit, "submit");
+  const decline = button(options.labels.decline, "button");
+  const cancel = button(options.labels.cancel, "button");
+  const buttons = [submit, decline, cancel];
+  const resolve = async (response) => {
+    buttons.forEach((item) => {
+      item.disabled = true;
+    });
+    try {
+      await options.respond(response);
+    } catch (error) {
+      buttons.forEach((item) => {
+        item.disabled = false;
+      });
+      throw error;
+    }
+  };
+  form.addEventListener("submit", (event) => {
+    event.preventDefault();
+    for (const [name, control] of controls) {
+      updateControlValidity(
+        control,
+        record(properties[name]),
+        required.has(name),
+        touched.has(control)
+      );
+    }
+    if (!form.reportValidity()) return;
+    void resolve({
+      action: "accept",
+      content: readContent(controls, properties, required, touched)
+    }).catch(() => {
+    });
+  });
+  decline.addEventListener("click", () => {
+    void resolve({ action: "decline" }).catch(() => {
+    });
+  });
+  cancel.addEventListener("click", () => {
+    void resolve({ action: "cancel" }).catch(() => {
+    });
+  });
+  actions.append(submit, decline, cancel);
+  form.append(actions);
+  card.append(form);
+  return card;
+}
+function createControl(name, property, required) {
+  const choices = stringChoices(property);
+  if (choices || property.type === "array") {
+    const select = document.createElement("select");
+    select.name = name;
+    select.multiple = property.type === "array";
+    const availableChoices = choices ?? arrayChoices(property);
+    if (!select.multiple && (!required || !availableChoices.some((choice) => choice.value === property.default))) {
+      select.append(placeholderOption(availableChoices));
+    }
+    for (const choice of availableChoices) {
+      select.append(option(choice.title, choice.value));
+    }
+    applySelectDefault(select, property.default);
+    updateControlValidity(select, property, required, false);
+    return select;
+  }
+  const input = document.createElement("input");
+  input.name = name;
+  input.type = inputType(property);
+  input.required = required && inputNeedsNonEmptyValue(property);
+  if (property.type === "integer") input.step = "1";
+  if (typeof property.minimum === "number") input.min = String(property.minimum);
+  if (typeof property.maximum === "number") input.max = String(property.maximum);
+  if (typeof property.minLength === "number") input.minLength = property.minLength;
+  if (typeof property.maxLength === "number") input.maxLength = property.maxLength;
+  if (property.format === "date-time") input.step = "0.001";
+  applyInputDefault(input, property);
+  return input;
+}
+function readContent(controls, properties, required, touched) {
+  const content = {};
+  for (const [name, control] of controls) {
+    const property = record(properties[name]);
+    if (control instanceof HTMLSelectElement && control.multiple) {
+      const values = [...control.selectedOptions].map((option2) => option2.value);
+      if (shouldIncludeArray(property, required.has(name), touched.has(control), values.length)) {
+        content[name] = values;
+      }
+    } else if (control instanceof HTMLInputElement && control.type === "checkbox") {
+      if (required.has(name) || hasDefault(property) || touched.has(control)) {
+        content[name] = control.checked;
+      }
+    } else if (control instanceof HTMLSelectElement) {
+      if (!isPlaceholderSelected(control)) content[name] = control.value;
+    } else if (control.value !== "" || property.type === "string" && (required.has(name) || hasDefault(property) || touched.has(control))) {
+      if (property.format === "date-time") {
+        const value = dateTimeLocalToRfc3339(control.value);
+        if (value !== void 0) content[name] = value;
+      } else {
+        content[name] = property.type === "number" || property.type === "integer" ? Number(control.value) : control.value;
+      }
+    }
+  }
+  return content;
+}
+function updateControlValidity(control, property, required, touched) {
+  control.setCustomValidity("");
+  if (!(control instanceof HTMLSelectElement)) return;
+  if (!control.multiple) {
+    control.required = required;
+    if (required && isPlaceholderSelected(control)) {
+      control.setCustomValidity("Please select an option.");
+    }
+    return;
+  }
+  const count = control.selectedOptions.length;
+  const included = shouldIncludeArray(property, required, touched, count);
+  const minimum = integerBound(property.minItems);
+  const maximum = integerBound(property.maxItems);
+  control.required = included && minimum !== void 0 && minimum > 0;
+  if (included && minimum !== void 0 && count < minimum) {
+    control.setCustomValidity(`Select at least ${minimum} option${minimum === 1 ? "" : "s"}.`);
+  } else if (included && maximum !== void 0 && count > maximum) {
+    control.setCustomValidity(`Select at most ${maximum} option${maximum === 1 ? "" : "s"}.`);
+  }
+}
+function shouldIncludeArray(property, required, touched, selectedCount) {
+  return required || hasDefault(property) || touched || selectedCount > 0;
+}
+function hasDefault(property) {
+  return Object.hasOwn(property, "default");
+}
+function integerBound(value) {
+  return typeof value === "number" && Number.isInteger(value) && value >= 0 ? value : void 0;
+}
+function inputNeedsNonEmptyValue(property) {
+  if (property.type === "number" || property.type === "integer") return true;
+  if (property.type !== "string") return false;
+  return property.format === "date" || property.format === "date-time" || property.format === "email" || property.format === "uri" || typeof property.minLength === "number" && property.minLength > 0;
+}
+function isPlaceholderSelected(select) {
+  return select.selectedOptions[0]?.dataset.placeholder === "true";
+}
+function stringChoices(property) {
+  if (Array.isArray(property.enum) && property.enum.every((value) => typeof value === "string")) {
+    return property.enum.map((value) => ({ value, title: value }));
+  }
+  return titledChoices(property.oneOf) ?? titledChoices(property.anyOf);
+}
+function arrayChoices(property) {
+  return stringChoices(record(property.items)) ?? [];
+}
+function inputType(property) {
+  if (property.type === "boolean") return "checkbox";
+  if (property.type === "number" || property.type === "integer") return "number";
+  if (property.format === "date") return "date";
+  if (property.format === "date-time") return "datetime-local";
+  if (property.format === "email") return "email";
+  if (property.format === "uri") return "url";
+  return "text";
+}
+function titledChoices(value) {
+  if (!Array.isArray(value)) return void 0;
+  const choices = value.map((item) => record(item));
+  if (!choices.every((item) => typeof item.const === "string")) return void 0;
+  return choices.map((item) => ({
+    value: String(item.const),
+    title: typeof item.title === "string" ? item.title : String(item.const)
+  }));
+}
+function applySelectDefault(select, value) {
+  if (select.multiple) {
+    const selected = new Set(
+      Array.isArray(value) ? value.filter((item) => typeof item === "string") : []
+    );
+    for (const item of select.options) item.selected = selected.has(item.value);
+    return;
+  }
+  if (typeof value === "string") select.value = value;
+}
+function applyInputDefault(input, property) {
+  const value = property.default;
+  if (property.type === "boolean") {
+    if (typeof value === "boolean") input.checked = value;
+    return;
+  }
+  if (property.type === "number" || property.type === "integer") {
+    if (typeof value === "number" && Number.isFinite(value)) input.value = String(value);
+    return;
+  }
+  if (typeof value !== "string") return;
+  if (property.format === "date-time") {
+    input.value = rfc3339ToDateTimeLocal(value) ?? "";
+    return;
+  }
+  input.value = value;
+}
+function rfc3339ToDateTimeLocal(value) {
+  const instant = new Date(value);
+  if (Number.isNaN(instant.valueOf())) return void 0;
+  return [
+    String(instant.getFullYear()).padStart(4, "0"),
+    "-",
+    twoDigits(instant.getMonth() + 1),
+    "-",
+    twoDigits(instant.getDate()),
+    "T",
+    twoDigits(instant.getHours()),
+    ":",
+    twoDigits(instant.getMinutes()),
+    ":",
+    twoDigits(instant.getSeconds()),
+    ".",
+    String(instant.getMilliseconds()).padStart(3, "0")
+  ].join("");
+}
+function dateTimeLocalToRfc3339(value) {
+  const instant = new Date(value);
+  return Number.isNaN(instant.valueOf()) ? void 0 : instant.toISOString();
+}
+function twoDigits(value) {
+  return String(value).padStart(2, "0");
+}
+function button(label, type) {
+  const element = document.createElement("button");
+  element.type = type;
+  element.textContent = label;
+  return element;
+}
+function option(label, value) {
+  const element = document.createElement("option");
+  element.textContent = label;
+  element.value = value;
+  return element;
+}
+function placeholderOption(choices) {
+  let value = "";
+  while (choices.some((choice) => choice.value === value)) value += "\0";
+  const element = option("", value);
+  element.dataset.placeholder = "true";
+  return element;
+}
+function humanize(value) {
+  const words = value.replaceAll(/([a-z0-9])([A-Z])/g, "$1 $2").replaceAll(/[_-]+/g, " ");
+  return words ? `${words[0]?.toUpperCase() ?? ""}${words.slice(1)}` : value;
+}
+function record(value) {
+  return value !== null && typeof value === "object" && !Array.isArray(value) ? value : {};
+}
+
+// src/interaction-card.ts
+function createInteractionCard(options) {
+  const card = document.createElement("section");
+  card.className = "tool-proposal";
+  const label = document.createElement("strong");
+  label.textContent = options.tool;
+  card.append(label);
+  if (options.arguments && Object.keys(options.arguments).length > 0) {
+    card.append(createArgumentList(options.arguments));
+  }
+  const actions = document.createElement("div");
+  actions.className = "proposal-actions";
+  const buttons = [];
+  for (const [labelText, action] of [
+    [options.labels.accept, "accept"],
+    [options.labels.decline, "decline"],
+    [options.labels.cancel, "cancel"]
+  ]) {
+    const button2 = document.createElement("button");
+    button2.type = "button";
+    button2.textContent = labelText;
+    buttons.push(button2);
+    button2.addEventListener("click", () => {
+      for (const candidate of buttons) candidate.disabled = true;
+      void options.respond(action).catch(() => {
+        for (const candidate of buttons) candidate.disabled = false;
+      });
+    });
+    actions.append(button2);
+  }
+  card.append(actions);
+  return card;
+}
+function createArgumentList(arguments_) {
+  const details = document.createElement("dl");
+  details.className = "proposal-arguments";
+  for (const [name, value] of Object.entries(arguments_)) {
+    const term = document.createElement("dt");
+    term.textContent = humanizeArgumentName(name);
+    const description = document.createElement("dd");
+    description.textContent = formatArgumentValue(value);
+    details.append(term, description);
+  }
+  return details;
+}
+function humanizeArgumentName(value) {
+  const words = value.replaceAll(/([a-z0-9])([A-Z])/g, "$1 $2").replaceAll(/[_-]+/g, " ");
+  return words ? `${words[0]?.toUpperCase() ?? ""}${words.slice(1)}` : value;
+}
+function formatArgumentValue(value) {
+  if (value === null) return "None";
+  if (typeof value === "string") return value;
+  if (typeof value === "number" || typeof value === "boolean") return String(value);
+  return JSON.stringify(value) ?? "";
+}
+
+// src/element-event-controller.ts
+var AssistantElementEventController = class {
+  #host;
+  #assistantBody;
+  #completedTool;
+  #proposalCards = /* @__PURE__ */ new Map();
+  constructor(host) {
+    this.#host = host;
+  }
+  handle(event) {
+    if (event.event === "view_available") {
+      this.#host.element.dispatchEvent(
+        new CustomEvent("assistant-view-available", {
+          detail: event.data
+        })
+      );
+      return;
+    }
+    if (event.event === "unrecognized") return;
+    const { event: name, data } = event;
+    if (name === "session_started") {
+      if (isRecord(data.configuration)) {
+        this.#host.applyConfiguration(data.configuration);
+      }
+      this.#host.element.dispatchEvent(
+        new CustomEvent("assistant-session-started", {
+          detail: { expiresAt: String(data.expiresAt ?? "") }
+        })
+      );
+      return;
+    }
+    if (name === "session_expired") {
+      this.#host.element.dispatchEvent(new CustomEvent("assistant-session-expired"));
+      return;
+    }
+    if (name === "session_reset") {
+      this.resetConversation();
+      return;
+    }
+    if (name === "context_changed") {
+      this.#host.element.dispatchEvent(
+        new CustomEvent("assistant-context-changed", { detail: { context: data.context } })
+      );
+      return;
+    }
+    if (name === "model_context_changed") {
+      this.#host.element.dispatchEvent(
+        new CustomEvent("assistant-model-context-changed", {
+          detail: { modelContext: data.modelContext }
+        })
+      );
+      return;
+    }
+    if (name === "message_started") {
+      this.#assistantBody = void 0;
+      this.#host.appendMessage("user", String(data.message ?? ""));
+      this.#host.element.dispatchEvent(new CustomEvent("assistant-message-started"));
+      return;
+    }
+    if (name === "message_completed") {
+      this.#assistantBody = void 0;
+      this.#host.element.dispatchEvent(new CustomEvent("assistant-message-completed"));
+      return;
+    }
+    if (name === "interaction_started") {
+      this.#assistantBody = void 0;
+      this.#completedTool = void 0;
+      return;
+    }
+    if (name === "interaction_completed") {
+      this.#finishInteraction(String(data.id ?? ""), String(data.action ?? "accept"));
+      return;
+    }
+    if (name === "content") {
+      const body = this.#assistantBody ?? this.#host.appendMessage("assistant", "");
+      this.#assistantBody = body;
+      if (body) body.textContent += String(data.delta ?? "");
+      return;
+    }
+    if (name === "tool_proposed" || name === "interaction_proposed") {
+      this.#appendToolProposal(
+        String(data.id ?? ""),
+        String(data.tool ?? ("title" in data ? data.title : void 0) ?? "Action"),
+        isRecord(data.arguments) ? data.arguments : void 0
+      );
+      return;
+    }
+    if (name === "input_requested" && isRecord(data.requestedSchema)) {
+      this.#appendInputRequest(
+        String(data.id ?? ""),
+        String(data.message ?? "More information is required"),
+        data.requestedSchema
+      );
+      return;
+    }
+    if (name === "tool_completed") {
+      this.#completedTool = data;
+      return;
+    }
+    if (name === "error") {
+      this.#host.dispatchError({
+        code: String(data.code ?? "stream_failed"),
+        ...typeof data.status === "number" ? { status: data.status } : {},
+        retryable: data.retryable === true
+      });
+    }
+  }
+  resetConversation() {
+    this.#host.messages()?.replaceChildren();
+    this.#proposalCards.clear();
+    this.#assistantBody = void 0;
+    this.#completedTool = void 0;
+    this.#host.element.dispatchEvent(new CustomEvent("assistant-session-reset"));
+  }
+  #finishInteraction(id, action) {
+    if (this.#completedTool && !this.#assistantBody) {
+      this.#host.appendMessage("assistant", JSON.stringify(this.#completedTool.result ?? {}) ?? "");
+    }
+    this.#proposalCards.get(id)?.remove();
+    this.#proposalCards.delete(id);
+    if (action === "accept") {
+      this.#host.element.dispatchEvent(
+        new CustomEvent("assistant-tool-completed", { detail: { id } })
+      );
+    }
+    this.#host.element.dispatchEvent(
+      new CustomEvent("assistant-interaction-resolved", { detail: { id, action } })
+    );
+    this.#assistantBody = void 0;
+    this.#completedTool = void 0;
+  }
+  #appendToolProposal(id, tool, arguments_) {
+    const messages = this.#host.messages();
+    if (!messages || !id) return;
+    this.#proposalCards.get(id)?.remove();
+    const labels = this.#host.labels();
+    const card = createInteractionCard({
+      tool,
+      ...arguments_ ? { arguments: arguments_ } : {},
+      labels: {
+        accept: labels.confirm,
+        decline: "Decline",
+        cancel: labels.cancel
+      },
+      respond: (action) => this.#host.respond(id, { action })
+    });
+    messages.append(card);
+    this.#proposalCards.set(id, card);
+    this.#host.element.dispatchEvent(
+      new CustomEvent("assistant-tool-proposed", { detail: { id, tool, arguments: arguments_ } })
+    );
+  }
+  #appendInputRequest(id, message, requestedSchema) {
+    const messages = this.#host.messages();
+    if (!messages || !id) return;
+    this.#proposalCards.get(id)?.remove();
+    const labels = this.#host.labels();
+    const card = createInputRequestCard({
+      message,
+      requestedSchema,
+      labels: {
+        submit: labels.confirm,
+        decline: "Decline",
+        cancel: labels.cancel
+      },
+      respond: (response) => this.#host.respond(id, response)
+    });
+    messages.append(card);
+    this.#proposalCards.set(id, card);
+    this.#host.element.dispatchEvent(
+      new CustomEvent("assistant-input-requested", {
+        detail: { id, message, requestedSchema }
+      })
+    );
+  }
+};
+function isRecord(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+
+// src/element-styles.ts
+var ASSISTANT_ELEMENT_STYLES = `<style>
+  :host { color-scheme: light dark; font-family: var(--ns-assistant-font-family, var(--ns-assistant-default-font-family)); font-size: var(--ns-assistant-base-font-size, var(--ns-assistant-default-base-font-size)); line-height: var(--ns-assistant-line-height, var(--ns-assistant-default-line-height)); z-index: var(--ns-assistant-z-index, var(--ns-assistant-default-z-index)); }
+  :host([data-mode="floating"]) { position: fixed; bottom: 24px; right: 24px; }
+  :host([data-mode="floating"][data-position="bottom-left"]) { right: auto; left: 24px; }
+  .launcher { width: 54px; height: 54px; border: 0; border-radius: var(--ns-assistant-launcher-radius, var(--ns-assistant-default-launcher-radius)); color: var(--ns-assistant-accent-text, var(--ns-assistant-default-accent-text)); background: var(--ns-assistant-accent, var(--ns-assistant-default-accent)); box-shadow: var(--ns-assistant-shadow, var(--ns-assistant-default-shadow)); cursor: pointer; }
+  .launcher img { width: 24px; height: 24px; object-fit: contain; }
+  .panel { display: none; width: min(var(--ns-assistant-panel-width, var(--ns-assistant-default-panel-width)), calc(100vw - 32px)); min-height: var(--ns-assistant-min-height, var(--ns-assistant-default-min-height)); max-height: min(var(--ns-assistant-max-height, var(--ns-assistant-default-max-height)), calc(100vh - 32px)); overflow: hidden; color: var(--ns-assistant-text, var(--ns-assistant-default-text)); background: var(--ns-assistant-panel, var(--ns-assistant-default-panel)); border-radius: var(--ns-assistant-panel-radius, var(--ns-assistant-default-panel-radius)); box-shadow: var(--ns-assistant-shadow, var(--ns-assistant-default-shadow)); }
+  :host([open]) .panel { display: grid; grid-template-rows: auto auto 1fr auto; }
+  :host([open]) .launcher { display: none; }
+  header { display: flex; gap: var(--ns-assistant-spacing, var(--ns-assistant-default-spacing)); align-items: center; padding: calc(var(--ns-assistant-spacing, var(--ns-assistant-default-spacing)) * 1.2); border-bottom: 1px solid var(--ns-assistant-divider, var(--ns-assistant-default-divider)); }
+  header strong { flex: 1; }
+  .brand-logo { display: block; max-width: 120px; max-height: 28px; object-fit: contain; }
+  button { font: inherit; }
+  .close, .send { border: 0; border-radius: var(--ns-assistant-button-radius, var(--ns-assistant-default-button-radius)); cursor: pointer; }
+  .close { color: var(--ns-assistant-muted-text, var(--ns-assistant-default-muted-text)); background: transparent; font-size: 24px; }
+  .welcome { padding: calc(var(--ns-assistant-spacing, var(--ns-assistant-default-spacing)) * 1.5); }
+  .welcome h2 { margin: 0; font-size: 1.25em; }
+  .welcome p { margin: 6px 0 0; color: var(--ns-assistant-muted-text, var(--ns-assistant-default-muted-text)); }
+  .suggested-prompts { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 var(--ns-assistant-spacing, var(--ns-assistant-default-spacing)); }
+  .suggested-prompts:empty { display: none; }
+  .suggested-prompts button { padding: 7px 10px; color: var(--ns-assistant-text, var(--ns-assistant-default-text)); background: transparent; border: 1px solid var(--ns-assistant-divider, var(--ns-assistant-default-divider)); border-radius: 999px; cursor: pointer; }
+  .messages { min-height: 120px; padding: var(--ns-assistant-spacing, var(--ns-assistant-default-spacing)); overflow: auto; }
+  .message { width: fit-content; max-width: 84%; margin: 8px 0; padding: 10px 12px; border-radius: var(--ns-assistant-card-radius, var(--ns-assistant-default-card-radius)); background: var(--ns-assistant-elevated, var(--ns-assistant-default-elevated)); white-space: pre-wrap; }
+  .message .avatar { float: left; width: 24px; height: 24px; margin-right: 8px; border-radius: 50%; object-fit: cover; }
+  .message time { display: block; margin-top: 4px; color: var(--ns-assistant-muted-text, var(--ns-assistant-default-muted-text)); font-size: .75em; }
+  .message.user { margin-left: auto; color: var(--ns-assistant-accent-text, var(--ns-assistant-default-accent-text)); background: var(--ns-assistant-accent, var(--ns-assistant-default-accent)); }
+  .tool-proposal { display: grid; gap: 10px; margin: 10px 0; padding: 12px; border-radius: var(--ns-assistant-card-radius, var(--ns-assistant-default-card-radius)); background: var(--ns-assistant-elevated, var(--ns-assistant-default-elevated)); }
+  .proposal-arguments { display: grid; grid-template-columns: minmax(90px, auto) 1fr; gap: 4px 10px; margin: 0; font-size: .9em; }
+  .proposal-arguments dt { color: var(--ns-assistant-muted-text, var(--ns-assistant-default-muted-text)); }
+  .proposal-arguments dd { margin: 0; overflow-wrap: anywhere; }
+  .proposal-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: end; }
+  .tool-proposal button { padding: 8px 10px; border: 0; border-radius: var(--ns-assistant-button-radius, var(--ns-assistant-default-button-radius)); color: var(--ns-assistant-text, var(--ns-assistant-default-text)); background: var(--ns-assistant-input, var(--ns-assistant-default-input)); cursor: pointer; }
+  .tool-proposal button:first-of-type { color: var(--ns-assistant-accent-text, var(--ns-assistant-default-accent-text)); background: var(--ns-assistant-accent, var(--ns-assistant-default-accent)); }
+  .input-request form { display: grid; gap: 10px; padding: 0; border: 0; }
+  .input-request label { display: grid; gap: 4px; color: var(--ns-assistant-muted-text, var(--ns-assistant-default-muted-text)); font-size: .9em; }
+  .input-request input, .input-request select { width: 100%; box-sizing: border-box; padding: 8px 10px; color: var(--ns-assistant-text, var(--ns-assistant-default-text)); background: var(--ns-assistant-input, var(--ns-assistant-default-input)); border: 1px solid var(--ns-assistant-divider, var(--ns-assistant-default-divider)); border-radius: var(--ns-assistant-input-radius, var(--ns-assistant-default-input-radius)); font: inherit; }
+  .input-request input[type="checkbox"] { width: auto; justify-self: start; }
+  form { display: flex; gap: 8px; align-items: end; padding: var(--ns-assistant-spacing, var(--ns-assistant-default-spacing)); border-top: 1px solid var(--ns-assistant-divider, var(--ns-assistant-default-divider)); }
+  textarea { flex: 1; resize: none; padding: 10px 12px; color: var(--ns-assistant-text, var(--ns-assistant-default-text)); background: var(--ns-assistant-input, var(--ns-assistant-default-input)); border: 0; border-radius: var(--ns-assistant-input-radius, var(--ns-assistant-default-input-radius)); font: inherit; }
+  textarea:focus-visible, button:focus-visible { outline: 3px solid var(--ns-assistant-focus, var(--ns-assistant-default-focus)); outline-offset: 2px; }
+  .send { padding: 10px 14px; color: var(--ns-assistant-accent-text, var(--ns-assistant-default-accent-text)); background: var(--ns-assistant-accent, var(--ns-assistant-default-accent)); }
+  .legal { display: flex; gap: 12px; justify-content: center; padding: 0 12px 10px; font-size: .8em; }
+  .legal:empty { display: none; }
+  .legal a { color: var(--ns-assistant-link, var(--ns-assistant-default-link)); }
+  :host([data-density="compact"]) .welcome { padding: var(--ns-assistant-spacing, var(--ns-assistant-default-spacing)); }
+  @media (max-width: 640px) { :host([mobile-fullscreen][open]) { inset: 0; } :host([mobile-fullscreen][open]) .panel { width: 100vw; min-height: 100vh; max-height: 100vh; border-radius: 0; } }
+  @media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; } }
+  @media (max-width: 560px) { :host([data-mode="floating"]) { inset: auto 12px 12px; } :host([open]) .panel { width: calc(100vw - 24px); max-height: calc(100vh - 24px); } }
+</style>`;
+
+// src/element.ts
+var ASSISTANT_TAG_NAME = "noodle-assistant";
+var HTMLElementBase = globalThis.HTMLElement ?? class {
+};
+var NoodleAssistantElement = class extends HTMLElementBase {
+  static observedAttributes = ["open", "theme"];
+  #appearance = resolveAppearance();
+  #client;
+  #clientEndpoint = "";
+  #unsubscribeClient;
+  #messages;
+  #media;
+  #context;
+  #modelContext;
+  sessionEndpoint = "";
+  #events = new AssistantElementEventController({
+    element: this,
+    messages: () => this.#messages,
+    appendMessage: (role, text) => this.#appendMessage(role, text),
+    applyConfiguration: (configuration) => {
+      this.#appearance = resolveAppearance(configuration);
+      this.#render();
+    },
+    labels: () => ({
+      confirm: this.#appearance.labels.confirm,
+      cancel: this.#appearance.labels.cancel
+    }),
+    respond: (id, response) => this.respond(id, response),
+    dispatchError: (detail) => this.#dispatchError(detail)
+  });
+  connectedCallback() {
+    if (!this.shadowRoot) this.attachShadow({ mode: "open" });
+    if (!this.sessionEndpoint) this.sessionEndpoint = this.getAttribute("session-endpoint") ?? "";
+    this.#media = globalThis.matchMedia?.("(prefers-color-scheme: dark)");
+    this.#media?.addEventListener("change", this.#handleSystemTheme);
+    document.addEventListener("keydown", this.#handleDocumentKeydown);
+    document.addEventListener("pointerdown", this.#handleDocumentPointerDown);
+    if (this.#appearance.behavior.startOpen) this.setAttribute("open", "");
+    this.#render();
+    this.dispatchEvent(new CustomEvent("assistant-ready"));
+  }
+  disconnectedCallback() {
+    this.#client?.abort();
+    this.#unsubscribeClient?.();
+    this.#client = void 0;
+    this.#clientEndpoint = "";
+    this.#unsubscribeClient = void 0;
+    this.#media?.removeEventListener("change", this.#handleSystemTheme);
+    document.removeEventListener("keydown", this.#handleDocumentKeydown);
+    document.removeEventListener("pointerdown", this.#handleDocumentPointerDown);
+  }
+  attributeChangedCallback(name) {
+    if (name === "theme") this.#applyTheme();
+  }
+  open() {
+    this.setAttribute("open", "");
+    this.dispatchEvent(new CustomEvent("assistant-open"));
+  }
+  close() {
+    this.removeAttribute("open");
+    this.dispatchEvent(new CustomEvent("assistant-close"));
+  }
+  toggle() {
+    this.hasAttribute("open") ? this.close() : this.open();
+  }
+  focusComposer() {
+    this.shadowRoot?.querySelector("textarea")?.focus();
+  }
+  resetSession() {
+    if (this.#client) {
+      this.#client.resetSession();
+    } else {
+      this.#events.resetConversation();
+    }
+  }
+  updateContext(context) {
+    this.#context = { ...context };
+    if (this.#client) {
+      this.#client.updateContext(this.#context);
+    } else {
+      this.dispatchEvent(
+        new CustomEvent("assistant-context-changed", { detail: { context: this.#context } })
+      );
+    }
+  }
+  /** Replace the compact renderer summary attached to subsequent message turns. */
+  updateModelContext(update) {
+    this.#modelContext = copyAssistantModelContext(update);
+    if (this.#client) {
+      this.#client.updateModelContext(this.#modelContext);
+    } else {
+      this.dispatchEvent(
+        new CustomEvent("assistant-model-context-changed", {
+          detail: { modelContext: this.#modelContext }
+        })
+      );
+    }
+  }
+  async sendMessage(text) {
+    const message = text.trim();
+    if (!message) return;
+    try {
+      await this.#ensureClient().sendMessage(message);
+    } catch (error) {
+      this.#dispatchClientError(error, "turn_failed");
+      throw error;
+    }
+  }
+  /**
+   * Every listener the element attaches to its own DOM must go through this guard: internal UI
+   * failures surface as `assistant-error` events (already dispatched by the failing path) and must
+   * never escape as unhandled rejections into the embedding page. Programmatic callers use
+   * `sendMessage`/`confirmTool` directly and keep the rejection.
+   */
+  #sendGuarded(text) {
+    void this.sendMessage(text).catch(() => {
+    });
+  }
+  async confirmTool(id) {
+    await this.respond(id, { action: "accept" });
+  }
+  async respond(id, response) {
+    try {
+      await this.#ensureClient().respond(id, response);
+    } catch (error) {
+      this.#dispatchClientError(error, "confirmation_failed");
+      throw error;
+    }
+  }
+  #handleSystemTheme = () => this.#applyTheme();
+  #handleDocumentKeydown = (event) => {
+    if (event.key === "Escape" && this.hasAttribute("open") && this.#appearance.behavior.closeOnEscape) {
+      this.close();
+    }
+  };
+  #handleDocumentPointerDown = (event) => {
+    if (this.hasAttribute("open") && this.#appearance.behavior.closeOnOutsideClick && !event.composedPath().includes(this)) {
+      this.close();
+    }
+  };
+  #ensureClient() {
+    if (this.#client && this.#clientEndpoint === this.sessionEndpoint) return this.#client;
+    this.#client?.abort();
+    this.#unsubscribeClient?.();
+    const client = createAssistantClient({
+      sessionEndpoint: this.sessionEndpoint,
+      ...this.#context ? { context: this.#context } : {},
+      clientContext: browserClientContext,
+      ...this.#modelContext ? { modelContext: this.#modelContext } : {}
+    });
+    this.#client = client;
+    this.#clientEndpoint = this.sessionEndpoint;
+    this.#unsubscribeClient = client.subscribe((event) => this.#events.handle(event));
+    return client;
+  }
+  #appendMessage(role, text) {
+    if (!this.#messages) return void 0;
+    const message = document.createElement("div");
+    message.className = `message ${role}`;
+    if (role === "assistant" && this.#appearance.behavior.showAvatars && this.#appearance.brand.avatar[this.#resolvedMode()]) {
+      const avatar = document.createElement("img");
+      avatar.className = "avatar";
+      avatar.src = this.#appearance.brand.avatar[this.#resolvedMode()] ?? "";
+      avatar.alt = "";
+      message.append(avatar);
+    }
+    const body = document.createElement("span");
+    body.textContent = text;
+    message.append(body);
+    if (this.#appearance.behavior.showTimestamps) {
+      const timestamp = document.createElement("time");
+      timestamp.dateTime = (/* @__PURE__ */ new Date()).toISOString();
+      timestamp.textContent = new Intl.DateTimeFormat(this.#appearance.locale, {
+        hour: "numeric",
+        minute: "2-digit"
+      }).format(/* @__PURE__ */ new Date());
+      message.append(timestamp);
+    }
+    this.#messages.append(message);
+    return body;
+  }
+  #dispatchError(detail) {
+    this.dispatchEvent(new CustomEvent("assistant-error", { detail }));
+  }
+  #dispatchClientError(error, fallbackCode) {
+    this.#dispatchError(
+      error instanceof AssistantClientError ? error.detail : { code: fallbackCode, retryable: false }
+    );
+  }
+  #resolvedMode() {
+    const configured = this.getAttribute("theme") ?? this.#appearance.theme.defaultMode;
+    return configured === "auto" ? this.#media?.matches ? "dark" : "light" : configured;
+  }
+  #applyTheme() {
+    const mode = this.#resolvedMode();
+    this.setAttribute("data-theme", mode);
+    const tokens = this.#appearance.theme[mode];
+    for (const [name, value] of Object.entries(tokens)) {
+      this.style.setProperty(
+        `--ns-assistant-default-${camelToKebab(name)}`,
+        tokenValue(name, value)
+      );
+    }
+    this.style.setProperty(
+      "--ns-assistant-default-panel-width",
+      `${this.#appearance.layout.panelWidth}px`
+    );
+    this.style.setProperty(
+      "--ns-assistant-default-min-height",
+      `${this.#appearance.layout.panelMinHeight}px`
+    );
+    this.style.setProperty(
+      "--ns-assistant-default-max-height",
+      `${this.#appearance.layout.panelMaxHeight}px`
+    );
+    this.style.setProperty(
+      "--ns-assistant-default-z-index",
+      String(this.#appearance.layout.zIndex)
+    );
+    const logo = this.shadowRoot?.querySelector(".brand-logo");
+    const logoUrl = this.#appearance.brand.logo[mode];
+    if (logo) {
+      logo.hidden = !logoUrl;
+      if (logoUrl) logo.src = logoUrl;
+    }
+  }
+  #render() {
+    if (!this.shadowRoot) return;
+    const conversation = this.#messages ? [...this.#messages.childNodes] : [];
+    const appearance = this.#appearance;
+    this.setAttribute("role", "complementary");
+    this.setAttribute("aria-label", appearance.brand.name);
+    this.setAttribute("lang", appearance.locale);
+    this.setAttribute("dir", appearance.direction);
+    this.dataset.mode = appearance.layout.mode;
+    this.dataset.position = appearance.layout.position;
+    this.dataset.density = appearance.layout.density;
+    this.toggleAttribute("mobile-fullscreen", appearance.layout.mobileFullscreen);
+    this.shadowRoot.innerHTML = `${ASSISTANT_ELEMENT_STYLES}
+      <button class="launcher" type="button" aria-label="${escapeAttribute(appearance.labels.open)}"><slot name="launcher-icon">\u2726</slot></button>
+      <section class="panel" aria-label="${escapeAttribute(appearance.brand.name)}">
+        <header><slot name="header-leading"></slot><img class="brand-logo" alt=""><strong></strong><slot name="header-actions"></slot><button class="close" type="button" aria-label="${escapeAttribute(appearance.labels.close)}">\xD7</button></header>
+        <div class="welcome"><slot name="empty-state"><h2></h2><p></p></slot></div>
+        <div class="suggested-prompts"></div>
+        <div class="messages" aria-live="polite"></div>
+        <form><slot name="composer-leading"></slot><textarea rows="1"></textarea><button class="send" type="submit"></button><slot name="composer-trailing"></slot></form>
+        <nav class="legal" aria-label="Legal"></nav>
+        <slot name="conversation-footer"></slot>
+      </section>`;
+    queryRequired(this.shadowRoot, "strong").textContent = appearance.brand.name;
+    const launcherIcon = appearance.brand.mark[this.#resolvedMode()];
+    if (launcherIcon) {
+      const launcherSlot = queryRequired(
+        this.shadowRoot,
+        'slot[name="launcher-icon"]'
+      );
+      const icon = document.createElement("img");
+      icon.src = launcherIcon;
+      icon.alt = "";
+      launcherSlot.replaceChildren(icon);
+    }
+    const logo = queryRequired(this.shadowRoot, ".brand-logo");
+    const logoUrl = appearance.brand.logo[this.#resolvedMode()];
+    if (logoUrl) {
+      logo.src = logoUrl;
+      logo.alt = appearance.brand.name;
+    } else {
+      logo.hidden = true;
+    }
+    queryRequired(this.shadowRoot, "h2").textContent = appearance.labels.welcomeHeading;
+    queryRequired(this.shadowRoot, "p").textContent = appearance.labels.welcomeMessage;
+    const textarea = queryRequired(this.shadowRoot, "textarea");
+    textarea.placeholder = appearance.labels.composerPlaceholder;
+    textarea.setAttribute("aria-label", appearance.labels.composerPlaceholder);
+    queryRequired(this.shadowRoot, ".send").textContent = appearance.labels.send;
+    const prompts = queryRequired(this.shadowRoot, ".suggested-prompts");
+    for (const prompt of appearance.suggestedPrompts) {
+      const button2 = document.createElement("button");
+      button2.type = "button";
+      button2.textContent = prompt;
+      button2.addEventListener("click", () => this.#sendGuarded(prompt));
+      prompts.append(button2);
+    }
+    if (!appearance.behavior.showLauncher)
+      queryRequired(this.shadowRoot, ".launcher").hidden = true;
+    if (!appearance.behavior.showHeader)
+      queryRequired(this.shadowRoot, "header").hidden = true;
+    const legal = queryRequired(this.shadowRoot, ".legal");
+    for (const [label, href] of [
+      ["Privacy", appearance.privacyUrl],
+      ["Terms", appearance.termsUrl]
+    ]) {
+      if (!href) continue;
+      const link = document.createElement("a");
+      link.href = href;
+      link.target = "_blank";
+      link.rel = "noopener noreferrer";
+      link.textContent = label;
+      legal.append(link);
+    }
+    this.#messages = this.shadowRoot.querySelector(".messages") ?? void 0;
+    this.#messages?.append(...conversation);
+    this.shadowRoot.querySelector(".launcher")?.addEventListener("click", () => this.open());
+    this.shadowRoot.querySelector(".close")?.addEventListener("click", () => this.close());
+    this.shadowRoot.querySelector("form")?.addEventListener("submit", (event) => {
+      event.preventDefault();
+      const value = textarea.value;
+      textarea.value = "";
+      this.#sendGuarded(value);
+    });
+    this.#applyTheme();
+  }
+};
+function registerNoodleAssistant() {
+  if (globalThis.customElements && !customElements.get(ASSISTANT_TAG_NAME)) {
+    customElements.define(ASSISTANT_TAG_NAME, NoodleAssistantElement);
+  }
+}
+function camelToKebab(value) {
+  return value.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`);
+}
+function tokenValue(name, value) {
+  if (typeof value !== "number") return value;
+  if (name === "lineHeight" || name === "motionScale") return String(value);
+  return `${value}px`;
+}
+function escapeAttribute(value) {
+  return value.replaceAll("&", "&amp;").replaceAll('"', "&quot;").replaceAll("<", "&lt;");
+}
+function queryRequired(root, selector) {
+  const element = root.querySelector(selector);
+  if (!element) throw new Error(`assistant renderer is missing ${selector}`);
+  return element;
+}
+
+export {
+  ASSISTANT_TAG_NAME,
+  NoodleAssistantElement,
+  registerNoodleAssistant
+};
+//# sourceMappingURL=chunk-J2YDKISA.js.map