@kodaris/krubble-app-components 1.0.103 → 1.0.105

package/dist/krubble-app.bundled.js

@@ -5530,15 +5530,23 @@ var __decorate = (undefined && undefined.__decorate) || function (decorators, ta
 };
 /** Image extensions the chatbot renders as thumbnails (used when MIME is absent). */
 const IMAGE_EXTENSIONS = ['jpg', 'jpeg', 'png', 'gif', 'webp'];
+/**
+ * Video extensions the picker accepts. The AI cannot watch video — these upload
+ * and store for playback and tool use only, and the backend tells the model so.
+ * Matches what kr-file-preview can play back.
+ */
+const VIDEO_EXTENSIONS = ['mp4', 'webm', 'ogg', 'mov'];
 /**
  * File extensions the picker accepts. Mirrors what the backend can read: the
  * document/spreadsheet family Bedrock ingests, the plain-text family read as
- * fallback, and the image formats. This is a UX convenience — the backend
+ * fallback, and the image formats. Videos are accepted for upload/storage even
+ * though the model can't read them. This is a UX convenience — the backend
  * accepts anything and just tells the model when a type can't be read.
  */
 const ACCEPTED_FILE_EXTENSIONS = [
     'pdf', 'doc', 'docx', 'xls', 'xlsx', 'csv', 'html', 'md', 'txt', 'json', 'xml',
     ...IMAGE_EXTENSIONS,
+    ...VIDEO_EXTENSIONS,
 ];
 /**
  * AI chatbot component with SSE streaming.
@@ -6048,6 +6056,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) {
@@ -6848,8 +6860,9 @@ let KRChatbot = class KRChatbot extends i$3 {
             return;
         }
         files.forEach((file) => {
-            // Only images get a local preview thumbnail; documents render an icon.
-            // Prefer the File's MIME, falling back to the extension when it's absent.
+            // Only images get a local preview thumbnail; documents (and videos, which are
+            // tiles too) render an icon. Prefer the File's MIME, falling back to the
+            // extension when it's absent.
             let previewUrl;
             if (file.type.startsWith('image/') || IMAGE_EXTENSIONS.includes(this._getFileExtension(file.name))) {
                 previewUrl = URL.createObjectURL(file);
@@ -6880,22 +6893,25 @@ let KRChatbot = class KRChatbot extends i$3 {
         });
         this._pendingConversationFiles = [];
     }
-    /** Open the shared full-screen previewer for a message image. */
-    _handleImageOpen(img) {
+    /** Open the shared full-screen previewer for a message attachment (image or video). */
+    _handleFileOpen(file) {
         // Use the local preview if the upload hasn't finished yet; otherwise the
         // backend view URL (prefixed with the base URL — a raw fetch of a relative
         // path would hit the page origin, e.g. the dev server, not the backend).
-        const src = img.previewUrl
-            || `${KRHttp.getBaseUrl()}/api/system/conversationFile/${img.conversationFileID}/view`;
+        // The previewer picks image vs video playback off the name's extension, so
+        // niceName has to carry it — hence the generic fallback keeps no extension
+        // only when there's no name at all.
+        const src = file.previewUrl
+            || `${KRHttp.getBaseUrl()}/api/system/conversationFile/${file.conversationFileID}/view`;
         const preview = KRFilePreview.open({
             src,
-            name: img.niceName || 'image',
+            name: file.niceName || 'file',
         });
         // The previewer's download button only fires a `download` event — the
         // consumer performs the actual download. Hit the view endpoint with
         // `?download=true` (Content-Disposition: attachment) in a new tab.
         preview.addEventListener('download', () => {
-            window.open(`${KRHttp.getBaseUrl()}/api/system/conversationFile/${img.conversationFileID}/view?download=true`, '_blank');
+            window.open(`${KRHttp.getBaseUrl()}/api/system/conversationFile/${file.conversationFileID}/view?download=true`, '_blank');
         });
     }
     _handleSubmit() {
@@ -7830,15 +7846,18 @@ let KRChatbot = class KRChatbot extends i$3 {
             if (file.mimeType) {
                 isImage = file.mimeType.startsWith('image/');
             }
-            // Images open in the previewer; documents just show a tile
-            // (the previewer is image-only).
+            // An image shows its thumbnail; everything else shows a
+            // file-type tile. Both open the previewer on click — it renders
+            // images, video, PDFs, and text inline, and shows a download
+            // tile for the rest (Office formats), so a click always does
+            // something useful.
             if (isImage) {
                 return b `
                           <button
                             class="attachment"
                             type="button"
                             title=${file.niceName || 'View image'}
-                            @click=${() => this._handleImageOpen(file)}
+                            @click=${() => this._handleFileOpen(file)}
                           >
                             <img
                               src=${file.previewUrl || `${KRHttp.getBaseUrl()}/api/system/conversationFile/${file.conversationFileID}/view`}
@@ -7848,13 +7867,15 @@ let KRChatbot = class KRChatbot extends i$3 {
                         `;
             }
             return b `
-                        <div
-                          class="attachment attachment--doc"
+                        <button
+                          class="attachment attachment--doc attachment--openable"
+                          type="button"
                           title=${fileName}
+                          @click=${() => this._handleFileOpen(file)}
                         >
                           <span class="attachment__type">${this._getFileExtension(fileName) || 'File'}</span>
                           <span class="attachment__name">${fileName}</span>
-                        </div>
+                        </button>
                       `;
         })}
                   </div>
@@ -9126,15 +9147,22 @@ KRChatbot.styles = i$6 `
       display: block;
     }
 
-    /* Non-image attachment in a sent message — file-type label above the filename
-       (the previewer is image-only, so this isn't clickable). */
+    /* Non-image attachment in a sent message — file-type label above the filename. */
     .attachment--doc {
       display: flex;
       flex-direction: column;
       padding: 16px 14px;
       box-sizing: border-box;
       text-align: left;
-      cursor: default;
+    }
+
+    /* Opens the previewer on click — same affordance as the composer's doc chip. */
+    .attachment--openable {
+      cursor: pointer;
+    }
+
+    .attachment--openable:hover {
+      background: #dfdddd;
     }
 
     .attachment__type {