@oddkin/ai 0.0.0-stage → 1.0.0-beta.0

package/dist/prod/response-feedback/response-feedback.js

@@ -0,0 +1,105 @@
+import { OddkinElement, prop } from "@oddkin/core/element";
+import { signal } from "@oddkin/core/reactive";
+import { announceEvent, feedbackSubmitEvent } from "../events.js";
+import { FocusRecovery } from "@oddkin/core/controllers/focus";
+import { strings } from "../internal/strings.js";
+const FEEDBACK_STRINGS = {
+  label: "Rate this response",
+  positive: "Good response",
+  negative: "Bad response",
+  reasons: "What went wrong? (optional)",
+  comment: "Comment (optional)",
+  submit: "Send feedback",
+  cancel: "Cancel",
+  pending: "Sending feedback\u2026",
+  submitted: "Thanks. Your feedback was recorded.",
+  failed: "Feedback was not sent: {message}",
+  retry: "Try again"
+};
+class OddkinResponseFeedback extends OddkinElement.with({
+  messageId: prop.string({
+    default: "",
+    attribute: "message-id",
+    description: "Message the feedback is about."
+  }),
+  feedback: prop.object({
+    description: "The authoritative feedback record (status and outcome)."
+  }),
+  reasons: prop.array({ description: "Reasons offered for negative feedback." }),
+  disabled: prop.boolean({ reflect: !0, description: "Feedback is unavailable." }),
+  announce: prop.enum(["none", "important"], {
+    default: "none",
+    empty: "important",
+    description: "Announce outcomes (when no surrounding surface does)."
+  }),
+  strings: prop.object({
+    description: "Localized string overrides."
+  })
+}) {
+  static events = {
+    "odd-feedback-submit": feedbackSubmitEvent,
+    "odd-announce": announceEvent
+  };
+  /** @internal Local draft (presentation state). */
+  _rating = signal(void 0);
+  /** @internal */
+  _selected = signal([]);
+  /** @internal */
+  _comment = signal("");
+  /** @internal */
+  get _strings() {
+    return strings(FEEDBACK_STRINGS, this.strings);
+  }
+  /** @internal */
+  _rate = (event) => {
+    const rating = event.currentTarget.dataset.rating;
+    this._rating.value = this._rating.peek() === rating ? void 0 : rating;
+  };
+  /** @internal */
+  _toggleReason = (event) => {
+    const input = event.target, current = this._selected.peek();
+    this._selected.value = input.checked ? [...current, input.value] : current.filter((r) => r !== input.value);
+  };
+  /** @internal */
+  _onComment = (event) => {
+    this._comment.value = event.target.value;
+  };
+  /** @internal */
+  _cancel = () => {
+    this._rating.value = void 0, this._selected.value = [], this._comment.value = "";
+  };
+  /** @internal */
+  _submit = (event) => {
+    event.preventDefault();
+    const rating = this._rating.peek();
+    !rating || this.disabled || this.feedback?.status === "pending" || this.emit(feedbackSubmitEvent, {
+      messageId: this.messageId,
+      rating,
+      reasons: rating === "negative" ? this._selected.peek() : [],
+      comment: this._comment.peek()
+    });
+  };
+  mounted(scope) {
+    scope.use(new FocusRecovery({
+      root: () => this.shadowRoot,
+      fallback: () => this.shadowRoot?.querySelector(".outcome")
+    }));
+    let previous;
+    scope.effect(() => {
+      const status = this.feedback?.status;
+      if (status === "submitted" && previous && previous !== "submitted" && this._cancel(), this.announce !== "none" && previous !== void 0 && status !== previous && (status === "submitted" || status === "failed")) {
+        const t = this._strings;
+        this.emit(announceEvent, {
+          text: status === "submitted" ? t.submitted : t.failed.replace("{message}", this.feedback?.error?.message ?? ""),
+          priority: "polite",
+          key: `feedback:${this.messageId}:${status}:${Date.now()}`
+        });
+      }
+      previous = status ?? "idle";
+    }, { phase: "post", name: "<odd-response-feedback> outcome" });
+  }
+}
+export {
+  FEEDBACK_STRINGS,
+  OddkinResponseFeedback
+};

