@corti/dictation-web 0.0.0-rc.359 → 0.0.0-test.571

package/dist/components/device-selector.js

@@ -0,0 +1,75 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _DictationDeviceSelector_instances, _DictationDeviceSelector_handleSelectDevice;
+import { consume } from "@lit/context";
+import { html, LitElement } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { devicesContext, selectedDeviceContext, } from "../contexts/dictation-context.js";
+import SelectStyles from "../styles/select.js";
+import { recordingDevicesChangedEvent } from "../utils/events.js";
+let DictationDeviceSelector = class DictationDeviceSelector extends LitElement {
+    constructor() {
+        super(...arguments);
+        _DictationDeviceSelector_instances.add(this);
+        this.disabled = false;
+    }
+    render() {
+        return html `
+      <div>
+        <label id="device-select-label" for="device-select">
+          Recording Device
+        </label>
+        <select
+          id="device-select"
+          aria-labelledby="device-select-label"
+          @change=${__classPrivateFieldGet(this, _DictationDeviceSelector_instances, "m", _DictationDeviceSelector_handleSelectDevice)}
+          ?disabled=${this.disabled || !this._devices || this._devices.length === 0}
+        >
+          ${this._devices?.map((device) => html `
+              <option
+                value=${device.deviceId}
+                ?selected=${this._selectedDevice?.deviceId === device.deviceId}
+              >
+                ${device.label || "Unknown Device"}
+              </option>
+            `)}
+        </select>
+      </div>
+    `;
+    }
+};
+_DictationDeviceSelector_instances = new WeakSet();
+_DictationDeviceSelector_handleSelectDevice = function _DictationDeviceSelector_handleSelectDevice(e) {
+    const deviceId = e.target.value;
+    const device = this._devices?.find((d) => d.deviceId === deviceId);
+    if (!device) {
+        return;
+    }
+    this.dispatchEvent(recordingDevicesChangedEvent(this._devices || [], device));
+};
+DictationDeviceSelector.styles = SelectStyles;
+__decorate([
+    consume({ context: devicesContext, subscribe: true }),
+    state()
+], DictationDeviceSelector.prototype, "_devices", void 0);
+__decorate([
+    consume({ context: selectedDeviceContext, subscribe: true }),
+    state()
+], DictationDeviceSelector.prototype, "_selectedDevice", void 0);
+__decorate([
+    property({ type: Boolean })
+], DictationDeviceSelector.prototype, "disabled", void 0);
+DictationDeviceSelector = __decorate([
+    customElement("dictation-device-selector")
+], DictationDeviceSelector);
+export { DictationDeviceSelector };
+//# sourceMappingURL=device-selector.js.map

