site-operator 0.2.5 → 0.2.7

package/dist/index.d.ts

@@ -81,6 +81,11 @@ export declare class AgentChat extends LitElement {
     setAppLocation(location: AppState["location"]): void;
     setAppUI(ui: AppState["ui"]): void;
     setAppFocus(focus: AppState["focus"]): void;
+    /**
+     * Establece los prompts sugeridos que se mostrarán al usuario.
+     * @param prompts Lista de prompts sugeridos.
+     */
+    setSuggestedPrompts(prompts: SuggestedPrompt[]): void;
     private _toggleHistory;
     private _handleSelectThread;
     private _toggleInspector;
@@ -287,6 +292,14 @@ export declare class ChatController implements ReactiveController {
      * Retorna el listado de conversaciones recientes.
      */
     get conversations(): ConversationSummary[];
+    /**
+     * Retorna los prompts sugeridos.
+     */
+    get suggestedPrompts(): SuggestedPrompt[];
+    /**
+     * Indica si se deben mostrar los prompts.
+     */
+    get showPrompts(): boolean;
     /**
      * Envía un mensaje a través del servicio.
      * @param content Contenido del mensaje.
@@ -315,6 +328,15 @@ export declare class ChatController implements ReactiveController {
     setAppLocation(location: AppState["location"]): void;
     setAppUI(ui: AppState["ui"]): void;
     setAppFocus(focus: AppState["focus"]): void;
+    /**
+     * Establece los prompts sugeridos.
+     * @param prompts Lista de prompts.
+     */
+    setSuggestedPrompts(prompts: SuggestedPrompt[]): void;
+    /**
+     * Oculta los prompts sugeridos.
+     */
+    hideSuggestedPrompts(): void;
     /**
      * Refresca el listado de conversaciones desde el servidor.
      */
@@ -372,6 +394,8 @@ declare class ChatService extends EventTarget {
     private _conversations;
     private _appContext;
     private _appState;
+    private _suggestedPrompts;
+    private _showPrompts;
     get isRunning(): boolean;
     get messages(): ({
         id: string;
@@ -423,6 +447,8 @@ declare class ChatService extends EventTarget {
         content: Record<string, any>;
         activityType: string;
     })[];
+    get suggestedPrompts(): SuggestedPrompt[];
+    get showPrompts(): boolean;
     private subscriber;
     constructor();
     /**
@@ -460,6 +486,15 @@ declare class ChatService extends EventTarget {
     setAppLocation(location: AppState["location"]): void;
     setAppUI(ui: AppState["ui"]): void;
     setAppFocus(focus: AppState["focus"]): void;
+    /**
+     * Establece los prompts sugeridos que se mostrarán al usuario.
+     * @param prompts Lista de prompts sugeridos. El caption tiene un máximo de 50 caracteres.
+     */
+    setSuggestedPrompts(prompts: SuggestedPrompt[]): void;
+    /**
+     * Oculta la lista de prompts sugeridos.
+     */
+    hideSuggestedPrompts(): void;
     sendMessage(content: string, role?: "developer" | "user" | "assistant" | "system" | "tool" | "activity"): Promise<void>;
     _ensureConversation(): Promise<void>;
     addPlaceholderMessage(): void;
@@ -482,6 +517,7 @@ export declare interface ChatThread {
     messages: UIMessage[];
     isRunning: boolean;
     title?: string;
+    suggestedPrompts?: SuggestedPrompt[];
 }
 
 /**
@@ -655,6 +691,11 @@ export declare interface NavigationAction {
  */
 export declare function register(): void;
 
+export declare interface SuggestedPrompt {
+    caption: string;
+    message: string;
+}
+
 export declare type UIMessage = Message & {
     isThinking?: boolean;
     createdAt?: number;

package/dist/site-operator.es.js

@@ -1378,10 +1378,43 @@ const styles$3 = i$1`
       font-size: 0.75rem;
       padding: 0.5rem;
   }
+
+  .prompts-list {
+    display: flex;
+    flex-direction: column;
+    margin-bottom: 0.75rem;
+    padding: 0 0.5rem;
+  }
+
+  .prompt-item {
+    background: transparent;
+    border: none;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
+    padding: 0.625rem 0.5rem;
+    text-align: left;
+    cursor: pointer;
+    font-size: 0.875rem;
+    color: var(--agent-text-zinc-600, #52525b);
+    transition: all 0.2s ease;
+    border-radius: 0.375rem;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .prompt-item:last-child {
+    border-bottom: none;
+  }
+
+  .prompt-item:hover {
+    background-color: var(--agent-bg-zinc-50, #fafafa);
+    color: var(--agent-text-foreground, #09090b);
+    padding-left: 0.75rem;
+  }
 `;
 var ChatComposer = class extends i {
 	constructor(...o) {
-		super(...o), this.isRunning = !1, this.disclaimer = "", this.placeholder = "", this._value = "";
+		super(...o), this.isRunning = !1, this.disclaimer = "", this.placeholder = "", this.prompts = [], this._value = "";
 	}
 	static #e = this.styles = styles$3;
 	_handleInput(o) {
@@ -1393,6 +1426,9 @@ var ChatComposer = class extends i {
 	_adjustHeight() {
 		this._textarea && (this._textarea.style.height = "auto", this._textarea.style.height = `${Math.min(this._textarea.scrollHeight, 160)}px`);
 	}
+	_handlePromptClick(o) {
+		this._value = o.message, this._textarea.focus(), setTimeout(() => this._adjustHeight(), 0);
+	}
 	async _handleSubmit() {
 		this._value.trim() && (this.dispatchEvent(new CustomEvent("send", {
 			detail: { content: this._value },
@@ -1408,6 +1444,15 @@ var ChatComposer = class extends i {
 	}
 	render() {
 		return b`
+      ${this.prompts.length > 0 ? b`
+        <div class="prompts-list">
+          ${this.prompts.map((o) => b`
+            <button class="prompt-item" @click="${() => this._handlePromptClick(o)}">
+              ${o.caption}
+            </button>
+          `)}
+        </div>
+      ` : ""}
       <div class="composer-container">
         <textarea
             placeholder="${this.placeholder}"
@@ -1426,7 +1471,7 @@ var ChatComposer = class extends i {
     `;
 	}
 };
-__decorate([n({ type: Boolean })], ChatComposer.prototype, "isRunning", void 0), __decorate([n({ type: String })], ChatComposer.prototype, "disclaimer", void 0), __decorate([n({ type: String })], ChatComposer.prototype, "placeholder", void 0), __decorate([r()], ChatComposer.prototype, "_value", void 0), __decorate([e$5("textarea")], ChatComposer.prototype, "_textarea", void 0), ChatComposer = __decorate([t("agent-chat-composer")], ChatComposer);
+__decorate([n({ type: Boolean })], ChatComposer.prototype, "isRunning", void 0), __decorate([n({ type: String })], ChatComposer.prototype, "disclaimer", void 0), __decorate([n({ type: String })], ChatComposer.prototype, "placeholder", void 0), __decorate([n({ type: Array })], ChatComposer.prototype, "prompts", void 0), __decorate([r()], ChatComposer.prototype, "_value", void 0), __decorate([e$5("textarea")], ChatComposer.prototype, "_textarea", void 0), ChatComposer = __decorate([t("agent-chat-composer")], ChatComposer);
 var __defProp = Object.defineProperty, __defNormalProp = (o, O, M) => O in o ? __defProp(o, O, {
 	enumerable: !0,
 	configurable: !0,
@@ -3188,12 +3233,18 @@ const chatService = new class extends EventTarget {
 	get messages() {
 		return this.agent?.messages || [];
 	}
+	get suggestedPrompts() {
+		return this._suggestedPrompts;
+	}
+	get showPrompts() {
+		return this._showPrompts;
+	}
 	constructor() {
 		super(), this._conversations = [], this._appContext = null, this._appState = {
 			v: "1.1",
 			location: { path: "" },
 			ui: { visibleClickTargetIds: [] }
-		}, this.subscriber = new ChatSubscriber(this), chatPortalService.addEventListener("portal-registered", (o) => {
+		}, this._suggestedPrompts = [], this._showPrompts = !1, this.subscriber = new ChatSubscriber(this), chatPortalService.addEventListener("portal-registered", (o) => {
 			let O = o.detail;
 			console.log("ChatService: Portal context detected", O), this.setAppContext(O);
 		});
@@ -3243,6 +3294,15 @@ const chatService = new class extends EventTarget {
 	setAppFocus(o) {
 		this._appState.focus = o, this.notify();
 	}
+	setSuggestedPrompts(o) {
+		this._suggestedPrompts = o.map((o) => ({
+			...o,
+			caption: o.caption.slice(0, 50)
+		})), this._showPrompts = !0, this.notify();
+	}
+	hideSuggestedPrompts() {
+		this._showPrompts = !1, this.notify();
+	}
 	async sendMessage(o, O = "user") {
 		if (!this.agent) {
 			console.error("ChatService not initialized. Call initialize() first.");
@@ -3310,7 +3370,7 @@ const chatService = new class extends EventTarget {
 		} catch (o) {
 			console.error("Failed to send message", o);
 		} finally {
-			this.notify();
+			this._showPrompts = !1, this.notify();
 		}
 	}
 	async _ensureConversation() {
@@ -3369,7 +3429,7 @@ const chatService = new class extends EventTarget {
 		this.agent.messages = [...F, M], this.notify();
 	}
 	async startNewThread() {
-		localStorage.removeItem(STORAGE_THREAD_ID_KEY), this.agent && (this.agent.threadId = threadIdPlaceHolder, this.agent.messages = [], this.agent.isRunning = !1), this.notify();
+		localStorage.removeItem(STORAGE_THREAD_ID_KEY), this.agent && (this.agent.threadId = threadIdPlaceHolder, this.agent.messages = [], this.agent.isRunning = !1), this._suggestedPrompts.length > 0 && (this._showPrompts = !0), this.notify();
 	}
 	async refreshConversations() {
 		try {
@@ -3409,6 +3469,12 @@ var ChatController = class {
 	get conversations() {
 		return chatService.conversations;
 	}
+	get suggestedPrompts() {
+		return chatService.suggestedPrompts;
+	}
+	get showPrompts() {
+		return chatService.showPrompts;
+	}
 	sendMessage(o, O = "user") {
 		return chatService.sendMessage(o, O);
 	}
@@ -3433,6 +3499,12 @@ var ChatController = class {
 	setAppFocus(o) {
 		return chatService.setAppFocus(o);
 	}
+	setSuggestedPrompts(o) {
+		return chatService.setSuggestedPrompts(o);
+	}
+	hideSuggestedPrompts() {
+		return chatService.hideSuggestedPrompts();
+	}
 	refreshConversations() {
 		return chatService.refreshConversations();
 	}
@@ -3512,6 +3584,9 @@ var AgentChat = class extends i {
 	setAppFocus(o) {
 		this._chatController.setAppFocus(o);
 	}
+	setSuggestedPrompts(o) {
+		this._chatController.setSuggestedPrompts(o);
+	}
 	_toggleHistory() {
 		this._historyOpen = !this._historyOpen, this._historyOpen && this._chatController.refreshConversations();
 	}
@@ -3546,6 +3621,7 @@ var AgentChat = class extends i {
             ?isRunning="${this._chatController.isRunning}" 
             .disclaimer="${this.disclaimer}"
             .placeholder="${this.placeholder}"
+            .prompts="${this._chatController.showPrompts ? this._chatController.suggestedPrompts : []}"
             @send="${this._handleSend}">
         </agent-chat-composer>