@corti/dictation-web 0.5.0-rc → 0.5.0-rc.2

package/dist/components/corti-dictation.d.ts

@@ -1,6 +1,6 @@
 import type { Corti } from "@corti/sdk";
 import { LitElement } from "lit";
-import type { ConfigurableSettings, DictationMode, ProxyOptions, RecordingState } from "../types.js";
+import type { ConfigurableSettings, ProxyOptions, RecordingState } from "../types.js";
 import "../contexts/dictation-context.js";
 import "./recording-button.js";
 import "./settings-menu.js";
@@ -70,19 +70,23 @@ export declare class CortiDictation extends LitElement {
      */
     get recordingState(): RecordingState;
     /**
-     * Dictation mode: "toggle-to-talk" or "push-to-talk"
+     * Push-to-talk keybinding for keyboard shortcut. Single key only (e.g., "Space", "k", "meta", "ctrl").
+     * Combinations with "+" are not supported.
+     * Keydown starts recording, keyup stops recording.
+     * Defaults to "Space" if keybinding is in settingsEnabled, otherwise undefined
      */
-    set mode(value: DictationMode);
-    get mode(): DictationMode;
-    _mode?: DictationMode;
+    set pushToTalkKeybinding(value: string | null | undefined);
+    get pushToTalkKeybinding(): string | null | undefined;
+    _pushToTalkKeybinding?: string | null;
     /**
-     * Keybinding for keyboard shortcut. Single key only (e.g., "`", "k", "meta", "ctrl").
+     * Toggle-to-talk keybinding for keyboard shortcut. Single key only (e.g., "`", "k", "meta", "ctrl").
      * Combinations with "+" are not supported.
+     * Pressing the key toggles recording on/off.
      * Defaults to "`" if keybinding is in settingsEnabled, otherwise undefined
      */
-    set keybinding(value: string | null | undefined);
-    get keybinding(): string | null | undefined;
-    _keybinding?: string | null;
+    set toggleToTalkKeybinding(value: string | null | undefined);
+    get toggleToTalkKeybinding(): string | null | undefined;
+    _toggleToTalkKeybinding?: string | null;
     /**
      * Set the latest access token.
      * @returns ServerConfig with environment, tenant, and accessToken

package/dist/components/corti-dictation.js

@@ -45,7 +45,6 @@ let CortiDictation = class CortiDictation extends LitElement {
          */
         this.debug_displayAudio = false;
         this._dictationConfig = DEFAULT_DICTATION_CONFIG;
-        this._mode = "toggle-to-talk";
     }
     /**
      * List of all language codes available for use with the Web Component.
@@ -93,24 +92,30 @@ let CortiDictation = class CortiDictation extends LitElement {
         return __classPrivateFieldGet(this, _CortiDictation_contextProviderRef, "f").value?.recordingState || "stopped";
     }
     /**
-     * Dictation mode: "toggle-to-talk" or "push-to-talk"
+     * Push-to-talk keybinding for keyboard shortcut. Single key only (e.g., "Space", "k", "meta", "ctrl").
+     * Combinations with "+" are not supported.
+     * Keydown starts recording, keyup stops recording.
+     * Defaults to "Space" if keybinding is in settingsEnabled, otherwise undefined
      */
-    set mode(value) {
-        this._mode = value;
+    set pushToTalkKeybinding(value) {
+        this._pushToTalkKeybinding = value;
     }
-    get mode() {
-        return (__classPrivateFieldGet(this, _CortiDictation_contextProviderRef, "f").value?.mode || this._mode || "toggle-to-talk");
+    get pushToTalkKeybinding() {
+        return (__classPrivateFieldGet(this, _CortiDictation_contextProviderRef, "f").value?.pushToTalkKeybinding ||
+            this._pushToTalkKeybinding);
     }
     /**
-     * Keybinding for keyboard shortcut. Single key only (e.g., "`", "k", "meta", "ctrl").
+     * Toggle-to-talk keybinding for keyboard shortcut. Single key only (e.g., "`", "k", "meta", "ctrl").
      * Combinations with "+" are not supported.
+     * Pressing the key toggles recording on/off.
      * Defaults to "`" if keybinding is in settingsEnabled, otherwise undefined
      */
-    set keybinding(value) {
-        this._keybinding = value;
+    set toggleToTalkKeybinding(value) {
+        this._toggleToTalkKeybinding = value;
     }
-    get keybinding() {
-        return __classPrivateFieldGet(this, _CortiDictation_contextProviderRef, "f").value?.keybinding || this._keybinding;
+    get toggleToTalkKeybinding() {
+        return (__classPrivateFieldGet(this, _CortiDictation_contextProviderRef, "f").value?.toggleToTalkKeybinding ||
+            this._toggleToTalkKeybinding);
     }
     // ─────────────────────────────────────────────────────────────────────────────
     // Public methods
@@ -180,8 +185,8 @@ let CortiDictation = class CortiDictation extends LitElement {
         .devices=${this._devices}
         .selectedDevice=${this._selectedDevice}
         .debug_displayAudio=${this.debug_displayAudio}
-        .mode=${this._mode}
-        .keybinding=${this._keybinding}
+        .pushToTalkKeybinding=${this._pushToTalkKeybinding}
+        .toggleToTalkKeybinding=${this._toggleToTalkKeybinding}
       >
         <dictation-recording-button
           ${ref(__classPrivateFieldGet(this, _CortiDictation_recordingButtonRef, "f"))}
@@ -256,16 +261,16 @@ __decorate([
 ], CortiDictation.prototype, "_selectedDevice", void 0);
 __decorate([
     property({ type: String })
-], CortiDictation.prototype, "mode", null);
+], CortiDictation.prototype, "pushToTalkKeybinding", null);
 __decorate([
     state()
-], CortiDictation.prototype, "_mode", void 0);
+], CortiDictation.prototype, "_pushToTalkKeybinding", void 0);
 __decorate([
     property({ type: String })
-], CortiDictation.prototype, "keybinding", null);
+], CortiDictation.prototype, "toggleToTalkKeybinding", null);
 __decorate([
     state()
-], CortiDictation.prototype, "_keybinding", void 0);
+], CortiDictation.prototype, "_toggleToTalkKeybinding", void 0);
 CortiDictation = __decorate([
     customElement("corti-dictation")
 ], CortiDictation);

