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

package/dist/prod/usage-meter/usage-meter.define.js

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

package/dist/prod/usage-meter/usage-meter.definition.js

@@ -0,0 +1,14 @@
+import { compose } from "@oddkin/core/element";
+import { aiBaseStyles } from "../internal/base.styles.js";
+import { OddkinUsageMeter } from "./usage-meter.js";
+import { usageMeterStyles } from "./usage-meter.styles.js";
+import { usageMeterTemplate } from "./usage-meter.template.js";
+const usageMeterDefinition = compose({
+  name: "odd-usage-meter",
+  element: OddkinUsageMeter,
+  template: usageMeterTemplate,
+  styles: [aiBaseStyles, usageMeterStyles]
+});
+export {
+  usageMeterDefinition
+};

package/dist/prod/usage-meter/usage-meter.js

@@ -0,0 +1,41 @@
+import { OddkinElement, prop } from "@oddkin/core/element";
+import { format, formatNumber, langOf, strings } from "../internal/strings.js";
+const USAGE_STRINGS = {
+  label: "Usage",
+  ofLimit: "{used} of {limit}",
+  unknown: "Unknown",
+  estimated: "estimated",
+  measured: "measured",
+  noLimit: "no limit reported"
+};
+class OddkinUsageMeter extends OddkinElement.with({
+  usage: prop.array({ description: "Usage entries (replace to update)." }),
+  label: prop.string({
+    default: "",
+    description: 'Accessible name; defaults to the localized "Usage".'
+  }),
+  strings: prop.object({
+    description: "Localized string overrides."
+  })
+}) {
+  /** @internal */
+  get _strings() {
+    return strings(USAGE_STRINGS, this.strings);
+  }
+  /** @internal Display text for one entry. */
+  _value(entry) {
+    const t = this._strings;
+    if (entry.precision === "unknown" || entry.used === void 0)
+      return t.unknown;
+    const locale = langOf(this), number = (value) => entry.kind === "cost" && entry.currency ? formatNumber(value, locale, {
+      style: "currency",
+      currency: entry.currency,
+      maximumFractionDigits: 4
+    }) : `${formatNumber(value, locale)}${entry.unit ? ` ${entry.unit}` : ""}`, used = number(entry.used);
+    return `${entry.limit !== void 0 ? format(t.ofLimit, { used, limit: number(entry.limit) }) : used} (${entry.precision === "estimated" ? t.estimated : t.measured})`;
+  }
+}
+export {
+  OddkinUsageMeter,
+  USAGE_STRINGS
+};

package/dist/prod/usage-meter/usage-meter.recipe.js

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

package/dist/prod/usage-meter/usage-meter.recipe.styles.js

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

package/dist/prod/usage-meter/usage-meter.styles.js

@@ -0,0 +1,37 @@
+import { css } from "@oddkin/core/styles";
+import { token } from "@oddkin/tokens/refs";
+import { usageMeterRecipeStyles } from "./usage-meter.recipe.styles.js";
+const usageMeterStyles = css`
+  ${usageMeterRecipeStyles}
+  .list {
+    margin: 0;
+    font-size: ${token("font.size.sm")};
+  }
+  .entry {
+    display: grid;
+    grid-template-columns: minmax(6rem, max-content) 1fr;
+    gap: ${token("space.xs")};
+    align-items: baseline;
+  }
+  dt {
+    color: ${token("color.text.secondary")};
+  }
+  dd {
+    display: grid;
+    gap: ${token("space.2xs")};
+    margin: 0;
+  }
+  .entry[data-precision='estimated'] .value {
+    font-style: italic;
+  }
+  .entry[data-precision='unknown'] .value {
+    color: ${token("color.text.secondary")};
+  }
+  meter {
+    inline-size: 100%;
+    max-inline-size: 16rem;
+  }
+`;
+export {
+  usageMeterStyles
+};

package/dist/prod/usage-meter/usage-meter.template.js