package/dist/prod/response-feedback/response-feedback.recipe.js

@@ -0,0 +1,14 @@
+import { defineLayoutRecipe, row, stack } from "@oddkin/components/layout";
+import { token } from "@oddkin/tokens/refs";
+const responseFeedbackRecipe = defineLayoutRecipe({
+  name: "response-feedback",
+  regions: {
+    base: stack({ gap: token("space.xs") }),
+    form: stack({ gap: token("space.xs") }),
+    check: row({ gap: token("space.xs") }),
+    field: stack({ gap: token("space.2xs") })
+  }
+});
+export {
+  responseFeedbackRecipe
+};

package/dist/prod/response-feedback/response-feedback.recipe.styles.js

@@ -0,0 +1,33 @@
+import { unsafeCSS } from "@oddkin/core/styles";
+const responseFeedbackRecipeStyles = unsafeCSS(`@layer odd.layout.base {
+  .base {
+    display: flex;
+    flex-direction: column;
+    gap: var(--odd-space-xs);
+    min-inline-size: 0;
+  }
+  .form {
+    display: flex;
+    flex-direction: column;
+    gap: var(--odd-space-xs);
+    min-inline-size: 0;
+  }
+  .check {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: var(--odd-space-xs);
+    flex-wrap: nowrap;
+    min-inline-size: 0;
+  }
+  .field {
+    display: flex;
+    flex-direction: column;
+    gap: var(--odd-space-2xs);
+    min-inline-size: 0;
+  }
+}
+`);
+export {
+  responseFeedbackRecipeStyles
+};

package/dist/prod/response-feedback/response-feedback.styles.js

@@ -0,0 +1,43 @@
+import { css } from "@oddkin/core/styles";
+import { token } from "@oddkin/tokens/refs";
+import { responseFeedbackRecipeStyles } from "./response-feedback.recipe.styles.js";
+const responseFeedbackStyles = css`
+  ${responseFeedbackRecipeStyles}
+  .form {
+    max-inline-size: 36rem;
+  }
+  fieldset {
+    /* Not a grid: WebKit keeps a grid fieldset's legend at its old width after the container shrinks. */
+    display: flex;
+    flex-direction: column;
+    gap: ${token("space.2xs")};
+    margin: 0;
+    padding: ${token("space.xs")};
+    border: ${token("border.width.default")} solid ${token("color.border.default")};
+    border-radius: ${token("radius.sm")};
+  }
+  legend,
+  .field span {
+    font-size: ${token("font.size.sm")};
+  }
+  .check {
+    min-block-size: ${token("target.min")};
+  }
+  textarea {
+    padding: ${token("space.2xs")} ${token("space.xs")};
+    border: ${token("border.width.default")} solid ${token("color.border.default")};
+    border-radius: ${token("control.radius")};
+    font: inherit;
+    color: inherit;
+    background: ${token("color.surface.default")};
+  }
+  .outcome[data-status='failed'] {
+    color: ${token("color.danger.foreground")};
+  }
+  .outcome[data-status='submitted'] {
+    color: ${token("color.success.foreground")};
+  }
+`;
+export {
+  responseFeedbackStyles
+};

package/dist/prod/response-feedback/response-feedback.template.js