package/dist/components/corti-dictation.js.map

@@ -1 +1 @@
-{"version":3,"file":"corti-dictation.js","sourceRoot":"","sources":["../../src/components/corti-dictation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Corti } from \"@corti/sdk\";\nimport { css, html, LitElement, nothing } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { createRef, type Ref, ref } from \"lit/directives/ref.js\";\nimport { DEFAULT_DICTATION_CONFIG } from \"../constants.js\";\nimport type { DictationRoot } from \"../contexts/dictation-context.js\";\nimport type {\n  ConfigurableSettings,\n  DictationMode,\n  ProxyOptions,\n  RecordingState,\n} from \"../types.js\";\nimport { commaSeparatedConverter } from \"../utils/converters.js\";\nimport type { DictationRecordingButton } from \"./recording-button.js\";\n\nimport \"../contexts/dictation-context.js\";\nimport \"./recording-button.js\";\nimport \"./settings-menu.js\";\n\n@customElement(\"corti-dictation\")\nexport class CortiDictation extends LitElement {\n  static styles = css`\n    .hidden {\n      display: none;\n    }\n  `;\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Private refs\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  #recordingButtonRef: Ref<DictationRecordingButton> = createRef();\n  #contextProviderRef: Ref<DictationRoot> = createRef();\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Properties\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  /**\n   * Latest access token\n   */\n  @property({ type: String })\n  accessToken?: string;\n\n  /**\n   * Authentication configuration with optional refresh mechanism.\n   */\n  @property({ attribute: false, type: Object })\n  authConfig?: Corti.BearerOptions;\n\n  /**\n   * WebSocket URL for proxy connection. When provided, uses CortiWebSocketProxyClient instead of CortiClient.\n   */\n  @property({ type: String })\n  socketUrl?: string;\n\n  /**\n   * Socket proxy configuration object. When provided, uses CortiWebSocketProxyClient instead of CortiClient.\n   */\n  @property({ attribute: false, type: Object })\n  socketProxy?: ProxyOptions;\n\n  /**\n   * List of all language codes available for use with the Web Component.\n   *  Default list depends on the accessToken\n   */\n  @property({\n    converter: commaSeparatedConverter,\n    type: Array,\n  })\n  set languagesSupported(value:\n    | Corti.TranscribeSupportedLanguage[]\n    | undefined) {\n    this._languagesSupported = value;\n  }\n\n  get languagesSupported(): Corti.TranscribeSupportedLanguage[] {\n    return (\n      this.#contextProviderRef.value?.languages ||\n      this._languagesSupported ||\n      []\n    );\n  }\n\n  @state()\n  _languagesSupported?: Corti.TranscribeSupportedLanguage[];\n\n  /**\n   * Which settings should be available in the UI.\n   *  If an empty array is passed, the settings will be disabled entirely.\n   *  Options are language and devices\n   */\n  @property({\n    converter: commaSeparatedConverter,\n    type: Array,\n  })\n  settingsEnabled: ConfigurableSettings[] = [\"device\", \"language\"];\n\n  /**\n   * When false (default), allows the start/stop button from taking focus when clicked,\n   *  disabling textareas or other input elements to maintain focus.\n   *  Set to \"true\" to allow the button to receive focus on click.\n   */\n  @property({ type: Boolean })\n  allowButtonFocus: boolean = false;\n\n  /**\n   * Overrides any device selection and instead uses getDisplayMedia to stream system audio.\n   * Should only be used for debugging.\n   */\n  @property({ attribute: \"debug-display-audio\", type: Boolean })\n  debug_displayAudio: boolean = false;\n\n  /**\n   * Configuration settings for dictation\n   */\n  @property({ attribute: false, type: Object })\n  set dictationConfig(value: Corti.TranscribeConfig) {\n    this._dictationConfig = value;\n  }\n\n  get dictationConfig(): Corti.TranscribeConfig {\n    return (\n      this.#contextProviderRef.value?.dictationConfig || this._dictationConfig\n    );\n  }\n\n  @state()\n  _dictationConfig: Corti.TranscribeConfig = DEFAULT_DICTATION_CONFIG;\n\n  /**\n   * List of available recording devices\n   */\n  @property({ attribute: false, type: Array })\n  set devices(value: MediaDeviceInfo[] | undefined) {\n    this._devices = value;\n  }\n\n  get devices(): MediaDeviceInfo[] {\n    return this.#contextProviderRef.value?.devices || this._devices || [];\n  }\n\n  @state()\n  _devices?: MediaDeviceInfo[];\n\n  /**\n   * The selected device used for recording (MediaDeviceInfo).\n   */\n  @property({ attribute: false, type: Object })\n  set selectedDevice(value: MediaDeviceInfo | undefined) {\n    this._selectedDevice = value;\n  }\n\n  get selectedDevice(): MediaDeviceInfo | undefined {\n    return (\n      this.#contextProviderRef.value?.selectedDevice || this._selectedDevice\n    );\n  }\n\n  @state()\n  _selectedDevice?: MediaDeviceInfo;\n\n  /**\n   * Current state of recording (stopped, recording, initializing and stopping, ).\n   */\n  get recordingState(): RecordingState {\n    return this.#contextProviderRef.value?.recordingState || \"stopped\";\n  }\n\n  /**\n   * Dictation mode: \"toggle-to-talk\" or \"push-to-talk\"\n   */\n  @property({ type: String })\n  set mode(value: DictationMode) {\n    this._mode = value;\n  }\n\n  get mode(): DictationMode {\n    return (\n      this.#contextProviderRef.value?.mode || this._mode || \"toggle-to-talk\"\n    );\n  }\n\n  @state()\n  _mode?: DictationMode = \"toggle-to-talk\";\n\n  /**\n   * Keybinding for keyboard shortcut. Single key only (e.g., \"`\", \"k\", \"meta\", \"ctrl\").\n   * Combinations with \"+\" are not supported.\n   * Defaults to \"`\" if keybinding is in settingsEnabled, otherwise undefined\n   */\n  @property({ type: String })\n  set keybinding(value: string | null | undefined) {\n    this._keybinding = value;\n  }\n\n  get keybinding(): string | null | undefined {\n    return this.#contextProviderRef.value?.keybinding || this._keybinding;\n  }\n\n  @state()\n  _keybinding?: string | null;\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Public methods\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  /**\n   * Set the latest access token.\n   * @returns ServerConfig with environment, tenant, and accessToken\n   * @deprecated Use 'accessToken' property instead.\n   */\n  public setAccessToken(token: string) {\n    this.accessToken = token;\n\n    return (\n      this.#contextProviderRef.value?.setAccessToken(token) ?? {\n        accessToken: token,\n        environment: undefined,\n        tenant: undefined,\n      }\n    );\n  }\n\n  /**\n   * Set the auth configuration for OAuth flows.\n   * @returns Promise with ServerConfig containing environment, tenant, and accessToken\n   * @deprecated Use 'authConfig' property instead.\n   */\n  public async setAuthConfig(config: Corti.BearerOptions) {\n    this.authConfig = config;\n\n    return (\n      this.#contextProviderRef.value?.setAuthConfig(config) ?? {\n        accessToken: undefined,\n        environment: undefined,\n        tenant: undefined,\n      }\n    );\n  }\n\n  /**\n   * Starts a recording.\n   */\n  public startRecording(): void {\n    this.#recordingButtonRef.value?.startRecording();\n  }\n\n  /**\n   * Stops a recording.\n   */\n  public stopRecording(): void {\n    this.#recordingButtonRef.value?.stopRecording();\n  }\n\n  /**\n   * Starts or stops recording. Convenience layer on top of the start/stop methods.\n   */\n  public toggleRecording(): void {\n    this.#recordingButtonRef.value?.toggleRecording();\n  }\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Render\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  render() {\n    const isHidden =\n      !this.accessToken &&\n      !this.authConfig &&\n      !this.socketUrl &&\n      !this.socketProxy;\n\n    return html`\n      <dictation-root\n        ${ref(this.#contextProviderRef)}\n        class=${classMap({ hidden: isHidden })}\n        .accessToken=${this.accessToken}\n        .authConfig=${this.authConfig}\n        .socketUrl=${this.socketUrl}\n        .socketProxy=${this.socketProxy}\n        .dictationConfig=${this._dictationConfig}\n        .languages=${this._languagesSupported}\n        .devices=${this._devices}\n        .selectedDevice=${this._selectedDevice}\n        .debug_displayAudio=${this.debug_displayAudio}\n        .mode=${this._mode}\n        .keybinding=${this._keybinding}\n      >\n        <dictation-recording-button\n          ${ref(this.#recordingButtonRef)}\n          ?allowButtonFocus=${this.allowButtonFocus}\n        ></dictation-recording-button>\n        ${\n          this.settingsEnabled?.length > 0\n            ? html`<dictation-settings-menu\n                .settingsEnabled=${this.settingsEnabled}\n              ></dictation-settings-menu>`\n            : nothing\n        }\n      </dictation-root>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"corti-dictation\": CortiDictation;\n  }\n}\n"]}
+{"version":3,"file":"corti-dictation.js","sourceRoot":"","sources":["../../src/components/corti-dictation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Corti } from \"@corti/sdk\";\nimport { css, html, LitElement, nothing } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { createRef, type Ref, ref } from \"lit/directives/ref.js\";\nimport { DEFAULT_DICTATION_CONFIG } from \"../constants.js\";\nimport type { DictationRoot } from \"../contexts/dictation-context.js\";\nimport type {\n  ConfigurableSettings,\n  ProxyOptions,\n  RecordingState,\n} from \"../types.js\";\nimport { commaSeparatedConverter } from \"../utils/converters.js\";\nimport type { DictationRecordingButton } from \"./recording-button.js\";\n\nimport \"../contexts/dictation-context.js\";\nimport \"./recording-button.js\";\nimport \"./settings-menu.js\";\n\n@customElement(\"corti-dictation\")\nexport class CortiDictation extends LitElement {\n  static styles = css`\n    .hidden {\n      display: none;\n    }\n  `;\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Private refs\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  #recordingButtonRef: Ref<DictationRecordingButton> = createRef();\n  #contextProviderRef: Ref<DictationRoot> = createRef();\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Properties\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  /**\n   * Latest access token\n   */\n  @property({ type: String })\n  accessToken?: string;\n\n  /**\n   * Authentication configuration with optional refresh mechanism.\n   */\n  @property({ attribute: false, type: Object })\n  authConfig?: Corti.BearerOptions;\n\n  /**\n   * WebSocket URL for proxy connection. When provided, uses CortiWebSocketProxyClient instead of CortiClient.\n   */\n  @property({ type: String })\n  socketUrl?: string;\n\n  /**\n   * Socket proxy configuration object. When provided, uses CortiWebSocketProxyClient instead of CortiClient.\n   */\n  @property({ attribute: false, type: Object })\n  socketProxy?: ProxyOptions;\n\n  /**\n   * List of all language codes available for use with the Web Component.\n   *  Default list depends on the accessToken\n   */\n  @property({\n    converter: commaSeparatedConverter,\n    type: Array,\n  })\n  set languagesSupported(value:\n    | Corti.TranscribeSupportedLanguage[]\n    | undefined) {\n    this._languagesSupported = value;\n  }\n\n  get languagesSupported(): Corti.TranscribeSupportedLanguage[] {\n    return (\n      this.#contextProviderRef.value?.languages ||\n      this._languagesSupported ||\n      []\n    );\n  }\n\n  @state()\n  _languagesSupported?: Corti.TranscribeSupportedLanguage[];\n\n  /**\n   * Which settings should be available in the UI.\n   *  If an empty array is passed, the settings will be disabled entirely.\n   *  Options are language and devices\n   */\n  @property({\n    converter: commaSeparatedConverter,\n    type: Array,\n  })\n  settingsEnabled: ConfigurableSettings[] = [\"device\", \"language\"];\n\n  /**\n   * When false (default), allows the start/stop button from taking focus when clicked,\n   *  disabling textareas or other input elements to maintain focus.\n   *  Set to \"true\" to allow the button to receive focus on click.\n   */\n  @property({ type: Boolean })\n  allowButtonFocus: boolean = false;\n\n  /**\n   * Overrides any device selection and instead uses getDisplayMedia to stream system audio.\n   * Should only be used for debugging.\n   */\n  @property({ attribute: \"debug-display-audio\", type: Boolean })\n  debug_displayAudio: boolean = false;\n\n  /**\n   * Configuration settings for dictation\n   */\n  @property({ attribute: false, type: Object })\n  set dictationConfig(value: Corti.TranscribeConfig) {\n    this._dictationConfig = value;\n  }\n\n  get dictationConfig(): Corti.TranscribeConfig {\n    return (\n      this.#contextProviderRef.value?.dictationConfig || this._dictationConfig\n    );\n  }\n\n  @state()\n  _dictationConfig: Corti.TranscribeConfig = DEFAULT_DICTATION_CONFIG;\n\n  /**\n   * List of available recording devices\n   */\n  @property({ attribute: false, type: Array })\n  set devices(value: MediaDeviceInfo[] | undefined) {\n    this._devices = value;\n  }\n\n  get devices(): MediaDeviceInfo[] {\n    return this.#contextProviderRef.value?.devices || this._devices || [];\n  }\n\n  @state()\n  _devices?: MediaDeviceInfo[];\n\n  /**\n   * The selected device used for recording (MediaDeviceInfo).\n   */\n  @property({ attribute: false, type: Object })\n  set selectedDevice(value: MediaDeviceInfo | undefined) {\n    this._selectedDevice = value;\n  }\n\n  get selectedDevice(): MediaDeviceInfo | undefined {\n    return (\n      this.#contextProviderRef.value?.selectedDevice || this._selectedDevice\n    );\n  }\n\n  @state()\n  _selectedDevice?: MediaDeviceInfo;\n\n  /**\n   * Current state of recording (stopped, recording, initializing and stopping, ).\n   */\n  get recordingState(): RecordingState {\n    return this.#contextProviderRef.value?.recordingState || \"stopped\";\n  }\n\n  /**\n   * Push-to-talk keybinding for keyboard shortcut. Single key only (e.g., \"Space\", \"k\", \"meta\", \"ctrl\").\n   * Combinations with \"+\" are not supported.\n   * Keydown starts recording, keyup stops recording.\n   * Defaults to \"Space\" if keybinding is in settingsEnabled, otherwise undefined\n   */\n  @property({ type: String })\n  set pushToTalkKeybinding(value: string | null | undefined) {\n    this._pushToTalkKeybinding = value;\n  }\n\n  get pushToTalkKeybinding(): string | null | undefined {\n    return (\n      this.#contextProviderRef.value?.pushToTalkKeybinding ||\n      this._pushToTalkKeybinding\n    );\n  }\n\n  @state()\n  _pushToTalkKeybinding?: string | null;\n\n  /**\n   * Toggle-to-talk keybinding for keyboard shortcut. Single key only (e.g., \"`\", \"k\", \"meta\", \"ctrl\").\n   * Combinations with \"+\" are not supported.\n   * Pressing the key toggles recording on/off.\n   * Defaults to \"`\" if keybinding is in settingsEnabled, otherwise undefined\n   */\n  @property({ type: String })\n  set toggleToTalkKeybinding(value: string | null | undefined) {\n    this._toggleToTalkKeybinding = value;\n  }\n\n  get toggleToTalkKeybinding(): string | null | undefined {\n    return (\n      this.#contextProviderRef.value?.toggleToTalkKeybinding ||\n      this._toggleToTalkKeybinding\n    );\n  }\n\n  @state()\n  _toggleToTalkKeybinding?: string | null;\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Public methods\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  /**\n   * Set the latest access token.\n   * @returns ServerConfig with environment, tenant, and accessToken\n   * @deprecated Use 'accessToken' property instead.\n   */\n  public setAccessToken(token: string) {\n    this.accessToken = token;\n\n    return (\n      this.#contextProviderRef.value?.setAccessToken(token) ?? {\n        accessToken: token,\n        environment: undefined,\n        tenant: undefined,\n      }\n    );\n  }\n\n  /**\n   * Set the auth configuration for OAuth flows.\n   * @returns Promise with ServerConfig containing environment, tenant, and accessToken\n   * @deprecated Use 'authConfig' property instead.\n   */\n  public async setAuthConfig(config: Corti.BearerOptions) {\n    this.authConfig = config;\n\n    return (\n      this.#contextProviderRef.value?.setAuthConfig(config) ?? {\n        accessToken: undefined,\n        environment: undefined,\n        tenant: undefined,\n      }\n    );\n  }\n\n  /**\n   * Starts a recording.\n   */\n  public startRecording(): void {\n    this.#recordingButtonRef.value?.startRecording();\n  }\n\n  /**\n   * Stops a recording.\n   */\n  public stopRecording(): void {\n    this.#recordingButtonRef.value?.stopRecording();\n  }\n\n  /**\n   * Starts or stops recording. Convenience layer on top of the start/stop methods.\n   */\n  public toggleRecording(): void {\n    this.#recordingButtonRef.value?.toggleRecording();\n  }\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Render\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  render() {\n    const isHidden =\n      !this.accessToken &&\n      !this.authConfig &&\n      !this.socketUrl &&\n      !this.socketProxy;\n\n    return html`\n      <dictation-root\n        ${ref(this.#contextProviderRef)}\n        class=${classMap({ hidden: isHidden })}\n        .accessToken=${this.accessToken}\n        .authConfig=${this.authConfig}\n        .socketUrl=${this.socketUrl}\n        .socketProxy=${this.socketProxy}\n        .dictationConfig=${this._dictationConfig}\n        .languages=${this._languagesSupported}\n        .devices=${this._devices}\n        .selectedDevice=${this._selectedDevice}\n        .debug_displayAudio=${this.debug_displayAudio}\n        .pushToTalkKeybinding=${this._pushToTalkKeybinding}\n        .toggleToTalkKeybinding=${this._toggleToTalkKeybinding}\n      >\n        <dictation-recording-button\n          ${ref(this.#recordingButtonRef)}\n          ?allowButtonFocus=${this.allowButtonFocus}\n        ></dictation-recording-button>\n        ${\n          this.settingsEnabled?.length > 0\n            ? html`<dictation-settings-menu\n                .settingsEnabled=${this.settingsEnabled}\n              ></dictation-settings-menu>`\n            : nothing\n        }\n      </dictation-root>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"corti-dictation\": CortiDictation;\n  }\n}\n"]}

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