package/dist/components/device-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"device-selector.js","sourceRoot":"","sources":["../../src/components/device-selector.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EACL,cAAc,EACd,qBAAqB,GACtB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,4BAA4B,EAAE,MAAM,oBAAoB,CAAC;AAG3D,IAAM,uBAAuB,GAA7B,MAAM,uBAAwB,SAAQ,UAAU;IAAhD;;;QAUL,aAAQ,GAAY,KAAK,CAAC;IA2C5B,CAAC;IA1BC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;;;;oBAQK,uBAAA,IAAI,uFAAoB;sBACtB,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC;;YAEvE,IAAI,CAAC,QAAQ,EAAE,GAAG,CAClB,CAAC,MAAM,EAAE,EAAE,CAAC,IAAI,CAAA;;wBAEJ,MAAM,CAAC,QAAQ;4BACX,IAAI,CAAC,eAAe,EAAE,QAAQ,KAAK,MAAM,CAAC,QAAQ;;kBAE5D,MAAM,CAAC,KAAK,IAAI,gBAAgB;;aAErC,CACF;;;KAGN,CAAC;IACJ,CAAC;;;mGAtCmB,CAAQ;IAC1B,MAAM,QAAQ,GAAI,CAAC,CAAC,MAA4B,CAAC,KAAK,CAAC;IACvD,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC;IAEnE,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,OAAO;IACT,CAAC;IAED,IAAI,CAAC,aAAa,CAChB,4BAA4B,CAAC,IAAI,CAAC,QAAQ,IAAI,EAAE,EAAE,MAAM,CAAC,CAC1D,CAAC;AACJ,CAAC;AAbM,8BAAM,GAAG,YAAY,AAAf,CAAgB;AAT7B;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACrD,KAAK,EAAE;yDACqB;AAI7B;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,qBAAqB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAC5D,KAAK,EAAE;gEAC0B;AAGlC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yDACF;AAVf,uBAAuB;IADnC,aAAa,CAAC,2BAA2B,CAAC;GAC9B,uBAAuB,CAqDnC","sourcesContent":["import { consume } from \"@lit/context\";\nimport { html, LitElement } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport {\n  devicesContext,\n  selectedDeviceContext,\n} from \"../contexts/dictation-context.js\";\nimport SelectStyles from \"../styles/select.js\";\nimport { recordingDevicesChangedEvent } from \"../utils/events.js\";\n\n@customElement(\"dictation-device-selector\")\nexport class DictationDeviceSelector extends LitElement {\n  @consume({ context: devicesContext, subscribe: true })\n  @state()\n  _devices?: MediaDeviceInfo[];\n\n  @consume({ context: selectedDeviceContext, subscribe: true })\n  @state()\n  _selectedDevice?: MediaDeviceInfo;\n\n  @property({ type: Boolean })\n  disabled: boolean = false;\n\n  static styles = SelectStyles;\n\n  #handleSelectDevice(e: Event): void {\n    const deviceId = (e.target as HTMLSelectElement).value;\n    const device = this._devices?.find((d) => d.deviceId === deviceId);\n\n    if (!device) {\n      return;\n    }\n\n    this.dispatchEvent(\n      recordingDevicesChangedEvent(this._devices || [], device),\n    );\n  }\n\n  render() {\n    return html`\n      <div>\n        <label id=\"device-select-label\" for=\"device-select\">\n          Recording Device\n        </label>\n        <select\n          id=\"device-select\"\n          aria-labelledby=\"device-select-label\"\n          @change=${this.#handleSelectDevice}\n          ?disabled=${this.disabled || !this._devices || this._devices.length === 0}\n        >\n          ${this._devices?.map(\n            (device) => html`\n              <option\n                value=${device.deviceId}\n                ?selected=${this._selectedDevice?.deviceId === device.deviceId}\n              >\n                ${device.label || \"Unknown Device\"}\n              </option>\n            `,\n          )}\n        </select>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"dictation-device-selector\": DictationDeviceSelector;\n  }\n}\n"]}

package/dist/components/keybinding-selector.d.ts

@@ -0,0 +1,14 @@
+import { LitElement } from "lit";
+export declare class DictationKeybindingSelector extends LitElement {
+    #private;
+    _keybinding?: string | null;
+    disabled: boolean;
+    _isCapturingKeybinding: boolean;
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "dictation-keybinding-selector": DictationKeybindingSelector;
+    }
+}

package/dist/components/keybinding-selector.js