@@ -0,0 +1,57 @@
+import { html } from "@oddkin/core/template";
+import { format } from "../internal/strings.js";
+const responseFeedbackTemplate = (host) => {
+  const t = host._strings, record = host.feedback, status = record?.status ?? "idle", rating = host._rating.value ?? (status === "submitted" ? record?.rating : void 0), drafting = !!host._rating.value && status !== "pending" && status !== "submitted", outcome = status === "pending" ? t.pending : status === "submitted" ? t.submitted : status === "failed" ? format(t.failed, { message: record?.error?.message ?? "" }) : "", locked = host.disabled || status === "pending" || status === "submitted";
+  return html`<div part="base" class="base" role="group" aria-label=${t.label}>
+    <div class="actions">
+      <button
+        class="text-button"
+        type="button"
+        data-rating="positive"
+        aria-pressed=${rating === "positive" ? "true" : "false"}
+        ?disabled=${locked}
+        @click=${host._rate}
+      >
+        <span aria-hidden="true">👍</span><span class="visually-hidden">${t.positive}</span>
+      </button>
+      <button
+        class="text-button"
+        type="button"
+        data-rating="negative"
+        aria-pressed=${rating === "negative" ? "true" : "false"}
+        ?disabled=${locked}
+        @click=${host._rate}
+      >
+        <span aria-hidden="true">👎</span><span class="visually-hidden">${t.negative}</span>
+      </button>
+      <span class="outcome muted" data-status=${status} ?hidden=${!outcome}>${outcome}</span>
+    </div>
+    <form part="form" class="form" ?hidden=${!drafting} @submit=${host._submit}>
+      ${host._rating.value === "negative" && host.reasons.length ? html`<fieldset>
+              <legend>${t.reasons}</legend>
+              ${host.reasons.map((reason) => html`<label class="check">
+                    <input
+                      type="checkbox"
+                      .value=${reason}
+                      .checked=${host._selected.value.includes(reason)}
+                      @change=${host._toggleReason}
+                    />
+                    ${reason}
+                  </label>`)}
+            </fieldset>` : null}
+      <label class="field">
+        <span>${t.comment}</span>
+        <textarea rows="2" .value=${host._comment.value} @input=${host._onComment}></textarea>
+      </label>
+      <div class="actions">
+        <odd-button type="submit" appearance="primary" size="sm" @click=${host._submit}
+          >${status === "failed" ? t.retry : t.submit}</odd-button
+        >
+        <odd-button size="sm" appearance="ghost" @click=${host._cancel}>${t.cancel}</odd-button>
+      </div>
+    </form>
+  </div>`;
+};
+export {
+  responseFeedbackTemplate
+};

package/dist/prod/sources/index.js

@@ -0,0 +1,11 @@
+import { OddkinSources, SOURCES_STRINGS } from "./sources.js";
+import { sourcesTemplate } from "./sources.template.js";
+import { sourcesStyles } from "./sources.styles.js";
+import { sourcesDefinition } from "./sources.definition.js";
+export {
+  OddkinSources,
+  SOURCES_STRINGS,
+  sourcesDefinition,
+  sourcesStyles,
+  sourcesTemplate
+};

package/dist/prod/sources/sources.define.js

@@ -0,0 +1,3 @@
+import { define } from "@oddkin/core/element";
+import { sourcesDefinition } from "./sources.definition.js";
+define(sourcesDefinition);

package/dist/prod/sources/sources.definition.js

@@ -0,0 +1,14 @@
+import { compose } from "@oddkin/core/element";
+import { aiBaseStyles } from "../internal/base.styles.js";
+import { OddkinSources } from "./sources.js";
+import { sourcesStyles } from "./sources.styles.js";
+import { sourcesTemplate } from "./sources.template.js";
+const sourcesDefinition = compose({
+  name: "odd-sources",
+  element: OddkinSources,
+  template: sourcesTemplate,
+  styles: [aiBaseStyles, sourcesStyles]
+});
+export {
+  sourcesDefinition
+};

package/dist/prod/sources/sources.js

@@ -0,0 +1,37 @@
+import { OddkinElement, prop } from "@oddkin/core/element";
+import { signal } from "@oddkin/core/reactive";
+import { strings } from "../internal/strings.js";
+const SOURCES_STRINGS = {
+  heading: "Sources",
+  count: "{count} sources",
+  open: "Open",
+  untitled: "Untitled source"
+};
+class OddkinSources extends OddkinElement.with({
+  sources: prop.array({
+    description: "Source records in citation order (replaced, never mutated)."
+  }),
+  label: prop.string({
+    default: "",
+    description: 'Visible heading and accessible name of the list; defaults to the localized "Sources".'
+  }),
+  strings: prop.object({
+    description: "Localized string overrides."
+  })
+}) {
+  /** @internal The entry most recently revealed (highlighted). */
+  _revealed = signal(void 0);
+  /** @internal */
+  get _strings() {
+    return strings(SOURCES_STRINGS, this.strings);
+  }
+  /** Scroll to and focus the entry for `sourceId`. Returns false when it is not listed. */
+  reveal(sourceId) {
+    const item = this.shadowRoot?.querySelector(`[data-source-id="${CSS.escape(sourceId)}"]`);
+    return item ? (this._revealed.value = sourceId, item.scrollIntoView({ block: "nearest" }), item.focus(), !0) : !1;
+  }
+}
+export {
+  OddkinSources,
+  SOURCES_STRINGS
+};