@@ -0,0 +1,16 @@
+import { LitElement } from "lit";
+export declare class DictationKeybindingInput extends LitElement {
+    #private;
+    keybindingType: "push-to-talk" | "toggle-to-talk";
+    _pushToTalkKeybinding?: string | null;
+    _toggleToTalkKeybinding?: string | null;
+    disabled: boolean;
+    _isCapturingKeybinding: boolean;
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "dictation-keybinding-input": DictationKeybindingInput;
+    }
+}

package/dist/components/keybinding-input.js

@@ -0,0 +1,94 @@
+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 _DictationKeybindingInput_instances, _DictationKeybindingInput_handleKeybindingInputFocus, _DictationKeybindingInput_handleKeybindingInputBlur, _DictationKeybindingInput_handleKeybindingKeyDown;
+import { consume } from "@lit/context";
+import { html, LitElement } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { pushToTalkKeybindingContext, toggleToTalkKeybindingContext, } from "../contexts/dictation-context.js";
+import KeybindingSelectorStyles from "../styles/keybinding-selector.js";
+import { keybindingChangedEvent } from "../utils/events.js";
+import { normalizeKeybinding } from "../utils/keybinding.js";
+let DictationKeybindingInput = class DictationKeybindingInput extends LitElement {
+    constructor() {
+        super(...arguments);
+        _DictationKeybindingInput_instances.add(this);
+        this.keybindingType = "toggle-to-talk";
+        this.disabled = false;
+        this._isCapturingKeybinding = false;
+    }
+    render() {
+        const keybinding = this.keybindingType === "push-to-talk"
+            ? this._pushToTalkKeybinding
+            : this._toggleToTalkKeybinding;
+        const label = this.keybindingType === "push-to-talk"
+            ? "Push-to-Talk keybinding"
+            : "Toggle-to-Talk keybinding";
+        return html `
+      <div>
+        <label>${label}</label>
+        <div class="keybinding-selector-wrapper">
+          ${keybinding && html `<div class="keybinding-key">${keybinding}</div>`}
+          <input
+            type="text"
+            class="keybinding-selector-input"
+            .value=""
+            placeholder="Click and press a key..."
+            readonly
+            @focusin=${__classPrivateFieldGet(this, _DictationKeybindingInput_instances, "m", _DictationKeybindingInput_handleKeybindingInputFocus)}
+            @focusout=${__classPrivateFieldGet(this, _DictationKeybindingInput_instances, "m", _DictationKeybindingInput_handleKeybindingInputBlur)}
+            @keydown=${__classPrivateFieldGet(this, _DictationKeybindingInput_instances, "m", _DictationKeybindingInput_handleKeybindingKeyDown)}
+            ?disabled=${this.disabled}
+          />
+        </div>
+      </div>
+    `;
+    }
+};
+_DictationKeybindingInput_instances = new WeakSet();
+_DictationKeybindingInput_handleKeybindingInputFocus = function _DictationKeybindingInput_handleKeybindingInputFocus() {
+    this._isCapturingKeybinding = true;
+};
+_DictationKeybindingInput_handleKeybindingInputBlur = function _DictationKeybindingInput_handleKeybindingInputBlur() {
+    this._isCapturingKeybinding = false;
+};
+_DictationKeybindingInput_handleKeybindingKeyDown = function _DictationKeybindingInput_handleKeybindingKeyDown(event) {
+    if (!this._isCapturingKeybinding) {
+        return;
+    }
+    event.preventDefault();
+    event.stopPropagation();
+    const keybinding = normalizeKeybinding(event.key);
+    this.dispatchEvent(keybindingChangedEvent(event.key, event.code, keybinding, this.keybindingType));
+};
+DictationKeybindingInput.styles = KeybindingSelectorStyles;
+__decorate([
+    property({ type: String })
+], DictationKeybindingInput.prototype, "keybindingType", void 0);
+__decorate([
+    consume({ context: pushToTalkKeybindingContext, subscribe: true }),
+    state()
+], DictationKeybindingInput.prototype, "_pushToTalkKeybinding", void 0);
+__decorate([
+    consume({ context: toggleToTalkKeybindingContext, subscribe: true }),
+    state()
+], DictationKeybindingInput.prototype, "_toggleToTalkKeybinding", void 0);
+__decorate([
+    property({ type: Boolean })
+], DictationKeybindingInput.prototype, "disabled", void 0);
+__decorate([
+    state()
+], DictationKeybindingInput.prototype, "_isCapturingKeybinding", void 0);
+DictationKeybindingInput = __decorate([
+    customElement("dictation-keybinding-input")
+], DictationKeybindingInput);
+export { DictationKeybindingInput };
+//# sourceMappingURL=keybinding-input.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"keybinding-input.js","sourceRoot":"","sources":["../../src/components/keybinding-input.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,2BAA2B,EAC3B,6BAA6B,GAC9B,MAAM,kCAAkC,CAAC;AAC1C,OAAO,wBAAwB,MAAM,kCAAkC,CAAC;AACxE,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAGtD,IAAM,wBAAwB,GAA9B,MAAM,wBAAyB,SAAQ,UAAU;IAAjD;;;QAEL,mBAAc,GAAsC,gBAAgB,CAAC;QAWrE,aAAQ,GAAY,KAAK,CAAC;QAG1B,2BAAsB,GAAY,KAAK,CAAC;IA8D1C,CAAC;IA9BC,MAAM;QACJ,MAAM,UAAU,GACd,IAAI,CAAC,cAAc,KAAK,cAAc;YACpC,CAAC,CAAC,IAAI,CAAC,qBAAqB;YAC5B,CAAC,CAAC,IAAI,CAAC,uBAAuB,CAAC;QACnC,MAAM,KAAK,GACT,IAAI,CAAC,cAAc,KAAK,cAAc;YACpC,CAAC,CAAC,yBAAyB;YAC3B,CAAC,CAAC,2BAA2B,CAAC;QAElC,OAAO,IAAI,CAAA;;iBAEE,KAAK;;YAEV,UAAU,IAAI,IAAI,CAAA,+BAA+B,UAAU,QAAQ;;;;;;;uBAOxD,uBAAA,IAAI,iGAA4B;wBAC/B,uBAAA,IAAI,gGAA2B;uBAChC,uBAAA,IAAI,8FAAyB;wBAC5B,IAAI,CAAC,QAAQ;;;;KAIhC,CAAC;IACJ,CAAC;;;;IAxDC,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC;AACrC,CAAC;;IAGC,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC;AACtC,CAAC;+GAEwB,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,MAAM,UAAU,GAAG,mBAAmB,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAElD,IAAI,CAAC,aAAa,CAChB,sBAAsB,CACpB,KAAK,CAAC,GAAG,EACT,KAAK,CAAC,IAAI,EACV,UAAU,EACV,IAAI,CAAC,cAAc,CACpB,CACF,CAAC;AACJ,CAAC;AA5BM,+BAAM,GAAG,wBAAwB,AAA3B,CAA4B;AAhBzC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gEAC0C;AAIrE;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,2BAA2B,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAClE,KAAK,EAAE;uEAC8B;AAItC;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,6BAA6B,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACpE,KAAK,EAAE;yEACgC;AAGxC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0DACF;AAG1B;IADC,KAAK,EAAE;wEACgC;AAhB7B,wBAAwB;IADpC,aAAa,CAAC,4BAA4B,CAAC;GAC/B,wBAAwB,CA8EpC","sourcesContent":["import { consume } from \"@lit/context\";\nimport { html, LitElement } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport {\n  pushToTalkKeybindingContext,\n  toggleToTalkKeybindingContext,\n} from \"../contexts/dictation-context.js\";\nimport KeybindingSelectorStyles from \"../styles/keybinding-selector.js\";\nimport { keybindingChangedEvent } from \"../utils/events.js\";\nimport { normalizeKeybinding } from \"../utils/keybinding.js\";\n\n@customElement(\"dictation-keybinding-input\")\nexport class DictationKeybindingInput extends LitElement {\n  @property({ type: String })\n  keybindingType: \"push-to-talk\" | \"toggle-to-talk\" = \"toggle-to-talk\";\n\n  @consume({ context: pushToTalkKeybindingContext, subscribe: true })\n  @state()\n  _pushToTalkKeybinding?: string | null;\n\n  @consume({ context: toggleToTalkKeybindingContext, subscribe: true })\n  @state()\n  _toggleToTalkKeybinding?: 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    const keybinding = normalizeKeybinding(event.key);\n\n    this.dispatchEvent(\n      keybindingChangedEvent(\n        event.key,\n        event.code,\n        keybinding,\n        this.keybindingType,\n      ),\n    );\n  }\n\n  render() {\n    const keybinding =\n      this.keybindingType === \"push-to-talk\"\n        ? this._pushToTalkKeybinding\n        : this._toggleToTalkKeybinding;\n    const label =\n      this.keybindingType === \"push-to-talk\"\n        ? \"Push-to-Talk keybinding\"\n        : \"Toggle-to-Talk keybinding\";\n\n    return html`\n      <div>\n        <label>${label}</label>\n        <div class=\"keybinding-selector-wrapper\">\n          ${keybinding && html`<div class=\"keybinding-key\">${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      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"dictation-keybinding-input\": DictationKeybindingInput;\n  }\n}\n"]}

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