@@ -0,0 +1,81 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _DictationKeybindingSelector_instances, _DictationKeybindingSelector_handleKeybindingInputFocus, _DictationKeybindingSelector_handleKeybindingInputBlur, _DictationKeybindingSelector_handleKeybindingKeyDown;
+import { consume } from "@lit/context";
+import { html, LitElement } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { keybindingContext } from "../contexts/dictation-context.js";
+import KeybindingSelectorStyles from "../styles/keybinding-selector.js";
+import { keybindingChangedEvent } from "../utils/events.js";
+let DictationKeybindingSelector = class DictationKeybindingSelector extends LitElement {
+    constructor() {
+        super(...arguments);
+        _DictationKeybindingSelector_instances.add(this);
+        this.disabled = false;
+        this._isCapturingKeybinding = false;
+    }
+    render() {
+        return html `
+      <div>
+        <label>Keybinding</label>
+        <div class="keybinding-selector-wrapper">
+          <div class="keybinding-key">${this._keybinding}</div>
+          <input
+            type="text"
+            class="keybinding-selector-input"
+            .value=""
+            placeholder="Click and press a key..."
+            readonly
+            @focusin=${__classPrivateFieldGet(this, _DictationKeybindingSelector_instances, "m", _DictationKeybindingSelector_handleKeybindingInputFocus)}
+            @focusout=${__classPrivateFieldGet(this, _DictationKeybindingSelector_instances, "m", _DictationKeybindingSelector_handleKeybindingInputBlur)}
+            @keydown=${__classPrivateFieldGet(this, _DictationKeybindingSelector_instances, "m", _DictationKeybindingSelector_handleKeybindingKeyDown)}
+            ?disabled=${this.disabled}
+          />
+        </div>
+        <p class="keybinding-help">
+          Press ${this._keybinding} to start/stop recording
+        </p>
+      </div>
+    `;
+    }
+};
+_DictationKeybindingSelector_instances = new WeakSet();
+_DictationKeybindingSelector_handleKeybindingInputFocus = function _DictationKeybindingSelector_handleKeybindingInputFocus() {
+    this._isCapturingKeybinding = true;
+};
+_DictationKeybindingSelector_handleKeybindingInputBlur = function _DictationKeybindingSelector_handleKeybindingInputBlur() {
+    this._isCapturingKeybinding = false;
+};
+_DictationKeybindingSelector_handleKeybindingKeyDown = function _DictationKeybindingSelector_handleKeybindingKeyDown(event) {
+    if (!this._isCapturingKeybinding) {
+        return;
+    }
+    event.preventDefault();
+    event.stopPropagation();
+    this.dispatchEvent(keybindingChangedEvent(event.key, event.code));
+};
+DictationKeybindingSelector.styles = KeybindingSelectorStyles;
+__decorate([
+    consume({ context: keybindingContext, subscribe: true }),
+    state()
+], DictationKeybindingSelector.prototype, "_keybinding", void 0);
+__decorate([
+    property({ type: Boolean })
+], DictationKeybindingSelector.prototype, "disabled", void 0);
+__decorate([
+    state()
+], DictationKeybindingSelector.prototype, "_isCapturingKeybinding", void 0);
+DictationKeybindingSelector = __decorate([
+    customElement("dictation-keybinding-selector")
+], DictationKeybindingSelector);
+export { DictationKeybindingSelector };
+//# sourceMappingURL=keybinding-selector.js.map