@@ -0,0 +1,27 @@
+import { html } from "@oddkin/core/template";
+const usageMeterTemplate = (host) => {
+  const t = host._strings;
+  return html`<dl part="list" class="list" aria-label=${host.label || t.label}>
+    ${host.usage.map((entry, i) => {
+    const measurable = entry.precision !== "unknown" && entry.used !== void 0 && entry.limit !== void 0 && entry.limit > 0;
+    return html`<div class="entry" data-precision=${entry.precision}>
+        <dt id=${`usage-${i}`}>${entry.label}</dt>
+        <dd>
+          <span class="value">${host._value(entry)}</span>
+          ${measurable ? html`<meter
+                  part="meter"
+                  min="0"
+                  .max=${entry.limit ?? 1}
+                  .value=${entry.used ?? 0}
+                  .high=${(entry.limit ?? 1) * 0.8}
+                  .optimum=${0}
+                  aria-labelledby=${`usage-${i}`}
+                ></meter>` : null}
+        </dd>
+      </div>`;
+  })}
+  </dl>`;
+};
+export {
+  usageMeterTemplate
+};

package/dist/prod/voice/recorder.js

@@ -0,0 +1,39 @@
+function mediaError(error) {
+  const name = error?.name;
+  return name === "NotAllowedError" || name === "SecurityError" ? "permission-denied" : name === "NotFoundError" || name === "OverconstrainedError" || name === "NotReadableError" ? "no-device" : "other";
+}
+function createRecorderAdapter(options) {
+  return {
+    supported: typeof navigator < "u" && !!navigator.mediaDevices?.getUserMedia && typeof MediaRecorder < "u",
+    start(handlers) {
+      const abort = new AbortController();
+      let stream, recorder, finished = !1;
+      const chunks = [], releaseTracks = () => {
+        stream?.getTracks().forEach((track) => track.stop()), stream = void 0;
+      }, end = (reason, error) => {
+        finished || (finished = !0, releaseTracks(), handlers.ended(reason, error));
+      };
+      return navigator.mediaDevices.getUserMedia({ audio: !0 }).then((media) => {
+        if (abort.signal.aborted) {
+          media.getTracks().forEach((t) => t.stop());
+          return;
+        }
+        stream = media, media.getTracks().forEach((t) => t.addEventListener("ended", () => end("error", "interrupted"), { once: !0 })), recorder = new MediaRecorder(media, options.mimeType ? { mimeType: options.mimeType } : void 0), recorder.addEventListener("dataavailable", (e) => e.data.size && chunks.push(e.data)), recorder.addEventListener("stop", () => {
+          releaseTracks(), !(abort.signal.aborted || finished) && (handlers.processing(), options.transcribe(new Blob(chunks, { type: recorder?.mimeType ?? "" }), abort.signal).then((text) => {
+            abort.signal.aborted || (text && handlers.final(text), end("stopped"));
+          }).catch(() => !abort.signal.aborted && end("error", "network")));
+        }), recorder.start(), handlers.started();
+      }).catch((error) => !abort.signal.aborted && end("error", mediaError(error))), {
+        stop() {
+          recorder?.state === "recording" ? recorder.stop() : recorder || (abort.abort(), end("stopped"));
+        },
+        cancel() {
+          finished = !0, abort.abort(), recorder?.state === "recording" && recorder.stop(), releaseTracks();
+        }
+      };
+    }
+  };
+}
+export {
+  createRecorderAdapter
+};

package/dist/prod/voice/web-speech.js