@@ -1,9 +1,9 @@
 import { LitElement } from "lit";
+import "./keybinding-input.js";
 export declare class DictationKeybindingSelector extends LitElement {
-    #private;
-    _keybinding?: string | null;
+    _pushToTalkKeybinding?: string | null;
+    _toggleToTalkKeybinding?: string | null;
     disabled: boolean;
-    _isCapturingKeybinding: boolean;
     static styles: import("lit").CSSResult[];
     render(): import("lit-html").TemplateResult<1>;
 }

package/dist/components/keybinding-selector.js

@@ -4,77 +4,48 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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 { pushToTalkKeybindingContext, toggleToTalkKeybindingContext, } from "../contexts/dictation-context.js";
 import KeybindingSelectorStyles from "../styles/keybinding-selector.js";
-import { keybindingChangedEvent } from "../utils/events.js";
+import "./keybinding-input.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">
-          ${this._keybinding && html `<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>
-        ${this._keybinding &&
+      <div class="settings-group">
+        <dictation-keybinding-input
+          keybindingType="toggle-to-talk"
+          ?disabled=${this.disabled}
+        ></dictation-keybinding-input>
+        <dictation-keybinding-input
+          keybindingType="push-to-talk"
+          ?disabled=${this.disabled}
+        ></dictation-keybinding-input>
+        ${(this._toggleToTalkKeybinding || this._pushToTalkKeybinding) &&
             html `<p class="keybinding-help">
-            Press ${this._keybinding} to start/stop recording
+            ${html `Press ${[this._toggleToTalkKeybinding, this._pushToTalkKeybinding].join(" or ")} 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 }),
+    consume({ context: pushToTalkKeybindingContext, subscribe: true }),
     state()
-], DictationKeybindingSelector.prototype, "_keybinding", void 0);
+], DictationKeybindingSelector.prototype, "_pushToTalkKeybinding", void 0);
+__decorate([
+    consume({ context: toggleToTalkKeybindingContext, subscribe: true }),
+    state()
+], DictationKeybindingSelector.prototype, "_toggleToTalkKeybinding", 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);

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

@@ -1 +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;IAkD1C,CAAC;IA3BC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;YAIH,IAAI,CAAC,WAAW,IAAI,IAAI,CAAA,+BAA+B,IAAI,CAAC,WAAW,QAAQ;;;;;;;uBAOpE,uBAAA,IAAI,uGAA4B;wBAC/B,uBAAA,IAAI,sGAA2B;uBAChC,uBAAA,IAAI,oGAAyB;wBAC5B,IAAI,CAAC,QAAQ;;;UAI3B,IAAI,CAAC,WAAW;YAChB,IAAI,CAAA;oBACM,IAAI,CAAC,WAAW;eAE5B;;KAEH,CAAC;IACJ,CAAC;;;;IA5CC,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,CA2DvC","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          ${this._keybinding && html`<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        ${\n          this._keybinding &&\n          html`<p class=\"keybinding-help\">\n            Press ${this._keybinding} to start/stop recording\n          </p>`\n        }\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"dictation-keybinding-selector\": DictationKeybindingSelector;\n  }\n}\n"]}
+{"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,EACL,2BAA2B,EAC3B,6BAA6B,GAC9B,MAAM,kCAAkC,CAAC;AAC1C,OAAO,wBAAwB,MAAM,kCAAkC,CAAC;AAExE,OAAO,uBAAuB,CAAC;AAGxB,IAAM,2BAA2B,GAAjC,MAAM,2BAA4B,SAAQ,UAAU;IAApD;;QAUL,aAAQ,GAAY,KAAK,CAAC;IAwB5B,CAAC;IApBC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;sBAIO,IAAI,CAAC,QAAQ;;;;sBAIb,IAAI,CAAC,QAAQ;;UAGzB,CAAC,IAAI,CAAC,uBAAuB,IAAI,IAAI,CAAC,qBAAqB,CAAC;YAC5D,IAAI,CAAA;cACA,IAAI,CAAA,SAAS,CAAC,IAAI,CAAC,uBAAuB,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,0BAA0B;eAEpH;;KAEH,CAAC;IACJ,CAAC;;AArBM,kCAAM,GAAG,wBAAwB,AAA3B,CAA4B;AATzC;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,2BAA2B,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAClE,KAAK,EAAE;0EAC8B;AAItC;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,6BAA6B,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACpE,KAAK,EAAE;4EACgC;AAGxC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6DACF;AAVf,2BAA2B;IADvC,aAAa,CAAC,+BAA+B,CAAC;GAClC,2BAA2B,CAkCvC","sourcesContent":["import { consume } from \"@lit/context\";\nimport { html, LitElement } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport {\n  pushToTalkKeybindingContext,\n  toggleToTalkKeybindingContext,\n} from \"../contexts/dictation-context.js\";\nimport KeybindingSelectorStyles from \"../styles/keybinding-selector.js\";\n\nimport \"./keybinding-input.js\";\n\n@customElement(\"dictation-keybinding-selector\")\nexport class DictationKeybindingSelector extends LitElement {\n  @consume({ context: pushToTalkKeybindingContext, subscribe: true })\n  @state()\n  _pushToTalkKeybinding?: string | null;\n\n  @consume({ context: toggleToTalkKeybindingContext, subscribe: true })\n  @state()\n  _toggleToTalkKeybinding?: string | null;\n\n  @property({ type: Boolean })\n  disabled: boolean = false;\n\n  static styles = KeybindingSelectorStyles;\n\n  render() {\n    return html`\n      <div class=\"settings-group\">\n        <dictation-keybinding-input\n          keybindingType=\"toggle-to-talk\"\n          ?disabled=${this.disabled}\n        ></dictation-keybinding-input>\n        <dictation-keybinding-input\n          keybindingType=\"push-to-talk\"\n          ?disabled=${this.disabled}\n        ></dictation-keybinding-input>\n        ${\n          (this._toggleToTalkKeybinding || this._pushToTalkKeybinding) &&\n          html`<p class=\"keybinding-help\">\n            ${html`Press ${[this._toggleToTalkKeybinding, this._pushToTalkKeybinding].join(\" or \")} to start/stop recording`}\n          </p>`\n        }\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"dictation-keybinding-selector\": DictationKeybindingSelector;\n  }\n}\n"]}

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