package/dist/components/keybinding-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"keybinding-selector.js","sourceRoot":"","sources":["../../src/components/keybinding-selector.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AACrE,OAAO,wBAAwB,MAAM,kCAAkC,CAAC;AACxE,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAGrD,IAAM,2BAA2B,GAAjC,MAAM,2BAA4B,SAAQ,UAAU;IAApD;;;QAML,aAAQ,GAAY,KAAK,CAAC;QAG1B,2BAAsB,GAAY,KAAK,CAAC;IA+C1C,CAAC;IAxBC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;wCAIyB,IAAI,CAAC,WAAW;;;;;;;uBAOjC,uBAAA,IAAI,uGAA4B;wBAC/B,uBAAA,IAAI,sGAA2B;uBAChC,uBAAA,IAAI,oGAAyB;wBAC5B,IAAI,CAAC,QAAQ;;;;kBAInB,IAAI,CAAC,WAAW;;;KAG7B,CAAC;IACJ,CAAC;;;;IAzCC,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC;AACrC,CAAC;;IAGC,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC;AACtC,CAAC;qHAEwB,KAAoB;IAC3C,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE,CAAC;QACjC,OAAO;IACT,CAAC;IAED,KAAK,CAAC,cAAc,EAAE,CAAC;IACvB,KAAK,CAAC,eAAe,EAAE,CAAC;IAExB,IAAI,CAAC,aAAa,CAAC,sBAAsB,CAAC,KAAK,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;AACpE,CAAC;AAnBM,kCAAM,GAAG,wBAAwB,AAA3B,CAA4B;AARzC;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACxD,KAAK,EAAE;gEACoB;AAG5B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6DACF;AAG1B;IADC,KAAK,EAAE;2EACgC;AAT7B,2BAA2B;IADvC,aAAa,CAAC,+BAA+B,CAAC;GAClC,2BAA2B,CAwDvC","sourcesContent":["import { consume } from \"@lit/context\";\nimport { html, LitElement } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { keybindingContext } from \"../contexts/dictation-context.js\";\nimport KeybindingSelectorStyles from \"../styles/keybinding-selector.js\";\nimport { keybindingChangedEvent } from \"../utils/events.js\";\n\n@customElement(\"dictation-keybinding-selector\")\nexport class DictationKeybindingSelector extends LitElement {\n  @consume({ context: keybindingContext, subscribe: true })\n  @state()\n  _keybinding?: string | null;\n\n  @property({ type: Boolean })\n  disabled: boolean = false;\n\n  @state()\n  _isCapturingKeybinding: boolean = false;\n\n  static styles = KeybindingSelectorStyles;\n\n  #handleKeybindingInputFocus(): void {\n    this._isCapturingKeybinding = true;\n  }\n\n  #handleKeybindingInputBlur(): void {\n    this._isCapturingKeybinding = false;\n  }\n\n  #handleKeybindingKeyDown(event: KeyboardEvent): void {\n    if (!this._isCapturingKeybinding) {\n      return;\n    }\n\n    event.preventDefault();\n    event.stopPropagation();\n\n    this.dispatchEvent(keybindingChangedEvent(event.key, event.code));\n  }\n\n  render() {\n    return html`\n      <div>\n        <label>Keybinding</label>\n        <div class=\"keybinding-selector-wrapper\">\n          <div class=\"keybinding-key\">${this._keybinding}</div>\n          <input\n            type=\"text\"\n            class=\"keybinding-selector-input\"\n            .value=\"\"\n            placeholder=\"Click and press a key...\"\n            readonly\n            @focusin=${this.#handleKeybindingInputFocus}\n            @focusout=${this.#handleKeybindingInputBlur}\n            @keydown=${this.#handleKeybindingKeyDown}\n            ?disabled=${this.disabled}\n          />\n        </div>\n        <p class=\"keybinding-help\">\n          Press ${this._keybinding} to start/stop recording\n        </p>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"dictation-keybinding-selector\": DictationKeybindingSelector;\n  }\n}\n"]}

package/dist/components/language-selector.d.ts

@@ -0,0 +1,15 @@
+import type { Corti } from "@corti/sdk";
+import { LitElement } from "lit";
+export declare class DictationLanguageSelector extends LitElement {
+    #private;
+    _languages?: Corti.TranscribeSupportedLanguage[];
+    _dictationConfig?: Corti.TranscribeConfig;
+    disabled: boolean;
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "dictation-language-selector": DictationLanguageSelector;
+    }
+}

package/dist/components/language-selector.js

@@ -0,0 +1,74 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _DictationLanguageSelector_instances, _DictationLanguageSelector_handleSelectLanguage;
+import { consume } from "@lit/context";
+import { html, LitElement } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { dictationConfigContext, languagesContext, } from "../contexts/dictation-context.js";
+import SelectStyles from "../styles/select.js";
+import { languageChangedEvent, languagesChangedEvent, } from "../utils/events.js";
+import { getLanguageName } from "../utils/languages.js";
+let DictationLanguageSelector = class DictationLanguageSelector extends LitElement {
+    constructor() {
+        super(...arguments);
+        _DictationLanguageSelector_instances.add(this);
+        this.disabled = false;
+    }
+    render() {
+        return html `
+      <div>
+        <label id="language-select-label" for="language-select">
+          Dictation Language
+        </label>
+        <select
+          id="language-select"
+          aria-labelledby="language-select-label"
+          @change=${__classPrivateFieldGet(this, _DictationLanguageSelector_instances, "m", _DictationLanguageSelector_handleSelectLanguage)}
+          ?disabled=${this.disabled || !this._languages || this._languages.length === 0}
+        >
+          ${this._languages?.map((language) => html `
+              <option
+                value=${language}
+                ?selected=${this._dictationConfig?.primaryLanguage === language}
+              >
+                ${getLanguageName(language)}
+              </option>
+            `)}
+        </select>
+      </div>
+    `;
+    }
+};
+_DictationLanguageSelector_instances = new WeakSet();
+_DictationLanguageSelector_handleSelectLanguage = function _DictationLanguageSelector_handleSelectLanguage(e) {
+    const language = e.target.value;
+    this.dispatchEvent(languagesChangedEvent(this._languages || [], language));
+    // Dispatch backward compatible event
+    this.dispatchEvent(languageChangedEvent(language));
+};
+DictationLanguageSelector.styles = SelectStyles;
+__decorate([
+    consume({ context: languagesContext, subscribe: true }),
+    state()
+], DictationLanguageSelector.prototype, "_languages", void 0);
+__decorate([
+    consume({ context: dictationConfigContext, subscribe: true }),
+    state()
+], DictationLanguageSelector.prototype, "_dictationConfig", void 0);
+__decorate([
+    property({ type: Boolean })
+], DictationLanguageSelector.prototype, "disabled", void 0);
+DictationLanguageSelector = __decorate([
+    customElement("dictation-language-selector")
+], DictationLanguageSelector);
+export { DictationLanguageSelector };
+//# sourceMappingURL=language-selector.js.map

