@kodaris/krubble-app-components 1.0.102 → 1.0.104

package/dist/krubble-app.bundled.js

@@ -6048,6 +6048,10 @@ let KRChatbot = class KRChatbot extends i$3 {
     stop() {
         this._handleStop();
     }
+    /** Whether a turn is in flight — true from send until the stream ends. */
+    isStreaming() {
+        return this._isStreaming;
+    }
     /** Open the chat panel. */
     open() {
         if (!this.opened) {
@@ -7318,122 +7322,6 @@ let KRChatbot = class KRChatbot extends i$3 {
         }
     }
     // --- Render ---
-    /**
-     * The composer's controls: attach, the textarea, the mic, and send/stop.
-     *
-     * While dictating, only the mic swaps — to a stop button — so the textarea
-     * stays visible with the transcript streaming into it and send stays reachable.
-     */
-    _renderComposerControls() {
-        return b `
-      <button
-        class="input-plus"
-        @click=${this._handlePlusClick}
-      >+</button>
-      <textarea
-        class="input"
-        .value=${this._inputValue}
-        placeholder=${this.placeholder}
-        rows="1"
-        @input=${this._handleInputChange}
-        @keydown=${this._handleKeyDown}
-        @paste=${this._handlePaste}
-      ></textarea>
-      ${window.SpeechRecognition || window.webkitSpeechRecognition ? b `
-        ${this._isDictating ? b `
-          <button
-            class="mic-stop"
-            title="Stop dictation"
-            aria-label="Stop dictation"
-            @click=${this._handleMicClick}
-          >
-            <svg
-              xmlns="http://www.w3.org/2000/svg"
-              fill="currentColor"
-              viewBox="0 0 24 24"
-              class="mic-stop-icon"
-              aria-hidden="true"
-            >
-              <rect
-                x="6"
-                y="6"
-                width="12"
-                height="12"
-                rx="2"
-              />
-            </svg>
-          </button>
-        ` : b `
-          <button
-            class="mic"
-            title="Dictate a message"
-            aria-label="Dictate a message"
-            @click=${this._handleMicClick}
-          >
-            <svg
-              xmlns="http://www.w3.org/2000/svg"
-              viewBox="0 0 24 24"
-              fill="none"
-              stroke="currentColor"
-              stroke-width="1.75"
-              stroke-linecap="round"
-              stroke-linejoin="round"
-              class="mic-icon"
-              aria-hidden="true"
-            >
-              <path d="M12 15a3 3 0 0 0 3-3V6a3 3 0 0 0-6 0v6a3 3 0 0 0 3 3Z"/>
-              <path d="M19 11a7 7 0 0 1-14 0"/>
-              <path d="M12 18v3"/>
-            </svg>
-          </button>
-        `}
-      ` : A}
-      ${this._isStreaming ? b `
-        <button
-          class="stop"
-          @click=${this._handleStop}
-          title="Stop generating"
-        >
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            fill="currentColor"
-            viewBox="0 0 24 24"
-            class="stop-icon"
-          >
-            <rect
-              x="6"
-              y="6"
-              width="12"
-              height="12"
-              rx="2"
-            />
-          </svg>
-        </button>
-      ` : b `
-        <button
-          class=${e({
-            'send': true,
-            'send--disabled': !this._inputValue.trim() && !this._pendingConversationFiles.length,
-        })}
-          @click=${this._handleSubmit}
-          title="Send message"
-        >
-          <svg
-            width="16"
-            height="16"
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            stroke-width="2.5"
-            stroke-linecap="round"
-            class="send-icon"
-          >
-            <path d="M12 19V5M5 12l7-7 7 7"/>
-          </svg>
-        </button>
-      `}
-    `;
-    }
     /** The `/` skill menu shown above the composer while typing a slash command. */
     _renderSkillMenu() {
         const skills = this._invocableSkills;
@@ -8140,7 +8028,112 @@ let KRChatbot = class KRChatbot extends i$3 {
           />
           ${this._skillMenuOpened ? this._renderSkillMenu() : A}
           <div class="input-wrapper">
-            ${this._renderComposerControls()}
+            <button
+              class="input-plus"
+              @click=${this._handlePlusClick}
+            >+</button>
+            <textarea
+              class="input"
+              .value=${this._inputValue}
+              placeholder=${this.placeholder}
+              rows="1"
+              @input=${this._handleInputChange}
+              @keydown=${this._handleKeyDown}
+              @paste=${this._handlePaste}
+            ></textarea>
+            ${window.SpeechRecognition || window.webkitSpeechRecognition ? b `
+              ${this._isDictating ? b `
+                <button
+                  class="mic-stop"
+                  title="Stop dictation"
+                  aria-label="Stop dictation"
+                  @click=${this._handleMicClick}
+                >
+                  <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    fill="currentColor"
+                    viewBox="0 0 24 24"
+                    class="mic-stop-icon"
+                    aria-hidden="true"
+                  >
+                    <rect
+                      x="6"
+                      y="6"
+                      width="12"
+                      height="12"
+                      rx="2"
+                    />
+                  </svg>
+                </button>
+              ` : b `
+                <button
+                  class="mic"
+                  title="Dictate a message"
+                  aria-label="Dictate a message"
+                  @click=${this._handleMicClick}
+                >
+                  <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    viewBox="0 0 24 24"
+                    fill="none"
+                    stroke="currentColor"
+                    stroke-width="1.75"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    class="mic-icon"
+                    aria-hidden="true"
+                  >
+                    <path d="M12 15a3 3 0 0 0 3-3V6a3 3 0 0 0-6 0v6a3 3 0 0 0 3 3Z"/>
+                    <path d="M19 11a7 7 0 0 1-14 0"/>
+                    <path d="M12 18v3"/>
+                  </svg>
+                </button>
+              `}
+            ` : A}
+            ${this._isStreaming ? b `
+              <button
+                class="stop"
+                @click=${this._handleStop}
+                title="Stop generating"
+              >
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  fill="currentColor"
+                  viewBox="0 0 24 24"
+                  class="stop-icon"
+                >
+                  <rect
+                    x="6"
+                    y="6"
+                    width="12"
+                    height="12"
+                    rx="2"
+                  />
+                </svg>
+              </button>
+            ` : b `
+              <button
+                class=${e({
+            'send': true,
+            'send--disabled': !this._inputValue.trim() && !this._pendingConversationFiles.length,
+        })}
+                @click=${this._handleSubmit}
+                title="Send message"
+              >
+                <svg
+                  width="16"
+                  height="16"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-width="2.5"
+                  stroke-linecap="round"
+                  class="send-icon"
+                >
+                  <path d="M12 19V5M5 12l7-7 7 7"/>
+                </svg>
+              </button>
+            `}
           </div>
         </div>
         ${this._skillBrowseOpened ? this._renderSkillBrowse() : A}