@@ -0,0 +1,67 @@
+const ERRORS = {
+  "not-allowed": "permission-denied",
+  "service-not-allowed": "permission-denied",
+  "audio-capture": "no-device",
+  network: "network",
+  aborted: "interrupted"
+};
+function recognitionConstructor() {
+  const scope = globalThis;
+  return scope.SpeechRecognition ?? scope.webkitSpeechRecognition;
+}
+function createWebSpeechAdapter(options = {}) {
+  const Ctor = recognitionConstructor();
+  return {
+    supported: !!Ctor,
+    start(handlers) {
+      if (!Ctor)
+        return queueMicrotask(() => handlers.ended("error", "no-device")), { stop() {
+        }, cancel() {
+        } };
+      const recognition = new Ctor();
+      recognition.continuous = !0, recognition.interimResults = !0, options.lang && (recognition.lang = options.lang);
+      let ended = !1, failure, cancelled = !1;
+      const listeners = [
+        ["start", () => handlers.started()],
+        [
+          "result",
+          (event) => {
+            const e = event;
+            let interim = "";
+            for (let i = e.resultIndex; i < e.results.length; i++) {
+              const result = e.results[i];
+              result.isFinal ? handlers.final(result[0].transcript.trim()) : interim += result[0].transcript;
+            }
+            handlers.interim(interim);
+          }
+        ],
+        [
+          "error",
+          (event) => failure = ERRORS[event.error] ?? "other"
+        ],
+        [
+          "end",
+          () => {
+            ended || (ended = !0, release(), cancelled || handlers.ended(failure ? "error" : "stopped", failure));
+          }
+        ]
+      ], release = () => {
+        for (const [type, listener] of listeners)
+          recognition.removeEventListener(type, listener);
+      };
+      for (const [type, listener] of listeners)
+        recognition.addEventListener(type, listener);
+      return recognition.start(), {
+        stop() {
+          ended || (handlers.processing(), recognition.stop());
+        },
+        cancel() {
+          cancelled = !0, ended || (ended = !0, release(), recognition.abort());
+        }
+      };
+    }
+  };
+}
+export {
+  createWebSpeechAdapter
+};

package/dist/prod/voice-input/index.js

@@ -0,0 +1,11 @@
+import { OddkinVoiceInput, VOICE_INPUT_STRINGS } from "./voice-input.js";
+import { voiceInputTemplate } from "./voice-input.template.js";
+import { voiceInputStyles } from "./voice-input.styles.js";
+import { voiceInputDefinition } from "./voice-input.definition.js";
+export {
+  OddkinVoiceInput,
+  VOICE_INPUT_STRINGS,
+  voiceInputDefinition,
+  voiceInputStyles,
+  voiceInputTemplate
+};

package/dist/prod/voice-input/voice-input.define.js

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

package/dist/prod/voice-input/voice-input.definition.js

@@ -0,0 +1,16 @@
+import { compose } from "@oddkin/core/element";
+import { aiBaseStyles } from "../internal/base.styles.js";
+import { transcriptDefinition } from "../transcript/transcript.definition.js";
+import { OddkinVoiceInput } from "./voice-input.js";
+import { voiceInputStyles } from "./voice-input.styles.js";
+import { voiceInputTemplate } from "./voice-input.template.js";
+const voiceInputDefinition = compose({
+  name: "odd-voice-input",
+  element: OddkinVoiceInput,
+  template: voiceInputTemplate,
+  styles: [aiBaseStyles, voiceInputStyles],
+  dependencies: { transcript: transcriptDefinition }
+});
+export {
+  voiceInputDefinition
+};

package/dist/prod/voice-input/voice-input.js