package/dist/components/language-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"language-selector.js","sourceRoot":"","sources":["../../src/components/language-selector.ts"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EACL,sBAAsB,EACtB,gBAAgB,GACjB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EACL,oBAAoB,EACpB,qBAAqB,GACtB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAGjD,IAAM,yBAAyB,GAA/B,MAAM,yBAA0B,SAAQ,UAAU;IAAlD;;;QAUL,aAAQ,GAAY,KAAK,CAAC;IAuC5B,CAAC;IA1BC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;;;;oBAQK,uBAAA,IAAI,6FAAsB;sBACxB,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,KAAK,CAAC;;YAE3E,IAAI,CAAC,UAAU,EAAE,GAAG,CACpB,CAAC,QAAQ,EAAE,EAAE,CAAC,IAAI,CAAA;;wBAEN,QAAQ;4BACJ,IAAI,CAAC,gBAAgB,EAAE,eAAe,KAAK,QAAQ;;kBAE7D,eAAe,CAAC,QAAQ,CAAC;;aAE9B,CACF;;;KAGN,CAAC;IACJ,CAAC;;;2GAlCqB,CAAQ;IAC5B,MAAM,QAAQ,GAAI,CAAC,CAAC,MAA4B,CAAC,KAAK,CAAC;IAEvD,IAAI,CAAC,aAAa,CAAC,qBAAqB,CAAC,IAAI,CAAC,UAAU,IAAI,EAAE,EAAE,QAAQ,CAAC,CAAC,CAAC;IAE3E,qCAAqC;IACrC,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAC,QAAQ,CAAC,CAAC,CAAC;AACrD,CAAC;AATM,gCAAM,GAAG,YAAY,AAAf,CAAgB;AAT7B;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACvD,KAAK,EAAE;6DACyC;AAIjD;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,sBAAsB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAC7D,KAAK,EAAE;mEACkC;AAG1C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2DACF;AAVf,yBAAyB;IADrC,aAAa,CAAC,6BAA6B,CAAC;GAChC,yBAAyB,CAiDrC","sourcesContent":["import type { Corti } from \"@corti/sdk\";\nimport { consume } from \"@lit/context\";\nimport { html, LitElement } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport {\n  dictationConfigContext,\n  languagesContext,\n} from \"../contexts/dictation-context.js\";\nimport SelectStyles from \"../styles/select.js\";\nimport {\n  languageChangedEvent,\n  languagesChangedEvent,\n} from \"../utils/events.js\";\nimport { getLanguageName } from \"../utils/languages.js\";\n\n@customElement(\"dictation-language-selector\")\nexport class DictationLanguageSelector extends LitElement {\n  @consume({ context: languagesContext, subscribe: true })\n  @state()\n  _languages?: Corti.TranscribeSupportedLanguage[];\n\n  @consume({ context: dictationConfigContext, subscribe: true })\n  @state()\n  _dictationConfig?: Corti.TranscribeConfig;\n\n  @property({ type: Boolean })\n  disabled: boolean = false;\n\n  static styles = SelectStyles;\n\n  #handleSelectLanguage(e: Event): void {\n    const language = (e.target as HTMLSelectElement).value;\n\n    this.dispatchEvent(languagesChangedEvent(this._languages || [], language));\n\n    // Dispatch backward compatible event\n    this.dispatchEvent(languageChangedEvent(language));\n  }\n\n  render() {\n    return html`\n      <div>\n        <label id=\"language-select-label\" for=\"language-select\">\n          Dictation Language\n        </label>\n        <select\n          id=\"language-select\"\n          aria-labelledby=\"language-select-label\"\n          @change=${this.#handleSelectLanguage}\n          ?disabled=${this.disabled || !this._languages || this._languages.length === 0}\n        >\n          ${this._languages?.map(\n            (language) => html`\n              <option\n                value=${language}\n                ?selected=${this._dictationConfig?.primaryLanguage === language}\n              >\n                ${getLanguageName(language)}\n              </option>\n            `,\n          )}\n        </select>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"dictation-language-selector\": DictationLanguageSelector;\n  }\n}\n"]}