package/dist/prod/sources/sources.recipe.js

@@ -0,0 +1,9 @@
+import { defineLayoutRecipe, stack } from "@oddkin/components/layout";
+import { token } from "@oddkin/tokens/refs";
+const sourcesRecipe = defineLayoutRecipe({
+  name: "sources",
+  regions: { list: stack({ gap: token("space.xs") }), item: stack({ gap: "0.125rem" }) }
+});
+export {
+  sourcesRecipe
+};

package/dist/prod/sources/sources.recipe.styles.js

@@ -0,0 +1,19 @@
+import { unsafeCSS } from "@oddkin/core/styles";
+const sourcesRecipeStyles = unsafeCSS(`@layer odd.layout.base {
+  .list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--odd-space-xs);
+    min-inline-size: 0;
+  }
+  .item {
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+    min-inline-size: 0;
+  }
+}
+`);
+export {
+  sourcesRecipeStyles
+};

package/dist/prod/sources/sources.styles.js

@@ -0,0 +1,37 @@
+import { css } from "@oddkin/core/styles";
+import { token } from "@oddkin/tokens/refs";
+import { sourcesRecipeStyles } from "./sources.recipe.styles.js";
+const sourcesStyles = css`
+  ${sourcesRecipeStyles}
+  .heading {
+    margin: 0 0 ${token("space.xs")};
+    font-size: ${token("font.size.sm")};
+    font-weight: ${token("font.weight.semibold")};
+    color: ${token("color.text.secondary")};
+  }
+  .list {
+    margin: 0;
+    padding-inline-start: ${token("space.lg")};
+    font-size: ${token("font.size.sm")};
+  }
+  .item {
+    padding: ${token("space.2xs")} ${token("space.xs")};
+    border-radius: ${token("radius.sm")};
+  }
+  .item[data-revealed='true'] {
+    background: ${token("color.surface.hover")};
+  }
+  .title {
+    color: ${token("color.link")};
+    font-weight: ${token("font.weight.medium")};
+  }
+  span.title {
+    color: inherit;
+  }
+  .excerpt {
+    color: ${token("color.text.secondary")};
+  }
+`;
+export {
+  sourcesStyles
+};

package/dist/prod/sources/sources.template.js

@@ -0,0 +1,40 @@
+import { html, repeat } from "@oddkin/core/template";
+import { displayHost, safeUrl } from "../markdown/url.js";
+const sourcesTemplate = (host) => {
+  const t = host._strings, revealed = host._revealed.value;
+  return html`<section
+    class="base"
+    part="base"
+    aria-labelledby="heading"
+    ?hidden=${!host.sources.length}
+  >
+    <p id="heading" class="heading">${host.label || t.heading}</p>
+    <ol part="list" class="list">
+      ${repeat(host.sources, (s) => s.sourceId, (s) => {
+    const url = s.url ? safeUrl(s.url) : void 0, title = s.title || displayHost(url) || t.untitled;
+    return html`<li
+            part="item"
+            class="item"
+            tabindex="-1"
+            data-source-id=${s.sourceId}
+            data-revealed=${revealed === s.sourceId ? "true" : "false"}
+          >
+            ${url ? html`<a
+                    class="title"
+                    href=${url}
+                    rel="noopener noreferrer nofollow"
+                    target="_blank"
+                    >${title}</a
+                  >` : html`<span class="title">${title}</span>`}
+            <span class="muted" ?hidden=${!s.publisher && !url}
+              >${s.publisher ?? displayHost(url) ?? ""}</span
+            >
+            <span class="excerpt" ?hidden=${!s.excerpt}>${s.excerpt ?? ""}</span>
+          </li>`;
+  })}
+    </ol>
+  </section>`;
+};
+export {
+  sourcesTemplate
+};