@@ -0,0 +1,92 @@
+import { OddkinElement, prop } from "@oddkin/core/element";
+import { signal } from "@oddkin/core/reactive";
+import { VoiceController } from "../controllers/voice.js";
+import { announceEvent, voiceTranscriptEvent } from "../events.js";
+import { strings } from "../internal/strings.js";
+const VOICE_INPUT_STRINGS = {
+  start: "Start voice input",
+  stop: "Stop recording",
+  cancel: "Cancel recording",
+  use: "Use transcript",
+  clear: "Clear",
+  unsupported: "Voice input is not available in this browser or app.",
+  idle: "",
+  "requesting-permission": "Waiting for microphone permission\u2026",
+  recording: "Listening\u2026",
+  processing: "Transcribing\u2026",
+  denied: "Microphone permission was denied. Allow it in your browser settings to use voice input.",
+  unavailable: "No microphone is available.",
+  interrupted: "Recording was interrupted.",
+  error: "Voice input failed. Try again."
+};
+class OddkinVoiceInput extends OddkinElement.with({
+  adapter: prop.object({
+    description: "Capture and transcription adapter (owned controller only)."
+  }),
+  controller: prop.object({
+    description: "Host-owned controller; the host also owns its cleanup."
+  }),
+  disabled: prop.boolean({
+    reflect: !0,
+    description: "Voice input is unavailable (e.g. capability off)."
+  }),
+  strings: prop.object({
+    description: "Localized string overrides."
+  })
+}) {
+  static events = {
+    "odd-voice-transcript": voiceTranscriptEvent,
+    "odd-announce": announceEvent
+  };
+  #owned;
+  /** @internal Mirror of the active controller state. */
+  _state = signal({ status: "unsupported", interim: "", segments: [] });
+  /** @internal */
+  get _strings() {
+    return strings(VOICE_INPUT_STRINGS, this.strings);
+  }
+  /** The controller in use (host-supplied or owned). */
+  get activeController() {
+    return this.controller ?? (this.#owned ??= new VoiceController(this.adapter));
+  }
+  /** @internal */
+  _toggle = () => {
+    const controller = this.activeController;
+    this.disabled || (controller.active ? controller.stop() : controller.start());
+  };
+  /** @internal */
+  _cancel = () => this.activeController.cancel();
+  /** @internal */
+  _clear = () => this.activeController.clear();
+  /** @internal */
+  _use = () => {
+    const text = this._state.peek().segments.map((s) => s.text).join(" ").trim();
+    text && this.emit(voiceTranscriptEvent, { text });
+  };
+  connected(scope) {
+    scope.listen(this, "keydown", (event) => {
+      event.key === "Escape" && this.activeController.active && (event.stopPropagation(), this.activeController.cancel());
+    }), scope.effect((run) => {
+      if (!this.controller) {
+        const adapter = this.adapter;
+        this.#owned ? this.#owned.setAdapter(adapter) : this.#owned = new VoiceController(adapter);
+      }
+      const controller = this.activeController;
+      let previous;
+      run.effect(() => {
+        const state = controller.state.value;
+        this._state.value = state;
+        const t = this._strings;
+        previous && previous !== state.status && ["denied", "unavailable", "interrupted", "error"].includes(state.status) && this.emit(announceEvent, {
+          text: t[state.status],
+          priority: "polite",
+          key: `voice:${state.status}:${Date.now()}`
+        }), previous = state.status;
+      });
+    }, { name: "<odd-voice-input> controller" }), scope.add(() => this.#owned?.cancel(), "voice session");
+  }
+}
+export {
+  OddkinVoiceInput,
+  VOICE_INPUT_STRINGS
+};

package/dist/prod/voice-input/voice-input.recipe.js

@@ -0,0 +1,9 @@
+import { defineLayoutRecipe, stack } from "@oddkin/components/layout";
+import { token } from "@oddkin/tokens/refs";
+const voiceInputRecipe = defineLayoutRecipe({
+  name: "voice-input",
+  regions: { base: stack({ gap: token("space.xs") }) }
+});
+export {
+  voiceInputRecipe
+};

package/dist/prod/voice-input/voice-input.recipe.styles.js

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

package/dist/prod/voice-input/voice-input.styles.js

@@ -0,0 +1,52 @@
+import { css } from "@oddkin/core/styles";
+import { token } from "@oddkin/tokens/refs";
+import { voiceInputRecipeStyles } from "./voice-input.recipe.styles.js";
+const voiceInputStyles = css`
+  ${voiceInputRecipeStyles}
+  .record {
+    display: inline-flex;
+    align-items: center;
+    gap: ${token("space.xs")};
+  }
+  .dot {
+    inline-size: 0.625rem;
+    block-size: 0.625rem;
+    border-radius: ${token("radius.full")};
+    background: ${token("color.text.secondary")};
+  }
+  .record[aria-pressed='true'] .dot {
+    background: ${token("color.danger.foreground")};
+    animation: odd-voice-pulse 1s ease-in-out infinite;
+  }
+  @keyframes odd-voice-pulse {
+    50% {
+      opacity: 0.35;
+    }
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .record[aria-pressed='true'] .dot {
+      animation: none;
+    }
+  }
+  .status-text {
+    margin: 0;
+    font-size: ${token("font.size.sm")};
+    color: ${token("color.text.secondary")};
+  }
+  .status-text:is(
+    [data-status='denied'],
+    [data-status='unavailable'],
+    [data-status='interrupted'],
+    [data-status='error']
+  ) {
+    color: ${token("color.danger.foreground")};
+  }
+  @media (forced-colors: active) {
+    .dot {
+      background: CanvasText;
+    }
+  }
+`;
+export {
+  voiceInputStyles
+};

package/dist/prod/voice-input/voice-input.template.js

@@ -0,0 +1,47 @@
+import { html } from "@oddkin/core/template";
+const voiceInputTemplate = (host) => {
+  const t = host._strings, state = host._state.value, unsupported = state.status === "unsupported", recording = state.status === "recording" || state.status === "requesting-permission", status = unsupported ? t.unsupported : t[state.status], hasText = state.segments.some((s) => s.text.trim());
+  return html`<div class="base" part="base">
+    <div part="controls" class="actions">
+      <button
+        class="record text-button"
+        type="button"
+        aria-pressed=${recording ? "true" : "false"}
+        ?disabled=${host.disabled || unsupported || state.status === "processing"}
+        @click=${host._toggle}
+      >
+        <span class="dot" aria-hidden="true"></span>${recording ? t.stop : t.start}
+      </button>
+      <button class="text-button" type="button" ?hidden=${!recording} @click=${host._cancel}>
+        ${t.cancel}
+      </button>
+      <button
+        class="text-button"
+        type="button"
+        ?hidden=${recording || !hasText}
+        @click=${host._use}
+      >
+        ${t.use}
+      </button>
+      <button
+        class="text-button"
+        type="button"
+        ?hidden=${recording || !hasText}
+        @click=${host._clear}
+      >
+        ${t.clear}
+      </button>
+    </div>
+    <p part="status" class="status-text" data-status=${state.status} ?hidden=${!status}>
+      ${status}
+    </p>
+    <odd-transcript
+      .segments=${state.segments}
+      .interim=${state.interim}
+      ?hidden=${!hasText && !state.interim}
+    ></odd-transcript>
+  </div>`;
+};
+export {
+  voiceInputTemplate
+};

package/dist/prompt-input/index.d.ts

@@ -0,0 +1,5 @@
+export { OddkinPromptInput, PROMPT_INPUT_STRINGS } from './prompt-input.js';
+export { promptInputTemplate } from './prompt-input.template.js';
+export { promptInputStyles } from './prompt-input.styles.js';
+export { promptInputDefinition } from './prompt-input.definition.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/prompt-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/prompt-input/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC"}

package/dist/prompt-input/index.js

@@ -0,0 +1,6 @@
+// Side-effect free. Register with `@oddkin/ai/define/prompt-input`.
+export { OddkinPromptInput, PROMPT_INPUT_STRINGS } from './prompt-input.js';
+export { promptInputTemplate } from './prompt-input.template.js';
+export { promptInputStyles } from './prompt-input.styles.js';
+export { promptInputDefinition } from './prompt-input.definition.js';
+//# sourceMappingURL=index.js.map

package/dist/prompt-input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/prompt-input/index.ts"],"names":[],"mappings":"AAAA,oEAAoE;AACpE,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC"}