package/dist/components/mode-selector.d.ts

@@ -0,0 +1,14 @@
+import { LitElement } from "lit";
+import type { DictationMode } from "../types.js";
+export declare class DictationModeSelector extends LitElement {
+    #private;
+    _mode: DictationMode;
+    disabled: boolean;
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "dictation-mode-selector": DictationModeSelector;
+    }
+}

package/dist/components/mode-selector.js

@@ -0,0 +1,73 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _DictationModeSelector_instances, _DictationModeSelector_handleModeChange;
+import { consume } from "@lit/context";
+import { html, LitElement } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { classMap } from "lit/directives/class-map.js";
+import { modeContext } from "../contexts/dictation-context.js";
+import ModeSelectorStyles from "../styles/mode-selector.js";
+import { modeChangedEvent } from "../utils/events.js";
+let DictationModeSelector = class DictationModeSelector extends LitElement {
+    constructor() {
+        super(...arguments);
+        _DictationModeSelector_instances.add(this);
+        this._mode = "toggle-to-talk";
+        this.disabled = false;
+    }
+    render() {
+        return html `
+      <div>
+        <label>Dictation Mode</label>
+        <div class="mode-selector-tabs">
+          <button
+            class=${classMap({
+            active: this._mode === "toggle-to-talk",
+            "mode-selector-tab": true,
+        })}
+            @click=${() => __classPrivateFieldGet(this, _DictationModeSelector_instances, "m", _DictationModeSelector_handleModeChange).call(this, "toggle-to-talk")}
+            ?disabled=${this.disabled}
+          >
+            Toggle-to-Talk
+          </button>
+          <button
+            class=${classMap({
+            active: this._mode === "push-to-talk",
+            "mode-selector-tab": true,
+        })}
+            @click=${() => __classPrivateFieldGet(this, _DictationModeSelector_instances, "m", _DictationModeSelector_handleModeChange).call(this, "push-to-talk")}
+            ?disabled=${this.disabled}
+          >
+            Push-to-Talk
+          </button>
+        </div>
+      </div>
+    `;
+    }
+};
+_DictationModeSelector_instances = new WeakSet();
+_DictationModeSelector_handleModeChange = function _DictationModeSelector_handleModeChange(mode) {
+    this.dispatchEvent(modeChangedEvent(mode));
+};
+DictationModeSelector.styles = ModeSelectorStyles;
+__decorate([
+    consume({ context: modeContext, subscribe: true }),
+    state()
+], DictationModeSelector.prototype, "_mode", void 0);
+__decorate([
+    property({ type: Boolean })
+], DictationModeSelector.prototype, "disabled", void 0);
+DictationModeSelector = __decorate([
+    customElement("dictation-mode-selector")
+], DictationModeSelector);
+export { DictationModeSelector };
+//# sourceMappingURL=mode-selector.js.map