package/dist/prod/stream/index.js

@@ -0,0 +1,16 @@
+import { SseParser, createSseDecoder, readSse } from "./sse.js";
+import { UI_MESSAGE_STREAM_HEADER, UI_MESSAGE_STREAM_VERSION, UiMessageStreamReader, createUiMessageStreamTransport, toUiMessage } from "./ui-message-stream.js";
+import { chunkText, createSimulatedTransport, streamTextSteps } from "./simulation.js";
+export {
+  SseParser,
+  UI_MESSAGE_STREAM_HEADER,
+  UI_MESSAGE_STREAM_VERSION,
+  UiMessageStreamReader,
+  chunkText,
+  createSimulatedTransport,
+  createSseDecoder,
+  createUiMessageStreamTransport,
+  readSse,
+  streamTextSteps,
+  toUiMessage
+};

package/dist/prod/stream/simulation.js

@@ -0,0 +1,198 @@
+import { toPublicError } from "../contracts/normalize.js";
+const TERMINAL = /* @__PURE__ */ new Set(["finish", "abort", "error"]), DEFAULT_CAPABILITIES = {
+  send: { available: !0 },
+  stop: { available: !0 },
+  disconnect: { available: !0 },
+  reconnect: { available: !0 },
+  resume: { available: !0 },
+  retry: { available: !0 },
+  regenerate: { available: !0 },
+  edit: { available: !0 },
+  switchBranch: { available: !0 },
+  respondToApproval: { available: !0 },
+  history: { available: !0 },
+  feedback: { available: !0 },
+  attachments: { available: !0 }
+};
+function createSimulatedTransport(options) {
+  const controls = {
+    acceptDelay: 120,
+    stopBehavior: "cancel",
+    stopDelay: 250,
+    decisionOutcome: "accepted",
+    decisionDelay: 250,
+    replayOverlap: 3,
+    feedbackDelay: 200,
+    failFeedback: !1,
+    historyDelay: 300,
+    ...options.controls
+  }, runs = /* @__PURE__ */ new Map(), timers = /* @__PURE__ */ new Set(), historyPages = [...options.history ?? []], wait = (ms) => new Promise((resolve) => {
+    const id = setTimeout(() => {
+      timers.delete(id), resolve();
+    }, ms);
+    timers.add(id);
+  }), later = (ms, fn) => {
+    const id = setTimeout(() => {
+      timers.delete(id), fn();
+    }, ms);
+    return timers.add(id), id;
+  }, produce = (run, event) => {
+    if (run.ended)
+      return;
+    const seq = run.produced.length;
+    run.produced.push({ ...event, seq }), TERMINAL.has(event.type) && (run.ended = !0), flush(run);
+  }, flush = (run) => {
+    for (; run.sink && run.delivered < run.produced.length; )
+      run.sink.push(run.produced[run.delivered++]);
+    if (run.sink && run.ended && run.delivered >= run.produced.length) {
+      const sink = run.sink;
+      run.sink = void 0, sink.close();
+    }
+  }, advance = (run) => {
+    if (run.ended || run.waiting || run.timer !== void 0)
+      return;
+    const step = run.queue.shift();
+    step && (run.timer = later(step.after, () => {
+      if (run.timer = void 0, !run.ended) {
+        if ("event" in step)
+          produce(run, step.event);
+        else if ("drop" in step) {
+          run.dropped = !0;
+          const sink = run.sink;
+          run.sink = void 0, sink?.close();
+        } else {
+          run.waiting = step.awaitDecision, run.branches = { approve: step.approve, reject: step.reject };
+          return;
+        }
+        advance(run);
+      }
+    }));
+  };
+  return {
+    simulated: !0,
+    controls,
+    capabilities: { ...DEFAULT_CAPABILITIES, ...options.capabilities },
+    get pendingTimers() {
+      return timers.size;
+    },
+    async send(request, sink) {
+      await wait(controls.acceptDelay);
+      const failure = controls.failNextSend;
+      if (failure)
+        throw controls.failNextSend = void 0, failure;
+      const run = {
+        target: {
+          conversationId: request.conversationId,
+          runId: request.runId,
+          attemptId: request.attemptId
+        },
+        queue: [...options.script(request)],
+        produced: [],
+        delivered: 0,
+        sink,
+        timer: void 0,
+        ended: !1,
+        waiting: void 0,
+        branches: void 0,
+        dropped: !1
+      };
+      runs.set(request.attemptId, run), produce(run, { type: "attempt-accepted" }), advance(run);
+    },
+    disconnect(target) {
+      const run = runs.get(target.attemptId);
+      run && (run.sink = void 0);
+    },
+    async resume(target, sink) {
+      await wait(controls.acceptDelay);
+      const run = runs.get(target.attemptId);
+      if (!run)
+        throw { code: "ai.resume.notFound", message: "There is no response to resume." };
+      run.sink = sink, run.dropped = !1, run.delivered = Math.max(0, run.delivered - controls.replayOverlap), flush(run);
+    },
+    async stop(target) {
+      await wait(controls.stopDelay);
+      const run = runs.get(target.attemptId);
+      if (!run)
+        return "not-found";
+      if (run.ended)
+        return "already-finished";
+      switch (controls.stopBehavior) {
+        case "fail":
+          throw { code: "ai.stop.failed", message: "The stop request failed.", retryable: !0 };
+        case "unknown":
+          return "unknown";
+        case "already-finished":
+          return "already-finished";
+        case "cancel":
+          return run.timer !== void 0 && clearTimeout(run.timer), timers.delete(run.timer), run.timer = void 0, run.queue = [], run.waiting = void 0, produce(run, { type: "abort", reason: "stopped" }), "cancelled";
+      }
+    },
+    async decide(decision) {
+      if (await wait(controls.decisionDelay), controls.decisionOutcome === "fail")
+        throw toPublicError({
+          code: "ai.approval.failed",
+          message: "The decision could not be recorded.",
+          retryable: !0
+        }, {
+          code: "ai.approval.failed",
+          message: "The decision could not be recorded."
+        });
+      const outcome = controls.decisionOutcome, run = runs.get(decision.attemptId);
+      if (outcome === "accepted" && run && run.waiting === decision.approvalId && run.branches) {
+        const branch = decision.decision === "approve" ? run.branches.approve : run.branches.reject;
+        run.waiting = void 0, run.branches = void 0, produce(run, {
+          type: "approval-resolved",
+          approvalId: decision.approvalId,
+          revision: decision.revision,
+          status: decision.decision === "approve" ? "approved" : "rejected"
+        }), run.queue = [...branch, ...run.queue], advance(run);
+      }
+      return outcome;
+    },
+    async loadHistory(conversationId) {
+      await wait(controls.historyDelay);
+      const page = historyPages.shift();
+      return page ? { ...page, hasMoreHistory: historyPages.length > 0 } : { conversationId, messages: [], hasMoreHistory: !1 };
+    },
+    async submitFeedback(_feedback) {
+      if (await wait(controls.feedbackDelay), controls.failFeedback)
+        throw {
+          code: "ai.feedback.failed",
+          message: "Feedback could not be sent.",
+          retryable: !0
+        };
+    },
+    inject(attemptId, event) {
+      const run = runs.get(attemptId);
+      run && (run.ended = !1, produce(run, event));
+    },
+    dispose() {
+      for (const id of timers)
+        clearTimeout(id);
+      timers.clear();
+      for (const run of runs.values())
+        run.timer = void 0;
+    }
+  };
+}
+function chunkText(text, size = 6) {
+  const points = Array.from(text), out = [];
+  for (let i = 0; i < points.length; i += size)
+    out.push(points.slice(i, i + size).join(""));
+  return out;
+}
+function streamTextSteps(partId, text, every = 30, size = 6) {
+  return [
+    { after: every, event: { type: "text-start", partId } },
+    ...chunkText(text, size).map((delta) => ({
+      after: every,
+      event: { type: "text-delta", partId, delta }
+    })),
+    { after: every, event: { type: "text-end", partId } }
+  ];
+}
+export {
+  chunkText,
+  createSimulatedTransport,
+  streamTextSteps
+};