@@ -1,6 +1,6 @@
 import type { Corti } from "@corti/sdk";
 import { type CSSResultGroup, LitElement, type PropertyValues } from "lit";
-import type { DictationMode, ProxyOptions, RecordingState } from "../types.js";
+import type { ProxyOptions, RecordingState } from "../types.js";
 import "./audio-visualiser.js";
 import "../icons/icons.js";
 export declare class DictationRecordingButton extends LitElement {
@@ -15,8 +15,8 @@ export declare class DictationRecordingButton extends LitElement {
     _socketUrl?: string;
     _socketProxy?: ProxyOptions;
     _debug_displayAudio?: boolean;
-    _keybinding?: string | null;
-    _mode?: DictationMode;
+    _pushToTalkKeybinding?: string | null;
+    _toggleToTalkKeybinding?: string | null;
     allowButtonFocus: boolean;
     static styles: CSSResultGroup;
     protected update(changedProperties: PropertyValues): void;

package/dist/components/recording-button.js

@@ -15,12 +15,12 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (
     if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
     return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var _DictationRecordingButton_instances, _DictationRecordingButton_mediaController, _DictationRecordingButton_dictationController, _DictationRecordingButton_keybindingController, _DictationRecordingButton_closeConnectionOnInit, _DictationRecordingButton_handlePointerDown, _DictationRecordingButton_handlePointerUp, _DictationRecordingButton_handlePointerLeave, _DictationRecordingButton_handleWebSocketMessage, _DictationRecordingButton_handleWebSocketError, _DictationRecordingButton_handleWebSocketClose, _DictationRecordingButton_handleStart, _DictationRecordingButton_handleStop;
+var _DictationRecordingButton_instances, _DictationRecordingButton_mediaController, _DictationRecordingButton_dictationController, _DictationRecordingButton_keybindingController, _DictationRecordingButton_closeConnectionOnInit, _DictationRecordingButton_handleClick, _DictationRecordingButton_handleWebSocketMessage, _DictationRecordingButton_handleWebSocketError, _DictationRecordingButton_handleWebSocketClose, _DictationRecordingButton_handleStart, _DictationRecordingButton_handleStop;
 import { consume } from "@lit/context";
 import { html, LitElement, } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
 import { AUDIO_CHUNK_INTERVAL_MS } from "../constants.js";
-import { accessTokenContext, authConfigContext, debugDisplayAudioContext, dictationConfigContext, keybindingContext, modeContext, recordingStateContext, regionContext, selectedDeviceContext, socketProxyContext, socketUrlContext, tenantNameContext, } from "../contexts/dictation-context.js";
+import { accessTokenContext, authConfigContext, debugDisplayAudioContext, dictationConfigContext, pushToTalkKeybindingContext, recordingStateContext, regionContext, selectedDeviceContext, socketProxyContext, socketUrlContext, tenantNameContext, toggleToTalkKeybindingContext, } from "../contexts/dictation-context.js";
 import { DictationController, } from "../controllers/dictation-controller.js";
 import { KeybindingController } from "../controllers/keybinding-controller.js";
 import { MediaController } from "../controllers/media-controller.js";
@@ -119,10 +119,7 @@ let DictationRecordingButton = class DictationRecordingButton extends LitElement
         const isRecording = this._recordingState === "recording";
         return html `
       <button
-        @pointerdown=${__classPrivateFieldGet(this, _DictationRecordingButton_instances, "m", _DictationRecordingButton_handlePointerDown)}
-        @pointerup=${__classPrivateFieldGet(this, _DictationRecordingButton_instances, "m", _DictationRecordingButton_handlePointerUp)}
-        @pointerleave=${__classPrivateFieldGet(this, _DictationRecordingButton_instances, "m", _DictationRecordingButton_handlePointerLeave)}
-        @pointercancel=${__classPrivateFieldGet(this, _DictationRecordingButton_instances, "m", _DictationRecordingButton_handlePointerLeave)}
+        @click=${__classPrivateFieldGet(this, _DictationRecordingButton_instances, "m", _DictationRecordingButton_handleClick)}
         ?disabled=${isLoading}
         class=${isRecording ? "red" : "accent"}
         aria-label=${isRecording ? "Stop recording" : "Start recording"}
@@ -149,36 +146,11 @@ _DictationRecordingButton_handleWebSocketMessage = new WeakMap();
 _DictationRecordingButton_handleWebSocketError = new WeakMap();
 _DictationRecordingButton_handleWebSocketClose = new WeakMap();
 _DictationRecordingButton_instances = new WeakSet();
-_DictationRecordingButton_handlePointerDown = function _DictationRecordingButton_handlePointerDown(event) {
+_DictationRecordingButton_handleClick = function _DictationRecordingButton_handleClick(event) {
     if (!this.allowButtonFocus) {
         event.preventDefault();
     }
-    if (this._mode === "push-to-talk") {
-        this.startRecording();
-        event.currentTarget.setPointerCapture(event.pointerId);
-    }
-};
-_DictationRecordingButton_handlePointerUp = function _DictationRecordingButton_handlePointerUp(event) {
-    if (this._mode === "push-to-talk") {
-        this.stopRecording();
-        const button = event.currentTarget;
-        if (button.hasPointerCapture(event.pointerId)) {
-            button.releasePointerCapture(event.pointerId);
-        }
-        return;
-    }
-    if (this._mode === "toggle-to-talk") {
-        this.toggleRecording();
-    }
-};
-_DictationRecordingButton_handlePointerLeave = function _DictationRecordingButton_handlePointerLeave(event) {
-    if (this._mode === "push-to-talk") {
-        this.stopRecording();
-        const button = event.currentTarget;
-        if (button.hasPointerCapture(event.pointerId)) {
-            button.releasePointerCapture(event.pointerId);
-        }
-    }
+    this.toggleRecording();
 };
 _DictationRecordingButton_handleStart = async function _DictationRecordingButton_handleStart() {
     this.dispatchEvent(recordingStateChangedEvent("initializing"));
@@ -266,13 +238,13 @@ __decorate([
     state()
 ], DictationRecordingButton.prototype, "_debug_displayAudio", void 0);
 __decorate([
-    consume({ context: keybindingContext, subscribe: true }),
+    consume({ context: pushToTalkKeybindingContext, subscribe: true }),
     state()
-], DictationRecordingButton.prototype, "_keybinding", void 0);
+], DictationRecordingButton.prototype, "_pushToTalkKeybinding", void 0);
 __decorate([
-    consume({ context: modeContext, subscribe: true }),
+    consume({ context: toggleToTalkKeybindingContext, subscribe: true }),
     state()
-], DictationRecordingButton.prototype, "_mode", void 0);
+], DictationRecordingButton.prototype, "_toggleToTalkKeybinding", void 0);
 __decorate([
     property({ type: Boolean })
 ], DictationRecordingButton.prototype, "allowButtonFocus", void 0);