package/dist/components/mode-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mode-selector.js","sourceRoot":"","sources":["../../src/components/mode-selector.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAC/D,OAAO,kBAAkB,MAAM,4BAA4B,CAAC;AAE5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAG/C,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,UAAU;IAA9C;;;QAGL,UAAK,GAAkB,gBAAgB,CAAC;QAGxC,aAAQ,GAAY,KAAK,CAAC;IAqC5B,CAAC;IA7BC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;oBAKK,QAAQ,CAAC;YACf,MAAM,EAAE,IAAI,CAAC,KAAK,KAAK,gBAAgB;YACvC,mBAAmB,EAAE,IAAI;SAC1B,CAAC;qBACO,GAAG,EAAE,CAAC,uBAAA,IAAI,iFAAkB,MAAtB,IAAI,EAAmB,gBAAgB,CAAC;wBAC3C,IAAI,CAAC,QAAQ;;;;;oBAKjB,QAAQ,CAAC;YACf,MAAM,EAAE,IAAI,CAAC,KAAK,KAAK,cAAc;YACrC,mBAAmB,EAAE,IAAI;SAC1B,CAAC;qBACO,GAAG,EAAE,CAAC,uBAAA,IAAI,iFAAkB,MAAtB,IAAI,EAAmB,cAAc,CAAC;wBACzC,IAAI,CAAC,QAAQ;;;;;;KAMhC,CAAC;IACJ,CAAC;;;2FAhCiB,IAAmB;IACnC,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAC;AAC7C,CAAC;AAJM,4BAAM,GAAG,kBAAkB,AAArB,CAAsB;AALnC;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAClD,KAAK,EAAE;oDACgC;AAGxC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uDACF;AANf,qBAAqB;IADjC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,qBAAqB,CA2CjC","sourcesContent":["import { consume } from \"@lit/context\";\nimport { html, LitElement } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { modeContext } from \"../contexts/dictation-context.js\";\nimport ModeSelectorStyles from \"../styles/mode-selector.js\";\nimport type { DictationMode } from \"../types.js\";\nimport { modeChangedEvent } from \"../utils/events.js\";\n\n@customElement(\"dictation-mode-selector\")\nexport class DictationModeSelector extends LitElement {\n  @consume({ context: modeContext, subscribe: true })\n  @state()\n  _mode: DictationMode = \"toggle-to-talk\";\n\n  @property({ type: Boolean })\n  disabled: boolean = false;\n\n  static styles = ModeSelectorStyles;\n\n  #handleModeChange(mode: DictationMode): void {\n    this.dispatchEvent(modeChangedEvent(mode));\n  }\n\n  render() {\n    return html`\n      <div>\n        <label>Dictation Mode</label>\n        <div class=\"mode-selector-tabs\">\n          <button\n            class=${classMap({\n              active: this._mode === \"toggle-to-talk\",\n              \"mode-selector-tab\": true,\n            })}\n            @click=${() => this.#handleModeChange(\"toggle-to-talk\")}\n            ?disabled=${this.disabled}\n          >\n            Toggle-to-Talk\n          </button>\n          <button\n            class=${classMap({\n              active: this._mode === \"push-to-talk\",\n              \"mode-selector-tab\": true,\n            })}\n            @click=${() => this.#handleModeChange(\"push-to-talk\")}\n            ?disabled=${this.disabled}\n          >\n            Push-to-Talk\n          </button>\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"dictation-mode-selector\": DictationModeSelector;\n  }\n}\n"]}

package/dist/components/recording-button.d.ts

@@ -0,0 +1,31 @@
+import type { Corti } from "@corti/sdk";
+import { type CSSResultGroup, LitElement } from "lit";
+import type { DictationMode, ProxyOptions, RecordingState } from "../types.js";
+import "./audio-visualiser.js";
+import "../icons/icons.js";
+export declare class DictationRecordingButton extends LitElement {
+    #private;
+    _recordingState: RecordingState;
+    _selectedDevice?: MediaDeviceInfo;
+    _accessToken?: string;
+    _authConfig?: Corti.BearerOptions;
+    _region?: string;
+    _tenantName?: string;
+    _dictationConfig?: Corti.TranscribeConfig;
+    _socketUrl?: string;
+    _socketProxy?: ProxyOptions;
+    _debug_displayAudio?: boolean;
+    _keybinding?: string | null;
+    _mode?: DictationMode;
+    allowButtonFocus: boolean;
+    static styles: CSSResultGroup;
+    startRecording(): void;
+    stopRecording(): void;
+    toggleRecording(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "dictation-recording-button": DictationRecordingButton;
+    }
+}