@m6d/cortex-client 1.4.2 → 1.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { InjectionToken, inject, NgZone, Injectable, signal, DestroyRef, Pipe, input, ViewEncapsulation, ChangeDetectionStrategy, Component, computed, forwardRef,
|
|
2
|
+
import { InjectionToken, inject, NgZone, Injectable, signal, DestroyRef, Pipe, input, effect, ViewEncapsulation, ChangeDetectionStrategy, Component, computed, forwardRef, afterNextRender, viewChild, model, Injector } from '@angular/core';
|
|
3
3
|
import * as i1$1 from '@angular/forms';
|
|
4
4
|
import { FormControl, Validators, FormBuilder, ReactiveFormsModule, NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
|
|
5
5
|
import { TranslatePipe, TranslateService, provideTranslateService, provideTranslateLoader } from '@ngx-translate/core';
|
|
@@ -53,10 +53,10 @@ class CortexClientWebSocketService {
|
|
|
53
53
|
get events() {
|
|
54
54
|
return this.events$;
|
|
55
55
|
}
|
|
56
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
57
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
56
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexClientWebSocketService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
57
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexClientWebSocketService });
|
|
58
58
|
}
|
|
59
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexClientWebSocketService, decorators: [{
|
|
60
60
|
type: Injectable
|
|
61
61
|
}], ctorParameters: () => [] });
|
|
62
62
|
function deriveWsUrl(baseUrl) {
|
|
@@ -195,17 +195,6 @@ class CortexChatService {
|
|
|
195
195
|
chat.stop();
|
|
196
196
|
this.isAgentWorking.set(false);
|
|
197
197
|
this.hasPendingToolCalls.set(false);
|
|
198
|
-
const threadId = this.selectedThread()?.id;
|
|
199
|
-
if (!threadId)
|
|
200
|
-
return;
|
|
201
|
-
this.reloadMessages(threadId).subscribe((messages) => {
|
|
202
|
-
if (this.chat() !== chat)
|
|
203
|
-
return;
|
|
204
|
-
if (this.selectedThread()?.id !== threadId)
|
|
205
|
-
return;
|
|
206
|
-
chat.messages = messages;
|
|
207
|
-
this.syncConversationState(messages);
|
|
208
|
-
});
|
|
209
198
|
}
|
|
210
199
|
deleteThread(threadId) {
|
|
211
200
|
if (this.selectedThread()?.id === threadId)
|
|
@@ -218,9 +207,27 @@ class CortexChatService {
|
|
|
218
207
|
case 'thread:title-updated':
|
|
219
208
|
this.onThreadTitleUpdated(event.payload);
|
|
220
209
|
break;
|
|
210
|
+
case 'thread:messages-updated':
|
|
211
|
+
this.onThreadMessagesUpdated(event.payload);
|
|
212
|
+
break;
|
|
221
213
|
}
|
|
222
214
|
});
|
|
223
215
|
}
|
|
216
|
+
onThreadMessagesUpdated(payload) {
|
|
217
|
+
const chat = this.chat();
|
|
218
|
+
if (!chat || this.selectedThread()?.id !== payload.threadId)
|
|
219
|
+
return;
|
|
220
|
+
if (this.isAgentWorking())
|
|
221
|
+
return;
|
|
222
|
+
this.reloadMessages(payload.threadId).subscribe((messages) => {
|
|
223
|
+
if (this.chat() !== chat)
|
|
224
|
+
return;
|
|
225
|
+
if (this.selectedThread()?.id !== payload.threadId)
|
|
226
|
+
return;
|
|
227
|
+
chat.messages = messages;
|
|
228
|
+
this.syncConversationState(messages);
|
|
229
|
+
});
|
|
230
|
+
}
|
|
224
231
|
onThreadTitleUpdated(payload) {
|
|
225
232
|
const current = this.threads();
|
|
226
233
|
if (current) {
|
|
@@ -294,10 +301,10 @@ class CortexChatService {
|
|
|
294
301
|
const text = await res.text();
|
|
295
302
|
return text ? JSON.parse(text) : undefined;
|
|
296
303
|
}
|
|
297
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
298
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
304
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexChatService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
305
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexChatService });
|
|
299
306
|
}
|
|
300
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
307
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexChatService, decorators: [{
|
|
301
308
|
type: Injectable
|
|
302
309
|
}], ctorParameters: () => [] });
|
|
303
310
|
/**
|
|
@@ -337,10 +344,10 @@ class MarkedPipe {
|
|
|
337
344
|
.replace(/<(t[hd])([\s>])/g, '<$1 style="padding:0.5rem 1rem"$2');
|
|
338
345
|
return this.sanitizer.bypassSecurityTrustHtml(DOMPurify.sanitize(html));
|
|
339
346
|
}
|
|
340
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
341
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.
|
|
347
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MarkedPipe, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
|
|
348
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.4", ngImport: i0, type: MarkedPipe, isStandalone: true, name: "marked" });
|
|
342
349
|
}
|
|
343
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
350
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MarkedPipe, decorators: [{
|
|
344
351
|
type: Pipe,
|
|
345
352
|
args: [{
|
|
346
353
|
name: 'marked',
|
|
@@ -348,23 +355,130 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImpor
|
|
|
348
355
|
}]
|
|
349
356
|
}], ctorParameters: () => [{ type: i1.DomSanitizer }] });
|
|
350
357
|
|
|
358
|
+
/**
|
|
359
|
+
* Smooths the display of streamed text by buffering incoming characters
|
|
360
|
+
* and releasing them at a consistent rate, eliminating the jerky appearance
|
|
361
|
+
* caused by uneven token delivery from LLMs.
|
|
362
|
+
*
|
|
363
|
+
* Uses a proportional drain strategy: each animation frame releases a fraction
|
|
364
|
+
* of the buffered characters, creating natural smoothing that adapts to
|
|
365
|
+
* the incoming token rate.
|
|
366
|
+
*/
|
|
367
|
+
class StreamTextSmoother {
|
|
368
|
+
onUpdate;
|
|
369
|
+
fullText = '';
|
|
370
|
+
displayedLength = 0;
|
|
371
|
+
animationFrameId = null;
|
|
372
|
+
isDone = false;
|
|
373
|
+
/**
|
|
374
|
+
* Fraction of buffer to release per frame.
|
|
375
|
+
* At 60fps, 0.03 means roughly half the buffer drains in ~23 frames (~383ms).
|
|
376
|
+
*/
|
|
377
|
+
static DRAIN_FRACTION = 0.03;
|
|
378
|
+
/** Minimum characters to release per frame to prevent stalling at small buffer sizes. */
|
|
379
|
+
static MIN_CHARS_PER_FRAME = 1;
|
|
380
|
+
/** Faster drain fraction when the stream has completed, for a quick but smooth flush. */
|
|
381
|
+
static DONE_DRAIN_FRACTION = 0.1;
|
|
382
|
+
constructor(onUpdate) {
|
|
383
|
+
this.onUpdate = onUpdate;
|
|
384
|
+
}
|
|
385
|
+
update(newFullText, done) {
|
|
386
|
+
this.fullText = newFullText;
|
|
387
|
+
this.isDone = done;
|
|
388
|
+
if (done && this.displayedLength >= this.fullText.length) {
|
|
389
|
+
this.onUpdate(this.fullText);
|
|
390
|
+
this.stopAnimation();
|
|
391
|
+
return;
|
|
392
|
+
}
|
|
393
|
+
if (!this.animationFrameId) {
|
|
394
|
+
this.scheduleFrame();
|
|
395
|
+
}
|
|
396
|
+
}
|
|
397
|
+
destroy() {
|
|
398
|
+
this.stopAnimation();
|
|
399
|
+
}
|
|
400
|
+
scheduleFrame() {
|
|
401
|
+
this.animationFrameId = requestAnimationFrame(() => this.tick());
|
|
402
|
+
}
|
|
403
|
+
tick() {
|
|
404
|
+
const bufferSize = this.fullText.length - this.displayedLength;
|
|
405
|
+
if (bufferSize <= 0) {
|
|
406
|
+
this.animationFrameId = null;
|
|
407
|
+
return;
|
|
408
|
+
}
|
|
409
|
+
const fraction = this.isDone
|
|
410
|
+
? StreamTextSmoother.DONE_DRAIN_FRACTION
|
|
411
|
+
: StreamTextSmoother.DRAIN_FRACTION;
|
|
412
|
+
const charsToRelease = Math.max(StreamTextSmoother.MIN_CHARS_PER_FRAME, Math.ceil(bufferSize * fraction));
|
|
413
|
+
this.displayedLength = Math.min(this.fullText.length, this.displayedLength + charsToRelease);
|
|
414
|
+
this.onUpdate(this.fullText.substring(0, this.displayedLength));
|
|
415
|
+
if (this.displayedLength < this.fullText.length) {
|
|
416
|
+
this.scheduleFrame();
|
|
417
|
+
}
|
|
418
|
+
else {
|
|
419
|
+
this.animationFrameId = null;
|
|
420
|
+
}
|
|
421
|
+
}
|
|
422
|
+
stopAnimation() {
|
|
423
|
+
if (this.animationFrameId) {
|
|
424
|
+
cancelAnimationFrame(this.animationFrameId);
|
|
425
|
+
this.animationFrameId = null;
|
|
426
|
+
}
|
|
427
|
+
}
|
|
428
|
+
}
|
|
429
|
+
|
|
351
430
|
class MessageTextPartComponent {
|
|
352
431
|
role = input.required(...(ngDevMode ? [{ debugName: "role" }] : /* istanbul ignore next */ []));
|
|
353
432
|
textPart = input.required(...(ngDevMode ? [{ debugName: "textPart" }] : /* istanbul ignore next */ []));
|
|
354
|
-
|
|
355
|
-
|
|
433
|
+
displayedText = signal('', ...(ngDevMode ? [{ debugName: "displayedText" }] : /* istanbul ignore next */ []));
|
|
434
|
+
smoother = null;
|
|
435
|
+
isFirstRender = true;
|
|
436
|
+
constructor() {
|
|
437
|
+
effect(() => {
|
|
438
|
+
const part = this.textPart();
|
|
439
|
+
const role = this.role();
|
|
440
|
+
if (role !== 'assistant') {
|
|
441
|
+
this.destroySmoother();
|
|
442
|
+
this.displayedText.set(part.text);
|
|
443
|
+
this.isFirstRender = false;
|
|
444
|
+
return;
|
|
445
|
+
}
|
|
446
|
+
// Historical message already complete on first render — show immediately
|
|
447
|
+
if (this.isFirstRender && part.state !== 'streaming') {
|
|
448
|
+
this.displayedText.set(part.text);
|
|
449
|
+
this.isFirstRender = false;
|
|
450
|
+
return;
|
|
451
|
+
}
|
|
452
|
+
this.isFirstRender = false;
|
|
453
|
+
if (!this.smoother) {
|
|
454
|
+
this.smoother = new StreamTextSmoother((text) => this.displayedText.set(text));
|
|
455
|
+
}
|
|
456
|
+
this.smoother.update(part.text, part.state !== 'streaming');
|
|
457
|
+
});
|
|
458
|
+
}
|
|
459
|
+
ngOnDestroy() {
|
|
460
|
+
this.destroySmoother();
|
|
461
|
+
}
|
|
462
|
+
destroySmoother() {
|
|
463
|
+
if (this.smoother) {
|
|
464
|
+
this.smoother.destroy();
|
|
465
|
+
this.smoother = null;
|
|
466
|
+
}
|
|
467
|
+
}
|
|
468
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageTextPartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
469
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: MessageTextPartComponent, isStandalone: true, selector: "cortex-message-text-part", inputs: { role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: true, transformFunction: null }, textPart: { classPropertyName: "textPart", publicName: "textPart", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div\n class=\"cortex-text-part\"\n [class.cortex-text-part--assistant]=\"role() === 'assistant'\"\n [class.cortex-text-part--user]=\"role() === 'user'\"\n>\n <div\n class=\"cortex-text-bubble\"\n [class.cortex-text-bubble--assistant]=\"role() === 'assistant'\"\n [class.cortex-text-bubble--user]=\"role() === 'user'\"\n [innerHTML]=\"displayedText() | marked\"\n ></div>\n</div>\n", styles: [".cortex-text-part{width:100%;display:flex;flex-direction:column}.cortex-text-part--assistant{align-items:flex-start}.cortex-text-part--user{align-items:flex-end}[dir=rtl] .cortex-text-part--assistant{align-items:flex-start}[dir=rtl] .cortex-text-part--user{align-items:flex-end}.cortex-text-bubble{max-width:80%;font-size:.8125rem;line-height:1.625;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;color:#334155}.cortex-text-bubble--assistant{background:#f1f5f9;border-bottom-left-radius:0}[dir=rtl] .cortex-text-bubble--assistant{border-bottom-left-radius:1rem;border-bottom-right-radius:0}.cortex-text-bubble--user{background:#f8fafc;border-bottom-right-radius:0}[dir=rtl] .cortex-text-bubble--user{border-bottom-right-radius:1rem;border-bottom-left-radius:0}.cortex-text-bubble h1,.cortex-text-bubble h2,.cortex-text-bubble h3,.cortex-text-bubble h4,.cortex-text-bubble h5,.cortex-text-bubble h6{margin-top:1.25em;margin-bottom:.5em;font-weight:600;line-height:1.3;color:#1e293b}.cortex-text-bubble h1:first-child,.cortex-text-bubble h2:first-child,.cortex-text-bubble h3:first-child,.cortex-text-bubble h4:first-child,.cortex-text-bubble h5:first-child,.cortex-text-bubble h6:first-child{margin-top:0}.cortex-text-bubble h1{font-size:1.25em}.cortex-text-bubble h2{font-size:1.125em}.cortex-text-bubble h3{font-size:1em}.cortex-text-bubble p{margin-top:.75em;margin-bottom:.75em}.cortex-text-bubble p:first-child{margin-top:0}.cortex-text-bubble p:last-child{margin-bottom:0}.cortex-text-bubble ul,.cortex-text-bubble ol{margin-top:.75em;margin-bottom:.75em;padding-inline-start:1.5em}.cortex-text-bubble ul{list-style-type:disc}.cortex-text-bubble ol{list-style-type:decimal}.cortex-text-bubble li{margin-top:.25em;margin-bottom:.25em}.cortex-text-bubble code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.875em;background:#e2e8f0;padding:.125em .375em;border-radius:.25rem}.cortex-text-bubble pre{margin-top:.75em;margin-bottom:.75em;padding:.75em 1em;background:#1e293b;border-radius:.5rem;overflow-x:auto;font-size:.8125em;line-height:1.6}.cortex-text-bubble pre code{background:transparent;padding:0;color:#e2e8f0}.cortex-text-bubble blockquote{margin-top:.75em;margin-bottom:.75em;padding-inline-start:1em;border-inline-start:3px solid #cbd5e1;color:#64748b;font-style:italic}.cortex-text-bubble a{color:#2563eb;text-decoration:underline}.cortex-text-bubble a:hover{color:#1d4ed8}.cortex-text-bubble table{width:100%;border-collapse:collapse;margin-top:.75em;margin-bottom:.75em;font-size:.875em}.cortex-text-bubble th,.cortex-text-bubble td{border:1px solid #e2e8f0;padding:.375em .75em;text-align:start}.cortex-text-bubble th{background:#f8fafc;font-weight:600}.cortex-text-bubble hr{margin-top:1.5em;margin-bottom:1.5em;border:none;border-top:1px solid #e2e8f0}.cortex-text-bubble img{max-width:100%;height:auto;border-radius:.375rem}\n"], dependencies: [{ kind: "pipe", type: MarkedPipe, name: "marked" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
356
470
|
}
|
|
357
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
471
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageTextPartComponent, decorators: [{
|
|
358
472
|
type: Component,
|
|
359
|
-
args: [{ selector: 'cortex-message-text-part', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [MarkedPipe], template: "<div\n class=\"cortex-text-part\"\n [class.cortex-text-part--assistant]=\"role() === 'assistant'\"\n [class.cortex-text-part--user]=\"role() === 'user'\"\n>\n <div\n class=\"cortex-text-bubble\"\n [class.cortex-text-bubble--assistant]=\"role() === 'assistant'\"\n [class.cortex-text-bubble--user]=\"role() === 'user'\"\n [innerHTML]=\"
|
|
360
|
-
}], propDecorators: { role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: true }] }], textPart: [{ type: i0.Input, args: [{ isSignal: true, alias: "textPart", required: true }] }] } });
|
|
473
|
+
args: [{ selector: 'cortex-message-text-part', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [MarkedPipe], template: "<div\n class=\"cortex-text-part\"\n [class.cortex-text-part--assistant]=\"role() === 'assistant'\"\n [class.cortex-text-part--user]=\"role() === 'user'\"\n>\n <div\n class=\"cortex-text-bubble\"\n [class.cortex-text-bubble--assistant]=\"role() === 'assistant'\"\n [class.cortex-text-bubble--user]=\"role() === 'user'\"\n [innerHTML]=\"displayedText() | marked\"\n ></div>\n</div>\n", styles: [".cortex-text-part{width:100%;display:flex;flex-direction:column}.cortex-text-part--assistant{align-items:flex-start}.cortex-text-part--user{align-items:flex-end}[dir=rtl] .cortex-text-part--assistant{align-items:flex-start}[dir=rtl] .cortex-text-part--user{align-items:flex-end}.cortex-text-bubble{max-width:80%;font-size:.8125rem;line-height:1.625;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;color:#334155}.cortex-text-bubble--assistant{background:#f1f5f9;border-bottom-left-radius:0}[dir=rtl] .cortex-text-bubble--assistant{border-bottom-left-radius:1rem;border-bottom-right-radius:0}.cortex-text-bubble--user{background:#f8fafc;border-bottom-right-radius:0}[dir=rtl] .cortex-text-bubble--user{border-bottom-right-radius:1rem;border-bottom-left-radius:0}.cortex-text-bubble h1,.cortex-text-bubble h2,.cortex-text-bubble h3,.cortex-text-bubble h4,.cortex-text-bubble h5,.cortex-text-bubble h6{margin-top:1.25em;margin-bottom:.5em;font-weight:600;line-height:1.3;color:#1e293b}.cortex-text-bubble h1:first-child,.cortex-text-bubble h2:first-child,.cortex-text-bubble h3:first-child,.cortex-text-bubble h4:first-child,.cortex-text-bubble h5:first-child,.cortex-text-bubble h6:first-child{margin-top:0}.cortex-text-bubble h1{font-size:1.25em}.cortex-text-bubble h2{font-size:1.125em}.cortex-text-bubble h3{font-size:1em}.cortex-text-bubble p{margin-top:.75em;margin-bottom:.75em}.cortex-text-bubble p:first-child{margin-top:0}.cortex-text-bubble p:last-child{margin-bottom:0}.cortex-text-bubble ul,.cortex-text-bubble ol{margin-top:.75em;margin-bottom:.75em;padding-inline-start:1.5em}.cortex-text-bubble ul{list-style-type:disc}.cortex-text-bubble ol{list-style-type:decimal}.cortex-text-bubble li{margin-top:.25em;margin-bottom:.25em}.cortex-text-bubble code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.875em;background:#e2e8f0;padding:.125em .375em;border-radius:.25rem}.cortex-text-bubble pre{margin-top:.75em;margin-bottom:.75em;padding:.75em 1em;background:#1e293b;border-radius:.5rem;overflow-x:auto;font-size:.8125em;line-height:1.6}.cortex-text-bubble pre code{background:transparent;padding:0;color:#e2e8f0}.cortex-text-bubble blockquote{margin-top:.75em;margin-bottom:.75em;padding-inline-start:1em;border-inline-start:3px solid #cbd5e1;color:#64748b;font-style:italic}.cortex-text-bubble a{color:#2563eb;text-decoration:underline}.cortex-text-bubble a:hover{color:#1d4ed8}.cortex-text-bubble table{width:100%;border-collapse:collapse;margin-top:.75em;margin-bottom:.75em;font-size:.875em}.cortex-text-bubble th,.cortex-text-bubble td{border:1px solid #e2e8f0;padding:.375em .75em;text-align:start}.cortex-text-bubble th{background:#f8fafc;font-weight:600}.cortex-text-bubble hr{margin-top:1.5em;margin-bottom:1.5em;border:none;border-top:1px solid #e2e8f0}.cortex-text-bubble img{max-width:100%;height:auto;border-radius:.375rem}\n"] }]
|
|
474
|
+
}], ctorParameters: () => [], propDecorators: { role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: true }] }], textPart: [{ type: i0.Input, args: [{ isSignal: true, alias: "textPart", required: true }] }] } });
|
|
361
475
|
|
|
362
476
|
class MessageReasoningPartComponent {
|
|
363
477
|
reasoningPart = input.required(...(ngDevMode ? [{ debugName: "reasoningPart" }] : /* istanbul ignore next */ []));
|
|
364
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
365
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
478
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageReasoningPartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
479
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: MessageReasoningPartComponent, isStandalone: true, selector: "cortex-message-reasoning-part", inputs: { reasoningPart: { classPropertyName: "reasoningPart", publicName: "reasoningPart", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@let p = reasoningPart();\n<details class=\"cortex-reasoning-details\">\n <summary class=\"cortex-reasoning-details__summary\">\n <div class=\"cortex-reasoning-details__header\">\n <span class=\"cortex-reasoning-details__icon\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 20 20\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M10 2C6.686 2 4 4.686 4 8c0 1.655.672 3.154 1.757 4.243.362.363.576.858.576 1.371V14.5a1 1 0 0 0 1 1h5.334a1 1 0 0 0 1-1v-.886c0-.513.214-1.008.576-1.371A5.978 5.978 0 0 0 16 8c0-3.314-2.686-6-6-6Z\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n <path\n d=\"M7.5 17.5h5M8.5 8a2 2 0 0 1 2-2\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n\n <div class=\"cortex-reasoning-details__title-group\">\n <div class=\"cortex-reasoning-details__title-row\">\n <div class=\"cortex-reasoning-details__title\">Reasoning</div>\n @if (p.state) {\n <span\n class=\"cortex-reasoning-details__badge\"\n [ngClass]=\"{\n 'cortex-reasoning-details__badge--streaming': p.state === 'streaming',\n 'cortex-reasoning-details__badge--done': p.state === 'done',\n }\"\n >\n {{ p.state === 'streaming' ? 'Streaming' : 'Done' }}\n </span>\n }\n </div>\n </div>\n </div>\n\n <span class=\"cortex-reasoning-details__chevron\" aria-hidden=\"true\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"m5.75 8.25 4.25 4.25 4.25-4.25\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n </summary>\n\n <div class=\"cortex-reasoning-details__body\">\n <div class=\"cortex-reasoning-details__content\">\n <pre class=\"cortex-reasoning-details__pre\">{{\n p.text.trim() ? p.text : 'No reasoning provided.'\n }}</pre>\n </div>\n </div>\n</details>\n", styles: [".cortex-reasoning-details{width:100%;border-radius:.5rem;border:1px solid #e2e8f0;background:#f8fafc;overflow:hidden}.cortex-reasoning-details__summary{list-style:none;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem 1rem;display:flex;align-items:center;gap:.75rem}.cortex-reasoning-details__summary::-webkit-details-marker{display:none}.cortex-reasoning-details__header{display:flex;align-items:center;gap:.5rem;min-width:0;flex:1}.cortex-reasoning-details__icon{display:inline-flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center;border-radius:.25rem;background:#e0e7ff;color:#4f46e5}.cortex-reasoning-details__title-group{min-width:0}.cortex-reasoning-details__title-row{display:flex;align-items:center;gap:.5rem}.cortex-reasoning-details__title{font-weight:500;color:#334155;font-size:.875rem}.cortex-reasoning-details__badge{display:inline-flex;align-items:center;border-radius:.25rem;padding:.125rem .375rem;font-size:.6875rem;font-weight:500}.cortex-reasoning-details__badge--streaming{background:#fef3c7;color:#b45309}.cortex-reasoning-details__badge--done{background:#d1fae5;color:#047857}.cortex-reasoning-details__chevron{margin-inline-start:auto;display:inline-flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center;border-radius:.25rem;color:#94a3b8;transition:transform .2s}details[open]>summary>.cortex-reasoning-details__chevron{transform:rotate(180deg)}.cortex-reasoning-details__body{padding:0 1rem 1rem}.cortex-reasoning-details__content{margin-top:.25rem;border-radius:.25rem;background:#fff;border:1px solid #e2e8f0;padding:.75rem}.cortex-reasoning-details__pre{margin:0;white-space:pre-wrap;overflow-wrap:break-word;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem;line-height:1.625;color:#334155}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
366
480
|
}
|
|
367
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
481
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageReasoningPartComponent, decorators: [{
|
|
368
482
|
type: Component,
|
|
369
483
|
args: [{ selector: 'cortex-message-reasoning-part', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [NgClass], template: "@let p = reasoningPart();\n<details class=\"cortex-reasoning-details\">\n <summary class=\"cortex-reasoning-details__summary\">\n <div class=\"cortex-reasoning-details__header\">\n <span class=\"cortex-reasoning-details__icon\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 20 20\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M10 2C6.686 2 4 4.686 4 8c0 1.655.672 3.154 1.757 4.243.362.363.576.858.576 1.371V14.5a1 1 0 0 0 1 1h5.334a1 1 0 0 0 1-1v-.886c0-.513.214-1.008.576-1.371A5.978 5.978 0 0 0 16 8c0-3.314-2.686-6-6-6Z\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n <path\n d=\"M7.5 17.5h5M8.5 8a2 2 0 0 1 2-2\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n\n <div class=\"cortex-reasoning-details__title-group\">\n <div class=\"cortex-reasoning-details__title-row\">\n <div class=\"cortex-reasoning-details__title\">Reasoning</div>\n @if (p.state) {\n <span\n class=\"cortex-reasoning-details__badge\"\n [ngClass]=\"{\n 'cortex-reasoning-details__badge--streaming': p.state === 'streaming',\n 'cortex-reasoning-details__badge--done': p.state === 'done',\n }\"\n >\n {{ p.state === 'streaming' ? 'Streaming' : 'Done' }}\n </span>\n }\n </div>\n </div>\n </div>\n\n <span class=\"cortex-reasoning-details__chevron\" aria-hidden=\"true\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"m5.75 8.25 4.25 4.25 4.25-4.25\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n </summary>\n\n <div class=\"cortex-reasoning-details__body\">\n <div class=\"cortex-reasoning-details__content\">\n <pre class=\"cortex-reasoning-details__pre\">{{\n p.text.trim() ? p.text : 'No reasoning provided.'\n }}</pre>\n </div>\n </div>\n</details>\n", styles: [".cortex-reasoning-details{width:100%;border-radius:.5rem;border:1px solid #e2e8f0;background:#f8fafc;overflow:hidden}.cortex-reasoning-details__summary{list-style:none;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem 1rem;display:flex;align-items:center;gap:.75rem}.cortex-reasoning-details__summary::-webkit-details-marker{display:none}.cortex-reasoning-details__header{display:flex;align-items:center;gap:.5rem;min-width:0;flex:1}.cortex-reasoning-details__icon{display:inline-flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center;border-radius:.25rem;background:#e0e7ff;color:#4f46e5}.cortex-reasoning-details__title-group{min-width:0}.cortex-reasoning-details__title-row{display:flex;align-items:center;gap:.5rem}.cortex-reasoning-details__title{font-weight:500;color:#334155;font-size:.875rem}.cortex-reasoning-details__badge{display:inline-flex;align-items:center;border-radius:.25rem;padding:.125rem .375rem;font-size:.6875rem;font-weight:500}.cortex-reasoning-details__badge--streaming{background:#fef3c7;color:#b45309}.cortex-reasoning-details__badge--done{background:#d1fae5;color:#047857}.cortex-reasoning-details__chevron{margin-inline-start:auto;display:inline-flex;height:1.5rem;width:1.5rem;align-items:center;justify-content:center;border-radius:.25rem;color:#94a3b8;transition:transform .2s}details[open]>summary>.cortex-reasoning-details__chevron{transform:rotate(180deg)}.cortex-reasoning-details__body{padding:0 1rem 1rem}.cortex-reasoning-details__content{margin-top:.25rem;border-radius:.25rem;background:#fff;border:1px solid #e2e8f0;padding:.75rem}.cortex-reasoning-details__pre{margin:0;white-space:pre-wrap;overflow-wrap:break-word;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem;line-height:1.625;color:#334155}\n"] }]
|
|
370
484
|
}], propDecorators: { reasoningPart: [{ type: i0.Input, args: [{ isSignal: true, alias: "reasoningPart", required: true }] }] } });
|
|
@@ -388,10 +502,10 @@ class HighlightPipe {
|
|
|
388
502
|
escapeHtml(str) {
|
|
389
503
|
return str.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
|
|
390
504
|
}
|
|
391
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
392
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.
|
|
505
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: HighlightPipe, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
|
|
506
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.4", ngImport: i0, type: HighlightPipe, isStandalone: true, name: "highlight" });
|
|
393
507
|
}
|
|
394
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
508
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: HighlightPipe, decorators: [{
|
|
395
509
|
type: Pipe,
|
|
396
510
|
args: [{ name: 'highlight', standalone: true }]
|
|
397
511
|
}], ctorParameters: () => [{ type: i1.DomSanitizer }] });
|
|
@@ -489,10 +603,10 @@ class JsonTreeComponent {
|
|
|
489
603
|
}
|
|
490
604
|
return value;
|
|
491
605
|
}
|
|
492
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
493
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
606
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: JsonTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
607
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: JsonTreeComponent, isStandalone: true, selector: "cortex-json-tree", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, expandDepth: { classPropertyName: "expandDepth", publicName: "expandDepth", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "cortex-json-tree" }, ngImport: i0, template: "<!-- Entry point: parse and render the root value -->\n<ng-container\n *ngTemplateOutlet=\"valueTemplate; context: { $implicit: parsed(data()), path: '$', depth: 0 }\"\n/>\n\n<!-- Recursive value renderer -->\n<ng-template #valueTemplate let-value let-path=\"path\" let-depth=\"depth\">\n @if (isObject(value)) {\n @if (objectLength(value) === 0) {\n <span class=\"jt-bracket\">{{ '{' }}{{ '}' }}</span>\n } @else {\n <span class=\"jt-toggle\" (click)=\"toggle(path, depth); $event.stopPropagation()\" role=\"button\">\n <span class=\"jt-arrow\" [class.jt-arrow--collapsed]=\"isCollapsed(path, depth)\">▾</span>\n <span class=\"jt-bracket\">{{ '{' }}</span>\n </span>\n @if (isCollapsed(path, depth)) {\n <span\n class=\"jt-collapsed-hint\"\n (click)=\"toggle(path, depth); $event.stopPropagation()\"\n role=\"button\"\n >{{ objectLength(value) }}\n {{ objectLength(value) === 1 ? 'property' : 'properties' }}</span\n ><span class=\"jt-bracket\">{{ '}' }}</span>\n } @else {\n <div class=\"jt-indent\">\n @for (entry of objectEntries(value); track entry[0]; let last = $last) {\n <div class=\"jt-line\">\n <span class=\"jt-key\">\"{{ entry[0] }}\"</span><span class=\"jt-colon\">: </span>\n @if (isContainer(entry[1])) {\n <ng-container\n *ngTemplateOutlet=\"\n valueTemplate;\n context: { $implicit: entry[1], path: path + '.' + entry[0], depth: depth + 1 }\n \"\n />\n } @else {\n <span [class]=\"primitiveClass(entry[1])\">{{ formatPrimitive(entry[1]) }}</span>\n }\n @if (!last) {\n <span class=\"jt-comma\">,</span>\n }\n </div>\n }\n </div>\n <span class=\"jt-bracket\">{{ '}' }}</span>\n }\n }\n } @else if (isArray(value)) {\n @if (arrayLength(value) === 0) {\n <span class=\"jt-bracket\">[]</span>\n } @else {\n <span class=\"jt-toggle\" (click)=\"toggle(path, depth); $event.stopPropagation()\" role=\"button\">\n <span class=\"jt-arrow\" [class.jt-arrow--collapsed]=\"isCollapsed(path, depth)\">▾</span>\n <span class=\"jt-bracket\">[</span>\n </span>\n @if (isCollapsed(path, depth)) {\n <span\n class=\"jt-collapsed-hint\"\n (click)=\"toggle(path, depth); $event.stopPropagation()\"\n role=\"button\"\n >{{ arrayLength(value) }} {{ arrayLength(value) === 1 ? 'item' : 'items' }}</span\n ><span class=\"jt-bracket\">]</span>\n } @else {\n <div class=\"jt-indent\">\n @for (item of arrayItems(value); track $index; let last = $last) {\n <div class=\"jt-line\">\n @if (isContainer(item)) {\n <ng-container\n *ngTemplateOutlet=\"\n valueTemplate;\n context: { $implicit: item, path: path + '[' + $index + ']', depth: depth + 1 }\n \"\n />\n } @else {\n <span [class]=\"primitiveClass(item)\">{{ formatPrimitive(item) }}</span>\n }\n @if (!last) {\n <span class=\"jt-comma\">,</span>\n }\n </div>\n }\n </div>\n <span class=\"jt-bracket\">]</span>\n }\n }\n } @else {\n <span [class]=\"primitiveClass(value)\">{{ formatPrimitive(value) }}</span>\n }\n</ng-template>\n", styles: [".cortex-json-tree{display:block;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem;line-height:1.25rem;-webkit-user-select:text;user-select:text;white-space:pre-wrap;word-break:break-word}.jt-indent{padding-inline-start:1.25em;border-inline-start:1px solid #e2e8f0;margin-inline-start:.3em}.jt-line{position:relative}.jt-toggle{cursor:pointer;-webkit-user-select:none;user-select:none}.jt-toggle:hover .jt-arrow{color:#475569}.jt-arrow{display:inline-block;width:1em;text-align:center;color:#94a3b8;font-size:.7em;transition:transform .15s ease;vertical-align:middle}.jt-arrow--collapsed{transform:rotate(-90deg)}.jt-bracket{color:#64748b}.jt-key{color:#6366f1}.jt-colon{color:#64748b}.jt-comma{color:#94a3b8}.jt-string{color:#059669}.jt-number{color:#2563eb}.jt-boolean{color:#d97706}.jt-null{color:#94a3b8;font-style:italic}.jt-collapsed-hint{display:inline-block;padding:0 .4em;margin:0 .15em;font-size:10px;line-height:1.5;color:#94a3b8;background:#f8fafc;border:1px solid #e2e8f0;border-radius:3px;font-style:italic;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:middle}.jt-collapsed-hint:hover{color:#64748b;border-color:#cbd5e1;background:#f1f5f9}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
494
608
|
}
|
|
495
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
609
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: JsonTreeComponent, decorators: [{
|
|
496
610
|
type: Component,
|
|
497
611
|
args: [{ selector: 'cortex-json-tree', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [NgTemplateOutlet], host: { class: 'cortex-json-tree' }, template: "<!-- Entry point: parse and render the root value -->\n<ng-container\n *ngTemplateOutlet=\"valueTemplate; context: { $implicit: parsed(data()), path: '$', depth: 0 }\"\n/>\n\n<!-- Recursive value renderer -->\n<ng-template #valueTemplate let-value let-path=\"path\" let-depth=\"depth\">\n @if (isObject(value)) {\n @if (objectLength(value) === 0) {\n <span class=\"jt-bracket\">{{ '{' }}{{ '}' }}</span>\n } @else {\n <span class=\"jt-toggle\" (click)=\"toggle(path, depth); $event.stopPropagation()\" role=\"button\">\n <span class=\"jt-arrow\" [class.jt-arrow--collapsed]=\"isCollapsed(path, depth)\">▾</span>\n <span class=\"jt-bracket\">{{ '{' }}</span>\n </span>\n @if (isCollapsed(path, depth)) {\n <span\n class=\"jt-collapsed-hint\"\n (click)=\"toggle(path, depth); $event.stopPropagation()\"\n role=\"button\"\n >{{ objectLength(value) }}\n {{ objectLength(value) === 1 ? 'property' : 'properties' }}</span\n ><span class=\"jt-bracket\">{{ '}' }}</span>\n } @else {\n <div class=\"jt-indent\">\n @for (entry of objectEntries(value); track entry[0]; let last = $last) {\n <div class=\"jt-line\">\n <span class=\"jt-key\">\"{{ entry[0] }}\"</span><span class=\"jt-colon\">: </span>\n @if (isContainer(entry[1])) {\n <ng-container\n *ngTemplateOutlet=\"\n valueTemplate;\n context: { $implicit: entry[1], path: path + '.' + entry[0], depth: depth + 1 }\n \"\n />\n } @else {\n <span [class]=\"primitiveClass(entry[1])\">{{ formatPrimitive(entry[1]) }}</span>\n }\n @if (!last) {\n <span class=\"jt-comma\">,</span>\n }\n </div>\n }\n </div>\n <span class=\"jt-bracket\">{{ '}' }}</span>\n }\n }\n } @else if (isArray(value)) {\n @if (arrayLength(value) === 0) {\n <span class=\"jt-bracket\">[]</span>\n } @else {\n <span class=\"jt-toggle\" (click)=\"toggle(path, depth); $event.stopPropagation()\" role=\"button\">\n <span class=\"jt-arrow\" [class.jt-arrow--collapsed]=\"isCollapsed(path, depth)\">▾</span>\n <span class=\"jt-bracket\">[</span>\n </span>\n @if (isCollapsed(path, depth)) {\n <span\n class=\"jt-collapsed-hint\"\n (click)=\"toggle(path, depth); $event.stopPropagation()\"\n role=\"button\"\n >{{ arrayLength(value) }} {{ arrayLength(value) === 1 ? 'item' : 'items' }}</span\n ><span class=\"jt-bracket\">]</span>\n } @else {\n <div class=\"jt-indent\">\n @for (item of arrayItems(value); track $index; let last = $last) {\n <div class=\"jt-line\">\n @if (isContainer(item)) {\n <ng-container\n *ngTemplateOutlet=\"\n valueTemplate;\n context: { $implicit: item, path: path + '[' + $index + ']', depth: depth + 1 }\n \"\n />\n } @else {\n <span [class]=\"primitiveClass(item)\">{{ formatPrimitive(item) }}</span>\n }\n @if (!last) {\n <span class=\"jt-comma\">,</span>\n }\n </div>\n }\n </div>\n <span class=\"jt-bracket\">]</span>\n }\n }\n } @else {\n <span [class]=\"primitiveClass(value)\">{{ formatPrimitive(value) }}</span>\n }\n</ng-template>\n", styles: [".cortex-json-tree{display:block;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem;line-height:1.25rem;-webkit-user-select:text;user-select:text;white-space:pre-wrap;word-break:break-word}.jt-indent{padding-inline-start:1.25em;border-inline-start:1px solid #e2e8f0;margin-inline-start:.3em}.jt-line{position:relative}.jt-toggle{cursor:pointer;-webkit-user-select:none;user-select:none}.jt-toggle:hover .jt-arrow{color:#475569}.jt-arrow{display:inline-block;width:1em;text-align:center;color:#94a3b8;font-size:.7em;transition:transform .15s ease;vertical-align:middle}.jt-arrow--collapsed{transform:rotate(-90deg)}.jt-bracket{color:#64748b}.jt-key{color:#6366f1}.jt-colon{color:#64748b}.jt-comma{color:#94a3b8}.jt-string{color:#059669}.jt-number{color:#2563eb}.jt-boolean{color:#d97706}.jt-null{color:#94a3b8;font-style:italic}.jt-collapsed-hint{display:inline-block;padding:0 .4em;margin:0 .15em;font-size:10px;line-height:1.5;color:#94a3b8;background:#f8fafc;border:1px solid #e2e8f0;border-radius:3px;font-style:italic;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:middle}.jt-collapsed-hint:hover{color:#64748b;border-color:#cbd5e1;background:#f1f5f9}\n"] }]
|
|
498
612
|
}], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], expandDepth: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandDepth", required: false }] }] } });
|
|
@@ -542,10 +656,10 @@ class MessageToolCallPartComponent {
|
|
|
542
656
|
return '';
|
|
543
657
|
return type.startsWith('tool-') ? type.slice('tool-'.length) : type;
|
|
544
658
|
}
|
|
545
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
546
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: MessageToolCallPartComponent, isStandalone: true, selector: "cortex-message-tool-call-part", inputs: { toolCallPart: { classPropertyName: "toolCallPart", publicName: "toolCallPart", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<details class=\"cortex-tool-details\">\n <summary class=\"cortex-tool-details__summary\">\n <div class=\"cortex-tool-details__header\">\n <div class=\"cortex-tool-details__icon-box\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-tool-details__icon-svg\" fill=\"none\">\n <path\n d=\"M6.5 6.5 3.75 10l2.75 3.5M13.5 6.5 16.25 10l-2.75 3.5M11.25 5.75 8.75 14.25\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n\n <div class=\"cortex-tool-details__info\">\n <div class=\"cortex-tool-details__title-row\">\n <div class=\"cortex-tool-details__name-row\">\n <div class=\"cortex-tool-details__name\" [attr.title]=\"toolCallPart().title || null\">\n {{ toolCallPart().title ?? 'Tool call' }}\n </div>\n @if (toolName()) {\n <span\n class=\"cortex-tool-details__tool-badge\"\n [attr.title]=\"toolCallPart().type || null\"\n >{{ toolName() }}</span\n >\n }\n </div>\n <div class=\"cortex-tool-details__id-line\">\n <span class=\"cortex-tool-details__id-label\">ID</span>\n <span class=\"cortex-tool-details__id-value\"> {{ toolCallPart().toolCallId }}</span>\n @if (toolCallPart().providerExecuted) {\n <span class=\"cortex-tool-details__provider-badge\">\n <span class=\"cortex-tool-details__provider-dot\"></span>\n provider\n </span>\n }\n </div>\n </div>\n\n <div class=\"cortex-tool-details__actions\">\n <span\n class=\"cortex-tool-details__state-badge\"\n [ngClass]=\"{\n 'cortex-tool-details__state-badge--success':\n toolCallPart().state === 'output-available',\n 'cortex-tool-details__state-badge--error': toolCallPart().state === 'output-error',\n 'cortex-tool-details__state-badge--denied': toolCallPart().state === 'output-denied',\n 'cortex-tool-details__state-badge--approval':\n toolCallPart().state === 'approval-requested' ||\n toolCallPart().state === 'approval-responded',\n 'cortex-tool-details__state-badge--pending':\n toolCallPart().state === 'input-streaming' ||\n toolCallPart().state === 'input-available',\n }\"\n >\n @switch (toolCallPart().state) {\n @case ('input-streaming') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--amber cortex-tool-details__status-dot--pulse\"\n ></span>\n Calling\n }\n @case ('input-available') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--amber\"\n ></span>\n Input ready\n }\n @case ('approval-requested') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--violet cortex-tool-details__status-dot--pulse\"\n ></span>\n Needs approval\n }\n @case ('approval-responded') {\n @if (toolCallPart().approval?.approved) {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--emerald\"\n ></span>\n Approved\n } @else {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--slate\"\n ></span>\n Responded\n }\n }\n @case ('output-available') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--emerald\"\n ></span>\n {{ 'translate_completed' | translate }}\n }\n @case ('output-error') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--red\"\n ></span>\n Error\n }\n @case ('output-denied') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--slate\"\n ></span>\n Denied\n }\n }\n </span>\n\n <span class=\"cortex-tool-details__chevron\" aria-hidden=\"true\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"m5.75 8.25 4.25 4.25 4.25-4.25\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n </div>\n </div>\n </div>\n </summary>\n\n <div class=\"cortex-tool-details__body\">\n <div class=\"cortex-tool-details__panels\">\n @for (snippet of codeSnippets(); track snippet.key) {\n <div class=\"cortex-tool-details__panel\">\n <div class=\"cortex-tool-details__panel-header\">\n <div class=\"cortex-tool-details__panel-label\">{{ snippet.key }}</div>\n <div class=\"cortex-tool-details__panel-lang\">{{ snippet.lang }}</div>\n </div>\n <pre\n dir=\"ltr\"\n class=\"cortex-tool-details__code-pre\"\n ><code class=\"hljs\" [innerHTML]=\"snippet.value | highlight : snippet.lang\"></code></pre>\n </div>\n }\n\n @if (remainingInput(); as remaining) {\n <div class=\"cortex-tool-details__panel\">\n <div class=\"cortex-tool-details__panel-header\">\n <div class=\"cortex-tool-details__panel-label\">Input</div>\n <div class=\"cortex-tool-details__panel-lang\">json</div>\n </div>\n <div dir=\"ltr\" class=\"cortex-tool-details__tree-container\">\n <cortex-json-tree [data]=\"remaining\" [expandDepth]=\"2\" />\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'output-available') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--success\">\n <div class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--success\">\n <div class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--success\">\n Output\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--success\">\n json\n </div>\n </div>\n <div dir=\"ltr\" class=\"cortex-tool-details__tree-container\">\n <cortex-json-tree [data]=\"toolCallPart().output\" [expandDepth]=\"2\" />\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'output-error') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--error\">\n <div class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--error\">\n <div class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--error\">\n Error\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--error\">\n text\n </div>\n </div>\n <pre dir=\"ltr\" class=\"cortex-tool-details__error-pre\">{{ toolCallPart().errorText }}</pre>\n </div>\n }\n\n @if (toolCallPart().state === 'output-denied') {\n <div class=\"cortex-tool-details__panel\">\n <div class=\"cortex-tool-details__panel-header\">\n <div class=\"cortex-tool-details__panel-label\">Denied</div>\n <div class=\"cortex-tool-details__panel-lang\">approval</div>\n </div>\n <div class=\"cortex-tool-details__denied-body\">\n Tool execution was denied.\n @if (toolCallPart().approval?.reason) {\n <div class=\"cortex-tool-details__reason-box\">\n <div class=\"cortex-tool-details__reason-label\">Reason</div>\n <div class=\"cortex-tool-details__reason-text\">\n {{ toolCallPart().approval?.reason }}\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'approval-requested') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--approval\">\n <div\n class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--approval\"\n >\n <div\n class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--approval\"\n >\n Approval requested\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--approval\">\n {{ toolCallPart().approval?.id }}\n </div>\n </div>\n <div class=\"cortex-tool-details__approval-body\">\n Waiting for approval to execute this tool.\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'approval-responded') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--approval\">\n <div\n class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--approval\"\n >\n <div\n class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--approval\"\n >\n Approval response\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--approval\">\n {{ toolCallPart().approval?.id }}\n </div>\n </div>\n <div class=\"cortex-tool-details__approval-body\">\n @if (toolCallPart().approval?.approved) {\n Approved.\n } @else {\n Response received.\n }\n @if (toolCallPart().approval?.reason) {\n <div\n class=\"cortex-tool-details__reason-box cortex-tool-details__reason-box--approval\"\n >\n <div\n class=\"cortex-tool-details__reason-label cortex-tool-details__reason-label--approval\"\n >\n Reason\n </div>\n <div\n class=\"cortex-tool-details__reason-text cortex-tool-details__reason-text--approval\"\n >\n {{ toolCallPart().approval?.reason }}\n </div>\n </div>\n }\n </div>\n </div>\n }\n </div>\n </div>\n</details>\n", styles: [".cortex-tool-details{width:100%;border-radius:.5rem;border:1px solid #e2e8f0;background:#f8fafc;overflow:hidden}.cortex-tool-details__summary{list-style:none;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem 1rem}.cortex-tool-details__summary::-webkit-details-marker{display:none}details[open]>.cortex-tool-details__summary{border-bottom:1px solid #e2e8f0}.cortex-tool-details__header{display:flex;align-items:flex-start;gap:.75rem}.cortex-tool-details__icon-box{flex-shrink:0;margin-top:.125rem;width:1.75rem;height:1.75rem;border-radius:.25rem;background:#1e293b;color:#fff;display:flex;align-items:center;justify-content:center}.cortex-tool-details__icon-svg{width:1rem;height:1rem}.cortex-tool-details__info{min-width:0;flex:1;display:flex;align-items:center;gap:.5rem}.cortex-tool-details__title-row{min-width:0;flex:1}.cortex-tool-details__name-row{display:flex;align-items:center;gap:.5rem;min-width:0}.cortex-tool-details__name{font-weight:500;color:#1e293b;font-size:.875rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cortex-tool-details__tool-badge{display:none;align-items:center;border-radius:.25rem;background:#e2e8f0;padding:.125rem .375rem;font-size:.6875rem;font-weight:500;color:#475569;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}@media(min-width:640px){.cortex-tool-details__tool-badge{display:inline-flex}}.cortex-tool-details__id-line{margin-top:.125rem;font-size:.6875rem;color:#64748b;word-break:break-all}.cortex-tool-details__id-label{font-weight:500;color:#475569}.cortex-tool-details__id-value{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.cortex-tool-details__provider-badge{margin-inline-start:.5rem;display:inline-flex;align-items:center;gap:.25rem;color:#047857}.cortex-tool-details__provider-dot{width:.375rem;height:.375rem;border-radius:9999px;background:#10b981}.cortex-tool-details__actions{display:flex;align-items:center;gap:.5rem}.cortex-tool-details__state-badge{display:inline-flex;align-items:center;gap:.375rem;border-radius:.25rem;padding:.25rem .5rem;font-size:.6875rem;font-weight:500;border:1px solid}.cortex-tool-details__state-badge--success{background:#ecfdf5;color:#047857;border-color:#a7f3d0}.cortex-tool-details__state-badge--error{background:#fef2f2;color:#b91c1c;border-color:#fecaca}.cortex-tool-details__state-badge--denied{background:#f1f5f9;color:#475569;border-color:#e2e8f0}.cortex-tool-details__state-badge--approval{background:#f5f3ff;color:#6d28d9;border-color:#ddd6fe}.cortex-tool-details__state-badge--pending{background:#fffbeb;color:#b45309;border-color:#fde68a}.cortex-tool-details__status-dot{width:.375rem;height:.375rem;border-radius:9999px}.cortex-tool-details__status-dot--amber{background:#f59e0b}.cortex-tool-details__status-dot--violet{background:#8b5cf6}.cortex-tool-details__status-dot--emerald{background:#10b981}.cortex-tool-details__status-dot--red{background:#ef4444}.cortex-tool-details__status-dot--slate{background:#64748b}.cortex-tool-details__status-dot--pulse{animation:cortex-tool-status-pulse 2s ease-in-out infinite}@keyframes cortex-tool-status-pulse{0%,to{opacity:1}50%{opacity:.4}}.cortex-tool-details__chevron{display:inline-flex;width:1.5rem;height:1.5rem;align-items:center;justify-content:center;border-radius:.25rem;color:#94a3b8;transition:transform .2s}details[open]>summary .cortex-tool-details__chevron{transform:rotate(180deg)}.cortex-tool-details__body{background:#fff;padding:.75rem 1rem 1rem}.cortex-tool-details__panels{display:grid;gap:.75rem}.cortex-tool-details__panel{border-radius:.5rem;border:1px solid #e2e8f0;overflow:hidden}.cortex-tool-details__panel--success{border-color:#a7f3d0}.cortex-tool-details__panel--error{border-color:#fecaca}.cortex-tool-details__panel--approval{border-color:#ddd6fe}.cortex-tool-details__panel-header{padding:.5rem .75rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e8f0;background:#f8fafc}.cortex-tool-details__panel-header--success{border-bottom-color:#a7f3d0;background:#ecfdf5}.cortex-tool-details__panel-header--error{border-bottom-color:#fecaca;background:#fef2f2}.cortex-tool-details__panel-header--approval{border-bottom-color:#ddd6fe;background:#f5f3ff}.cortex-tool-details__panel-label{font-size:.6875rem;font-weight:500;color:#475569}.cortex-tool-details__panel-label--success{color:#047857}.cortex-tool-details__panel-label--error{color:#b91c1c}.cortex-tool-details__panel-label--approval{color:#6d28d9}.cortex-tool-details__panel-lang{font-size:.6875rem;color:#94a3b8;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.cortex-tool-details__panel-lang--success{color:#059669}.cortex-tool-details__panel-lang--error{color:#dc2626}.cortex-tool-details__panel-lang--approval{color:#7c3aed}.cortex-tool-details__code-pre{margin:0;max-height:20rem;overflow:auto;padding:.75rem;font-size:.75rem;line-height:1.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;white-space:pre;overflow-wrap:break-word}.cortex-tool-details__tree-container{max-height:16rem;overflow:auto;padding:.75rem}.cortex-tool-details__error-pre{margin:0;max-height:16rem;overflow:auto;padding:.75rem;font-size:.75rem;line-height:1.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;color:#991b1b;white-space:pre-wrap;overflow-wrap:break-word}.cortex-tool-details__denied-body{padding:.75rem;font-size:.75rem;color:#334155}.cortex-tool-details__approval-body{padding:.75rem;font-size:.75rem;color:#5b21b6}.cortex-tool-details__reason-box{margin-top:.5rem;border-radius:.25rem;background:#f8fafc;border:1px solid #e2e8f0;padding:.5rem}.cortex-tool-details__reason-box--approval{background:#f5f3ff;border-color:#ddd6fe}.cortex-tool-details__reason-label{font-size:.6875rem;font-weight:500;color:#475569}.cortex-tool-details__reason-label--approval{color:#6d28d9}.cortex-tool-details__reason-text{margin-top:.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem;color:#334155;overflow-wrap:break-word}.cortex-tool-details__reason-text--approval{color:#5b21b6}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: JsonTreeComponent, selector: "cortex-json-tree", inputs: ["data", "expandDepth"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
659
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageToolCallPartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
660
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: MessageToolCallPartComponent, isStandalone: true, selector: "cortex-message-tool-call-part", inputs: { toolCallPart: { classPropertyName: "toolCallPart", publicName: "toolCallPart", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<details class=\"cortex-tool-details\">\n <summary class=\"cortex-tool-details__summary\">\n <div class=\"cortex-tool-details__header\">\n <div class=\"cortex-tool-details__icon-box\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-tool-details__icon-svg\" fill=\"none\">\n <path\n d=\"M6.5 6.5 3.75 10l2.75 3.5M13.5 6.5 16.25 10l-2.75 3.5M11.25 5.75 8.75 14.25\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n\n <div class=\"cortex-tool-details__info\">\n <div class=\"cortex-tool-details__title-row\">\n <div class=\"cortex-tool-details__name-row\">\n <div class=\"cortex-tool-details__name\" [attr.title]=\"toolCallPart().title || null\">\n {{ toolCallPart().title ?? 'Tool call' }}\n </div>\n @if (toolName()) {\n <span\n class=\"cortex-tool-details__tool-badge\"\n [attr.title]=\"toolCallPart().type || null\"\n >{{ toolName() }}</span\n >\n }\n </div>\n <div class=\"cortex-tool-details__id-line\">\n <span class=\"cortex-tool-details__id-label\">ID</span>\n <span class=\"cortex-tool-details__id-value\"> {{ toolCallPart().toolCallId }}</span>\n @if (toolCallPart().providerExecuted) {\n <span class=\"cortex-tool-details__provider-badge\">\n <span class=\"cortex-tool-details__provider-dot\"></span>\n provider\n </span>\n }\n </div>\n </div>\n\n <div class=\"cortex-tool-details__actions\">\n <span\n class=\"cortex-tool-details__state-badge\"\n [ngClass]=\"{\n 'cortex-tool-details__state-badge--success':\n toolCallPart().state === 'output-available',\n 'cortex-tool-details__state-badge--error': toolCallPart().state === 'output-error',\n 'cortex-tool-details__state-badge--denied': toolCallPart().state === 'output-denied',\n 'cortex-tool-details__state-badge--approval':\n toolCallPart().state === 'approval-requested' ||\n toolCallPart().state === 'approval-responded',\n 'cortex-tool-details__state-badge--pending':\n toolCallPart().state === 'input-streaming' ||\n toolCallPart().state === 'input-available',\n }\"\n >\n @switch (toolCallPart().state) {\n @case ('input-streaming') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--amber cortex-tool-details__status-dot--pulse\"\n ></span>\n Calling\n }\n @case ('input-available') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--amber\"\n ></span>\n Input ready\n }\n @case ('approval-requested') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--violet cortex-tool-details__status-dot--pulse\"\n ></span>\n Needs approval\n }\n @case ('approval-responded') {\n @if (toolCallPart().approval?.approved) {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--emerald\"\n ></span>\n Approved\n } @else {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--slate\"\n ></span>\n Responded\n }\n }\n @case ('output-available') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--emerald\"\n ></span>\n {{ 'translate_completed' | translate }}\n }\n @case ('output-error') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--red\"\n ></span>\n Error\n }\n @case ('output-denied') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--slate\"\n ></span>\n Denied\n }\n }\n </span>\n\n <span class=\"cortex-tool-details__chevron\" aria-hidden=\"true\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"m5.75 8.25 4.25 4.25 4.25-4.25\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n </div>\n </div>\n </div>\n </summary>\n\n <div class=\"cortex-tool-details__body\">\n <div class=\"cortex-tool-details__panels\">\n @for (snippet of codeSnippets(); track snippet.key) {\n <div class=\"cortex-tool-details__panel\">\n <div class=\"cortex-tool-details__panel-header\">\n <div class=\"cortex-tool-details__panel-label\">{{ snippet.key }}</div>\n <div class=\"cortex-tool-details__panel-lang\">{{ snippet.lang }}</div>\n </div>\n <pre\n dir=\"ltr\"\n class=\"cortex-tool-details__code-pre\"\n ><code class=\"hljs\" [innerHTML]=\"snippet.value | highlight : snippet.lang\"></code></pre>\n </div>\n }\n\n @if (remainingInput(); as remaining) {\n <div class=\"cortex-tool-details__panel\">\n <div class=\"cortex-tool-details__panel-header\">\n <div class=\"cortex-tool-details__panel-label\">Input</div>\n <div class=\"cortex-tool-details__panel-lang\">json</div>\n </div>\n <div dir=\"ltr\" class=\"cortex-tool-details__tree-container\">\n <cortex-json-tree [data]=\"remaining\" [expandDepth]=\"2\" />\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'output-available') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--success\">\n <div class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--success\">\n <div class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--success\">\n Output\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--success\">\n json\n </div>\n </div>\n <div dir=\"ltr\" class=\"cortex-tool-details__tree-container\">\n <cortex-json-tree [data]=\"toolCallPart().output\" [expandDepth]=\"2\" />\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'output-error') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--error\">\n <div class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--error\">\n <div class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--error\">\n Error\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--error\">\n text\n </div>\n </div>\n <pre dir=\"ltr\" class=\"cortex-tool-details__error-pre\">{{ toolCallPart().errorText }}</pre>\n </div>\n }\n\n @if (toolCallPart().state === 'output-denied') {\n <div class=\"cortex-tool-details__panel\">\n <div class=\"cortex-tool-details__panel-header\">\n <div class=\"cortex-tool-details__panel-label\">Denied</div>\n <div class=\"cortex-tool-details__panel-lang\">approval</div>\n </div>\n <div class=\"cortex-tool-details__denied-body\">\n Tool execution was denied.\n @if (toolCallPart().approval?.reason) {\n <div class=\"cortex-tool-details__reason-box\">\n <div class=\"cortex-tool-details__reason-label\">Reason</div>\n <div class=\"cortex-tool-details__reason-text\">\n {{ toolCallPart().approval?.reason }}\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'approval-requested') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--approval\">\n <div\n class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--approval\"\n >\n <div\n class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--approval\"\n >\n Approval requested\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--approval\">\n {{ toolCallPart().approval?.id }}\n </div>\n </div>\n <div class=\"cortex-tool-details__approval-body\">\n Waiting for approval to execute this tool.\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'approval-responded') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--approval\">\n <div\n class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--approval\"\n >\n <div\n class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--approval\"\n >\n Approval response\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--approval\">\n {{ toolCallPart().approval?.id }}\n </div>\n </div>\n <div class=\"cortex-tool-details__approval-body\">\n @if (toolCallPart().approval?.approved) {\n Approved.\n } @else {\n Response received.\n }\n @if (toolCallPart().approval?.reason) {\n <div\n class=\"cortex-tool-details__reason-box cortex-tool-details__reason-box--approval\"\n >\n <div\n class=\"cortex-tool-details__reason-label cortex-tool-details__reason-label--approval\"\n >\n Reason\n </div>\n <div\n class=\"cortex-tool-details__reason-text cortex-tool-details__reason-text--approval\"\n >\n {{ toolCallPart().approval?.reason }}\n </div>\n </div>\n }\n </div>\n </div>\n }\n </div>\n </div>\n</details>\n", styles: [".cortex-tool-details{width:100%;border-radius:.5rem;border:1px solid #e2e8f0;background:#f8fafc;overflow:hidden}.cortex-tool-details__summary{list-style:none;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem 1rem}.cortex-tool-details__summary::-webkit-details-marker{display:none}details[open]>.cortex-tool-details__summary{border-bottom:1px solid #e2e8f0}.cortex-tool-details__header{display:flex;align-items:flex-start;gap:.75rem}.cortex-tool-details__icon-box{flex-shrink:0;margin-top:.125rem;width:1.75rem;height:1.75rem;border-radius:.25rem;background:#1e293b;color:#fff;display:flex;align-items:center;justify-content:center}.cortex-tool-details__icon-svg{width:1rem;height:1rem}.cortex-tool-details__info{min-width:0;flex:1;display:flex;align-items:center;gap:.5rem}.cortex-tool-details__title-row{min-width:0;flex:1}.cortex-tool-details__name-row{display:flex;align-items:center;gap:.5rem;min-width:0}.cortex-tool-details__name{font-weight:500;color:#1e293b;font-size:.875rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cortex-tool-details__tool-badge{display:none;align-items:center;border-radius:.25rem;background:#e2e8f0;padding:.125rem .375rem;font-size:.6875rem;font-weight:500;color:#475569;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}@media(min-width:640px){.cortex-tool-details__tool-badge{display:inline-flex}}.cortex-tool-details__id-line{margin-top:.125rem;font-size:.6875rem;color:#64748b;word-break:break-all}.cortex-tool-details__id-label{font-weight:500;color:#475569}.cortex-tool-details__id-value{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.cortex-tool-details__provider-badge{margin-inline-start:.5rem;display:inline-flex;align-items:center;gap:.25rem;color:#047857}.cortex-tool-details__provider-dot{width:.375rem;height:.375rem;border-radius:9999px;background:#10b981}.cortex-tool-details__actions{display:flex;align-items:center;gap:.5rem}.cortex-tool-details__state-badge{display:inline-flex;align-items:center;gap:.375rem;border-radius:.25rem;padding:.25rem .5rem;font-size:.6875rem;font-weight:500;border:1px solid}.cortex-tool-details__state-badge--success{background:#ecfdf5;color:#047857;border-color:#a7f3d0}.cortex-tool-details__state-badge--error{background:#fef2f2;color:#b91c1c;border-color:#fecaca}.cortex-tool-details__state-badge--denied{background:#f1f5f9;color:#475569;border-color:#e2e8f0}.cortex-tool-details__state-badge--approval{background:#f5f3ff;color:#6d28d9;border-color:#ddd6fe}.cortex-tool-details__state-badge--pending{background:#fffbeb;color:#b45309;border-color:#fde68a}.cortex-tool-details__status-dot{width:.375rem;height:.375rem;border-radius:9999px}.cortex-tool-details__status-dot--amber{background:#f59e0b}.cortex-tool-details__status-dot--violet{background:#8b5cf6}.cortex-tool-details__status-dot--emerald{background:#10b981}.cortex-tool-details__status-dot--red{background:#ef4444}.cortex-tool-details__status-dot--slate{background:#64748b}.cortex-tool-details__status-dot--pulse{animation:cortex-tool-status-pulse 2s ease-in-out infinite}@keyframes cortex-tool-status-pulse{0%,to{opacity:1}50%{opacity:.4}}.cortex-tool-details__chevron{display:inline-flex;width:1.5rem;height:1.5rem;align-items:center;justify-content:center;border-radius:.25rem;color:#94a3b8;transition:transform .2s}details[open]>summary .cortex-tool-details__chevron{transform:rotate(180deg)}.cortex-tool-details__body{background:#fff;padding:.75rem 1rem 1rem}.cortex-tool-details__panels{display:grid;gap:.75rem}.cortex-tool-details__panel{border-radius:.5rem;border:1px solid #e2e8f0;overflow:hidden}.cortex-tool-details__panel--success{border-color:#a7f3d0}.cortex-tool-details__panel--error{border-color:#fecaca}.cortex-tool-details__panel--approval{border-color:#ddd6fe}.cortex-tool-details__panel-header{padding:.5rem .75rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e8f0;background:#f8fafc}.cortex-tool-details__panel-header--success{border-bottom-color:#a7f3d0;background:#ecfdf5}.cortex-tool-details__panel-header--error{border-bottom-color:#fecaca;background:#fef2f2}.cortex-tool-details__panel-header--approval{border-bottom-color:#ddd6fe;background:#f5f3ff}.cortex-tool-details__panel-label{font-size:.6875rem;font-weight:500;color:#475569}.cortex-tool-details__panel-label--success{color:#047857}.cortex-tool-details__panel-label--error{color:#b91c1c}.cortex-tool-details__panel-label--approval{color:#6d28d9}.cortex-tool-details__panel-lang{font-size:.6875rem;color:#94a3b8;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.cortex-tool-details__panel-lang--success{color:#059669}.cortex-tool-details__panel-lang--error{color:#dc2626}.cortex-tool-details__panel-lang--approval{color:#7c3aed}.cortex-tool-details__code-pre{margin:0;max-height:20rem;overflow:auto;padding:.75rem;font-size:.75rem;line-height:1.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;white-space:pre;overflow-wrap:break-word}.cortex-tool-details__tree-container{max-height:16rem;overflow:auto;padding:.75rem}.cortex-tool-details__error-pre{margin:0;max-height:16rem;overflow:auto;padding:.75rem;font-size:.75rem;line-height:1.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;color:#991b1b;white-space:pre-wrap;overflow-wrap:break-word}.cortex-tool-details__denied-body{padding:.75rem;font-size:.75rem;color:#334155}.cortex-tool-details__approval-body{padding:.75rem;font-size:.75rem;color:#5b21b6}.cortex-tool-details__reason-box{margin-top:.5rem;border-radius:.25rem;background:#f8fafc;border:1px solid #e2e8f0;padding:.5rem}.cortex-tool-details__reason-box--approval{background:#f5f3ff;border-color:#ddd6fe}.cortex-tool-details__reason-label{font-size:.6875rem;font-weight:500;color:#475569}.cortex-tool-details__reason-label--approval{color:#6d28d9}.cortex-tool-details__reason-text{margin-top:.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem;color:#334155;overflow-wrap:break-word}.cortex-tool-details__reason-text--approval{color:#5b21b6}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: JsonTreeComponent, selector: "cortex-json-tree", inputs: ["data", "expandDepth"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
547
661
|
}
|
|
548
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
662
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageToolCallPartComponent, decorators: [{
|
|
549
663
|
type: Component,
|
|
550
664
|
args: [{ selector: 'cortex-message-tool-call-part', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [HighlightPipe, NgClass, TranslatePipe, JsonTreeComponent], template: "<details class=\"cortex-tool-details\">\n <summary class=\"cortex-tool-details__summary\">\n <div class=\"cortex-tool-details__header\">\n <div class=\"cortex-tool-details__icon-box\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-tool-details__icon-svg\" fill=\"none\">\n <path\n d=\"M6.5 6.5 3.75 10l2.75 3.5M13.5 6.5 16.25 10l-2.75 3.5M11.25 5.75 8.75 14.25\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n\n <div class=\"cortex-tool-details__info\">\n <div class=\"cortex-tool-details__title-row\">\n <div class=\"cortex-tool-details__name-row\">\n <div class=\"cortex-tool-details__name\" [attr.title]=\"toolCallPart().title || null\">\n {{ toolCallPart().title ?? 'Tool call' }}\n </div>\n @if (toolName()) {\n <span\n class=\"cortex-tool-details__tool-badge\"\n [attr.title]=\"toolCallPart().type || null\"\n >{{ toolName() }}</span\n >\n }\n </div>\n <div class=\"cortex-tool-details__id-line\">\n <span class=\"cortex-tool-details__id-label\">ID</span>\n <span class=\"cortex-tool-details__id-value\"> {{ toolCallPart().toolCallId }}</span>\n @if (toolCallPart().providerExecuted) {\n <span class=\"cortex-tool-details__provider-badge\">\n <span class=\"cortex-tool-details__provider-dot\"></span>\n provider\n </span>\n }\n </div>\n </div>\n\n <div class=\"cortex-tool-details__actions\">\n <span\n class=\"cortex-tool-details__state-badge\"\n [ngClass]=\"{\n 'cortex-tool-details__state-badge--success':\n toolCallPart().state === 'output-available',\n 'cortex-tool-details__state-badge--error': toolCallPart().state === 'output-error',\n 'cortex-tool-details__state-badge--denied': toolCallPart().state === 'output-denied',\n 'cortex-tool-details__state-badge--approval':\n toolCallPart().state === 'approval-requested' ||\n toolCallPart().state === 'approval-responded',\n 'cortex-tool-details__state-badge--pending':\n toolCallPart().state === 'input-streaming' ||\n toolCallPart().state === 'input-available',\n }\"\n >\n @switch (toolCallPart().state) {\n @case ('input-streaming') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--amber cortex-tool-details__status-dot--pulse\"\n ></span>\n Calling\n }\n @case ('input-available') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--amber\"\n ></span>\n Input ready\n }\n @case ('approval-requested') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--violet cortex-tool-details__status-dot--pulse\"\n ></span>\n Needs approval\n }\n @case ('approval-responded') {\n @if (toolCallPart().approval?.approved) {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--emerald\"\n ></span>\n Approved\n } @else {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--slate\"\n ></span>\n Responded\n }\n }\n @case ('output-available') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--emerald\"\n ></span>\n {{ 'translate_completed' | translate }}\n }\n @case ('output-error') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--red\"\n ></span>\n Error\n }\n @case ('output-denied') {\n <span\n class=\"cortex-tool-details__status-dot cortex-tool-details__status-dot--slate\"\n ></span>\n Denied\n }\n }\n </span>\n\n <span class=\"cortex-tool-details__chevron\" aria-hidden=\"true\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 20 20\" fill=\"none\">\n <path\n d=\"m5.75 8.25 4.25 4.25 4.25-4.25\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n </div>\n </div>\n </div>\n </summary>\n\n <div class=\"cortex-tool-details__body\">\n <div class=\"cortex-tool-details__panels\">\n @for (snippet of codeSnippets(); track snippet.key) {\n <div class=\"cortex-tool-details__panel\">\n <div class=\"cortex-tool-details__panel-header\">\n <div class=\"cortex-tool-details__panel-label\">{{ snippet.key }}</div>\n <div class=\"cortex-tool-details__panel-lang\">{{ snippet.lang }}</div>\n </div>\n <pre\n dir=\"ltr\"\n class=\"cortex-tool-details__code-pre\"\n ><code class=\"hljs\" [innerHTML]=\"snippet.value | highlight : snippet.lang\"></code></pre>\n </div>\n }\n\n @if (remainingInput(); as remaining) {\n <div class=\"cortex-tool-details__panel\">\n <div class=\"cortex-tool-details__panel-header\">\n <div class=\"cortex-tool-details__panel-label\">Input</div>\n <div class=\"cortex-tool-details__panel-lang\">json</div>\n </div>\n <div dir=\"ltr\" class=\"cortex-tool-details__tree-container\">\n <cortex-json-tree [data]=\"remaining\" [expandDepth]=\"2\" />\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'output-available') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--success\">\n <div class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--success\">\n <div class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--success\">\n Output\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--success\">\n json\n </div>\n </div>\n <div dir=\"ltr\" class=\"cortex-tool-details__tree-container\">\n <cortex-json-tree [data]=\"toolCallPart().output\" [expandDepth]=\"2\" />\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'output-error') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--error\">\n <div class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--error\">\n <div class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--error\">\n Error\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--error\">\n text\n </div>\n </div>\n <pre dir=\"ltr\" class=\"cortex-tool-details__error-pre\">{{ toolCallPart().errorText }}</pre>\n </div>\n }\n\n @if (toolCallPart().state === 'output-denied') {\n <div class=\"cortex-tool-details__panel\">\n <div class=\"cortex-tool-details__panel-header\">\n <div class=\"cortex-tool-details__panel-label\">Denied</div>\n <div class=\"cortex-tool-details__panel-lang\">approval</div>\n </div>\n <div class=\"cortex-tool-details__denied-body\">\n Tool execution was denied.\n @if (toolCallPart().approval?.reason) {\n <div class=\"cortex-tool-details__reason-box\">\n <div class=\"cortex-tool-details__reason-label\">Reason</div>\n <div class=\"cortex-tool-details__reason-text\">\n {{ toolCallPart().approval?.reason }}\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'approval-requested') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--approval\">\n <div\n class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--approval\"\n >\n <div\n class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--approval\"\n >\n Approval requested\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--approval\">\n {{ toolCallPart().approval?.id }}\n </div>\n </div>\n <div class=\"cortex-tool-details__approval-body\">\n Waiting for approval to execute this tool.\n </div>\n </div>\n }\n\n @if (toolCallPart().state === 'approval-responded') {\n <div class=\"cortex-tool-details__panel cortex-tool-details__panel--approval\">\n <div\n class=\"cortex-tool-details__panel-header cortex-tool-details__panel-header--approval\"\n >\n <div\n class=\"cortex-tool-details__panel-label cortex-tool-details__panel-label--approval\"\n >\n Approval response\n </div>\n <div class=\"cortex-tool-details__panel-lang cortex-tool-details__panel-lang--approval\">\n {{ toolCallPart().approval?.id }}\n </div>\n </div>\n <div class=\"cortex-tool-details__approval-body\">\n @if (toolCallPart().approval?.approved) {\n Approved.\n } @else {\n Response received.\n }\n @if (toolCallPart().approval?.reason) {\n <div\n class=\"cortex-tool-details__reason-box cortex-tool-details__reason-box--approval\"\n >\n <div\n class=\"cortex-tool-details__reason-label cortex-tool-details__reason-label--approval\"\n >\n Reason\n </div>\n <div\n class=\"cortex-tool-details__reason-text cortex-tool-details__reason-text--approval\"\n >\n {{ toolCallPart().approval?.reason }}\n </div>\n </div>\n }\n </div>\n </div>\n }\n </div>\n </div>\n</details>\n", styles: [".cortex-tool-details{width:100%;border-radius:.5rem;border:1px solid #e2e8f0;background:#f8fafc;overflow:hidden}.cortex-tool-details__summary{list-style:none;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem 1rem}.cortex-tool-details__summary::-webkit-details-marker{display:none}details[open]>.cortex-tool-details__summary{border-bottom:1px solid #e2e8f0}.cortex-tool-details__header{display:flex;align-items:flex-start;gap:.75rem}.cortex-tool-details__icon-box{flex-shrink:0;margin-top:.125rem;width:1.75rem;height:1.75rem;border-radius:.25rem;background:#1e293b;color:#fff;display:flex;align-items:center;justify-content:center}.cortex-tool-details__icon-svg{width:1rem;height:1rem}.cortex-tool-details__info{min-width:0;flex:1;display:flex;align-items:center;gap:.5rem}.cortex-tool-details__title-row{min-width:0;flex:1}.cortex-tool-details__name-row{display:flex;align-items:center;gap:.5rem;min-width:0}.cortex-tool-details__name{font-weight:500;color:#1e293b;font-size:.875rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cortex-tool-details__tool-badge{display:none;align-items:center;border-radius:.25rem;background:#e2e8f0;padding:.125rem .375rem;font-size:.6875rem;font-weight:500;color:#475569;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}@media(min-width:640px){.cortex-tool-details__tool-badge{display:inline-flex}}.cortex-tool-details__id-line{margin-top:.125rem;font-size:.6875rem;color:#64748b;word-break:break-all}.cortex-tool-details__id-label{font-weight:500;color:#475569}.cortex-tool-details__id-value{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.cortex-tool-details__provider-badge{margin-inline-start:.5rem;display:inline-flex;align-items:center;gap:.25rem;color:#047857}.cortex-tool-details__provider-dot{width:.375rem;height:.375rem;border-radius:9999px;background:#10b981}.cortex-tool-details__actions{display:flex;align-items:center;gap:.5rem}.cortex-tool-details__state-badge{display:inline-flex;align-items:center;gap:.375rem;border-radius:.25rem;padding:.25rem .5rem;font-size:.6875rem;font-weight:500;border:1px solid}.cortex-tool-details__state-badge--success{background:#ecfdf5;color:#047857;border-color:#a7f3d0}.cortex-tool-details__state-badge--error{background:#fef2f2;color:#b91c1c;border-color:#fecaca}.cortex-tool-details__state-badge--denied{background:#f1f5f9;color:#475569;border-color:#e2e8f0}.cortex-tool-details__state-badge--approval{background:#f5f3ff;color:#6d28d9;border-color:#ddd6fe}.cortex-tool-details__state-badge--pending{background:#fffbeb;color:#b45309;border-color:#fde68a}.cortex-tool-details__status-dot{width:.375rem;height:.375rem;border-radius:9999px}.cortex-tool-details__status-dot--amber{background:#f59e0b}.cortex-tool-details__status-dot--violet{background:#8b5cf6}.cortex-tool-details__status-dot--emerald{background:#10b981}.cortex-tool-details__status-dot--red{background:#ef4444}.cortex-tool-details__status-dot--slate{background:#64748b}.cortex-tool-details__status-dot--pulse{animation:cortex-tool-status-pulse 2s ease-in-out infinite}@keyframes cortex-tool-status-pulse{0%,to{opacity:1}50%{opacity:.4}}.cortex-tool-details__chevron{display:inline-flex;width:1.5rem;height:1.5rem;align-items:center;justify-content:center;border-radius:.25rem;color:#94a3b8;transition:transform .2s}details[open]>summary .cortex-tool-details__chevron{transform:rotate(180deg)}.cortex-tool-details__body{background:#fff;padding:.75rem 1rem 1rem}.cortex-tool-details__panels{display:grid;gap:.75rem}.cortex-tool-details__panel{border-radius:.5rem;border:1px solid #e2e8f0;overflow:hidden}.cortex-tool-details__panel--success{border-color:#a7f3d0}.cortex-tool-details__panel--error{border-color:#fecaca}.cortex-tool-details__panel--approval{border-color:#ddd6fe}.cortex-tool-details__panel-header{padding:.5rem .75rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e8f0;background:#f8fafc}.cortex-tool-details__panel-header--success{border-bottom-color:#a7f3d0;background:#ecfdf5}.cortex-tool-details__panel-header--error{border-bottom-color:#fecaca;background:#fef2f2}.cortex-tool-details__panel-header--approval{border-bottom-color:#ddd6fe;background:#f5f3ff}.cortex-tool-details__panel-label{font-size:.6875rem;font-weight:500;color:#475569}.cortex-tool-details__panel-label--success{color:#047857}.cortex-tool-details__panel-label--error{color:#b91c1c}.cortex-tool-details__panel-label--approval{color:#6d28d9}.cortex-tool-details__panel-lang{font-size:.6875rem;color:#94a3b8;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.cortex-tool-details__panel-lang--success{color:#059669}.cortex-tool-details__panel-lang--error{color:#dc2626}.cortex-tool-details__panel-lang--approval{color:#7c3aed}.cortex-tool-details__code-pre{margin:0;max-height:20rem;overflow:auto;padding:.75rem;font-size:.75rem;line-height:1.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;white-space:pre;overflow-wrap:break-word}.cortex-tool-details__tree-container{max-height:16rem;overflow:auto;padding:.75rem}.cortex-tool-details__error-pre{margin:0;max-height:16rem;overflow:auto;padding:.75rem;font-size:.75rem;line-height:1.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;color:#991b1b;white-space:pre-wrap;overflow-wrap:break-word}.cortex-tool-details__denied-body{padding:.75rem;font-size:.75rem;color:#334155}.cortex-tool-details__approval-body{padding:.75rem;font-size:.75rem;color:#5b21b6}.cortex-tool-details__reason-box{margin-top:.5rem;border-radius:.25rem;background:#f8fafc;border:1px solid #e2e8f0;padding:.5rem}.cortex-tool-details__reason-box--approval{background:#f5f3ff;border-color:#ddd6fe}.cortex-tool-details__reason-label{font-size:.6875rem;font-weight:500;color:#475569}.cortex-tool-details__reason-label--approval{color:#6d28d9}.cortex-tool-details__reason-text{margin-top:.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem;color:#334155;overflow-wrap:break-word}.cortex-tool-details__reason-text--approval{color:#5b21b6}\n"] }]
|
|
551
665
|
}], propDecorators: { toolCallPart: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolCallPart", required: true }] }] } });
|
|
@@ -637,10 +751,10 @@ class MessageCaptureFilesPartComponent {
|
|
|
637
751
|
message: 'User canceled upload',
|
|
638
752
|
});
|
|
639
753
|
}
|
|
640
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
641
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: MessageCaptureFilesPartComponent, isStandalone: true, selector: "cortex-message-capture-files-part", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, toolPart: { classPropertyName: "toolPart", publicName: "toolPart", isSignal: true, isRequired: true, transformFunction: null }, setOutput: { classPropertyName: "setOutput", publicName: "setOutput", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "cortex-capture-files" }, ngImport: i0, template: "@if (outputData(); as output) {\n <!-- Result state -->\n @if (output.status === 'success') {\n <div class=\"cortex-capture-success\">\n <div class=\"cortex-capture-success__header\">\n <div class=\"cortex-capture-success__icon\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-capture-success__icon-svg\" fill=\"none\">\n <path\n d=\"M5.5 10.5 L8.5 13.5 L14.5 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.75\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n <div class=\"cortex-capture-success__title-wrap\">\n <h3 class=\"cortex-capture-success__title\">\n {{ 'translate_files_attached' | translate: { count: requestedFiles().length } }}\n </h3>\n </div>\n </div>\n\n <div class=\"cortex-capture-success__file-list\">\n <ul class=\"cortex-capture-success__files\">\n @for (file of outputData()!.result!; track file.uploadId) {\n <li>\n <button\n type=\"button\"\n (click)=\"downloadFile(file.uploadId)\"\n class=\"cortex-capture-success__download-btn\"\n >\n <svg viewBox=\"0 0 16 16\" class=\"cortex-capture-success__file-icon\" fill=\"none\">\n <path\n d=\"M4 1.5h5.172a2 2 0 0 1 1.414.586l2.328 2.328a2 2 0 0 1 .586 1.414V12.5a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-9a2 2 0 0 1 2-2Z\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n />\n <path\n d=\"M9.5 1.5v2a2 2 0 0 0 2 2h2\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n stroke-linecap=\"round\"\n />\n </svg>\n <span class=\"cortex-capture-success__file-name\">{{\n requestedFiles()[$index]?.label ?? outputData()!.result![$index]?.id\n }}</span>\n <svg viewBox=\"0 0 16 16\" class=\"cortex-capture-success__dl-icon\" fill=\"none\">\n <path\n d=\"M8 3v7m0 0L5.5 7.5M8 10l2.5-2.5M3 13h10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n </li>\n }\n </ul>\n </div>\n </div>\n } @else {\n <!-- Canceled state -->\n <div class=\"cortex-capture-canceled-wrap\">\n <div class=\"cortex-capture-canceled\">\n <div class=\"cortex-capture-canceled__icon\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-capture-canceled__icon-svg\" fill=\"none\">\n <path d=\"M6 10h8\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </div>\n <span class=\"cortex-capture-canceled__text\">{{\n 'translate_file_upload_skipped' | translate\n }}</span>\n </div>\n </div>\n }\n} @else {\n @if (!hasInvalidInput()) {\n <!-- Upload form -->\n <form [formGroup]=\"form()\" class=\"cortex-capture-form\">\n @if (requestedFiles().length === 1) {\n <!-- Single file: minimal inline -->\n <fieldset [formArray]=\"form().controls.files\">\n <div [formGroupName]=\"0\" class=\"cortex-capture-form__single\">\n <label for=\"capture-file-0\" class=\"cortex-capture-form__label\">\n {{ requestedFiles()[0]!.label }}\n </label>\n <input hidden formControlName=\"id\" />\n <div class=\"cortex-capture-form__row\">\n <cortex-file-input\n id=\"capture-file-0\"\n formControlName=\"file\"\n class=\"cortex-capture-form__input\"\n />\n <button\n (click)=\"cancel()\"\n [disabled]=\"isLoading()\"\n type=\"button\"\n class=\"cortex-capture-form__cancel-link\"\n >\n {{ 'translate_cancel' | translate }}\n </button>\n <button\n (click)=\"submit()\"\n type=\"button\"\n class=\"cortex-capture-form__submit-btn\"\n [disabled]=\"form().invalid || isLoading()\"\n >\n @if (isLoading()) {\n <svg class=\"cortex-capture-form__spinner\" viewBox=\"0 0 16 16\" fill=\"none\">\n <circle\n cx=\"8\"\n cy=\"8\"\n r=\"6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n class=\"cortex-capture-form__spinner-track\"\n />\n <path\n d=\"M14 8a6 6 0 0 0-6-6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_uploading' | translate }}\n } @else {\n {{ 'translate_submit' | translate }}\n }\n </button>\n </div>\n </div>\n </fieldset>\n } @else {\n <!-- Multi-file: full form -->\n <div class=\"cortex-capture-form__multi\">\n <div class=\"cortex-capture-form__multi-header\">\n <div class=\"cortex-capture-form__multi-header-row\">\n <div class=\"cortex-capture-form__multi-icon\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-capture-form__multi-icon-svg\" fill=\"none\">\n <path\n d=\"M4 13.5a3.5 3.5 0 0 1-.5-6.97 5.002 5.002 0 0 1 9.78-1.03A4.5 4.5 0 0 1 15.5 14\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n <path\n d=\"M10 10v7m0-7-2.5 2.5M10 10l2.5 2.5\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n\n <div class=\"cortex-capture-form__multi-title-wrap\">\n <h3 class=\"cortex-capture-form__multi-title\">\n {{ 'translate_attach_requested_files' | translate }}\n </h3>\n <p class=\"cortex-capture-form__multi-subtitle\">\n {{ 'translate_n_files_required' | translate: { count: requestedFiles().length } }}\n </p>\n </div>\n </div>\n </div>\n\n <fieldset [formArray]=\"form().controls.files\" class=\"cortex-capture-form__multi-fields\">\n @for (file of form().controls.files.value; track $index) {\n <div [formGroupName]=\"$index\" class=\"cortex-capture-form__multi-item\">\n <div class=\"cortex-capture-form__multi-item-header\">\n <label\n [for]=\"'capture-file-' + $index\"\n class=\"cortex-capture-form__multi-item-label\"\n >\n {{ requestedFiles()[$index]!.label }}\n </label>\n <span class=\"cortex-capture-form__required-badge\">\n {{ 'translate_required' | translate }}\n </span>\n </div>\n <input hidden formControlName=\"id\" />\n <cortex-file-input [id]=\"'capture-file-' + $index\" formControlName=\"file\" />\n </div>\n }\n </fieldset>\n\n <div class=\"cortex-capture-form__multi-footer\">\n <button\n (click)=\"cancel()\"\n [disabled]=\"isLoading()\"\n type=\"button\"\n class=\"cortex-capture-form__cancel-btn\"\n >\n {{ 'translate_cancel' | translate }}\n </button>\n <button\n (click)=\"submit()\"\n type=\"button\"\n class=\"cortex-capture-form__submit-btn\"\n [disabled]=\"form().invalid || isLoading()\"\n >\n @if (isLoading()) {\n <svg class=\"cortex-capture-form__spinner\" viewBox=\"0 0 16 16\" fill=\"none\">\n <circle\n cx=\"8\"\n cy=\"8\"\n r=\"6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n class=\"cortex-capture-form__spinner-track\"\n />\n <path\n d=\"M14 8a6 6 0 0 0-6-6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_uploading' | translate }}\n } @else {\n {{ 'translate_submit_files' | translate }}\n }\n </button>\n </div>\n </div>\n }\n </form>\n }\n}\n", styles: [".cortex-capture-files{display:block;width:100%}.cortex-file-input{display:flex;width:100%;cursor:pointer;align-items:center;border-radius:.5rem;border:1px solid #cbd5e1;background:#f8fafc;transition:border-color .15s}.cortex-file-input:hover{border-color:#94a3b8}.cortex-file-input:focus-within{box-shadow:0 0 0 2px #cbd5e1}.cortex-file-input__btn{margin:.25rem;flex-shrink:0;cursor:pointer;border-radius:.375rem;border:0;background:#1e293b;padding:.375rem .75rem;font-size:.6875rem;font-weight:600;letter-spacing:.025em;color:#f1f5f9}.cortex-file-input__btn:hover{background:#334155}.cortex-file-input__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 .75rem;font-size:.75rem;color:#475569}.cortex-file-input__hidden{display:none}.cortex-capture-success{overflow:hidden;border-radius:1rem;border:1px solid #a7f3d0;background:linear-gradient(to bottom,#ecfdf5cc,#fff)}.cortex-capture-success__header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-success__header{padding:.75rem 1.25rem}}.cortex-capture-success__icon{display:inline-flex;width:2rem;height:2rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.5rem;border:1px solid #a7f3d0;background:#d1fae5;color:#059669}.cortex-capture-success__icon-svg{width:1rem;height:1rem}.cortex-capture-success__title-wrap{min-width:0}.cortex-capture-success__title{font-size:.8125rem;font-weight:600;letter-spacing:-.01em;color:#065f46;margin:0}.cortex-capture-success__file-list{border-top:1px solid #d1fae5;padding:.625rem 1rem}@media(min-width:640px){.cortex-capture-success__file-list{padding:.625rem 1.25rem}}.cortex-capture-success__files{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}.cortex-capture-success__download-btn{display:inline-flex;cursor:pointer;align-items:center;gap:.375rem;border-radius:.5rem;border:1px solid #d1fae5;background:#fff;padding:.375rem .625rem;font-size:.75rem;font-weight:500;color:#047857;box-shadow:0 1px 2px #0000000d;transition:all .15s}.cortex-capture-success__download-btn:hover{border-color:#a7f3d0;background:#ecfdf5;box-shadow:0 1px 3px #0000001a}.cortex-capture-success__download-btn:active{transform:scale(.97)}.cortex-capture-success__file-icon{width:.875rem;height:.875rem;flex-shrink:0;color:#6ee7b7}.cortex-capture-success__file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}.cortex-capture-success__dl-icon{width:.75rem;height:.75rem;flex-shrink:0;color:#86efac}.cortex-capture-canceled-wrap{display:flex;justify-content:center}.cortex-capture-canceled{display:inline-flex;align-items:center;gap:.625rem;border-radius:.5rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.625rem 1rem}.cortex-capture-canceled__icon{display:inline-flex;width:1.5rem;height:1.5rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.375rem;border:1px solid #e2e8f0;background:#f1f5f9;color:#94a3b8}.cortex-capture-canceled__icon-svg{width:.75rem;height:.75rem}.cortex-capture-canceled__text{font-size:.8125rem;font-weight:500;color:#94a3b8}.cortex-capture-form{width:100%}.cortex-capture-form__single{border-radius:.75rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.75rem}.cortex-capture-form__label{display:block;margin-bottom:.375rem;font-size:.75rem;color:#64748b}.cortex-capture-form__row{display:flex;align-items:center;gap:.5rem}.cortex-capture-form__input{min-width:0;flex:1}.cortex-capture-form__cancel-link{flex-shrink:0;font-size:.75rem;font-weight:500;color:#94a3b8;background:none;border:0;cursor:pointer;transition:color .15s}.cortex-capture-form__cancel-link:hover{color:#475569}.cortex-capture-form__submit-btn{display:inline-flex;flex-shrink:0;align-items:center;border-radius:.375rem;background:#1e293b;padding:.375rem .75rem;font-size:.75rem;font-weight:500;color:#f1f5f9;border:0;cursor:pointer;transition:background-color .15s}.cortex-capture-form__submit-btn:hover{background:#334155}.cortex-capture-form__submit-btn:active{background:#0f172a}.cortex-capture-form__submit-btn:disabled{cursor:not-allowed;background:#cbd5e1}.cortex-capture-form__spinner{width:.75rem;height:.75rem;margin-inline-end:.375rem;animation:cortex-capture-spin .8s linear infinite}.cortex-capture-form__spinner-track{opacity:.25}@keyframes cortex-capture-spin{to{transform:rotate(360deg)}}.cortex-capture-form__multi{overflow:hidden;border-radius:1rem;border:1px solid #e2e8f0;background:linear-gradient(to bottom,#fff,#f8fafc)}.cortex-capture-form__multi-header{border-bottom:1px solid #e2e8f0;background:#ffffffd9;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-form__multi-header{padding:.75rem 1.25rem}}.cortex-capture-form__multi-header-row{display:flex;align-items:flex-start;gap:.75rem}.cortex-capture-form__multi-icon{margin-top:.125rem;display:inline-flex;width:2rem;height:2rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.5rem;border:1px solid #e2e8f0;background:#f1f5f9;color:#475569}.cortex-capture-form__multi-icon-svg{width:1rem;height:1rem}.cortex-capture-form__multi-title-wrap{min-width:0}.cortex-capture-form__multi-title{font-size:.8125rem;font-weight:600;letter-spacing:-.01em;color:#1e293b;margin:0}.cortex-capture-form__multi-subtitle{margin-top:.125rem;font-size:.6875rem;color:#64748b;margin-bottom:0}.cortex-capture-form__multi-fields{display:grid;gap:.75rem;padding:1rem;border:0}@media(min-width:640px){.cortex-capture-form__multi-fields{padding:1.25rem}}.cortex-capture-form__multi-item{border-radius:.75rem;border:1px solid #e2e8f0;background:#fff;padding:.75rem;transition:border-color .15s}.cortex-capture-form__multi-item:hover{border-color:#cbd5e1}.cortex-capture-form__multi-item-header{margin-bottom:.5rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.cortex-capture-form__multi-item-label{display:block;font-size:.75rem;font-weight:500;line-height:1;color:#334155}.cortex-capture-form__required-badge{display:inline-flex;align-items:center;border-radius:.25rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.125rem .375rem;font-size:.625rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:#64748b}.cortex-capture-form__multi-footer{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;border-top:1px solid #e2e8f0;background:#ffffffe6;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-form__multi-footer{padding:.75rem 1.25rem}}.cortex-capture-form__cancel-btn{display:inline-flex;align-items:center;border-radius:.375rem;border:1px solid #cbd5e1;background:#fff;padding:.375rem .75rem;font-size:.75rem;font-weight:500;color:#475569;cursor:pointer;transition:background-color .15s}.cortex-capture-form__cancel-btn:hover{background:#f8fafc}.cortex-capture-form__cancel-btn:active{background:#f1f5f9}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i1$1.ɵNgNoValidate), selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i0.forwardRef(() => i1$1.DefaultValueAccessor), selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormGroupDirective), selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormArrayDirective), selector: "[formArray]", inputs: ["formArray"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormControlName), selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormGroupName), selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i0.forwardRef(() => FileInputComponent), selector: "cortex-file-input", inputs: ["allowedMimeTypes"] }, { kind: "pipe", type: i0.forwardRef(() => TranslatePipe), name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
754
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageCaptureFilesPartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
755
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: MessageCaptureFilesPartComponent, isStandalone: true, selector: "cortex-message-capture-files-part", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, toolPart: { classPropertyName: "toolPart", publicName: "toolPart", isSignal: true, isRequired: true, transformFunction: null }, setOutput: { classPropertyName: "setOutput", publicName: "setOutput", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "cortex-capture-files" }, ngImport: i0, template: "@if (outputData(); as output) {\n <!-- Result state -->\n @if (output.status === 'success') {\n <div class=\"cortex-capture-success\">\n <div class=\"cortex-capture-success__header\">\n <div class=\"cortex-capture-success__icon\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-capture-success__icon-svg\" fill=\"none\">\n <path\n d=\"M5.5 10.5 L8.5 13.5 L14.5 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.75\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n <div class=\"cortex-capture-success__title-wrap\">\n <h3 class=\"cortex-capture-success__title\">\n {{ 'translate_files_attached' | translate: { count: requestedFiles().length } }}\n </h3>\n </div>\n </div>\n\n <div class=\"cortex-capture-success__file-list\">\n <ul class=\"cortex-capture-success__files\">\n @for (file of outputData()!.result!; track file.uploadId) {\n <li>\n <button\n type=\"button\"\n (click)=\"downloadFile(file.uploadId)\"\n class=\"cortex-capture-success__download-btn\"\n >\n <svg viewBox=\"0 0 16 16\" class=\"cortex-capture-success__file-icon\" fill=\"none\">\n <path\n d=\"M4 1.5h5.172a2 2 0 0 1 1.414.586l2.328 2.328a2 2 0 0 1 .586 1.414V12.5a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-9a2 2 0 0 1 2-2Z\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n />\n <path\n d=\"M9.5 1.5v2a2 2 0 0 0 2 2h2\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n stroke-linecap=\"round\"\n />\n </svg>\n <span class=\"cortex-capture-success__file-name\">{{\n requestedFiles()[$index]?.label ?? outputData()!.result![$index]?.id\n }}</span>\n <svg viewBox=\"0 0 16 16\" class=\"cortex-capture-success__dl-icon\" fill=\"none\">\n <path\n d=\"M8 3v7m0 0L5.5 7.5M8 10l2.5-2.5M3 13h10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n </li>\n }\n </ul>\n </div>\n </div>\n } @else {\n <!-- Canceled state -->\n <div class=\"cortex-capture-canceled-wrap\">\n <div class=\"cortex-capture-canceled\">\n <div class=\"cortex-capture-canceled__icon\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-capture-canceled__icon-svg\" fill=\"none\">\n <path d=\"M6 10h8\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </div>\n <span class=\"cortex-capture-canceled__text\">{{\n 'translate_file_upload_skipped' | translate\n }}</span>\n </div>\n </div>\n }\n} @else {\n @if (!hasInvalidInput()) {\n <!-- Upload form -->\n <form [formGroup]=\"form()\" class=\"cortex-capture-form\">\n @if (requestedFiles().length === 1) {\n <!-- Single file: minimal inline -->\n <fieldset [formArray]=\"form().controls.files\">\n <div [formGroupName]=\"0\" class=\"cortex-capture-form__single\">\n <label for=\"capture-file-0\" class=\"cortex-capture-form__label\">\n {{ requestedFiles()[0]!.label }}\n </label>\n <input hidden formControlName=\"id\" />\n <div class=\"cortex-capture-form__row\">\n <cortex-file-input\n id=\"capture-file-0\"\n formControlName=\"file\"\n class=\"cortex-capture-form__input\"\n />\n <button\n (click)=\"cancel()\"\n [disabled]=\"isLoading()\"\n type=\"button\"\n class=\"cortex-capture-form__cancel-link\"\n >\n {{ 'translate_cancel' | translate }}\n </button>\n <button\n (click)=\"submit()\"\n type=\"button\"\n class=\"cortex-capture-form__submit-btn\"\n [disabled]=\"form().invalid || isLoading()\"\n >\n @if (isLoading()) {\n <svg class=\"cortex-capture-form__spinner\" viewBox=\"0 0 16 16\" fill=\"none\">\n <circle\n cx=\"8\"\n cy=\"8\"\n r=\"6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n class=\"cortex-capture-form__spinner-track\"\n />\n <path\n d=\"M14 8a6 6 0 0 0-6-6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_uploading' | translate }}\n } @else {\n {{ 'translate_submit' | translate }}\n }\n </button>\n </div>\n </div>\n </fieldset>\n } @else {\n <!-- Multi-file: full form -->\n <div class=\"cortex-capture-form__multi\">\n <div class=\"cortex-capture-form__multi-header\">\n <div class=\"cortex-capture-form__multi-header-row\">\n <div class=\"cortex-capture-form__multi-icon\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-capture-form__multi-icon-svg\" fill=\"none\">\n <path\n d=\"M4 13.5a3.5 3.5 0 0 1-.5-6.97 5.002 5.002 0 0 1 9.78-1.03A4.5 4.5 0 0 1 15.5 14\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n <path\n d=\"M10 10v7m0-7-2.5 2.5M10 10l2.5 2.5\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n\n <div class=\"cortex-capture-form__multi-title-wrap\">\n <h3 class=\"cortex-capture-form__multi-title\">\n {{ 'translate_attach_requested_files' | translate }}\n </h3>\n <p class=\"cortex-capture-form__multi-subtitle\">\n {{ 'translate_n_files_required' | translate: { count: requestedFiles().length } }}\n </p>\n </div>\n </div>\n </div>\n\n <fieldset [formArray]=\"form().controls.files\" class=\"cortex-capture-form__multi-fields\">\n @for (file of form().controls.files.value; track $index) {\n <div [formGroupName]=\"$index\" class=\"cortex-capture-form__multi-item\">\n <div class=\"cortex-capture-form__multi-item-header\">\n <label\n [for]=\"'capture-file-' + $index\"\n class=\"cortex-capture-form__multi-item-label\"\n >\n {{ requestedFiles()[$index]!.label }}\n </label>\n <span class=\"cortex-capture-form__required-badge\">\n {{ 'translate_required' | translate }}\n </span>\n </div>\n <input hidden formControlName=\"id\" />\n <cortex-file-input [id]=\"'capture-file-' + $index\" formControlName=\"file\" />\n </div>\n }\n </fieldset>\n\n <div class=\"cortex-capture-form__multi-footer\">\n <button\n (click)=\"cancel()\"\n [disabled]=\"isLoading()\"\n type=\"button\"\n class=\"cortex-capture-form__cancel-btn\"\n >\n {{ 'translate_cancel' | translate }}\n </button>\n <button\n (click)=\"submit()\"\n type=\"button\"\n class=\"cortex-capture-form__submit-btn\"\n [disabled]=\"form().invalid || isLoading()\"\n >\n @if (isLoading()) {\n <svg class=\"cortex-capture-form__spinner\" viewBox=\"0 0 16 16\" fill=\"none\">\n <circle\n cx=\"8\"\n cy=\"8\"\n r=\"6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n class=\"cortex-capture-form__spinner-track\"\n />\n <path\n d=\"M14 8a6 6 0 0 0-6-6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_uploading' | translate }}\n } @else {\n {{ 'translate_submit_files' | translate }}\n }\n </button>\n </div>\n </div>\n }\n </form>\n }\n}\n", styles: [".cortex-capture-files{display:block;width:100%}.cortex-file-input{display:flex;width:100%;cursor:pointer;align-items:center;border-radius:.5rem;border:1px solid #cbd5e1;background:#f8fafc;transition:border-color .15s}.cortex-file-input:hover{border-color:#94a3b8}.cortex-file-input:focus-within{box-shadow:0 0 0 2px #cbd5e1}.cortex-file-input__btn{margin:.25rem;flex-shrink:0;cursor:pointer;border-radius:.375rem;border:0;background:#1e293b;padding:.375rem .75rem;font-size:.6875rem;font-weight:600;letter-spacing:.025em;color:#f1f5f9}.cortex-file-input__btn:hover{background:#334155}.cortex-file-input__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 .75rem;font-size:.75rem;color:#475569}.cortex-file-input__hidden{display:none}.cortex-capture-success{overflow:hidden;border-radius:1rem;border:1px solid #a7f3d0;background:linear-gradient(to bottom,#ecfdf5cc,#fff)}.cortex-capture-success__header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-success__header{padding:.75rem 1.25rem}}.cortex-capture-success__icon{display:inline-flex;width:2rem;height:2rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.5rem;border:1px solid #a7f3d0;background:#d1fae5;color:#059669}.cortex-capture-success__icon-svg{width:1rem;height:1rem}.cortex-capture-success__title-wrap{min-width:0}.cortex-capture-success__title{font-size:.8125rem;font-weight:600;letter-spacing:-.01em;color:#065f46;margin:0}.cortex-capture-success__file-list{border-top:1px solid #d1fae5;padding:.625rem 1rem}@media(min-width:640px){.cortex-capture-success__file-list{padding:.625rem 1.25rem}}.cortex-capture-success__files{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}.cortex-capture-success__download-btn{display:inline-flex;cursor:pointer;align-items:center;gap:.375rem;border-radius:.5rem;border:1px solid #d1fae5;background:#fff;padding:.375rem .625rem;font-size:.75rem;font-weight:500;color:#047857;box-shadow:0 1px 2px #0000000d;transition:all .15s}.cortex-capture-success__download-btn:hover{border-color:#a7f3d0;background:#ecfdf5;box-shadow:0 1px 3px #0000001a}.cortex-capture-success__download-btn:active{transform:scale(.97)}.cortex-capture-success__file-icon{width:.875rem;height:.875rem;flex-shrink:0;color:#6ee7b7}.cortex-capture-success__file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}.cortex-capture-success__dl-icon{width:.75rem;height:.75rem;flex-shrink:0;color:#86efac}.cortex-capture-canceled-wrap{display:flex;justify-content:center}.cortex-capture-canceled{display:inline-flex;align-items:center;gap:.625rem;border-radius:.5rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.625rem 1rem}.cortex-capture-canceled__icon{display:inline-flex;width:1.5rem;height:1.5rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.375rem;border:1px solid #e2e8f0;background:#f1f5f9;color:#94a3b8}.cortex-capture-canceled__icon-svg{width:.75rem;height:.75rem}.cortex-capture-canceled__text{font-size:.8125rem;font-weight:500;color:#94a3b8}.cortex-capture-form{width:100%}.cortex-capture-form__single{border-radius:.75rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.75rem}.cortex-capture-form__label{display:block;margin-bottom:.375rem;font-size:.75rem;color:#64748b}.cortex-capture-form__row{display:flex;align-items:center;gap:.5rem}.cortex-capture-form__input{min-width:0;flex:1}.cortex-capture-form__cancel-link{flex-shrink:0;font-size:.75rem;font-weight:500;color:#94a3b8;background:none;border:0;cursor:pointer;transition:color .15s}.cortex-capture-form__cancel-link:hover{color:#475569}.cortex-capture-form__submit-btn{display:inline-flex;flex-shrink:0;align-items:center;border-radius:.375rem;background:#1e293b;padding:.375rem .75rem;font-size:.75rem;font-weight:500;color:#f1f5f9;border:0;cursor:pointer;transition:background-color .15s}.cortex-capture-form__submit-btn:hover{background:#334155}.cortex-capture-form__submit-btn:active{background:#0f172a}.cortex-capture-form__submit-btn:disabled{cursor:not-allowed;background:#cbd5e1}.cortex-capture-form__spinner{width:.75rem;height:.75rem;margin-inline-end:.375rem;animation:cortex-capture-spin .8s linear infinite}.cortex-capture-form__spinner-track{opacity:.25}@keyframes cortex-capture-spin{to{transform:rotate(360deg)}}.cortex-capture-form__multi{overflow:hidden;border-radius:1rem;border:1px solid #e2e8f0;background:linear-gradient(to bottom,#fff,#f8fafc)}.cortex-capture-form__multi-header{border-bottom:1px solid #e2e8f0;background:#ffffffd9;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-form__multi-header{padding:.75rem 1.25rem}}.cortex-capture-form__multi-header-row{display:flex;align-items:flex-start;gap:.75rem}.cortex-capture-form__multi-icon{margin-top:.125rem;display:inline-flex;width:2rem;height:2rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.5rem;border:1px solid #e2e8f0;background:#f1f5f9;color:#475569}.cortex-capture-form__multi-icon-svg{width:1rem;height:1rem}.cortex-capture-form__multi-title-wrap{min-width:0}.cortex-capture-form__multi-title{font-size:.8125rem;font-weight:600;letter-spacing:-.01em;color:#1e293b;margin:0}.cortex-capture-form__multi-subtitle{margin-top:.125rem;font-size:.6875rem;color:#64748b;margin-bottom:0}.cortex-capture-form__multi-fields{display:grid;gap:.75rem;padding:1rem;border:0}@media(min-width:640px){.cortex-capture-form__multi-fields{padding:1.25rem}}.cortex-capture-form__multi-item{border-radius:.75rem;border:1px solid #e2e8f0;background:#fff;padding:.75rem;transition:border-color .15s}.cortex-capture-form__multi-item:hover{border-color:#cbd5e1}.cortex-capture-form__multi-item-header{margin-bottom:.5rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.cortex-capture-form__multi-item-label{display:block;font-size:.75rem;font-weight:500;line-height:1;color:#334155}.cortex-capture-form__required-badge{display:inline-flex;align-items:center;border-radius:.25rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.125rem .375rem;font-size:.625rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:#64748b}.cortex-capture-form__multi-footer{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;border-top:1px solid #e2e8f0;background:#ffffffe6;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-form__multi-footer{padding:.75rem 1.25rem}}.cortex-capture-form__cancel-btn{display:inline-flex;align-items:center;border-radius:.375rem;border:1px solid #cbd5e1;background:#fff;padding:.375rem .75rem;font-size:.75rem;font-weight:500;color:#475569;cursor:pointer;transition:background-color .15s}.cortex-capture-form__cancel-btn:hover{background:#f8fafc}.cortex-capture-form__cancel-btn:active{background:#f1f5f9}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i1$1.ɵNgNoValidate), selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i0.forwardRef(() => i1$1.DefaultValueAccessor), selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.NgControlStatusGroup), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormGroupDirective), selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormArrayDirective), selector: "[formArray]", inputs: ["formArray"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormControlName), selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i0.forwardRef(() => i1$1.FormGroupName), selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i0.forwardRef(() => FileInputComponent), selector: "cortex-file-input", inputs: ["allowedMimeTypes"] }, { kind: "pipe", type: i0.forwardRef(() => TranslatePipe), name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
642
756
|
}
|
|
643
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
757
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageCaptureFilesPartComponent, decorators: [{
|
|
644
758
|
type: Component,
|
|
645
759
|
args: [{ selector: 'cortex-message-capture-files-part', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [ReactiveFormsModule, forwardRef(() => FileInputComponent), TranslatePipe], host: { class: 'cortex-capture-files' }, template: "@if (outputData(); as output) {\n <!-- Result state -->\n @if (output.status === 'success') {\n <div class=\"cortex-capture-success\">\n <div class=\"cortex-capture-success__header\">\n <div class=\"cortex-capture-success__icon\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-capture-success__icon-svg\" fill=\"none\">\n <path\n d=\"M5.5 10.5 L8.5 13.5 L14.5 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.75\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n <div class=\"cortex-capture-success__title-wrap\">\n <h3 class=\"cortex-capture-success__title\">\n {{ 'translate_files_attached' | translate: { count: requestedFiles().length } }}\n </h3>\n </div>\n </div>\n\n <div class=\"cortex-capture-success__file-list\">\n <ul class=\"cortex-capture-success__files\">\n @for (file of outputData()!.result!; track file.uploadId) {\n <li>\n <button\n type=\"button\"\n (click)=\"downloadFile(file.uploadId)\"\n class=\"cortex-capture-success__download-btn\"\n >\n <svg viewBox=\"0 0 16 16\" class=\"cortex-capture-success__file-icon\" fill=\"none\">\n <path\n d=\"M4 1.5h5.172a2 2 0 0 1 1.414.586l2.328 2.328a2 2 0 0 1 .586 1.414V12.5a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-9a2 2 0 0 1 2-2Z\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n />\n <path\n d=\"M9.5 1.5v2a2 2 0 0 0 2 2h2\"\n stroke=\"currentColor\"\n stroke-width=\"1.25\"\n stroke-linecap=\"round\"\n />\n </svg>\n <span class=\"cortex-capture-success__file-name\">{{\n requestedFiles()[$index]?.label ?? outputData()!.result![$index]?.id\n }}</span>\n <svg viewBox=\"0 0 16 16\" class=\"cortex-capture-success__dl-icon\" fill=\"none\">\n <path\n d=\"M8 3v7m0 0L5.5 7.5M8 10l2.5-2.5M3 13h10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n </li>\n }\n </ul>\n </div>\n </div>\n } @else {\n <!-- Canceled state -->\n <div class=\"cortex-capture-canceled-wrap\">\n <div class=\"cortex-capture-canceled\">\n <div class=\"cortex-capture-canceled__icon\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-capture-canceled__icon-svg\" fill=\"none\">\n <path d=\"M6 10h8\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n </div>\n <span class=\"cortex-capture-canceled__text\">{{\n 'translate_file_upload_skipped' | translate\n }}</span>\n </div>\n </div>\n }\n} @else {\n @if (!hasInvalidInput()) {\n <!-- Upload form -->\n <form [formGroup]=\"form()\" class=\"cortex-capture-form\">\n @if (requestedFiles().length === 1) {\n <!-- Single file: minimal inline -->\n <fieldset [formArray]=\"form().controls.files\">\n <div [formGroupName]=\"0\" class=\"cortex-capture-form__single\">\n <label for=\"capture-file-0\" class=\"cortex-capture-form__label\">\n {{ requestedFiles()[0]!.label }}\n </label>\n <input hidden formControlName=\"id\" />\n <div class=\"cortex-capture-form__row\">\n <cortex-file-input\n id=\"capture-file-0\"\n formControlName=\"file\"\n class=\"cortex-capture-form__input\"\n />\n <button\n (click)=\"cancel()\"\n [disabled]=\"isLoading()\"\n type=\"button\"\n class=\"cortex-capture-form__cancel-link\"\n >\n {{ 'translate_cancel' | translate }}\n </button>\n <button\n (click)=\"submit()\"\n type=\"button\"\n class=\"cortex-capture-form__submit-btn\"\n [disabled]=\"form().invalid || isLoading()\"\n >\n @if (isLoading()) {\n <svg class=\"cortex-capture-form__spinner\" viewBox=\"0 0 16 16\" fill=\"none\">\n <circle\n cx=\"8\"\n cy=\"8\"\n r=\"6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n class=\"cortex-capture-form__spinner-track\"\n />\n <path\n d=\"M14 8a6 6 0 0 0-6-6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_uploading' | translate }}\n } @else {\n {{ 'translate_submit' | translate }}\n }\n </button>\n </div>\n </div>\n </fieldset>\n } @else {\n <!-- Multi-file: full form -->\n <div class=\"cortex-capture-form__multi\">\n <div class=\"cortex-capture-form__multi-header\">\n <div class=\"cortex-capture-form__multi-header-row\">\n <div class=\"cortex-capture-form__multi-icon\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 20 20\" class=\"cortex-capture-form__multi-icon-svg\" fill=\"none\">\n <path\n d=\"M4 13.5a3.5 3.5 0 0 1-.5-6.97 5.002 5.002 0 0 1 9.78-1.03A4.5 4.5 0 0 1 15.5 14\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n <path\n d=\"M10 10v7m0-7-2.5 2.5M10 10l2.5 2.5\"\n stroke=\"currentColor\"\n stroke-width=\"1.4\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n\n <div class=\"cortex-capture-form__multi-title-wrap\">\n <h3 class=\"cortex-capture-form__multi-title\">\n {{ 'translate_attach_requested_files' | translate }}\n </h3>\n <p class=\"cortex-capture-form__multi-subtitle\">\n {{ 'translate_n_files_required' | translate: { count: requestedFiles().length } }}\n </p>\n </div>\n </div>\n </div>\n\n <fieldset [formArray]=\"form().controls.files\" class=\"cortex-capture-form__multi-fields\">\n @for (file of form().controls.files.value; track $index) {\n <div [formGroupName]=\"$index\" class=\"cortex-capture-form__multi-item\">\n <div class=\"cortex-capture-form__multi-item-header\">\n <label\n [for]=\"'capture-file-' + $index\"\n class=\"cortex-capture-form__multi-item-label\"\n >\n {{ requestedFiles()[$index]!.label }}\n </label>\n <span class=\"cortex-capture-form__required-badge\">\n {{ 'translate_required' | translate }}\n </span>\n </div>\n <input hidden formControlName=\"id\" />\n <cortex-file-input [id]=\"'capture-file-' + $index\" formControlName=\"file\" />\n </div>\n }\n </fieldset>\n\n <div class=\"cortex-capture-form__multi-footer\">\n <button\n (click)=\"cancel()\"\n [disabled]=\"isLoading()\"\n type=\"button\"\n class=\"cortex-capture-form__cancel-btn\"\n >\n {{ 'translate_cancel' | translate }}\n </button>\n <button\n (click)=\"submit()\"\n type=\"button\"\n class=\"cortex-capture-form__submit-btn\"\n [disabled]=\"form().invalid || isLoading()\"\n >\n @if (isLoading()) {\n <svg class=\"cortex-capture-form__spinner\" viewBox=\"0 0 16 16\" fill=\"none\">\n <circle\n cx=\"8\"\n cy=\"8\"\n r=\"6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n class=\"cortex-capture-form__spinner-track\"\n />\n <path\n d=\"M14 8a6 6 0 0 0-6-6\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_uploading' | translate }}\n } @else {\n {{ 'translate_submit_files' | translate }}\n }\n </button>\n </div>\n </div>\n }\n </form>\n }\n}\n", styles: [".cortex-capture-files{display:block;width:100%}.cortex-file-input{display:flex;width:100%;cursor:pointer;align-items:center;border-radius:.5rem;border:1px solid #cbd5e1;background:#f8fafc;transition:border-color .15s}.cortex-file-input:hover{border-color:#94a3b8}.cortex-file-input:focus-within{box-shadow:0 0 0 2px #cbd5e1}.cortex-file-input__btn{margin:.25rem;flex-shrink:0;cursor:pointer;border-radius:.375rem;border:0;background:#1e293b;padding:.375rem .75rem;font-size:.6875rem;font-weight:600;letter-spacing:.025em;color:#f1f5f9}.cortex-file-input__btn:hover{background:#334155}.cortex-file-input__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 .75rem;font-size:.75rem;color:#475569}.cortex-file-input__hidden{display:none}.cortex-capture-success{overflow:hidden;border-radius:1rem;border:1px solid #a7f3d0;background:linear-gradient(to bottom,#ecfdf5cc,#fff)}.cortex-capture-success__header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-success__header{padding:.75rem 1.25rem}}.cortex-capture-success__icon{display:inline-flex;width:2rem;height:2rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.5rem;border:1px solid #a7f3d0;background:#d1fae5;color:#059669}.cortex-capture-success__icon-svg{width:1rem;height:1rem}.cortex-capture-success__title-wrap{min-width:0}.cortex-capture-success__title{font-size:.8125rem;font-weight:600;letter-spacing:-.01em;color:#065f46;margin:0}.cortex-capture-success__file-list{border-top:1px solid #d1fae5;padding:.625rem 1rem}@media(min-width:640px){.cortex-capture-success__file-list{padding:.625rem 1.25rem}}.cortex-capture-success__files{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}.cortex-capture-success__download-btn{display:inline-flex;cursor:pointer;align-items:center;gap:.375rem;border-radius:.5rem;border:1px solid #d1fae5;background:#fff;padding:.375rem .625rem;font-size:.75rem;font-weight:500;color:#047857;box-shadow:0 1px 2px #0000000d;transition:all .15s}.cortex-capture-success__download-btn:hover{border-color:#a7f3d0;background:#ecfdf5;box-shadow:0 1px 3px #0000001a}.cortex-capture-success__download-btn:active{transform:scale(.97)}.cortex-capture-success__file-icon{width:.875rem;height:.875rem;flex-shrink:0;color:#6ee7b7}.cortex-capture-success__file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}.cortex-capture-success__dl-icon{width:.75rem;height:.75rem;flex-shrink:0;color:#86efac}.cortex-capture-canceled-wrap{display:flex;justify-content:center}.cortex-capture-canceled{display:inline-flex;align-items:center;gap:.625rem;border-radius:.5rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.625rem 1rem}.cortex-capture-canceled__icon{display:inline-flex;width:1.5rem;height:1.5rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.375rem;border:1px solid #e2e8f0;background:#f1f5f9;color:#94a3b8}.cortex-capture-canceled__icon-svg{width:.75rem;height:.75rem}.cortex-capture-canceled__text{font-size:.8125rem;font-weight:500;color:#94a3b8}.cortex-capture-form{width:100%}.cortex-capture-form__single{border-radius:.75rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.75rem}.cortex-capture-form__label{display:block;margin-bottom:.375rem;font-size:.75rem;color:#64748b}.cortex-capture-form__row{display:flex;align-items:center;gap:.5rem}.cortex-capture-form__input{min-width:0;flex:1}.cortex-capture-form__cancel-link{flex-shrink:0;font-size:.75rem;font-weight:500;color:#94a3b8;background:none;border:0;cursor:pointer;transition:color .15s}.cortex-capture-form__cancel-link:hover{color:#475569}.cortex-capture-form__submit-btn{display:inline-flex;flex-shrink:0;align-items:center;border-radius:.375rem;background:#1e293b;padding:.375rem .75rem;font-size:.75rem;font-weight:500;color:#f1f5f9;border:0;cursor:pointer;transition:background-color .15s}.cortex-capture-form__submit-btn:hover{background:#334155}.cortex-capture-form__submit-btn:active{background:#0f172a}.cortex-capture-form__submit-btn:disabled{cursor:not-allowed;background:#cbd5e1}.cortex-capture-form__spinner{width:.75rem;height:.75rem;margin-inline-end:.375rem;animation:cortex-capture-spin .8s linear infinite}.cortex-capture-form__spinner-track{opacity:.25}@keyframes cortex-capture-spin{to{transform:rotate(360deg)}}.cortex-capture-form__multi{overflow:hidden;border-radius:1rem;border:1px solid #e2e8f0;background:linear-gradient(to bottom,#fff,#f8fafc)}.cortex-capture-form__multi-header{border-bottom:1px solid #e2e8f0;background:#ffffffd9;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-form__multi-header{padding:.75rem 1.25rem}}.cortex-capture-form__multi-header-row{display:flex;align-items:flex-start;gap:.75rem}.cortex-capture-form__multi-icon{margin-top:.125rem;display:inline-flex;width:2rem;height:2rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.5rem;border:1px solid #e2e8f0;background:#f1f5f9;color:#475569}.cortex-capture-form__multi-icon-svg{width:1rem;height:1rem}.cortex-capture-form__multi-title-wrap{min-width:0}.cortex-capture-form__multi-title{font-size:.8125rem;font-weight:600;letter-spacing:-.01em;color:#1e293b;margin:0}.cortex-capture-form__multi-subtitle{margin-top:.125rem;font-size:.6875rem;color:#64748b;margin-bottom:0}.cortex-capture-form__multi-fields{display:grid;gap:.75rem;padding:1rem;border:0}@media(min-width:640px){.cortex-capture-form__multi-fields{padding:1.25rem}}.cortex-capture-form__multi-item{border-radius:.75rem;border:1px solid #e2e8f0;background:#fff;padding:.75rem;transition:border-color .15s}.cortex-capture-form__multi-item:hover{border-color:#cbd5e1}.cortex-capture-form__multi-item-header{margin-bottom:.5rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.cortex-capture-form__multi-item-label{display:block;font-size:.75rem;font-weight:500;line-height:1;color:#334155}.cortex-capture-form__required-badge{display:inline-flex;align-items:center;border-radius:.25rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.125rem .375rem;font-size:.625rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:#64748b}.cortex-capture-form__multi-footer{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;border-top:1px solid #e2e8f0;background:#ffffffe6;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-form__multi-footer{padding:.75rem 1.25rem}}.cortex-capture-form__cancel-btn{display:inline-flex;align-items:center;border-radius:.375rem;border:1px solid #cbd5e1;background:#fff;padding:.375rem .75rem;font-size:.75rem;font-weight:500;color:#475569;cursor:pointer;transition:background-color .15s}.cortex-capture-form__cancel-btn:hover{background:#f8fafc}.cortex-capture-form__cancel-btn:active{background:#f1f5f9}\n"] }]
|
|
646
760
|
}], propDecorators: { message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: true }] }], toolPart: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolPart", required: true }] }], setOutput: [{ type: i0.Input, args: [{ isSignal: true, alias: "setOutput", required: true }] }] } });
|
|
@@ -694,8 +808,8 @@ class FileInputComponent {
|
|
|
694
808
|
this.value.set(value);
|
|
695
809
|
this.onChange?.(value);
|
|
696
810
|
}
|
|
697
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
698
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
811
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: FileInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
812
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: FileInputComponent, isStandalone: true, selector: "cortex-file-input", inputs: { allowedMimeTypes: { classPropertyName: "allowedMimeTypes", publicName: "allowedMimeTypes", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
699
813
|
{
|
|
700
814
|
provide: NG_VALUE_ACCESSOR,
|
|
701
815
|
multi: true,
|
|
@@ -711,7 +825,7 @@ class FileInputComponent {
|
|
|
711
825
|
<input #fileInput (change)="loadFile($event)" type="file" class="cortex-file-input__hidden" />
|
|
712
826
|
</div>`, isInline: true, styles: [".cortex-capture-files{display:block;width:100%}.cortex-file-input{display:flex;width:100%;cursor:pointer;align-items:center;border-radius:.5rem;border:1px solid #cbd5e1;background:#f8fafc;transition:border-color .15s}.cortex-file-input:hover{border-color:#94a3b8}.cortex-file-input:focus-within{box-shadow:0 0 0 2px #cbd5e1}.cortex-file-input__btn{margin:.25rem;flex-shrink:0;cursor:pointer;border-radius:.375rem;border:0;background:#1e293b;padding:.375rem .75rem;font-size:.6875rem;font-weight:600;letter-spacing:.025em;color:#f1f5f9}.cortex-file-input__btn:hover{background:#334155}.cortex-file-input__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 .75rem;font-size:.75rem;color:#475569}.cortex-file-input__hidden{display:none}.cortex-capture-success{overflow:hidden;border-radius:1rem;border:1px solid #a7f3d0;background:linear-gradient(to bottom,#ecfdf5cc,#fff)}.cortex-capture-success__header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-success__header{padding:.75rem 1.25rem}}.cortex-capture-success__icon{display:inline-flex;width:2rem;height:2rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.5rem;border:1px solid #a7f3d0;background:#d1fae5;color:#059669}.cortex-capture-success__icon-svg{width:1rem;height:1rem}.cortex-capture-success__title-wrap{min-width:0}.cortex-capture-success__title{font-size:.8125rem;font-weight:600;letter-spacing:-.01em;color:#065f46;margin:0}.cortex-capture-success__file-list{border-top:1px solid #d1fae5;padding:.625rem 1rem}@media(min-width:640px){.cortex-capture-success__file-list{padding:.625rem 1.25rem}}.cortex-capture-success__files{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}.cortex-capture-success__download-btn{display:inline-flex;cursor:pointer;align-items:center;gap:.375rem;border-radius:.5rem;border:1px solid #d1fae5;background:#fff;padding:.375rem .625rem;font-size:.75rem;font-weight:500;color:#047857;box-shadow:0 1px 2px #0000000d;transition:all .15s}.cortex-capture-success__download-btn:hover{border-color:#a7f3d0;background:#ecfdf5;box-shadow:0 1px 3px #0000001a}.cortex-capture-success__download-btn:active{transform:scale(.97)}.cortex-capture-success__file-icon{width:.875rem;height:.875rem;flex-shrink:0;color:#6ee7b7}.cortex-capture-success__file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}.cortex-capture-success__dl-icon{width:.75rem;height:.75rem;flex-shrink:0;color:#86efac}.cortex-capture-canceled-wrap{display:flex;justify-content:center}.cortex-capture-canceled{display:inline-flex;align-items:center;gap:.625rem;border-radius:.5rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.625rem 1rem}.cortex-capture-canceled__icon{display:inline-flex;width:1.5rem;height:1.5rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.375rem;border:1px solid #e2e8f0;background:#f1f5f9;color:#94a3b8}.cortex-capture-canceled__icon-svg{width:.75rem;height:.75rem}.cortex-capture-canceled__text{font-size:.8125rem;font-weight:500;color:#94a3b8}.cortex-capture-form{width:100%}.cortex-capture-form__single{border-radius:.75rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.75rem}.cortex-capture-form__label{display:block;margin-bottom:.375rem;font-size:.75rem;color:#64748b}.cortex-capture-form__row{display:flex;align-items:center;gap:.5rem}.cortex-capture-form__input{min-width:0;flex:1}.cortex-capture-form__cancel-link{flex-shrink:0;font-size:.75rem;font-weight:500;color:#94a3b8;background:none;border:0;cursor:pointer;transition:color .15s}.cortex-capture-form__cancel-link:hover{color:#475569}.cortex-capture-form__submit-btn{display:inline-flex;flex-shrink:0;align-items:center;border-radius:.375rem;background:#1e293b;padding:.375rem .75rem;font-size:.75rem;font-weight:500;color:#f1f5f9;border:0;cursor:pointer;transition:background-color .15s}.cortex-capture-form__submit-btn:hover{background:#334155}.cortex-capture-form__submit-btn:active{background:#0f172a}.cortex-capture-form__submit-btn:disabled{cursor:not-allowed;background:#cbd5e1}.cortex-capture-form__spinner{width:.75rem;height:.75rem;margin-inline-end:.375rem;animation:cortex-capture-spin .8s linear infinite}.cortex-capture-form__spinner-track{opacity:.25}@keyframes cortex-capture-spin{to{transform:rotate(360deg)}}.cortex-capture-form__multi{overflow:hidden;border-radius:1rem;border:1px solid #e2e8f0;background:linear-gradient(to bottom,#fff,#f8fafc)}.cortex-capture-form__multi-header{border-bottom:1px solid #e2e8f0;background:#ffffffd9;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-form__multi-header{padding:.75rem 1.25rem}}.cortex-capture-form__multi-header-row{display:flex;align-items:flex-start;gap:.75rem}.cortex-capture-form__multi-icon{margin-top:.125rem;display:inline-flex;width:2rem;height:2rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.5rem;border:1px solid #e2e8f0;background:#f1f5f9;color:#475569}.cortex-capture-form__multi-icon-svg{width:1rem;height:1rem}.cortex-capture-form__multi-title-wrap{min-width:0}.cortex-capture-form__multi-title{font-size:.8125rem;font-weight:600;letter-spacing:-.01em;color:#1e293b;margin:0}.cortex-capture-form__multi-subtitle{margin-top:.125rem;font-size:.6875rem;color:#64748b;margin-bottom:0}.cortex-capture-form__multi-fields{display:grid;gap:.75rem;padding:1rem;border:0}@media(min-width:640px){.cortex-capture-form__multi-fields{padding:1.25rem}}.cortex-capture-form__multi-item{border-radius:.75rem;border:1px solid #e2e8f0;background:#fff;padding:.75rem;transition:border-color .15s}.cortex-capture-form__multi-item:hover{border-color:#cbd5e1}.cortex-capture-form__multi-item-header{margin-bottom:.5rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.cortex-capture-form__multi-item-label{display:block;font-size:.75rem;font-weight:500;line-height:1;color:#334155}.cortex-capture-form__required-badge{display:inline-flex;align-items:center;border-radius:.25rem;border:1px solid #e2e8f0;background:#f8fafc;padding:.125rem .375rem;font-size:.625rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:#64748b}.cortex-capture-form__multi-footer{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;border-top:1px solid #e2e8f0;background:#ffffffe6;padding:.75rem 1rem}@media(min-width:640px){.cortex-capture-form__multi-footer{padding:.75rem 1.25rem}}.cortex-capture-form__cancel-btn{display:inline-flex;align-items:center;border-radius:.375rem;border:1px solid #cbd5e1;background:#fff;padding:.375rem .75rem;font-size:.75rem;font-weight:500;color:#475569;cursor:pointer;transition:background-color .15s}.cortex-capture-form__cancel-btn:hover{background:#f8fafc}.cortex-capture-form__cancel-btn:active{background:#f1f5f9}\n"], dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
713
827
|
}
|
|
714
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
828
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: FileInputComponent, decorators: [{
|
|
715
829
|
type: Component,
|
|
716
830
|
args: [{ selector: 'cortex-file-input', template: `<div class="cortex-file-input">
|
|
717
831
|
<button type="button" (click)="fileInput.click()" class="cortex-file-input__btn">
|
|
@@ -817,34 +931,182 @@ class MessageToolCallAnimatedComponent {
|
|
|
817
931
|
return Math.abs(hash) % STATUS_COUNT;
|
|
818
932
|
}, ...(ngDevMode ? [{ debugName: "stableIndex" }] : /* istanbul ignore next */ []));
|
|
819
933
|
chatService = inject(CortexChatService);
|
|
820
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
821
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
934
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageToolCallAnimatedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
935
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: MessageToolCallAnimatedComponent, isStandalone: true, selector: "cortex-message-tool-call-animated", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, toolCallPart: { classPropertyName: "toolCallPart", publicName: "toolCallPart", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "cortex-tool-call-animated" }, ngImport: i0, template: "@if (customComponent(); as custom) {\n <ng-container\n *ngComponentOutlet=\"\n custom;\n inputs: { toolCallPart: toolCallPart(), message: message(), setOutput: setOutput() };\n injector: config.injector\n \"\n />\n} @else {\n @switch (toolCallPart().type) {\n @case ('tool-captureFiles') {\n <cortex-message-capture-files-part\n [toolPart]=\"toolCallPart()\"\n [message]=\"message()\"\n [setOutput]=\"setOutput()\"\n />\n }\n @default {\n @let state = animState();\n @let active = isActive();\n\n <div class=\"cortex-tool-pill-wrap\">\n <div\n class=\"cortex-tool-pill\"\n [class.cortex-tool-pill--active]=\"active\"\n [class.cortex-tool-pill--complete]=\"state === 'complete'\"\n [class.cortex-tool-pill--error]=\"state === 'error'\"\n [class.cortex-tool-pill--denied]=\"state === 'denied'\"\n >\n <!-- Icon box -->\n <div\n class=\"cortex-tool-pill__icon\"\n [class.cortex-tool-pill__icon--active]=\"active\"\n [class.cortex-tool-pill__icon--complete]=\"state === 'complete'\"\n [class.cortex-tool-pill__icon--error]=\"state === 'error'\"\n [class.cortex-tool-pill__icon--denied]=\"state === 'denied'\"\n >\n <!-- Spinner -->\n <div\n class=\"cortex-tool-pill__spinner\"\n [class.cortex-tool-pill__spinner--visible]=\"active\"\n ></div>\n <!-- Check -->\n <svg\n class=\"cortex-tool-pill__svg\"\n [class.cortex-tool-pill__svg--visible]=\"state === 'complete'\"\n [class.cortex-tool-pill__svg--check]=\"state === 'complete'\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n >\n <path\n d=\"M5.5 10.5 L8.5 13.5 L14.5 7\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <!-- Error -->\n <svg\n class=\"cortex-tool-pill__svg\"\n [class.cortex-tool-pill__svg--visible]=\"state === 'error'\"\n [class.cortex-tool-pill__svg--error]=\"state === 'error'\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n >\n <path\n d=\"M6.5 6.5 L13.5 13.5 M13.5 6.5 L6.5 13.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n <!-- Denied -->\n <svg\n class=\"cortex-tool-pill__svg\"\n [class.cortex-tool-pill__svg--visible]=\"state === 'denied'\"\n [class.cortex-tool-pill__svg--denied]=\"state === 'denied'\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n >\n <path\n d=\"M6 10 L14 10\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n\n <!-- Title -->\n <span\n class=\"cortex-tool-pill__title\"\n [class.cortex-tool-pill__title--active]=\"active\"\n [class.cortex-tool-pill__title--complete]=\"state === 'complete'\"\n [class.cortex-tool-pill__title--error]=\"state === 'error'\"\n [class.cortex-tool-pill__title--denied]=\"state === 'denied'\"\n >\n {{ displayTitleKey() | translate }}\n </span>\n\n <!-- Bottom bar -->\n <div class=\"cortex-tool-pill__bar-track\">\n <div\n class=\"cortex-tool-pill__bar\"\n [class.cortex-tool-pill__bar--active]=\"active\"\n [class.cortex-tool-pill__bar--complete]=\"state === 'complete'\"\n [class.cortex-tool-pill__bar--error]=\"state === 'error'\"\n [class.cortex-tool-pill__bar--denied]=\"state === 'denied'\"\n ></div>\n </div>\n </div>\n </div>\n }\n }\n}\n", styles: [".cortex-tool-call-animated{display:block;width:100%}.cortex-tool-pill-wrap{display:flex;justify-content:center}.cortex-tool-pill{display:inline-flex;align-items:center;gap:.625rem;padding:.625rem 1rem;border-radius:.5rem;border:1px solid;position:relative;overflow:hidden;transition:background-color .3s,border-color .3s}.cortex-tool-pill--active{border-color:#c7d2fe;background:#eef2ff}.cortex-tool-pill--complete{border-color:#a7f3d0;background:#ecfdf5}.cortex-tool-pill--error{border-color:#fecaca;background:#fef2f2}.cortex-tool-pill--denied{border-color:#e2e8f0;background:#f8fafc;opacity:.6}.cortex-tool-pill__icon{position:relative;width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;border-radius:.375rem;border:1px solid;flex-shrink:0;transition:background-color .3s,border-color .3s}.cortex-tool-pill__icon--active{background:#e0e7ff;border-color:#c7d2fe}.cortex-tool-pill__icon--complete{background:#d1fae5;border-color:#a7f3d0}.cortex-tool-pill__icon--error{background:#fee2e2;border-color:#fecaca}.cortex-tool-pill__icon--denied{background:#f1f5f9;border-color:#e2e8f0}.cortex-tool-pill__spinner{position:absolute;width:.75rem;height:.75rem;border:1.5px solid #c7d2fe;border-top-color:#6366f1;border-radius:9999px;opacity:0;transition:opacity .2s}.cortex-tool-pill__spinner--visible{opacity:1;animation:cortex-tool-spin .8s linear infinite}@keyframes cortex-tool-spin{to{transform:rotate(360deg)}}.cortex-tool-pill__svg{position:absolute;width:.75rem;height:.75rem;opacity:0;transform:scale(.6);transition:opacity .2s,transform .2s}.cortex-tool-pill__svg--visible{opacity:1;transform:scale(1)}.cortex-tool-pill__svg--check{color:#059669}.cortex-tool-pill__svg--error{color:#dc2626}.cortex-tool-pill__svg--denied{color:#94a3b8}.cortex-tool-pill__title{font-size:.8125rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .3s}.cortex-tool-pill__title--active{color:#4338ca}.cortex-tool-pill__title--complete{color:#047857}.cortex-tool-pill__title--error{color:#dc2626}.cortex-tool-pill__title--denied{color:#94a3b8}.cortex-tool-pill__bar-track{position:absolute;bottom:0;left:0;right:0;height:2px;overflow:hidden}.cortex-tool-pill__bar{height:100%;width:100%;transform-origin:left}.cortex-tool-pill__bar--active{background:#818cf8;animation:cortex-bar-slide 1.5s ease-in-out infinite}.cortex-tool-pill__bar--complete{background:#34d399;animation:cortex-bar-fill .3s ease-out both}.cortex-tool-pill__bar--error{background:#f87171;animation:cortex-bar-fill .3s ease-out both}.cortex-tool-pill__bar--denied{opacity:0}@keyframes cortex-bar-slide{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes cortex-bar-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: MessageCaptureFilesPartComponent, selector: "cortex-message-capture-files-part", inputs: ["message", "toolPart", "setOutput"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
822
936
|
}
|
|
823
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
937
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageToolCallAnimatedComponent, decorators: [{
|
|
824
938
|
type: Component,
|
|
825
939
|
args: [{ selector: 'cortex-message-tool-call-animated', imports: [NgComponentOutlet, MessageCaptureFilesPartComponent, TranslatePipe], host: { class: 'cortex-tool-call-animated' }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (customComponent(); as custom) {\n <ng-container\n *ngComponentOutlet=\"\n custom;\n inputs: { toolCallPart: toolCallPart(), message: message(), setOutput: setOutput() };\n injector: config.injector\n \"\n />\n} @else {\n @switch (toolCallPart().type) {\n @case ('tool-captureFiles') {\n <cortex-message-capture-files-part\n [toolPart]=\"toolCallPart()\"\n [message]=\"message()\"\n [setOutput]=\"setOutput()\"\n />\n }\n @default {\n @let state = animState();\n @let active = isActive();\n\n <div class=\"cortex-tool-pill-wrap\">\n <div\n class=\"cortex-tool-pill\"\n [class.cortex-tool-pill--active]=\"active\"\n [class.cortex-tool-pill--complete]=\"state === 'complete'\"\n [class.cortex-tool-pill--error]=\"state === 'error'\"\n [class.cortex-tool-pill--denied]=\"state === 'denied'\"\n >\n <!-- Icon box -->\n <div\n class=\"cortex-tool-pill__icon\"\n [class.cortex-tool-pill__icon--active]=\"active\"\n [class.cortex-tool-pill__icon--complete]=\"state === 'complete'\"\n [class.cortex-tool-pill__icon--error]=\"state === 'error'\"\n [class.cortex-tool-pill__icon--denied]=\"state === 'denied'\"\n >\n <!-- Spinner -->\n <div\n class=\"cortex-tool-pill__spinner\"\n [class.cortex-tool-pill__spinner--visible]=\"active\"\n ></div>\n <!-- Check -->\n <svg\n class=\"cortex-tool-pill__svg\"\n [class.cortex-tool-pill__svg--visible]=\"state === 'complete'\"\n [class.cortex-tool-pill__svg--check]=\"state === 'complete'\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n >\n <path\n d=\"M5.5 10.5 L8.5 13.5 L14.5 7\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <!-- Error -->\n <svg\n class=\"cortex-tool-pill__svg\"\n [class.cortex-tool-pill__svg--visible]=\"state === 'error'\"\n [class.cortex-tool-pill__svg--error]=\"state === 'error'\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n >\n <path\n d=\"M6.5 6.5 L13.5 13.5 M13.5 6.5 L6.5 13.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n <!-- Denied -->\n <svg\n class=\"cortex-tool-pill__svg\"\n [class.cortex-tool-pill__svg--visible]=\"state === 'denied'\"\n [class.cortex-tool-pill__svg--denied]=\"state === 'denied'\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n >\n <path\n d=\"M6 10 L14 10\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n\n <!-- Title -->\n <span\n class=\"cortex-tool-pill__title\"\n [class.cortex-tool-pill__title--active]=\"active\"\n [class.cortex-tool-pill__title--complete]=\"state === 'complete'\"\n [class.cortex-tool-pill__title--error]=\"state === 'error'\"\n [class.cortex-tool-pill__title--denied]=\"state === 'denied'\"\n >\n {{ displayTitleKey() | translate }}\n </span>\n\n <!-- Bottom bar -->\n <div class=\"cortex-tool-pill__bar-track\">\n <div\n class=\"cortex-tool-pill__bar\"\n [class.cortex-tool-pill__bar--active]=\"active\"\n [class.cortex-tool-pill__bar--complete]=\"state === 'complete'\"\n [class.cortex-tool-pill__bar--error]=\"state === 'error'\"\n [class.cortex-tool-pill__bar--denied]=\"state === 'denied'\"\n ></div>\n </div>\n </div>\n </div>\n }\n }\n}\n", styles: [".cortex-tool-call-animated{display:block;width:100%}.cortex-tool-pill-wrap{display:flex;justify-content:center}.cortex-tool-pill{display:inline-flex;align-items:center;gap:.625rem;padding:.625rem 1rem;border-radius:.5rem;border:1px solid;position:relative;overflow:hidden;transition:background-color .3s,border-color .3s}.cortex-tool-pill--active{border-color:#c7d2fe;background:#eef2ff}.cortex-tool-pill--complete{border-color:#a7f3d0;background:#ecfdf5}.cortex-tool-pill--error{border-color:#fecaca;background:#fef2f2}.cortex-tool-pill--denied{border-color:#e2e8f0;background:#f8fafc;opacity:.6}.cortex-tool-pill__icon{position:relative;width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;border-radius:.375rem;border:1px solid;flex-shrink:0;transition:background-color .3s,border-color .3s}.cortex-tool-pill__icon--active{background:#e0e7ff;border-color:#c7d2fe}.cortex-tool-pill__icon--complete{background:#d1fae5;border-color:#a7f3d0}.cortex-tool-pill__icon--error{background:#fee2e2;border-color:#fecaca}.cortex-tool-pill__icon--denied{background:#f1f5f9;border-color:#e2e8f0}.cortex-tool-pill__spinner{position:absolute;width:.75rem;height:.75rem;border:1.5px solid #c7d2fe;border-top-color:#6366f1;border-radius:9999px;opacity:0;transition:opacity .2s}.cortex-tool-pill__spinner--visible{opacity:1;animation:cortex-tool-spin .8s linear infinite}@keyframes cortex-tool-spin{to{transform:rotate(360deg)}}.cortex-tool-pill__svg{position:absolute;width:.75rem;height:.75rem;opacity:0;transform:scale(.6);transition:opacity .2s,transform .2s}.cortex-tool-pill__svg--visible{opacity:1;transform:scale(1)}.cortex-tool-pill__svg--check{color:#059669}.cortex-tool-pill__svg--error{color:#dc2626}.cortex-tool-pill__svg--denied{color:#94a3b8}.cortex-tool-pill__title{font-size:.8125rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .3s}.cortex-tool-pill__title--active{color:#4338ca}.cortex-tool-pill__title--complete{color:#047857}.cortex-tool-pill__title--error{color:#dc2626}.cortex-tool-pill__title--denied{color:#94a3b8}.cortex-tool-pill__bar-track{position:absolute;bottom:0;left:0;right:0;height:2px;overflow:hidden}.cortex-tool-pill__bar{height:100%;width:100%;transform-origin:left}.cortex-tool-pill__bar--active{background:#818cf8;animation:cortex-bar-slide 1.5s ease-in-out infinite}.cortex-tool-pill__bar--complete{background:#34d399;animation:cortex-bar-fill .3s ease-out both}.cortex-tool-pill__bar--error{background:#f87171;animation:cortex-bar-fill .3s ease-out both}.cortex-tool-pill__bar--denied{opacity:0}@keyframes cortex-bar-slide{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes cortex-bar-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}\n"] }]
|
|
826
940
|
}], propDecorators: { message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: true }] }], toolCallPart: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolCallPart", required: true }] }] } });
|
|
827
941
|
|
|
942
|
+
class SubtleActivityComponent {
|
|
943
|
+
labels = input.required(...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
|
|
944
|
+
currentIndex = signal(0, ...(ngDevMode ? [{ debugName: "currentIndex" }] : /* istanbul ignore next */ []));
|
|
945
|
+
labelState = signal('idle', ...(ngDevMode ? [{ debugName: "labelState" }] : /* istanbul ignore next */ []));
|
|
946
|
+
transitionTimeout = null;
|
|
947
|
+
exitTimeout = null;
|
|
948
|
+
enterTimeout = null;
|
|
949
|
+
constructor() {
|
|
950
|
+
const destroyRef = inject(DestroyRef);
|
|
951
|
+
afterNextRender(() => {
|
|
952
|
+
this.scheduleNextTransition();
|
|
953
|
+
});
|
|
954
|
+
destroyRef.onDestroy(() => {
|
|
955
|
+
this.clearAllTimeouts();
|
|
956
|
+
});
|
|
957
|
+
}
|
|
958
|
+
scheduleNextTransition() {
|
|
959
|
+
this.transitionTimeout = setTimeout(() => {
|
|
960
|
+
this.triggerTransition();
|
|
961
|
+
}, 2000);
|
|
962
|
+
}
|
|
963
|
+
triggerTransition() {
|
|
964
|
+
this.labelState.set('exiting');
|
|
965
|
+
this.exitTimeout = setTimeout(() => {
|
|
966
|
+
this.currentIndex.update((i) => (i + 1) % this.labels().length);
|
|
967
|
+
this.labelState.set('enter-start');
|
|
968
|
+
requestAnimationFrame(() => {
|
|
969
|
+
this.labelState.set('entering');
|
|
970
|
+
this.enterTimeout = setTimeout(() => {
|
|
971
|
+
this.labelState.set('idle');
|
|
972
|
+
this.scheduleNextTransition();
|
|
973
|
+
}, 300);
|
|
974
|
+
});
|
|
975
|
+
}, 300);
|
|
976
|
+
}
|
|
977
|
+
clearAllTimeouts() {
|
|
978
|
+
if (this.transitionTimeout)
|
|
979
|
+
clearTimeout(this.transitionTimeout);
|
|
980
|
+
if (this.exitTimeout)
|
|
981
|
+
clearTimeout(this.exitTimeout);
|
|
982
|
+
if (this.enterTimeout)
|
|
983
|
+
clearTimeout(this.enterTimeout);
|
|
984
|
+
}
|
|
985
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SubtleActivityComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
986
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: SubtleActivityComponent, isStandalone: true, selector: "cortex-subtle-activity", inputs: { labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "cortex-subtle-activity" }, ngImport: i0, template: "<div class=\"cortex-subtle-activity__dots\">\n <span class=\"cortex-subtle-activity__dot\"></span>\n <span class=\"cortex-subtle-activity__dot cortex-subtle-activity__dot--d1\"></span>\n <span class=\"cortex-subtle-activity__dot cortex-subtle-activity__dot--d2\"></span>\n</div>\n\n<div class=\"cortex-subtle-activity__label-mask\">\n <span\n class=\"cortex-subtle-activity__label\"\n [class.cortex-subtle-activity__label--idle]=\"labelState() === 'idle'\"\n [class.cortex-subtle-activity__label--exiting]=\"labelState() === 'exiting'\"\n [class.cortex-subtle-activity__label--enter-start]=\"labelState() === 'enter-start'\"\n [class.cortex-subtle-activity__label--entering]=\"labelState() === 'entering'\"\n >\n {{ labels()[currentIndex()] | translate }}\n </span>\n</div>\n", styles: [".cortex-subtle-activity{display:flex;align-items:center;gap:.375rem;padding:.25rem 0;width:fit-content}.cortex-subtle-activity__dots{display:flex;align-items:center;gap:3px}.cortex-subtle-activity__dot{width:3px;height:3px;border-radius:9999px;background:#a5b4fc;animation:cortex-subtle-dot-pulse 1.4s ease-in-out infinite}.cortex-subtle-activity__dot--d1{animation-delay:.2s}.cortex-subtle-activity__dot--d2{animation-delay:.4s}@keyframes cortex-subtle-dot-pulse{0%,to{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1.3)}}.cortex-subtle-activity__label-mask{overflow:hidden;position:relative;height:1.1em}.cortex-subtle-activity__label{display:block;font-size:.75rem;color:#94a3b8;white-space:nowrap;line-height:1.1em}.cortex-subtle-activity__label--idle,.cortex-subtle-activity__label--entering{opacity:1;transform:translateY(0);transition:opacity .3s ease,transform .3s ease}.cortex-subtle-activity__label--exiting{opacity:0;transform:translateY(-6px);transition:opacity .3s ease,transform .3s ease}.cortex-subtle-activity__label--enter-start{opacity:0;transform:translateY(6px);transition:none}\n"], dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
987
|
+
}
|
|
988
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SubtleActivityComponent, decorators: [{
|
|
989
|
+
type: Component,
|
|
990
|
+
args: [{ selector: 'cortex-subtle-activity', imports: [TranslatePipe], host: { class: 'cortex-subtle-activity' }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cortex-subtle-activity__dots\">\n <span class=\"cortex-subtle-activity__dot\"></span>\n <span class=\"cortex-subtle-activity__dot cortex-subtle-activity__dot--d1\"></span>\n <span class=\"cortex-subtle-activity__dot cortex-subtle-activity__dot--d2\"></span>\n</div>\n\n<div class=\"cortex-subtle-activity__label-mask\">\n <span\n class=\"cortex-subtle-activity__label\"\n [class.cortex-subtle-activity__label--idle]=\"labelState() === 'idle'\"\n [class.cortex-subtle-activity__label--exiting]=\"labelState() === 'exiting'\"\n [class.cortex-subtle-activity__label--enter-start]=\"labelState() === 'enter-start'\"\n [class.cortex-subtle-activity__label--entering]=\"labelState() === 'entering'\"\n >\n {{ labels()[currentIndex()] | translate }}\n </span>\n</div>\n", styles: [".cortex-subtle-activity{display:flex;align-items:center;gap:.375rem;padding:.25rem 0;width:fit-content}.cortex-subtle-activity__dots{display:flex;align-items:center;gap:3px}.cortex-subtle-activity__dot{width:3px;height:3px;border-radius:9999px;background:#a5b4fc;animation:cortex-subtle-dot-pulse 1.4s ease-in-out infinite}.cortex-subtle-activity__dot--d1{animation-delay:.2s}.cortex-subtle-activity__dot--d2{animation-delay:.4s}@keyframes cortex-subtle-dot-pulse{0%,to{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1.3)}}.cortex-subtle-activity__label-mask{overflow:hidden;position:relative;height:1.1em}.cortex-subtle-activity__label{display:block;font-size:.75rem;color:#94a3b8;white-space:nowrap;line-height:1.1em}.cortex-subtle-activity__label--idle,.cortex-subtle-activity__label--entering{opacity:1;transform:translateY(0);transition:opacity .3s ease,transform .3s ease}.cortex-subtle-activity__label--exiting{opacity:0;transform:translateY(-6px);transition:opacity .3s ease,transform .3s ease}.cortex-subtle-activity__label--enter-start{opacity:0;transform:translateY(6px);transition:none}\n"] }]
|
|
991
|
+
}], ctorParameters: () => [], propDecorators: { labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: true }] }] } });
|
|
992
|
+
|
|
993
|
+
const LABELS$3 = [
|
|
994
|
+
'translate_reasoning_0',
|
|
995
|
+
'translate_reasoning_1',
|
|
996
|
+
'translate_reasoning_2',
|
|
997
|
+
'translate_reasoning_3',
|
|
998
|
+
'translate_reasoning_4',
|
|
999
|
+
'translate_reasoning_5',
|
|
1000
|
+
'translate_reasoning_6',
|
|
1001
|
+
'translate_reasoning_7',
|
|
1002
|
+
'translate_reasoning_8',
|
|
1003
|
+
'translate_reasoning_9',
|
|
1004
|
+
];
|
|
828
1005
|
class MessageReasoningAnimatedComponent {
|
|
829
1006
|
reasoningPart = input.required(...(ngDevMode ? [{ debugName: "reasoningPart" }] : /* istanbul ignore next */ []));
|
|
830
|
-
|
|
831
|
-
static
|
|
1007
|
+
labels = LABELS$3;
|
|
1008
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageReasoningAnimatedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1009
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: MessageReasoningAnimatedComponent, isStandalone: true, selector: "cortex-message-reasoning-animated", inputs: { reasoningPart: { classPropertyName: "reasoningPart", publicName: "reasoningPart", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "cortex-reasoning-animated" }, ngImport: i0, template: "<cortex-subtle-activity [labels]=\"labels\" />\n", styles: [".cortex-reasoning-animated{display:block}\n"], dependencies: [{ kind: "component", type: SubtleActivityComponent, selector: "cortex-subtle-activity", inputs: ["labels"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
832
1010
|
}
|
|
833
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1011
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageReasoningAnimatedComponent, decorators: [{
|
|
834
1012
|
type: Component,
|
|
835
|
-
args: [{ selector: 'cortex-message-reasoning-animated', imports: [
|
|
1013
|
+
args: [{ selector: 'cortex-message-reasoning-animated', imports: [SubtleActivityComponent], host: { class: 'cortex-reasoning-animated' }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<cortex-subtle-activity [labels]=\"labels\" />\n", styles: [".cortex-reasoning-animated{display:block}\n"] }]
|
|
836
1014
|
}], propDecorators: { reasoningPart: [{ type: i0.Input, args: [{ isSignal: true, alias: "reasoningPart", required: true }] }] } });
|
|
837
1015
|
|
|
1016
|
+
const LABELS$2 = [
|
|
1017
|
+
'translate_endpoint_0',
|
|
1018
|
+
'translate_endpoint_1',
|
|
1019
|
+
'translate_endpoint_2',
|
|
1020
|
+
'translate_endpoint_3',
|
|
1021
|
+
'translate_endpoint_4',
|
|
1022
|
+
'translate_endpoint_5',
|
|
1023
|
+
'translate_endpoint_6',
|
|
1024
|
+
'translate_endpoint_7',
|
|
1025
|
+
'translate_endpoint_8',
|
|
1026
|
+
'translate_endpoint_9',
|
|
1027
|
+
];
|
|
1028
|
+
class ToolCallEndpointAnimatedComponent {
|
|
1029
|
+
labels = LABELS$2;
|
|
1030
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ToolCallEndpointAnimatedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1031
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: ToolCallEndpointAnimatedComponent, isStandalone: true, selector: "cortex-tool-call-endpoint-animated", ngImport: i0, template: '<cortex-subtle-activity [labels]="labels" />', isInline: true, dependencies: [{ kind: "component", type: SubtleActivityComponent, selector: "cortex-subtle-activity", inputs: ["labels"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1032
|
+
}
|
|
1033
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ToolCallEndpointAnimatedComponent, decorators: [{
|
|
1034
|
+
type: Component,
|
|
1035
|
+
args: [{
|
|
1036
|
+
selector: 'cortex-tool-call-endpoint-animated',
|
|
1037
|
+
template: '<cortex-subtle-activity [labels]="labels" />',
|
|
1038
|
+
imports: [SubtleActivityComponent],
|
|
1039
|
+
encapsulation: ViewEncapsulation.None,
|
|
1040
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1041
|
+
}]
|
|
1042
|
+
}] });
|
|
1043
|
+
|
|
1044
|
+
const LABELS$1 = [
|
|
1045
|
+
'translate_graph_0',
|
|
1046
|
+
'translate_graph_1',
|
|
1047
|
+
'translate_graph_2',
|
|
1048
|
+
'translate_graph_3',
|
|
1049
|
+
'translate_graph_4',
|
|
1050
|
+
'translate_graph_5',
|
|
1051
|
+
'translate_graph_6',
|
|
1052
|
+
'translate_graph_7',
|
|
1053
|
+
'translate_graph_8',
|
|
1054
|
+
'translate_graph_9',
|
|
1055
|
+
];
|
|
1056
|
+
class ToolQueryGraphAnimatedComponent {
|
|
1057
|
+
labels = LABELS$1;
|
|
1058
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ToolQueryGraphAnimatedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1059
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: ToolQueryGraphAnimatedComponent, isStandalone: true, selector: "cortex-tool-query-graph-animated", ngImport: i0, template: '<cortex-subtle-activity [labels]="labels" />', isInline: true, dependencies: [{ kind: "component", type: SubtleActivityComponent, selector: "cortex-subtle-activity", inputs: ["labels"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1060
|
+
}
|
|
1061
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ToolQueryGraphAnimatedComponent, decorators: [{
|
|
1062
|
+
type: Component,
|
|
1063
|
+
args: [{
|
|
1064
|
+
selector: 'cortex-tool-query-graph-animated',
|
|
1065
|
+
template: '<cortex-subtle-activity [labels]="labels" />',
|
|
1066
|
+
imports: [SubtleActivityComponent],
|
|
1067
|
+
encapsulation: ViewEncapsulation.None,
|
|
1068
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1069
|
+
}]
|
|
1070
|
+
}] });
|
|
1071
|
+
|
|
1072
|
+
const LABELS = [
|
|
1073
|
+
'translate_code_0',
|
|
1074
|
+
'translate_code_1',
|
|
1075
|
+
'translate_code_2',
|
|
1076
|
+
'translate_code_3',
|
|
1077
|
+
'translate_code_4',
|
|
1078
|
+
'translate_code_5',
|
|
1079
|
+
'translate_code_6',
|
|
1080
|
+
'translate_code_7',
|
|
1081
|
+
'translate_code_8',
|
|
1082
|
+
'translate_code_9',
|
|
1083
|
+
];
|
|
1084
|
+
class ToolExecuteCodeAnimatedComponent {
|
|
1085
|
+
labels = LABELS;
|
|
1086
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ToolExecuteCodeAnimatedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1087
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: ToolExecuteCodeAnimatedComponent, isStandalone: true, selector: "cortex-tool-execute-code-animated", ngImport: i0, template: '<cortex-subtle-activity [labels]="labels" />', isInline: true, dependencies: [{ kind: "component", type: SubtleActivityComponent, selector: "cortex-subtle-activity", inputs: ["labels"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1088
|
+
}
|
|
1089
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ToolExecuteCodeAnimatedComponent, decorators: [{
|
|
1090
|
+
type: Component,
|
|
1091
|
+
args: [{
|
|
1092
|
+
selector: 'cortex-tool-execute-code-animated',
|
|
1093
|
+
template: '<cortex-subtle-activity [labels]="labels" />',
|
|
1094
|
+
imports: [SubtleActivityComponent],
|
|
1095
|
+
encapsulation: ViewEncapsulation.None,
|
|
1096
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1097
|
+
}]
|
|
1098
|
+
}] });
|
|
1099
|
+
|
|
838
1100
|
class MessagePartComponent {
|
|
839
1101
|
message = input.required(...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
|
|
840
1102
|
part = input.required(...(ngDevMode ? [{ debugName: "part" }] : /* istanbul ignore next */ []));
|
|
841
1103
|
debugMode = input(false, ...(ngDevMode ? [{ debugName: "debugMode" }] : /* istanbul ignore next */ []));
|
|
842
1104
|
animate = input(false, ...(ngDevMode ? [{ debugName: "animate" }] : /* istanbul ignore next */ []));
|
|
843
1105
|
isStaticToolUIPart = isStaticToolUIPart;
|
|
844
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
845
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1106
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessagePartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1107
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: MessagePartComponent, isStandalone: true, selector: "cortex-message-part", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, part: { classPropertyName: "part", publicName: "part", isSignal: true, isRequired: true, transformFunction: null }, debugMode: { classPropertyName: "debugMode", publicName: "debugMode", isSignal: true, isRequired: false, transformFunction: null }, animate: { classPropertyName: "animate", publicName: "animate", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.cortex-message-part--animated": "animate()" }, classAttribute: "cortex-message-part" }, ngImport: i0, template: "@let myPart = part();\n@switch (myPart.type) {\n @case ('text') {\n <cortex-message-text-part [textPart]=\"myPart\" [role]=\"message().role\" />\n }\n @case ('reasoning') {\n @if (debugMode()) {\n <cortex-message-reasoning-part [reasoningPart]=\"myPart\" />\n } @else {\n <cortex-message-reasoning-animated [reasoningPart]=\"myPart\" />\n }\n }\n @default {\n @if (isStaticToolUIPart(myPart)) {\n @if (debugMode()) {\n <cortex-message-tool-call-part [toolCallPart]=\"myPart\" />\n } @else {\n @switch (myPart.type) {\n @case ('tool-callEndpoint') {\n <cortex-tool-call-endpoint-animated />\n }\n @case ('tool-queryGraph') {\n <cortex-tool-query-graph-animated />\n }\n @case ('tool-executeCode') {\n <cortex-tool-execute-code-animated />\n }\n @default {\n <cortex-message-tool-call-animated [toolCallPart]=\"myPart\" [message]=\"message()\" />\n }\n }\n }\n } @else {\n <p class=\"cortex-unhandled-type\">Unhandled type: {{ part().type }}</p>\n }\n }\n}\n", styles: [".cortex-message-part{display:block}.cortex-message-part:empty{display:none}.cortex-message-part--animated{animation:cortex-part-fade-in-up .2s cubic-bezier(.34,1.56,.64,1) both}@keyframes cortex-part-fade-in-up{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.cortex-unhandled-type{text-align:center;font-size:.75rem;color:#94a3b8}\n"], dependencies: [{ kind: "component", type: MessageTextPartComponent, selector: "cortex-message-text-part", inputs: ["role", "textPart"] }, { kind: "component", type: MessageReasoningPartComponent, selector: "cortex-message-reasoning-part", inputs: ["reasoningPart"] }, { kind: "component", type: MessageToolCallPartComponent, selector: "cortex-message-tool-call-part", inputs: ["toolCallPart"] }, { kind: "component", type: MessageToolCallAnimatedComponent, selector: "cortex-message-tool-call-animated", inputs: ["message", "toolCallPart"] }, { kind: "component", type: MessageReasoningAnimatedComponent, selector: "cortex-message-reasoning-animated", inputs: ["reasoningPart"] }, { kind: "component", type: ToolCallEndpointAnimatedComponent, selector: "cortex-tool-call-endpoint-animated" }, { kind: "component", type: ToolQueryGraphAnimatedComponent, selector: "cortex-tool-query-graph-animated" }, { kind: "component", type: ToolExecuteCodeAnimatedComponent, selector: "cortex-tool-execute-code-animated" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
846
1108
|
}
|
|
847
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1109
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessagePartComponent, decorators: [{
|
|
848
1110
|
type: Component,
|
|
849
1111
|
args: [{ selector: 'cortex-message-part', imports: [
|
|
850
1112
|
MessageTextPartComponent,
|
|
@@ -852,17 +1114,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImpor
|
|
|
852
1114
|
MessageToolCallPartComponent,
|
|
853
1115
|
MessageToolCallAnimatedComponent,
|
|
854
1116
|
MessageReasoningAnimatedComponent,
|
|
1117
|
+
ToolCallEndpointAnimatedComponent,
|
|
1118
|
+
ToolQueryGraphAnimatedComponent,
|
|
1119
|
+
ToolExecuteCodeAnimatedComponent,
|
|
855
1120
|
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
856
1121
|
class: 'cortex-message-part',
|
|
857
1122
|
'[class.cortex-message-part--animated]': 'animate()',
|
|
858
|
-
}, template: "@let myPart = part();\n@switch (myPart.type) {\n @case ('text') {\n <cortex-message-text-part [textPart]=\"myPart\" [role]=\"message().role\" />\n }\n @case ('reasoning') {\n @if (debugMode()) {\n <cortex-message-reasoning-part [reasoningPart]=\"myPart\" />\n } @else {\n <cortex-message-reasoning-animated [reasoningPart]=\"myPart\" />\n }\n }\n @default {\n @if (isStaticToolUIPart(myPart)) {\n @if (debugMode()) {\n <cortex-message-tool-call-part [toolCallPart]=\"myPart\" />\n } @else {\n <cortex-message-tool-call-animated [toolCallPart]=\"myPart\" [message]=\"message()\" />\n }\n } @else {\n <p class=\"cortex-unhandled-type\">Unhandled type: {{ part().type }}</p>\n }\n }\n}\n", styles: [".cortex-message-part{display:block}.cortex-message-part:empty{display:none}.cortex-message-part--animated{animation:cortex-part-fade-in-up .2s cubic-bezier(.34,1.56,.64,1) both}@keyframes cortex-part-fade-in-up{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.cortex-unhandled-type{text-align:center;font-size:.75rem;color:#94a3b8}\n"] }]
|
|
1123
|
+
}, template: "@let myPart = part();\n@switch (myPart.type) {\n @case ('text') {\n <cortex-message-text-part [textPart]=\"myPart\" [role]=\"message().role\" />\n }\n @case ('reasoning') {\n @if (debugMode()) {\n <cortex-message-reasoning-part [reasoningPart]=\"myPart\" />\n } @else {\n <cortex-message-reasoning-animated [reasoningPart]=\"myPart\" />\n }\n }\n @default {\n @if (isStaticToolUIPart(myPart)) {\n @if (debugMode()) {\n <cortex-message-tool-call-part [toolCallPart]=\"myPart\" />\n } @else {\n @switch (myPart.type) {\n @case ('tool-callEndpoint') {\n <cortex-tool-call-endpoint-animated />\n }\n @case ('tool-queryGraph') {\n <cortex-tool-query-graph-animated />\n }\n @case ('tool-executeCode') {\n <cortex-tool-execute-code-animated />\n }\n @default {\n <cortex-message-tool-call-animated [toolCallPart]=\"myPart\" [message]=\"message()\" />\n }\n }\n }\n } @else {\n <p class=\"cortex-unhandled-type\">Unhandled type: {{ part().type }}</p>\n }\n }\n}\n", styles: [".cortex-message-part{display:block}.cortex-message-part:empty{display:none}.cortex-message-part--animated{animation:cortex-part-fade-in-up .2s cubic-bezier(.34,1.56,.64,1) both}@keyframes cortex-part-fade-in-up{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.cortex-unhandled-type{text-align:center;font-size:.75rem;color:#94a3b8}\n"] }]
|
|
859
1124
|
}], propDecorators: { message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: true }] }], part: [{ type: i0.Input, args: [{ isSignal: true, alias: "part", required: true }] }], debugMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "debugMode", required: false }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }] } });
|
|
860
1125
|
|
|
861
1126
|
class MessageComponent {
|
|
862
1127
|
message = input.required(...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
|
|
863
1128
|
debugMode = input(false, ...(ngDevMode ? [{ debugName: "debugMode" }] : /* istanbul ignore next */ []));
|
|
864
1129
|
animate = input(false, ...(ngDevMode ? [{ debugName: "animate" }] : /* istanbul ignore next */ []));
|
|
865
|
-
visibleParts = computed(() => this.parts().filter((x) =>
|
|
1130
|
+
visibleParts = computed(() => this.parts().filter((x) => {
|
|
1131
|
+
if (x.type === 'step-start')
|
|
1132
|
+
return false;
|
|
1133
|
+
if (!this.debugMode() && this.isHiddenInAnimatedMode(x))
|
|
1134
|
+
return false;
|
|
1135
|
+
return true;
|
|
1136
|
+
}), ...(ngDevMode ? [{ debugName: "visibleParts" }] : /* istanbul ignore next */ []));
|
|
866
1137
|
parts = signal([], ...(ngDevMode ? [{ debugName: "parts" }] : /* istanbul ignore next */ []));
|
|
867
1138
|
constructor() {
|
|
868
1139
|
effect(() => {
|
|
@@ -894,10 +1165,21 @@ class MessageComponent {
|
|
|
894
1165
|
};
|
|
895
1166
|
});
|
|
896
1167
|
}
|
|
897
|
-
|
|
898
|
-
|
|
1168
|
+
isHiddenInAnimatedMode(part) {
|
|
1169
|
+
if (part.type === 'reasoning') {
|
|
1170
|
+
return part.state === 'done';
|
|
1171
|
+
}
|
|
1172
|
+
const specificTools = ['tool-callEndpoint', 'tool-queryGraph', 'tool-executeCode'];
|
|
1173
|
+
if (specificTools.includes(part.type)) {
|
|
1174
|
+
const state = part.state;
|
|
1175
|
+
return state === 'output-available' || state === 'output-error' || state === 'output-denied';
|
|
1176
|
+
}
|
|
1177
|
+
return false;
|
|
1178
|
+
}
|
|
1179
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1180
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: MessageComponent, isStandalone: true, selector: "cortex-message", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, debugMode: { classPropertyName: "debugMode", publicName: "debugMode", isSignal: true, isRequired: false, transformFunction: null }, animate: { classPropertyName: "animate", publicName: "animate", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "cortex-message" }, ngImport: i0, template: "@if (visibleParts().length) {\n <div class=\"cortex-message-parts\">\n @for (part of visibleParts(); track $index) {\n <cortex-message-part\n [part]=\"part\"\n [message]=\"message()\"\n [debugMode]=\"debugMode()\"\n [animate]=\"animate()\"\n />\n }\n </div>\n}\n", styles: [".cortex-message:empty{display:none}.cortex-message-parts{width:100%;display:flex;flex-direction:column;gap:.5rem}\n"], dependencies: [{ kind: "component", type: MessagePartComponent, selector: "cortex-message-part", inputs: ["message", "part", "debugMode", "animate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
899
1181
|
}
|
|
900
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1182
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageComponent, decorators: [{
|
|
901
1183
|
type: Component,
|
|
902
1184
|
args: [{ selector: 'cortex-message', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [MessagePartComponent], host: { class: 'cortex-message' }, template: "@if (visibleParts().length) {\n <div class=\"cortex-message-parts\">\n @for (part of visibleParts(); track $index) {\n <cortex-message-part\n [part]=\"part\"\n [message]=\"message()\"\n [debugMode]=\"debugMode()\"\n [animate]=\"animate()\"\n />\n }\n </div>\n}\n", styles: [".cortex-message:empty{display:none}.cortex-message-parts{width:100%;display:flex;flex-direction:column;gap:.5rem}\n"] }]
|
|
903
1185
|
}], ctorParameters: () => [], propDecorators: { message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: true }] }], debugMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "debugMode", required: false }] }], animate: [{ type: i0.Input, args: [{ isSignal: true, alias: "animate", required: false }] }] } });
|
|
@@ -951,10 +1233,10 @@ class MessageListComponent {
|
|
|
951
1233
|
el.scrollTop = el.scrollHeight;
|
|
952
1234
|
}
|
|
953
1235
|
}
|
|
954
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
955
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1236
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageListComponent, deps: [{ token: CortexChatService }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1237
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: MessageListComponent, isStandalone: true, selector: "cortex-message-list", inputs: { debugMode: { classPropertyName: "debugMode", publicName: "debugMode", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "messagesContainer", first: true, predicate: ["messagesContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"cortex-message-list\" #messagesContainer (scroll)=\"onScroll()\">\n @for (message of chatService.chat()?.messages; track message.id) {\n <cortex-message [message]=\"message\" [debugMode]=\"debugMode()\" [animate]=\"animateNewParts()\" />\n }\n</div>\n", styles: [".cortex-message-list{height:100%;overflow-y:auto;width:100%;display:flex;flex-direction:column;gap:.5rem;padding:1rem}\n"], dependencies: [{ kind: "component", type: MessageComponent, selector: "cortex-message", inputs: ["message", "debugMode", "animate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
956
1238
|
}
|
|
957
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1239
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: MessageListComponent, decorators: [{
|
|
958
1240
|
type: Component,
|
|
959
1241
|
args: [{ selector: 'cortex-message-list', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [MessageComponent], template: "<div class=\"cortex-message-list\" #messagesContainer (scroll)=\"onScroll()\">\n @for (message of chatService.chat()?.messages; track message.id) {\n <cortex-message [message]=\"message\" [debugMode]=\"debugMode()\" [animate]=\"animateNewParts()\" />\n }\n</div>\n", styles: [".cortex-message-list{height:100%;overflow-y:auto;width:100%;display:flex;flex-direction:column;gap:.5rem;padding:1rem}\n"] }]
|
|
960
1242
|
}], ctorParameters: () => [{ type: CortexChatService }, { type: i0.DestroyRef }], propDecorators: { debugMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "debugMode", required: false }] }], messagesContainer: [{ type: i0.ViewChild, args: ['messagesContainer', { isSignal: true }] }] } });
|
|
@@ -967,7 +1249,7 @@ var translate_new_chat$1 = "New Chat";
|
|
|
967
1249
|
var translate_normal$1 = "Normal";
|
|
968
1250
|
var translate_debug$1 = "Debug";
|
|
969
1251
|
var translate_type_a_message$1 = "Type a message...";
|
|
970
|
-
var translate_thinking$1 = "Thinking";
|
|
1252
|
+
var translate_thinking$1 = "Thinking things through...";
|
|
971
1253
|
var translate_reasoned$1 = "Reasoned";
|
|
972
1254
|
var translate_knowledge_graph_query$1 = "Knowledge Graph Query";
|
|
973
1255
|
var translate_javascript_code_execution$1 = "JavaScript Code Execution";
|
|
@@ -975,7 +1257,7 @@ var translate_completed$1 = "Completed";
|
|
|
975
1257
|
var translate_files_attached$1 = "{{count}} file(s) attached";
|
|
976
1258
|
var translate_file_upload_skipped$1 = "File upload skipped";
|
|
977
1259
|
var translate_cancel$1 = "Cancel";
|
|
978
|
-
var translate_uploading$1 = "Uploading
|
|
1260
|
+
var translate_uploading$1 = "Uploading...";
|
|
979
1261
|
var translate_submit$1 = "Submit";
|
|
980
1262
|
var translate_attach_requested_files$1 = "Attach requested files";
|
|
981
1263
|
var translate_n_files_required$1 = "{{count}} file(s) required";
|
|
@@ -983,16 +1265,16 @@ var translate_required$1 = "Required";
|
|
|
983
1265
|
var translate_submit_files$1 = "Submit files";
|
|
984
1266
|
var translate_choose_file$1 = "Choose file";
|
|
985
1267
|
var translate_no_file_chosen$1 = "No file chosen";
|
|
986
|
-
var translate_tool_status_0$1 = "Fetching data
|
|
987
|
-
var translate_tool_status_1$1 = "Analyzing information
|
|
988
|
-
var translate_tool_status_2$1 = "Processing request
|
|
989
|
-
var translate_tool_status_3$1 = "Gathering results
|
|
990
|
-
var translate_tool_status_4$1 = "Preparing response
|
|
991
|
-
var translate_tool_status_5$1 = "Looking things up
|
|
992
|
-
var translate_tool_status_6$1 = "Checking records
|
|
993
|
-
var translate_tool_status_7$1 = "Reviewing details
|
|
994
|
-
var translate_tool_status_8$1 = "Running calculations
|
|
995
|
-
var translate_tool_status_9$1 = "Pulling information
|
|
1268
|
+
var translate_tool_status_0$1 = "Fetching data...";
|
|
1269
|
+
var translate_tool_status_1$1 = "Analyzing information...";
|
|
1270
|
+
var translate_tool_status_2$1 = "Processing request...";
|
|
1271
|
+
var translate_tool_status_3$1 = "Gathering results...";
|
|
1272
|
+
var translate_tool_status_4$1 = "Preparing response...";
|
|
1273
|
+
var translate_tool_status_5$1 = "Looking things up...";
|
|
1274
|
+
var translate_tool_status_6$1 = "Checking records...";
|
|
1275
|
+
var translate_tool_status_7$1 = "Reviewing details...";
|
|
1276
|
+
var translate_tool_status_8$1 = "Running calculations...";
|
|
1277
|
+
var translate_tool_status_9$1 = "Pulling information...";
|
|
996
1278
|
var translate_tool_done_0$1 = "Data fetched successfully";
|
|
997
1279
|
var translate_tool_done_1$1 = "Analysis completed successfully";
|
|
998
1280
|
var translate_tool_done_2$1 = "Request processed successfully";
|
|
@@ -1005,6 +1287,46 @@ var translate_tool_done_8$1 = "Calculations completed successfully";
|
|
|
1005
1287
|
var translate_tool_done_9$1 = "Information retrieved successfully";
|
|
1006
1288
|
var translate_tool_error$1 = "Something went wrong";
|
|
1007
1289
|
var translate_tool_denied$1 = "Cancelled";
|
|
1290
|
+
var translate_endpoint_0$1 = "Looking things up...";
|
|
1291
|
+
var translate_endpoint_1$1 = "Checking the details...";
|
|
1292
|
+
var translate_endpoint_2$1 = "Pulling up the records...";
|
|
1293
|
+
var translate_endpoint_3$1 = "Getting the latest info...";
|
|
1294
|
+
var translate_endpoint_4$1 = "Searching through the system...";
|
|
1295
|
+
var translate_endpoint_5$1 = "Finding what you need...";
|
|
1296
|
+
var translate_endpoint_6$1 = "Gathering the details...";
|
|
1297
|
+
var translate_endpoint_7$1 = "Loading your information...";
|
|
1298
|
+
var translate_endpoint_8$1 = "Fetching the latest updates...";
|
|
1299
|
+
var translate_endpoint_9$1 = "Retrieving your data...";
|
|
1300
|
+
var translate_graph_0$1 = "Exploring connections...";
|
|
1301
|
+
var translate_graph_1$1 = "Mapping out the links...";
|
|
1302
|
+
var translate_graph_2$1 = "Discovering relationships...";
|
|
1303
|
+
var translate_graph_3$1 = "Tracing the connections...";
|
|
1304
|
+
var translate_graph_4$1 = "Navigating the knowledge...";
|
|
1305
|
+
var translate_graph_5$1 = "Uncovering insights...";
|
|
1306
|
+
var translate_graph_6$1 = "Connecting the dots...";
|
|
1307
|
+
var translate_graph_7$1 = "Following the trail...";
|
|
1308
|
+
var translate_graph_8$1 = "Piecing things together...";
|
|
1309
|
+
var translate_graph_9$1 = "Building the picture...";
|
|
1310
|
+
var translate_code_0$1 = "Running the numbers...";
|
|
1311
|
+
var translate_code_1$1 = "Working through the data...";
|
|
1312
|
+
var translate_code_2$1 = "Processing your request...";
|
|
1313
|
+
var translate_code_3$1 = "Crunching the figures...";
|
|
1314
|
+
var translate_code_4$1 = "Putting it all together...";
|
|
1315
|
+
var translate_code_5$1 = "Analyzing the results...";
|
|
1316
|
+
var translate_code_6$1 = "Working behind the scenes...";
|
|
1317
|
+
var translate_code_7$1 = "Sorting through the details...";
|
|
1318
|
+
var translate_code_8$1 = "Preparing your answer...";
|
|
1319
|
+
var translate_code_9$1 = "Almost ready...";
|
|
1320
|
+
var translate_reasoning_0$1 = "Thinking it through...";
|
|
1321
|
+
var translate_reasoning_1$1 = "Considering the options...";
|
|
1322
|
+
var translate_reasoning_2$1 = "Weighing the possibilities...";
|
|
1323
|
+
var translate_reasoning_3$1 = "Reflecting on this...";
|
|
1324
|
+
var translate_reasoning_4$1 = "Working it out...";
|
|
1325
|
+
var translate_reasoning_5$1 = "Putting thoughts together...";
|
|
1326
|
+
var translate_reasoning_6$1 = "Mulling it over...";
|
|
1327
|
+
var translate_reasoning_7$1 = "Finding the best approach...";
|
|
1328
|
+
var translate_reasoning_8$1 = "Organizing my thoughts...";
|
|
1329
|
+
var translate_reasoning_9$1 = "Almost there...";
|
|
1008
1330
|
var en = {
|
|
1009
1331
|
translate_new: translate_new$1,
|
|
1010
1332
|
translate_threads: translate_threads$1,
|
|
@@ -1051,7 +1373,47 @@ var en = {
|
|
|
1051
1373
|
translate_tool_done_8: translate_tool_done_8$1,
|
|
1052
1374
|
translate_tool_done_9: translate_tool_done_9$1,
|
|
1053
1375
|
translate_tool_error: translate_tool_error$1,
|
|
1054
|
-
translate_tool_denied: translate_tool_denied$1
|
|
1376
|
+
translate_tool_denied: translate_tool_denied$1,
|
|
1377
|
+
translate_endpoint_0: translate_endpoint_0$1,
|
|
1378
|
+
translate_endpoint_1: translate_endpoint_1$1,
|
|
1379
|
+
translate_endpoint_2: translate_endpoint_2$1,
|
|
1380
|
+
translate_endpoint_3: translate_endpoint_3$1,
|
|
1381
|
+
translate_endpoint_4: translate_endpoint_4$1,
|
|
1382
|
+
translate_endpoint_5: translate_endpoint_5$1,
|
|
1383
|
+
translate_endpoint_6: translate_endpoint_6$1,
|
|
1384
|
+
translate_endpoint_7: translate_endpoint_7$1,
|
|
1385
|
+
translate_endpoint_8: translate_endpoint_8$1,
|
|
1386
|
+
translate_endpoint_9: translate_endpoint_9$1,
|
|
1387
|
+
translate_graph_0: translate_graph_0$1,
|
|
1388
|
+
translate_graph_1: translate_graph_1$1,
|
|
1389
|
+
translate_graph_2: translate_graph_2$1,
|
|
1390
|
+
translate_graph_3: translate_graph_3$1,
|
|
1391
|
+
translate_graph_4: translate_graph_4$1,
|
|
1392
|
+
translate_graph_5: translate_graph_5$1,
|
|
1393
|
+
translate_graph_6: translate_graph_6$1,
|
|
1394
|
+
translate_graph_7: translate_graph_7$1,
|
|
1395
|
+
translate_graph_8: translate_graph_8$1,
|
|
1396
|
+
translate_graph_9: translate_graph_9$1,
|
|
1397
|
+
translate_code_0: translate_code_0$1,
|
|
1398
|
+
translate_code_1: translate_code_1$1,
|
|
1399
|
+
translate_code_2: translate_code_2$1,
|
|
1400
|
+
translate_code_3: translate_code_3$1,
|
|
1401
|
+
translate_code_4: translate_code_4$1,
|
|
1402
|
+
translate_code_5: translate_code_5$1,
|
|
1403
|
+
translate_code_6: translate_code_6$1,
|
|
1404
|
+
translate_code_7: translate_code_7$1,
|
|
1405
|
+
translate_code_8: translate_code_8$1,
|
|
1406
|
+
translate_code_9: translate_code_9$1,
|
|
1407
|
+
translate_reasoning_0: translate_reasoning_0$1,
|
|
1408
|
+
translate_reasoning_1: translate_reasoning_1$1,
|
|
1409
|
+
translate_reasoning_2: translate_reasoning_2$1,
|
|
1410
|
+
translate_reasoning_3: translate_reasoning_3$1,
|
|
1411
|
+
translate_reasoning_4: translate_reasoning_4$1,
|
|
1412
|
+
translate_reasoning_5: translate_reasoning_5$1,
|
|
1413
|
+
translate_reasoning_6: translate_reasoning_6$1,
|
|
1414
|
+
translate_reasoning_7: translate_reasoning_7$1,
|
|
1415
|
+
translate_reasoning_8: translate_reasoning_8$1,
|
|
1416
|
+
translate_reasoning_9: translate_reasoning_9$1
|
|
1055
1417
|
};
|
|
1056
1418
|
|
|
1057
1419
|
var translate_new = "جديد";
|
|
@@ -1062,7 +1424,7 @@ var translate_new_chat = "محادثة جديدة";
|
|
|
1062
1424
|
var translate_normal = "عادي";
|
|
1063
1425
|
var translate_debug = "تصحيح";
|
|
1064
1426
|
var translate_type_a_message = "اكتب رسالة...";
|
|
1065
|
-
var translate_thinking = "
|
|
1427
|
+
var translate_thinking = "جارٍ معالجة الطلب...";
|
|
1066
1428
|
var translate_reasoned = "تم الاستنتاج";
|
|
1067
1429
|
var translate_knowledge_graph_query = "استعلام الرسم البياني المعرفي";
|
|
1068
1430
|
var translate_javascript_code_execution = "تنفيذ كود جافاسكريبت";
|
|
@@ -1100,6 +1462,46 @@ var translate_tool_done_8 = "تمت الحسابات بنجاح";
|
|
|
1100
1462
|
var translate_tool_done_9 = "تم استرجاع المعلومات بنجاح";
|
|
1101
1463
|
var translate_tool_error = "حدث خطأ";
|
|
1102
1464
|
var translate_tool_denied = "تم الإلغاء";
|
|
1465
|
+
var translate_endpoint_0 = "جارٍ البحث...";
|
|
1466
|
+
var translate_endpoint_1 = "جارٍ التحقق من التفاصيل...";
|
|
1467
|
+
var translate_endpoint_2 = "جارٍ استرجاع السجلات...";
|
|
1468
|
+
var translate_endpoint_3 = "جارٍ الحصول على آخر المعلومات...";
|
|
1469
|
+
var translate_endpoint_4 = "جارٍ البحث في النظام...";
|
|
1470
|
+
var translate_endpoint_5 = "جارٍ إيجاد ما تحتاجه...";
|
|
1471
|
+
var translate_endpoint_6 = "جارٍ تجميع التفاصيل...";
|
|
1472
|
+
var translate_endpoint_7 = "جارٍ تحميل معلوماتك...";
|
|
1473
|
+
var translate_endpoint_8 = "جارٍ جلب آخر التحديثات...";
|
|
1474
|
+
var translate_endpoint_9 = "جارٍ استرجاع بياناتك...";
|
|
1475
|
+
var translate_graph_0 = "جارٍ استكشاف الروابط...";
|
|
1476
|
+
var translate_graph_1 = "جارٍ رسم الخريطة...";
|
|
1477
|
+
var translate_graph_2 = "جارٍ اكتشاف العلاقات...";
|
|
1478
|
+
var translate_graph_3 = "جارٍ تتبع الروابط...";
|
|
1479
|
+
var translate_graph_4 = "جارٍ التنقل في المعرفة...";
|
|
1480
|
+
var translate_graph_5 = "جارٍ كشف الرؤى...";
|
|
1481
|
+
var translate_graph_6 = "جارٍ ربط النقاط...";
|
|
1482
|
+
var translate_graph_7 = "جارٍ تتبع المسار...";
|
|
1483
|
+
var translate_graph_8 = "جارٍ تجميع الأجزاء...";
|
|
1484
|
+
var translate_graph_9 = "جارٍ بناء الصورة...";
|
|
1485
|
+
var translate_code_0 = "جارٍ حساب الأرقام...";
|
|
1486
|
+
var translate_code_1 = "جارٍ معالجة البيانات...";
|
|
1487
|
+
var translate_code_2 = "جارٍ تنفيذ طلبك...";
|
|
1488
|
+
var translate_code_3 = "جارٍ تحليل الأرقام...";
|
|
1489
|
+
var translate_code_4 = "جارٍ تجميع كل شيء...";
|
|
1490
|
+
var translate_code_5 = "جارٍ تحليل النتائج...";
|
|
1491
|
+
var translate_code_6 = "جارٍ العمل خلف الكواليس...";
|
|
1492
|
+
var translate_code_7 = "جارٍ ترتيب التفاصيل...";
|
|
1493
|
+
var translate_code_8 = "جارٍ تحضير إجابتك...";
|
|
1494
|
+
var translate_code_9 = "أوشك على الانتهاء...";
|
|
1495
|
+
var translate_reasoning_0 = "جارٍ التفكير...";
|
|
1496
|
+
var translate_reasoning_1 = "جارٍ دراسة الخيارات...";
|
|
1497
|
+
var translate_reasoning_2 = "جارٍ تقييم الاحتمالات...";
|
|
1498
|
+
var translate_reasoning_3 = "جارٍ التأمل في هذا...";
|
|
1499
|
+
var translate_reasoning_4 = "جارٍ إيجاد الحل...";
|
|
1500
|
+
var translate_reasoning_5 = "جارٍ ترتيب الأفكار...";
|
|
1501
|
+
var translate_reasoning_6 = "جارٍ التمعن في الأمر...";
|
|
1502
|
+
var translate_reasoning_7 = "جارٍ إيجاد أفضل طريقة...";
|
|
1503
|
+
var translate_reasoning_8 = "جارٍ تنظيم أفكاري...";
|
|
1504
|
+
var translate_reasoning_9 = "أوشك على الانتهاء...";
|
|
1103
1505
|
var ar = {
|
|
1104
1506
|
translate_new: translate_new,
|
|
1105
1507
|
translate_threads: translate_threads,
|
|
@@ -1146,7 +1548,47 @@ var ar = {
|
|
|
1146
1548
|
translate_tool_done_8: translate_tool_done_8,
|
|
1147
1549
|
translate_tool_done_9: translate_tool_done_9,
|
|
1148
1550
|
translate_tool_error: translate_tool_error,
|
|
1149
|
-
translate_tool_denied: translate_tool_denied
|
|
1551
|
+
translate_tool_denied: translate_tool_denied,
|
|
1552
|
+
translate_endpoint_0: translate_endpoint_0,
|
|
1553
|
+
translate_endpoint_1: translate_endpoint_1,
|
|
1554
|
+
translate_endpoint_2: translate_endpoint_2,
|
|
1555
|
+
translate_endpoint_3: translate_endpoint_3,
|
|
1556
|
+
translate_endpoint_4: translate_endpoint_4,
|
|
1557
|
+
translate_endpoint_5: translate_endpoint_5,
|
|
1558
|
+
translate_endpoint_6: translate_endpoint_6,
|
|
1559
|
+
translate_endpoint_7: translate_endpoint_7,
|
|
1560
|
+
translate_endpoint_8: translate_endpoint_8,
|
|
1561
|
+
translate_endpoint_9: translate_endpoint_9,
|
|
1562
|
+
translate_graph_0: translate_graph_0,
|
|
1563
|
+
translate_graph_1: translate_graph_1,
|
|
1564
|
+
translate_graph_2: translate_graph_2,
|
|
1565
|
+
translate_graph_3: translate_graph_3,
|
|
1566
|
+
translate_graph_4: translate_graph_4,
|
|
1567
|
+
translate_graph_5: translate_graph_5,
|
|
1568
|
+
translate_graph_6: translate_graph_6,
|
|
1569
|
+
translate_graph_7: translate_graph_7,
|
|
1570
|
+
translate_graph_8: translate_graph_8,
|
|
1571
|
+
translate_graph_9: translate_graph_9,
|
|
1572
|
+
translate_code_0: translate_code_0,
|
|
1573
|
+
translate_code_1: translate_code_1,
|
|
1574
|
+
translate_code_2: translate_code_2,
|
|
1575
|
+
translate_code_3: translate_code_3,
|
|
1576
|
+
translate_code_4: translate_code_4,
|
|
1577
|
+
translate_code_5: translate_code_5,
|
|
1578
|
+
translate_code_6: translate_code_6,
|
|
1579
|
+
translate_code_7: translate_code_7,
|
|
1580
|
+
translate_code_8: translate_code_8,
|
|
1581
|
+
translate_code_9: translate_code_9,
|
|
1582
|
+
translate_reasoning_0: translate_reasoning_0,
|
|
1583
|
+
translate_reasoning_1: translate_reasoning_1,
|
|
1584
|
+
translate_reasoning_2: translate_reasoning_2,
|
|
1585
|
+
translate_reasoning_3: translate_reasoning_3,
|
|
1586
|
+
translate_reasoning_4: translate_reasoning_4,
|
|
1587
|
+
translate_reasoning_5: translate_reasoning_5,
|
|
1588
|
+
translate_reasoning_6: translate_reasoning_6,
|
|
1589
|
+
translate_reasoning_7: translate_reasoning_7,
|
|
1590
|
+
translate_reasoning_8: translate_reasoning_8,
|
|
1591
|
+
translate_reasoning_9: translate_reasoning_9
|
|
1150
1592
|
};
|
|
1151
1593
|
|
|
1152
1594
|
const translations = { en, ar };
|
|
@@ -1158,10 +1600,10 @@ class CortexClientTranslateLoader {
|
|
|
1158
1600
|
|
|
1159
1601
|
class CortexClientConfigRef {
|
|
1160
1602
|
config;
|
|
1161
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1162
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
1603
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexClientConfigRef, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1604
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexClientConfigRef });
|
|
1163
1605
|
}
|
|
1164
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1606
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexClientConfigRef, decorators: [{
|
|
1165
1607
|
type: Injectable
|
|
1166
1608
|
}] });
|
|
1167
1609
|
class CortexChatWidgetComponent {
|
|
@@ -1208,8 +1650,8 @@ class CortexChatWidgetComponent {
|
|
|
1208
1650
|
this.chatService.deselectThread();
|
|
1209
1651
|
this.screen.set('chat');
|
|
1210
1652
|
}
|
|
1211
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1212
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
1653
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexChatWidgetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1654
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: CortexChatWidgetComponent, isStandalone: true, selector: "cortex-chat-widget", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { text: "textChange" }, host: { classAttribute: "cortex-widget" }, providers: [
|
|
1213
1655
|
CortexClientConfigRef,
|
|
1214
1656
|
{
|
|
1215
1657
|
provide: CORTEX_CLIENT_CONFIG,
|
|
@@ -1221,9 +1663,9 @@ class CortexChatWidgetComponent {
|
|
|
1221
1663
|
fallbackLang: 'en',
|
|
1222
1664
|
loader: provideTranslateLoader(CortexClientTranslateLoader),
|
|
1223
1665
|
}),
|
|
1224
|
-
], ngImport: i0, template: "<div class=\"cortex-widget__container\">\n <!-- SCREEN 1: THREADS -->\n <div\n class=\"cortex-widget__screen\"\n [class.cortex-widget__screen--active]=\"screen() === 'threads'\"\n [class.cortex-widget__screen--left]=\"screen() !== 'threads'\"\n >\n <!-- Threads header -->\n <div class=\"cortex-widget__threads-header\">\n <div>\n <h2 class=\"cortex-widget__threads-title\">\n {{ 'translate_threads' | translate }}\n </h2>\n <p class=\"cortex-widget__threads-count\">\n {{\n 'translate_n_conversations' | translate: { count: chatService.threads()?.length ?? 0 }\n }}\n </p>\n </div>\n <button (click)=\"newChat()\" class=\"cortex-widget__new-chat-btn\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M8 3v10M3 8h10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_new' | translate }}\n </button>\n </div>\n\n <!-- Threads list -->\n <div class=\"cortex-widget__threads-list\">\n <!-- Threads loading skeleton -->\n @if (chatService.threads() === undefined) {\n @for (i of [1, 2, 3, 4]; track i) {\n <div class=\"cortex-widget__thread-skeleton\">\n <div class=\"cortex-skeleton cortex-widget__thread-skeleton-icon\"></div>\n <div class=\"cortex-widget__thread-skeleton-lines\">\n <div\n class=\"cortex-skeleton cortex-widget__thread-skeleton-line\"\n [style.width]=\"40 + i * 12 + '%'\"\n ></div>\n </div>\n </div>\n }\n } @else {\n @for (thread of chatService.threads(); track thread.id) {\n <button\n (click)=\"selectThread(thread)\"\n class=\"cortex-widget__thread-item\"\n [class.cortex-widget__thread-item--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <!-- Thread icon -->\n <div\n class=\"cortex-widget__thread-icon\"\n [class.cortex-widget__thread-icon--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n\n <!-- Thread info -->\n <div class=\"cortex-widget__thread-info\">\n <p\n class=\"cortex-widget__thread-title\"\n [class.cortex-widget__thread-title--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n {{ thread.title ?? ('translate_untitled' | translate) }}\n </p>\n </div>\n\n <!-- Delete button -->\n <button\n (click)=\"$event.stopPropagation(); chatService.deleteThread(thread.id).subscribe()\"\n class=\"cortex-widget__thread-delete\"\n [class.cortex-widget__thread-delete--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M4 4l8 8M12 4l-8 8\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </button>\n\n <!-- Arrow -->\n <svg\n class=\"cortex-widget__thread-arrow\"\n [class.cortex-widget__thread-arrow--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n d=\"M6 4l4 4-4 4\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n }\n\n @if (!chatService.threads()?.length) {\n <div class=\"cortex-widget__threads-empty\">\n <div class=\"cortex-widget__threads-empty-icon\">\n <svg\n width=\"18\"\n height=\"18\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__threads-empty-svg\"\n >\n <path\n d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n <p class=\"cortex-widget__threads-empty-title\">No threads yet</p>\n <p class=\"cortex-widget__threads-empty-subtitle\">Start a new conversation</p>\n </div>\n }\n }\n </div>\n </div>\n\n <!-- SCREEN 2: CHAT -->\n <div\n class=\"cortex-widget__screen\"\n [class.cortex-widget__screen--active]=\"screen() === 'chat'\"\n [class.cortex-widget__screen--right]=\"screen() !== 'chat'\"\n >\n <!-- Chat header -->\n <div class=\"cortex-widget__chat-header\">\n <!-- Back button -->\n <button (click)=\"goBack()\" class=\"cortex-widget__back-btn\">\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__back-icon\"\n >\n <path\n d=\"M10 3L5 8l5 5\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n\n <!-- Title -->\n <div class=\"cortex-widget__chat-title-wrap\">\n <p class=\"cortex-widget__chat-title\">\n {{ chatService.selectedThread()?.title ?? ('translate_new_chat' | translate) }}\n </p>\n </div>\n\n <!-- Debug toggle -->\n <button\n (click)=\"toggleDebugMode()\"\n class=\"cortex-widget__debug-btn\"\n [class.cortex-widget__debug-btn--on]=\"debugMode()\"\n [class.cortex-widget__debug-btn--off]=\"!debugMode()\"\n >\n {{ debugMode() ? ('translate_debug' | translate) : ('translate_normal' | translate) }}\n </button>\n </div>\n\n <!-- Messages loading skeleton -->\n @if (chatService.isLoadingMessages() && !chatService.isAgentWorking()) {\n <div class=\"cortex-widget__messages-skeleton\">\n <!-- User message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 13rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 9rem\"></div>\n </div>\n </div>\n <!-- Assistant message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 16rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 18rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 12rem\"></div>\n </div>\n </div>\n <!-- User message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 11rem\"></div>\n </div>\n </div>\n <!-- Assistant message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 14rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 15rem\"></div>\n </div>\n </div>\n </div>\n } @else {\n <!-- Messages area -->\n <cortex-message-list class=\"cortex-widget__messages\" [debugMode]=\"debugMode()\" />\n }\n\n <!-- Agent working indicator -->\n @if (chatService.isAgentWorking() && !chatService.hasPendingToolCalls()) {\n <div class=\"cortex-widget__working\">\n <div class=\"cortex-widget__working-dots\">\n <span class=\"cortex-working-dot\"></span>\n <span class=\"cortex-working-dot\"></span>\n <span class=\"cortex-working-dot\"></span>\n </div>\n <span class=\"cortex-widget__working-text\">{{ 'translate_thinking' | translate }}</span>\n </div>\n }\n\n <!-- Chat input (hidden during pending tool calls) -->\n @if (!chatService.hasPendingToolCalls()) {\n <div class=\"cortex-widget__input-area\">\n <div\n class=\"cortex-widget__input-box\"\n [class.cortex-widget__input-box--disabled]=\"chatService.isAgentWorking()\"\n [class.cortex-widget__input-box--enabled]=\"!chatService.isAgentWorking()\"\n >\n <textarea\n (keydown)=\"onKeydown($event)\"\n [(ngModel)]=\"text\"\n [placeholder]=\"\n chatService.isAgentWorking() ? '' : ('translate_type_a_message' | translate)\n \"\n [disabled]=\"chatService.isAgentWorking()\"\n rows=\"1\"\n class=\"cortex-widget__textarea\"\n [class.cortex-widget__textarea--disabled]=\"chatService.isAgentWorking()\"\n ></textarea>\n @if (chatService.isAgentWorking()) {\n <!-- Stop button -->\n <button (click)=\"chatService.abort()\" class=\"cortex-stop-btn\">\n <!-- Pulsing ring -->\n <span class=\"cortex-stop-btn__ring\"></span>\n <!-- Stop icon (rounded square) -->\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n class=\"cortex-stop-btn__icon\"\n >\n <rect x=\"1\" y=\"1\" width=\"10\" height=\"10\" rx=\"2.5\" fill=\"currentColor\" />\n </svg>\n </button>\n } @else {\n <!-- Send button -->\n <button\n (click)=\"send()\"\n class=\"cortex-widget__send-btn\"\n [class.cortex-widget__send-btn--empty]=\"!text().trim()\"\n [class.cortex-widget__send-btn--ready]=\"!!text().trim()\"\n >\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__send-icon\"\n >\n <path\n d=\"M3 8h10M9 4l4 4-4 4\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n }\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [".cortex-widget{display:block}.cortex-widget__container{width:100%;height:100%;position:relative;overflow:hidden}.cortex-widget__screen{position:absolute;inset:0;display:flex;flex-direction:column;transition:transform .3s ease-out}.cortex-widget__screen--active{transform:translate(0)}.cortex-widget__screen--left{transform:translate(-100%)}[dir=rtl] .cortex-widget__screen--left,.cortex-widget__screen--right{transform:translate(100%)}[dir=rtl] .cortex-widget__screen--right{transform:translate(-100%)}.cortex-widget__threads-header{flex-shrink:0;padding:1.25rem 1.25rem 1rem;display:flex;align-items:center;justify-content:space-between}.cortex-widget__threads-title{font-size:.9375rem;font-weight:600;color:#1e293b;letter-spacing:-.01em;margin:0}.cortex-widget__threads-count{font-size:.6875rem;color:#94a3b8;margin-top:.125rem;margin-bottom:0}.cortex-widget__new-chat-btn{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:500;color:#f1f5f9;background:#1e293b;padding:.375rem .75rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__new-chat-btn:hover{background:#334155}.cortex-widget__new-chat-btn:active{background:#0f172a}.cortex-widget__threads-list{flex:1;overflow-y:auto;padding:0 .75rem .75rem}.cortex-widget__thread-skeleton{display:flex;align-items:center;gap:.75rem;padding:.75rem;margin-bottom:.125rem}.cortex-widget__thread-skeleton-icon{flex-shrink:0;width:2rem;height:2rem}.cortex-widget__thread-skeleton-lines{flex:1;display:flex;flex-direction:column;gap:.375rem}.cortex-widget__thread-skeleton-line{height:.875rem}@keyframes cortex-skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.cortex-skeleton{background:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0 80%);background-size:200% 100%;animation:cortex-skeleton-shimmer 1.8s ease-in-out infinite;border-radius:6px}.cortex-widget__thread-item{width:100%;text-align:start;padding:.75rem;border-radius:.5rem;display:flex;align-items:center;gap:.75rem;transition:background-color .15s;cursor:pointer;margin-bottom:.125rem;border:0;background:transparent;color:#475569}.cortex-widget__thread-item:hover{background:#f1f5f9}.cortex-widget__thread-item:active{background:#e8ecf1}.cortex-widget__thread-item--active{background:#e2e8f0;color:#f1f5f9}.cortex-widget__thread-icon{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:600;background:#e2e8f0;color:#64748b}[dir=rtl] .cortex-widget__thread-icon{transform:rotate(180deg)}.cortex-widget__thread-icon--active{background:#334155;color:#cbd5e1}.cortex-widget__thread-info{min-width:0;flex:1}.cortex-widget__thread-title{font-size:.8125rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.25;margin:0;color:#334155}.cortex-widget__thread-title--active{color:#f1f5f9}.cortex-widget__thread-delete{flex-shrink:0;opacity:0;width:1.75rem;height:1.75rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .15s;background:transparent;border:0;color:#94a3b8}.cortex-widget__thread-item:hover>.cortex-widget__thread-delete{opacity:1}.cortex-widget__thread-delete:hover{background:#e2e8f0}.cortex-widget__thread-delete--active:hover{background:#475569}.cortex-widget__thread-arrow{flex-shrink:0;transition:color .15s;color:#cbd5e1}[dir=rtl] .cortex-widget__thread-arrow{transform:rotate(180deg)}.cortex-widget__thread-item:hover>.cortex-widget__thread-arrow{color:#94a3b8}.cortex-widget__thread-arrow--active{color:#64748b}.cortex-widget__threads-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;text-align:center}.cortex-widget__threads-empty-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;background:#e2e8f0;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.cortex-widget__threads-empty-svg{color:#94a3b8}.cortex-widget__threads-empty-title{font-size:.8125rem;color:#94a3b8;font-weight:500;margin:0}.cortex-widget__threads-empty-subtitle{font-size:.6875rem;color:#a5afbd;margin-top:.25rem;margin-bottom:0}.cortex-widget__chat-header{flex-shrink:0;height:3rem;padding:0 1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #e2e8f0;background:#fff}.cortex-widget__back-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;color:#94a3b8;background:transparent;border:0;cursor:pointer;transition:color .15s,background-color .15s}.cortex-widget__back-btn:hover{color:#475569;background:#f1f5f9}[dir=rtl] .cortex-widget__back-icon{transform:rotate(180deg)}.cortex-widget__chat-title-wrap{min-width:0;flex:1}.cortex-widget__chat-title{font-size:.8125rem;font-weight:500;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.cortex-widget__debug-btn{flex-shrink:0;font-size:.6875rem;font-weight:500;padding:.25rem .625rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__debug-btn--on{background:#fef3c7;color:#d97706}.cortex-widget__debug-btn--on:hover{background:#fde68a}.cortex-widget__debug-btn--off{background:#f1f5f9;color:#94a3b8}.cortex-widget__debug-btn--off:hover{background:#e2e8f0}.cortex-widget__messages-skeleton{flex:1;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel{width:100%;display:flex;flex-direction:column}.cortex-widget__msg-skel--user{align-items:flex-start}.cortex-widget__msg-skel--assistant{align-items:flex-end}.cortex-widget__msg-skel-bubble{max-width:80%;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel-bubble--user{background:#f8fafc;border-bottom-left-radius:0}.cortex-widget__msg-skel-bubble--assistant{background:#f1f5f9;border-bottom-right-radius:0}.cortex-widget__msg-skel-line{height:.75rem}.cortex-widget__messages{flex:1;overflow:hidden}.cortex-widget__working{flex-shrink:0;padding:.375rem 1rem;display:flex;align-items:center;gap:.375rem}.cortex-widget__working-dots{display:flex;align-items:center;gap:3px}@keyframes cortex-pulse{0%,to{opacity:.4}50%{opacity:1}}@keyframes cortex-dot-bounce{0%,80%,to{transform:translateY(0)}40%{transform:translateY(-3px)}}.cortex-working-dot{display:block;width:5px;height:5px;border-radius:9999px;background:#94a3b8;animation:cortex-pulse 1.6s ease-in-out infinite,cortex-dot-bounce 1.2s ease-in-out infinite}.cortex-working-dot:nth-child(2){animation-delay:.15s}.cortex-working-dot:nth-child(3){animation-delay:.3s}.cortex-widget__working-text{font-size:.6875rem;color:#94a3b8;font-weight:500}.cortex-widget__input-area{flex-shrink:0;padding:.75rem;background:#fff;border-top:1px solid #e2e8f0}.cortex-widget__input-box{display:flex;align-items:flex-end;gap:.5rem;border-radius:.75rem;border:1px solid #e2e8f0;padding:.375rem;transition:border-color .15s,background-color .15s}.cortex-widget__input-box--disabled{background:#f1f5f9}.cortex-widget__input-box--enabled{background:#f8fafc}.cortex-widget__input-box--enabled:focus-within{border-color:#cbd5e1;background:#fff}.cortex-widget__textarea{flex:1;background:transparent;resize:none;border:0;outline:none;font-size:.8125rem;padding:.375rem .5rem;min-height:28px;max-height:120px;line-height:1.375;color:#334155}.cortex-widget__textarea::placeholder{color:#a5afbd}.cortex-widget__textarea--disabled{color:#94a3b8;cursor:not-allowed}.cortex-widget__textarea:disabled{cursor:not-allowed;border:0}@keyframes cortex-stop-pulse-ring{0%{opacity:.45;transform:scale(1)}50%{opacity:.15;transform:scale(1.12)}to{opacity:.45;transform:scale(1)}}@keyframes cortex-stop-fade-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.cortex-stop-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;background:#e11d48;color:#fff;border:0;animation:cortex-stop-fade-in .2s ease-out both;transition:background .15s ease}.cortex-stop-btn:hover{background:#be123c}.cortex-stop-btn:active{transform:scale(.92)}.cortex-stop-btn__ring{position:absolute;inset:0;border-radius:.5rem;background:#e11d48;animation:cortex-stop-pulse-ring 2s ease-in-out infinite;pointer-events:none}.cortex-stop-btn__icon{position:relative;z-index:1}.cortex-widget__send-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;border:0;transition:background-color .15s}.cortex-widget__send-btn--empty{background:#e2e8f0;color:#94a3b8}.cortex-widget__send-btn--ready{background:#1e293b;color:#fff;cursor:pointer}.cortex-widget__send-btn--ready:hover{background:#334155}[dir=rtl] .cortex-widget__send-icon{transform:rotate(180deg)}\n"], dependencies: [{ kind: "component", type: MessageListComponent, selector: "cortex-message-list", inputs: ["debugMode"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1666
|
+
], ngImport: i0, template: "<div class=\"cortex-widget__container\">\n <!-- SCREEN 1: THREADS -->\n <div\n class=\"cortex-widget__screen\"\n [class.cortex-widget__screen--active]=\"screen() === 'threads'\"\n [class.cortex-widget__screen--left]=\"screen() !== 'threads'\"\n >\n <!-- Threads header -->\n <div class=\"cortex-widget__threads-header\">\n <div>\n <h2 class=\"cortex-widget__threads-title\">\n {{ 'translate_threads' | translate }}\n </h2>\n <p class=\"cortex-widget__threads-count\">\n {{\n 'translate_n_conversations' | translate: { count: chatService.threads()?.length ?? 0 }\n }}\n </p>\n </div>\n <button (click)=\"newChat()\" class=\"cortex-widget__new-chat-btn\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M8 3v10M3 8h10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_new' | translate }}\n </button>\n </div>\n\n <!-- Threads list -->\n <div class=\"cortex-widget__threads-list\">\n <!-- Threads loading skeleton -->\n @if (chatService.threads() === undefined) {\n @for (i of [1, 2, 3, 4]; track i) {\n <div class=\"cortex-widget__thread-skeleton\">\n <div class=\"cortex-skeleton cortex-widget__thread-skeleton-icon\"></div>\n <div class=\"cortex-widget__thread-skeleton-lines\">\n <div\n class=\"cortex-skeleton cortex-widget__thread-skeleton-line\"\n [style.width]=\"40 + i * 12 + '%'\"\n ></div>\n </div>\n </div>\n }\n } @else {\n @for (thread of chatService.threads(); track thread.id) {\n <button\n (click)=\"selectThread(thread)\"\n class=\"cortex-widget__thread-item\"\n [class.cortex-widget__thread-item--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <!-- Thread icon -->\n <div\n class=\"cortex-widget__thread-icon\"\n [class.cortex-widget__thread-icon--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n\n <!-- Thread info -->\n <div class=\"cortex-widget__thread-info\">\n <p\n class=\"cortex-widget__thread-title\"\n [class.cortex-widget__thread-title--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n {{ thread.title ?? ('translate_untitled' | translate) }}\n </p>\n </div>\n\n <!-- Delete button -->\n <button\n (click)=\"$event.stopPropagation(); chatService.deleteThread(thread.id).subscribe()\"\n class=\"cortex-widget__thread-delete\"\n [class.cortex-widget__thread-delete--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M4 4l8 8M12 4l-8 8\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </button>\n\n <!-- Arrow -->\n <svg\n class=\"cortex-widget__thread-arrow\"\n [class.cortex-widget__thread-arrow--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n d=\"M6 4l4 4-4 4\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n }\n\n @if (!chatService.threads()?.length) {\n <div class=\"cortex-widget__threads-empty\">\n <div class=\"cortex-widget__threads-empty-icon\">\n <svg\n width=\"18\"\n height=\"18\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__threads-empty-svg\"\n >\n <path\n d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n <p class=\"cortex-widget__threads-empty-title\">No threads yet</p>\n <p class=\"cortex-widget__threads-empty-subtitle\">Start a new conversation</p>\n </div>\n }\n }\n </div>\n </div>\n\n <!-- SCREEN 2: CHAT -->\n <div\n class=\"cortex-widget__screen\"\n [class.cortex-widget__screen--active]=\"screen() === 'chat'\"\n [class.cortex-widget__screen--right]=\"screen() !== 'chat'\"\n >\n <!-- Chat header -->\n <div class=\"cortex-widget__chat-header\">\n <!-- Back button -->\n <button (click)=\"goBack()\" class=\"cortex-widget__back-btn\">\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__back-icon\"\n >\n <path\n d=\"M10 3L5 8l5 5\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n\n <!-- Title -->\n <div class=\"cortex-widget__chat-title-wrap\">\n <p class=\"cortex-widget__chat-title\">\n {{ chatService.selectedThread()?.title ?? ('translate_new_chat' | translate) }}\n </p>\n </div>\n\n <!-- Debug toggle -->\n <button\n (click)=\"toggleDebugMode()\"\n class=\"cortex-widget__debug-btn\"\n [class.cortex-widget__debug-btn--on]=\"debugMode()\"\n [class.cortex-widget__debug-btn--off]=\"!debugMode()\"\n >\n {{ debugMode() ? ('translate_debug' | translate) : ('translate_normal' | translate) }}\n </button>\n </div>\n\n <!-- Messages loading skeleton -->\n @if (chatService.isLoadingMessages() && !chatService.isAgentWorking()) {\n <div class=\"cortex-widget__messages-skeleton\">\n <!-- User message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 13rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 9rem\"></div>\n </div>\n </div>\n <!-- Assistant message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 16rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 18rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 12rem\"></div>\n </div>\n </div>\n <!-- User message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 11rem\"></div>\n </div>\n </div>\n <!-- Assistant message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 14rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 15rem\"></div>\n </div>\n </div>\n </div>\n } @else {\n <!-- Messages area -->\n <cortex-message-list class=\"cortex-widget__messages\" [debugMode]=\"debugMode()\" />\n }\n\n <!-- Agent working indicator -->\n @if (chatService.isAgentWorking() && !chatService.hasPendingToolCalls()) {\n <div class=\"cortex-widget__working\">\n <div class=\"cortex-widget__working-dots\">\n <span class=\"cortex-working-dot\"></span>\n <span class=\"cortex-working-dot\"></span>\n <span class=\"cortex-working-dot\"></span>\n </div>\n <span class=\"cortex-widget__working-text\">{{ 'translate_thinking' | translate }}</span>\n </div>\n }\n\n <!-- Chat input (hidden during pending tool calls) -->\n @if (!chatService.hasPendingToolCalls()) {\n <div class=\"cortex-widget__input-area\">\n <div\n class=\"cortex-widget__input-box\"\n [class.cortex-widget__input-box--disabled]=\"chatService.isAgentWorking()\"\n [class.cortex-widget__input-box--enabled]=\"!chatService.isAgentWorking()\"\n >\n <textarea\n (keydown)=\"onKeydown($event)\"\n [(ngModel)]=\"text\"\n [placeholder]=\"\n chatService.isAgentWorking() ? '' : ('translate_type_a_message' | translate)\n \"\n [disabled]=\"chatService.isAgentWorking()\"\n rows=\"1\"\n class=\"cortex-widget__textarea\"\n [class.cortex-widget__textarea--disabled]=\"chatService.isAgentWorking()\"\n ></textarea>\n @if (chatService.isAgentWorking()) {\n <!-- Stop button -->\n <button (click)=\"chatService.abort()\" class=\"cortex-stop-btn\">\n <!-- Pulsing ring -->\n <span class=\"cortex-stop-btn__ring\"></span>\n <!-- Stop icon (rounded square) -->\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n class=\"cortex-stop-btn__icon\"\n >\n <rect x=\"1\" y=\"1\" width=\"10\" height=\"10\" rx=\"2.5\" fill=\"currentColor\" />\n </svg>\n </button>\n } @else {\n <!-- Send button -->\n <button\n (click)=\"send()\"\n class=\"cortex-widget__send-btn\"\n [class.cortex-widget__send-btn--empty]=\"!text().trim()\"\n [class.cortex-widget__send-btn--ready]=\"!!text().trim()\"\n >\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__send-icon\"\n >\n <path\n d=\"M3 8h10M9 4l4 4-4 4\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n }\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [".cortex-widget{display:block}.cortex-widget__container{width:100%;height:100%;position:relative;overflow:hidden}.cortex-widget__screen{position:absolute;inset:0;display:flex;flex-direction:column;transition:transform .3s ease-out}.cortex-widget__screen--active{transform:translate(0)}.cortex-widget__screen--left{transform:translate(-100%)}[dir=rtl] .cortex-widget__screen--left,.cortex-widget__screen--right{transform:translate(100%)}[dir=rtl] .cortex-widget__screen--right{transform:translate(-100%)}.cortex-widget__threads-header{flex-shrink:0;padding:1.25rem 1.25rem 1rem;display:flex;align-items:center;justify-content:space-between}.cortex-widget__threads-title{font-size:.9375rem;font-weight:600;color:#1e293b;letter-spacing:-.01em;margin:0}.cortex-widget__threads-count{font-size:.6875rem;color:#94a3b8;margin-top:.125rem;margin-bottom:0}.cortex-widget__new-chat-btn{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:500;color:#f1f5f9;background:#1e293b;padding:.375rem .75rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__new-chat-btn:hover{background:#334155}.cortex-widget__new-chat-btn:active{background:#0f172a}.cortex-widget__threads-list{flex:1;overflow-y:auto;padding:0 .75rem .75rem}.cortex-widget__thread-skeleton{display:flex;align-items:center;gap:.75rem;padding:.75rem;margin-bottom:.125rem}.cortex-widget__thread-skeleton-icon{flex-shrink:0;width:2rem;height:2rem}.cortex-widget__thread-skeleton-lines{flex:1;display:flex;flex-direction:column;gap:.375rem}.cortex-widget__thread-skeleton-line{height:.875rem}@keyframes cortex-skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.cortex-skeleton{background:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0 80%);background-size:200% 100%;animation:cortex-skeleton-shimmer 1.8s ease-in-out infinite;border-radius:6px}.cortex-widget__thread-item{width:100%;text-align:start;padding:.75rem;border-radius:.5rem;display:flex;align-items:center;gap:.75rem;transition:background-color .15s;cursor:pointer;margin-bottom:.125rem;border:0;background:transparent;color:#475569}.cortex-widget__thread-item:hover{background:#f1f5f9}.cortex-widget__thread-item:active{background:#e8ecf1}.cortex-widget__thread-item--active{background:#e2e8f0;color:#f1f5f9}.cortex-widget__thread-icon{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:600;background:#e2e8f0;color:#64748b}[dir=rtl] .cortex-widget__thread-icon{transform:rotate(180deg)}.cortex-widget__thread-icon--active{background:#334155;color:#cbd5e1}.cortex-widget__thread-info{min-width:0;flex:1}.cortex-widget__thread-title{font-size:.8125rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.25;margin:0;color:#334155}.cortex-widget__thread-title--active{color:#f1f5f9}.cortex-widget__thread-delete{flex-shrink:0;opacity:0;width:1.75rem;height:1.75rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .15s;background:transparent;border:0;color:#94a3b8}.cortex-widget__thread-item:hover>.cortex-widget__thread-delete{opacity:1}.cortex-widget__thread-delete:hover{background:#e2e8f0}.cortex-widget__thread-delete--active:hover{background:#475569}.cortex-widget__thread-arrow{flex-shrink:0;transition:color .15s;color:#cbd5e1}[dir=rtl] .cortex-widget__thread-arrow{transform:rotate(180deg)}.cortex-widget__thread-item:hover>.cortex-widget__thread-arrow{color:#94a3b8}.cortex-widget__thread-arrow--active{color:#64748b}.cortex-widget__threads-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;text-align:center}.cortex-widget__threads-empty-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;background:#e2e8f0;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.cortex-widget__threads-empty-svg{color:#94a3b8}.cortex-widget__threads-empty-title{font-size:.8125rem;color:#94a3b8;font-weight:500;margin:0}.cortex-widget__threads-empty-subtitle{font-size:.6875rem;color:#a5afbd;margin-top:.25rem;margin-bottom:0}.cortex-widget__chat-header{flex-shrink:0;height:3rem;padding:0 1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #e2e8f0;background:#fff}.cortex-widget__back-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;color:#94a3b8;background:transparent;border:0;cursor:pointer;transition:color .15s,background-color .15s}.cortex-widget__back-btn:hover{color:#475569;background:#f1f5f9}[dir=rtl] .cortex-widget__back-icon{transform:rotate(180deg)}.cortex-widget__chat-title-wrap{min-width:0;flex:1}.cortex-widget__chat-title{font-size:.8125rem;font-weight:500;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.cortex-widget__debug-btn{flex-shrink:0;font-size:.6875rem;font-weight:500;padding:.25rem .625rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__debug-btn--on{background:#fef3c7;color:#d97706}.cortex-widget__debug-btn--on:hover{background:#fde68a}.cortex-widget__debug-btn--off{background:#f1f5f9;color:#94a3b8}.cortex-widget__debug-btn--off:hover{background:#e2e8f0}.cortex-widget__messages-skeleton{flex:1;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel{width:100%;display:flex;flex-direction:column}.cortex-widget__msg-skel--user{align-items:flex-end}.cortex-widget__msg-skel--assistant{align-items:flex-start}.cortex-widget__msg-skel-bubble{max-width:80%;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel-bubble--user{background:#f8fafc;border-bottom-right-radius:0}.cortex-widget__msg-skel-bubble--assistant{background:#f1f5f9;border-bottom-left-radius:0}.cortex-widget__msg-skel-line{height:.75rem}.cortex-widget__messages{flex:1;overflow:hidden}@keyframes cortex-working-slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes cortex-dot-wave{0%,60%,to{transform:translateY(0) scale(1);opacity:.45}30%{transform:translateY(-5px) scale(1.2);opacity:1}}@keyframes cortex-working-shimmer{0%{background-position:-200% center}to{background-position:200% center}}.cortex-widget__working{flex-shrink:0;padding:.5rem 1rem;display:flex;align-items:center;gap:.5rem;animation:cortex-working-slide-in .25s ease-out both}.cortex-widget__working-dots{display:flex;align-items:center;gap:4px}.cortex-working-dot{display:block;width:6px;height:6px;border-radius:9999px;background:#22c55e;animation:cortex-dot-wave 1.4s ease-in-out infinite}.cortex-working-dot:nth-child(2){animation-delay:.15s}.cortex-working-dot:nth-child(3){animation-delay:.3s}.cortex-widget__working-text{font-size:.75rem;font-weight:500;letter-spacing:.01em;color:#16a34a}.cortex-widget__input-area{flex-shrink:0;padding:.75rem;background:#fff;border-top:1px solid #e2e8f0}.cortex-widget__input-box{display:flex;align-items:flex-end;gap:.5rem;border-radius:.75rem;border:1px solid #e2e8f0;padding:.375rem;transition:border-color .15s,background-color .15s}.cortex-widget__input-box--disabled{background:#f1f5f9}.cortex-widget__input-box--enabled{background:#f8fafc}.cortex-widget__input-box--enabled:focus-within{border-color:#cbd5e1;background:#fff}.cortex-widget__textarea{flex:1;background:transparent;resize:none;border:0;outline:none;font-size:.8125rem;padding:.375rem .5rem;min-height:28px;max-height:120px;line-height:1.375;color:#334155}.cortex-widget__textarea::placeholder{color:#a5afbd}.cortex-widget__textarea--disabled{color:#94a3b8;cursor:not-allowed}.cortex-widget__textarea:disabled{cursor:not-allowed;border:0}@keyframes cortex-stop-pulse-ring{0%{opacity:.45;transform:scale(1)}50%{opacity:.15;transform:scale(1.12)}to{opacity:.45;transform:scale(1)}}@keyframes cortex-stop-fade-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.cortex-stop-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;background:#e11d48;color:#fff;border:0;animation:cortex-stop-fade-in .2s ease-out both;transition:background .15s ease}.cortex-stop-btn:hover{background:#be123c}.cortex-stop-btn:active{transform:scale(.92)}.cortex-stop-btn__ring{position:absolute;inset:0;border-radius:.5rem;background:#e11d48;animation:cortex-stop-pulse-ring 2s ease-in-out infinite;pointer-events:none}.cortex-stop-btn__icon{position:relative;z-index:1}.cortex-widget__send-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;border:0;transition:background-color .15s}.cortex-widget__send-btn--empty{background:#e2e8f0;color:#94a3b8}.cortex-widget__send-btn--ready{background:#1e293b;color:#fff;cursor:pointer}.cortex-widget__send-btn--ready:hover{background:#334155}[dir=rtl] .cortex-widget__send-icon{transform:rotate(180deg)}\n"], dependencies: [{ kind: "component", type: MessageListComponent, selector: "cortex-message-list", inputs: ["debugMode"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1225
1667
|
}
|
|
1226
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1668
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: CortexChatWidgetComponent, decorators: [{
|
|
1227
1669
|
type: Component,
|
|
1228
1670
|
args: [{ selector: 'cortex-chat-widget', imports: [MessageListComponent, FormsModule, TranslatePipe], providers: [
|
|
1229
1671
|
CortexClientConfigRef,
|
|
@@ -1237,7 +1679,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImpor
|
|
|
1237
1679
|
fallbackLang: 'en',
|
|
1238
1680
|
loader: provideTranslateLoader(CortexClientTranslateLoader),
|
|
1239
1681
|
}),
|
|
1240
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'cortex-widget' }, template: "<div class=\"cortex-widget__container\">\n <!-- SCREEN 1: THREADS -->\n <div\n class=\"cortex-widget__screen\"\n [class.cortex-widget__screen--active]=\"screen() === 'threads'\"\n [class.cortex-widget__screen--left]=\"screen() !== 'threads'\"\n >\n <!-- Threads header -->\n <div class=\"cortex-widget__threads-header\">\n <div>\n <h2 class=\"cortex-widget__threads-title\">\n {{ 'translate_threads' | translate }}\n </h2>\n <p class=\"cortex-widget__threads-count\">\n {{\n 'translate_n_conversations' | translate: { count: chatService.threads()?.length ?? 0 }\n }}\n </p>\n </div>\n <button (click)=\"newChat()\" class=\"cortex-widget__new-chat-btn\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M8 3v10M3 8h10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_new' | translate }}\n </button>\n </div>\n\n <!-- Threads list -->\n <div class=\"cortex-widget__threads-list\">\n <!-- Threads loading skeleton -->\n @if (chatService.threads() === undefined) {\n @for (i of [1, 2, 3, 4]; track i) {\n <div class=\"cortex-widget__thread-skeleton\">\n <div class=\"cortex-skeleton cortex-widget__thread-skeleton-icon\"></div>\n <div class=\"cortex-widget__thread-skeleton-lines\">\n <div\n class=\"cortex-skeleton cortex-widget__thread-skeleton-line\"\n [style.width]=\"40 + i * 12 + '%'\"\n ></div>\n </div>\n </div>\n }\n } @else {\n @for (thread of chatService.threads(); track thread.id) {\n <button\n (click)=\"selectThread(thread)\"\n class=\"cortex-widget__thread-item\"\n [class.cortex-widget__thread-item--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <!-- Thread icon -->\n <div\n class=\"cortex-widget__thread-icon\"\n [class.cortex-widget__thread-icon--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n\n <!-- Thread info -->\n <div class=\"cortex-widget__thread-info\">\n <p\n class=\"cortex-widget__thread-title\"\n [class.cortex-widget__thread-title--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n {{ thread.title ?? ('translate_untitled' | translate) }}\n </p>\n </div>\n\n <!-- Delete button -->\n <button\n (click)=\"$event.stopPropagation(); chatService.deleteThread(thread.id).subscribe()\"\n class=\"cortex-widget__thread-delete\"\n [class.cortex-widget__thread-delete--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M4 4l8 8M12 4l-8 8\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </button>\n\n <!-- Arrow -->\n <svg\n class=\"cortex-widget__thread-arrow\"\n [class.cortex-widget__thread-arrow--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n d=\"M6 4l4 4-4 4\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n }\n\n @if (!chatService.threads()?.length) {\n <div class=\"cortex-widget__threads-empty\">\n <div class=\"cortex-widget__threads-empty-icon\">\n <svg\n width=\"18\"\n height=\"18\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__threads-empty-svg\"\n >\n <path\n d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n <p class=\"cortex-widget__threads-empty-title\">No threads yet</p>\n <p class=\"cortex-widget__threads-empty-subtitle\">Start a new conversation</p>\n </div>\n }\n }\n </div>\n </div>\n\n <!-- SCREEN 2: CHAT -->\n <div\n class=\"cortex-widget__screen\"\n [class.cortex-widget__screen--active]=\"screen() === 'chat'\"\n [class.cortex-widget__screen--right]=\"screen() !== 'chat'\"\n >\n <!-- Chat header -->\n <div class=\"cortex-widget__chat-header\">\n <!-- Back button -->\n <button (click)=\"goBack()\" class=\"cortex-widget__back-btn\">\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__back-icon\"\n >\n <path\n d=\"M10 3L5 8l5 5\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n\n <!-- Title -->\n <div class=\"cortex-widget__chat-title-wrap\">\n <p class=\"cortex-widget__chat-title\">\n {{ chatService.selectedThread()?.title ?? ('translate_new_chat' | translate) }}\n </p>\n </div>\n\n <!-- Debug toggle -->\n <button\n (click)=\"toggleDebugMode()\"\n class=\"cortex-widget__debug-btn\"\n [class.cortex-widget__debug-btn--on]=\"debugMode()\"\n [class.cortex-widget__debug-btn--off]=\"!debugMode()\"\n >\n {{ debugMode() ? ('translate_debug' | translate) : ('translate_normal' | translate) }}\n </button>\n </div>\n\n <!-- Messages loading skeleton -->\n @if (chatService.isLoadingMessages() && !chatService.isAgentWorking()) {\n <div class=\"cortex-widget__messages-skeleton\">\n <!-- User message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 13rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 9rem\"></div>\n </div>\n </div>\n <!-- Assistant message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 16rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 18rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 12rem\"></div>\n </div>\n </div>\n <!-- User message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 11rem\"></div>\n </div>\n </div>\n <!-- Assistant message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 14rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 15rem\"></div>\n </div>\n </div>\n </div>\n } @else {\n <!-- Messages area -->\n <cortex-message-list class=\"cortex-widget__messages\" [debugMode]=\"debugMode()\" />\n }\n\n <!-- Agent working indicator -->\n @if (chatService.isAgentWorking() && !chatService.hasPendingToolCalls()) {\n <div class=\"cortex-widget__working\">\n <div class=\"cortex-widget__working-dots\">\n <span class=\"cortex-working-dot\"></span>\n <span class=\"cortex-working-dot\"></span>\n <span class=\"cortex-working-dot\"></span>\n </div>\n <span class=\"cortex-widget__working-text\">{{ 'translate_thinking' | translate }}</span>\n </div>\n }\n\n <!-- Chat input (hidden during pending tool calls) -->\n @if (!chatService.hasPendingToolCalls()) {\n <div class=\"cortex-widget__input-area\">\n <div\n class=\"cortex-widget__input-box\"\n [class.cortex-widget__input-box--disabled]=\"chatService.isAgentWorking()\"\n [class.cortex-widget__input-box--enabled]=\"!chatService.isAgentWorking()\"\n >\n <textarea\n (keydown)=\"onKeydown($event)\"\n [(ngModel)]=\"text\"\n [placeholder]=\"\n chatService.isAgentWorking() ? '' : ('translate_type_a_message' | translate)\n \"\n [disabled]=\"chatService.isAgentWorking()\"\n rows=\"1\"\n class=\"cortex-widget__textarea\"\n [class.cortex-widget__textarea--disabled]=\"chatService.isAgentWorking()\"\n ></textarea>\n @if (chatService.isAgentWorking()) {\n <!-- Stop button -->\n <button (click)=\"chatService.abort()\" class=\"cortex-stop-btn\">\n <!-- Pulsing ring -->\n <span class=\"cortex-stop-btn__ring\"></span>\n <!-- Stop icon (rounded square) -->\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n class=\"cortex-stop-btn__icon\"\n >\n <rect x=\"1\" y=\"1\" width=\"10\" height=\"10\" rx=\"2.5\" fill=\"currentColor\" />\n </svg>\n </button>\n } @else {\n <!-- Send button -->\n <button\n (click)=\"send()\"\n class=\"cortex-widget__send-btn\"\n [class.cortex-widget__send-btn--empty]=\"!text().trim()\"\n [class.cortex-widget__send-btn--ready]=\"!!text().trim()\"\n >\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__send-icon\"\n >\n <path\n d=\"M3 8h10M9 4l4 4-4 4\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n }\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [".cortex-widget{display:block}.cortex-widget__container{width:100%;height:100%;position:relative;overflow:hidden}.cortex-widget__screen{position:absolute;inset:0;display:flex;flex-direction:column;transition:transform .3s ease-out}.cortex-widget__screen--active{transform:translate(0)}.cortex-widget__screen--left{transform:translate(-100%)}[dir=rtl] .cortex-widget__screen--left,.cortex-widget__screen--right{transform:translate(100%)}[dir=rtl] .cortex-widget__screen--right{transform:translate(-100%)}.cortex-widget__threads-header{flex-shrink:0;padding:1.25rem 1.25rem 1rem;display:flex;align-items:center;justify-content:space-between}.cortex-widget__threads-title{font-size:.9375rem;font-weight:600;color:#1e293b;letter-spacing:-.01em;margin:0}.cortex-widget__threads-count{font-size:.6875rem;color:#94a3b8;margin-top:.125rem;margin-bottom:0}.cortex-widget__new-chat-btn{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:500;color:#f1f5f9;background:#1e293b;padding:.375rem .75rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__new-chat-btn:hover{background:#334155}.cortex-widget__new-chat-btn:active{background:#0f172a}.cortex-widget__threads-list{flex:1;overflow-y:auto;padding:0 .75rem .75rem}.cortex-widget__thread-skeleton{display:flex;align-items:center;gap:.75rem;padding:.75rem;margin-bottom:.125rem}.cortex-widget__thread-skeleton-icon{flex-shrink:0;width:2rem;height:2rem}.cortex-widget__thread-skeleton-lines{flex:1;display:flex;flex-direction:column;gap:.375rem}.cortex-widget__thread-skeleton-line{height:.875rem}@keyframes cortex-skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.cortex-skeleton{background:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0 80%);background-size:200% 100%;animation:cortex-skeleton-shimmer 1.8s ease-in-out infinite;border-radius:6px}.cortex-widget__thread-item{width:100%;text-align:start;padding:.75rem;border-radius:.5rem;display:flex;align-items:center;gap:.75rem;transition:background-color .15s;cursor:pointer;margin-bottom:.125rem;border:0;background:transparent;color:#475569}.cortex-widget__thread-item:hover{background:#f1f5f9}.cortex-widget__thread-item:active{background:#e8ecf1}.cortex-widget__thread-item--active{background:#e2e8f0;color:#f1f5f9}.cortex-widget__thread-icon{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:600;background:#e2e8f0;color:#64748b}[dir=rtl] .cortex-widget__thread-icon{transform:rotate(180deg)}.cortex-widget__thread-icon--active{background:#334155;color:#cbd5e1}.cortex-widget__thread-info{min-width:0;flex:1}.cortex-widget__thread-title{font-size:.8125rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.25;margin:0;color:#334155}.cortex-widget__thread-title--active{color:#f1f5f9}.cortex-widget__thread-delete{flex-shrink:0;opacity:0;width:1.75rem;height:1.75rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .15s;background:transparent;border:0;color:#94a3b8}.cortex-widget__thread-item:hover>.cortex-widget__thread-delete{opacity:1}.cortex-widget__thread-delete:hover{background:#e2e8f0}.cortex-widget__thread-delete--active:hover{background:#475569}.cortex-widget__thread-arrow{flex-shrink:0;transition:color .15s;color:#cbd5e1}[dir=rtl] .cortex-widget__thread-arrow{transform:rotate(180deg)}.cortex-widget__thread-item:hover>.cortex-widget__thread-arrow{color:#94a3b8}.cortex-widget__thread-arrow--active{color:#64748b}.cortex-widget__threads-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;text-align:center}.cortex-widget__threads-empty-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;background:#e2e8f0;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.cortex-widget__threads-empty-svg{color:#94a3b8}.cortex-widget__threads-empty-title{font-size:.8125rem;color:#94a3b8;font-weight:500;margin:0}.cortex-widget__threads-empty-subtitle{font-size:.6875rem;color:#a5afbd;margin-top:.25rem;margin-bottom:0}.cortex-widget__chat-header{flex-shrink:0;height:3rem;padding:0 1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #e2e8f0;background:#fff}.cortex-widget__back-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;color:#94a3b8;background:transparent;border:0;cursor:pointer;transition:color .15s,background-color .15s}.cortex-widget__back-btn:hover{color:#475569;background:#f1f5f9}[dir=rtl] .cortex-widget__back-icon{transform:rotate(180deg)}.cortex-widget__chat-title-wrap{min-width:0;flex:1}.cortex-widget__chat-title{font-size:.8125rem;font-weight:500;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.cortex-widget__debug-btn{flex-shrink:0;font-size:.6875rem;font-weight:500;padding:.25rem .625rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__debug-btn--on{background:#fef3c7;color:#d97706}.cortex-widget__debug-btn--on:hover{background:#fde68a}.cortex-widget__debug-btn--off{background:#f1f5f9;color:#94a3b8}.cortex-widget__debug-btn--off:hover{background:#e2e8f0}.cortex-widget__messages-skeleton{flex:1;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel{width:100%;display:flex;flex-direction:column}.cortex-widget__msg-skel--user{align-items:flex-start}.cortex-widget__msg-skel--assistant{align-items:flex-end}.cortex-widget__msg-skel-bubble{max-width:80%;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel-bubble--user{background:#f8fafc;border-bottom-left-radius:0}.cortex-widget__msg-skel-bubble--assistant{background:#f1f5f9;border-bottom-right-radius:0}.cortex-widget__msg-skel-line{height:.75rem}.cortex-widget__messages{flex:1;overflow:hidden}.cortex-widget__working{flex-shrink:0;padding:.375rem 1rem;display:flex;align-items:center;gap:.375rem}.cortex-widget__working-dots{display:flex;align-items:center;gap:3px}@keyframes cortex-pulse{0%,to{opacity:.4}50%{opacity:1}}@keyframes cortex-dot-bounce{0%,80%,to{transform:translateY(0)}40%{transform:translateY(-3px)}}.cortex-working-dot{display:block;width:5px;height:5px;border-radius:9999px;background:#94a3b8;animation:cortex-pulse 1.6s ease-in-out infinite,cortex-dot-bounce 1.2s ease-in-out infinite}.cortex-working-dot:nth-child(2){animation-delay:.15s}.cortex-working-dot:nth-child(3){animation-delay:.3s}.cortex-widget__working-text{font-size:.6875rem;color:#94a3b8;font-weight:500}.cortex-widget__input-area{flex-shrink:0;padding:.75rem;background:#fff;border-top:1px solid #e2e8f0}.cortex-widget__input-box{display:flex;align-items:flex-end;gap:.5rem;border-radius:.75rem;border:1px solid #e2e8f0;padding:.375rem;transition:border-color .15s,background-color .15s}.cortex-widget__input-box--disabled{background:#f1f5f9}.cortex-widget__input-box--enabled{background:#f8fafc}.cortex-widget__input-box--enabled:focus-within{border-color:#cbd5e1;background:#fff}.cortex-widget__textarea{flex:1;background:transparent;resize:none;border:0;outline:none;font-size:.8125rem;padding:.375rem .5rem;min-height:28px;max-height:120px;line-height:1.375;color:#334155}.cortex-widget__textarea::placeholder{color:#a5afbd}.cortex-widget__textarea--disabled{color:#94a3b8;cursor:not-allowed}.cortex-widget__textarea:disabled{cursor:not-allowed;border:0}@keyframes cortex-stop-pulse-ring{0%{opacity:.45;transform:scale(1)}50%{opacity:.15;transform:scale(1.12)}to{opacity:.45;transform:scale(1)}}@keyframes cortex-stop-fade-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.cortex-stop-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;background:#e11d48;color:#fff;border:0;animation:cortex-stop-fade-in .2s ease-out both;transition:background .15s ease}.cortex-stop-btn:hover{background:#be123c}.cortex-stop-btn:active{transform:scale(.92)}.cortex-stop-btn__ring{position:absolute;inset:0;border-radius:.5rem;background:#e11d48;animation:cortex-stop-pulse-ring 2s ease-in-out infinite;pointer-events:none}.cortex-stop-btn__icon{position:relative;z-index:1}.cortex-widget__send-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;border:0;transition:background-color .15s}.cortex-widget__send-btn--empty{background:#e2e8f0;color:#94a3b8}.cortex-widget__send-btn--ready{background:#1e293b;color:#fff;cursor:pointer}.cortex-widget__send-btn--ready:hover{background:#334155}[dir=rtl] .cortex-widget__send-icon{transform:rotate(180deg)}\n"] }]
|
|
1682
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'cortex-widget' }, template: "<div class=\"cortex-widget__container\">\n <!-- SCREEN 1: THREADS -->\n <div\n class=\"cortex-widget__screen\"\n [class.cortex-widget__screen--active]=\"screen() === 'threads'\"\n [class.cortex-widget__screen--left]=\"screen() !== 'threads'\"\n >\n <!-- Threads header -->\n <div class=\"cortex-widget__threads-header\">\n <div>\n <h2 class=\"cortex-widget__threads-title\">\n {{ 'translate_threads' | translate }}\n </h2>\n <p class=\"cortex-widget__threads-count\">\n {{\n 'translate_n_conversations' | translate: { count: chatService.threads()?.length ?? 0 }\n }}\n </p>\n </div>\n <button (click)=\"newChat()\" class=\"cortex-widget__new-chat-btn\">\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M8 3v10M3 8h10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n />\n </svg>\n {{ 'translate_new' | translate }}\n </button>\n </div>\n\n <!-- Threads list -->\n <div class=\"cortex-widget__threads-list\">\n <!-- Threads loading skeleton -->\n @if (chatService.threads() === undefined) {\n @for (i of [1, 2, 3, 4]; track i) {\n <div class=\"cortex-widget__thread-skeleton\">\n <div class=\"cortex-skeleton cortex-widget__thread-skeleton-icon\"></div>\n <div class=\"cortex-widget__thread-skeleton-lines\">\n <div\n class=\"cortex-skeleton cortex-widget__thread-skeleton-line\"\n [style.width]=\"40 + i * 12 + '%'\"\n ></div>\n </div>\n </div>\n }\n } @else {\n @for (thread of chatService.threads(); track thread.id) {\n <button\n (click)=\"selectThread(thread)\"\n class=\"cortex-widget__thread-item\"\n [class.cortex-widget__thread-item--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <!-- Thread icon -->\n <div\n class=\"cortex-widget__thread-icon\"\n [class.cortex-widget__thread-icon--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n\n <!-- Thread info -->\n <div class=\"cortex-widget__thread-info\">\n <p\n class=\"cortex-widget__thread-title\"\n [class.cortex-widget__thread-title--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n {{ thread.title ?? ('translate_untitled' | translate) }}\n </p>\n </div>\n\n <!-- Delete button -->\n <button\n (click)=\"$event.stopPropagation(); chatService.deleteThread(thread.id).subscribe()\"\n class=\"cortex-widget__thread-delete\"\n [class.cortex-widget__thread-delete--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n >\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M4 4l8 8M12 4l-8 8\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </button>\n\n <!-- Arrow -->\n <svg\n class=\"cortex-widget__thread-arrow\"\n [class.cortex-widget__thread-arrow--active]=\"\n thread.id === chatService.selectedThread()?.id\n \"\n width=\"10\"\n height=\"10\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n d=\"M6 4l4 4-4 4\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n }\n\n @if (!chatService.threads()?.length) {\n <div class=\"cortex-widget__threads-empty\">\n <div class=\"cortex-widget__threads-empty-icon\">\n <svg\n width=\"18\"\n height=\"18\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__threads-empty-svg\"\n >\n <path\n d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n stroke=\"currentColor\"\n stroke-width=\"1.3\"\n stroke-linecap=\"round\"\n />\n </svg>\n </div>\n <p class=\"cortex-widget__threads-empty-title\">No threads yet</p>\n <p class=\"cortex-widget__threads-empty-subtitle\">Start a new conversation</p>\n </div>\n }\n }\n </div>\n </div>\n\n <!-- SCREEN 2: CHAT -->\n <div\n class=\"cortex-widget__screen\"\n [class.cortex-widget__screen--active]=\"screen() === 'chat'\"\n [class.cortex-widget__screen--right]=\"screen() !== 'chat'\"\n >\n <!-- Chat header -->\n <div class=\"cortex-widget__chat-header\">\n <!-- Back button -->\n <button (click)=\"goBack()\" class=\"cortex-widget__back-btn\">\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__back-icon\"\n >\n <path\n d=\"M10 3L5 8l5 5\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n\n <!-- Title -->\n <div class=\"cortex-widget__chat-title-wrap\">\n <p class=\"cortex-widget__chat-title\">\n {{ chatService.selectedThread()?.title ?? ('translate_new_chat' | translate) }}\n </p>\n </div>\n\n <!-- Debug toggle -->\n <button\n (click)=\"toggleDebugMode()\"\n class=\"cortex-widget__debug-btn\"\n [class.cortex-widget__debug-btn--on]=\"debugMode()\"\n [class.cortex-widget__debug-btn--off]=\"!debugMode()\"\n >\n {{ debugMode() ? ('translate_debug' | translate) : ('translate_normal' | translate) }}\n </button>\n </div>\n\n <!-- Messages loading skeleton -->\n @if (chatService.isLoadingMessages() && !chatService.isAgentWorking()) {\n <div class=\"cortex-widget__messages-skeleton\">\n <!-- User message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 13rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 9rem\"></div>\n </div>\n </div>\n <!-- Assistant message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 16rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 18rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 12rem\"></div>\n </div>\n </div>\n <!-- User message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 11rem\"></div>\n </div>\n </div>\n <!-- Assistant message skeleton -->\n <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 14rem\"></div>\n <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 15rem\"></div>\n </div>\n </div>\n </div>\n } @else {\n <!-- Messages area -->\n <cortex-message-list class=\"cortex-widget__messages\" [debugMode]=\"debugMode()\" />\n }\n\n <!-- Agent working indicator -->\n @if (chatService.isAgentWorking() && !chatService.hasPendingToolCalls()) {\n <div class=\"cortex-widget__working\">\n <div class=\"cortex-widget__working-dots\">\n <span class=\"cortex-working-dot\"></span>\n <span class=\"cortex-working-dot\"></span>\n <span class=\"cortex-working-dot\"></span>\n </div>\n <span class=\"cortex-widget__working-text\">{{ 'translate_thinking' | translate }}</span>\n </div>\n }\n\n <!-- Chat input (hidden during pending tool calls) -->\n @if (!chatService.hasPendingToolCalls()) {\n <div class=\"cortex-widget__input-area\">\n <div\n class=\"cortex-widget__input-box\"\n [class.cortex-widget__input-box--disabled]=\"chatService.isAgentWorking()\"\n [class.cortex-widget__input-box--enabled]=\"!chatService.isAgentWorking()\"\n >\n <textarea\n (keydown)=\"onKeydown($event)\"\n [(ngModel)]=\"text\"\n [placeholder]=\"\n chatService.isAgentWorking() ? '' : ('translate_type_a_message' | translate)\n \"\n [disabled]=\"chatService.isAgentWorking()\"\n rows=\"1\"\n class=\"cortex-widget__textarea\"\n [class.cortex-widget__textarea--disabled]=\"chatService.isAgentWorking()\"\n ></textarea>\n @if (chatService.isAgentWorking()) {\n <!-- Stop button -->\n <button (click)=\"chatService.abort()\" class=\"cortex-stop-btn\">\n <!-- Pulsing ring -->\n <span class=\"cortex-stop-btn__ring\"></span>\n <!-- Stop icon (rounded square) -->\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n class=\"cortex-stop-btn__icon\"\n >\n <rect x=\"1\" y=\"1\" width=\"10\" height=\"10\" rx=\"2.5\" fill=\"currentColor\" />\n </svg>\n </button>\n } @else {\n <!-- Send button -->\n <button\n (click)=\"send()\"\n class=\"cortex-widget__send-btn\"\n [class.cortex-widget__send-btn--empty]=\"!text().trim()\"\n [class.cortex-widget__send-btn--ready]=\"!!text().trim()\"\n >\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n class=\"cortex-widget__send-icon\"\n >\n <path\n d=\"M3 8h10M9 4l4 4-4 4\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </button>\n }\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [".cortex-widget{display:block}.cortex-widget__container{width:100%;height:100%;position:relative;overflow:hidden}.cortex-widget__screen{position:absolute;inset:0;display:flex;flex-direction:column;transition:transform .3s ease-out}.cortex-widget__screen--active{transform:translate(0)}.cortex-widget__screen--left{transform:translate(-100%)}[dir=rtl] .cortex-widget__screen--left,.cortex-widget__screen--right{transform:translate(100%)}[dir=rtl] .cortex-widget__screen--right{transform:translate(-100%)}.cortex-widget__threads-header{flex-shrink:0;padding:1.25rem 1.25rem 1rem;display:flex;align-items:center;justify-content:space-between}.cortex-widget__threads-title{font-size:.9375rem;font-weight:600;color:#1e293b;letter-spacing:-.01em;margin:0}.cortex-widget__threads-count{font-size:.6875rem;color:#94a3b8;margin-top:.125rem;margin-bottom:0}.cortex-widget__new-chat-btn{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:500;color:#f1f5f9;background:#1e293b;padding:.375rem .75rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__new-chat-btn:hover{background:#334155}.cortex-widget__new-chat-btn:active{background:#0f172a}.cortex-widget__threads-list{flex:1;overflow-y:auto;padding:0 .75rem .75rem}.cortex-widget__thread-skeleton{display:flex;align-items:center;gap:.75rem;padding:.75rem;margin-bottom:.125rem}.cortex-widget__thread-skeleton-icon{flex-shrink:0;width:2rem;height:2rem}.cortex-widget__thread-skeleton-lines{flex:1;display:flex;flex-direction:column;gap:.375rem}.cortex-widget__thread-skeleton-line{height:.875rem}@keyframes cortex-skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.cortex-skeleton{background:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0 80%);background-size:200% 100%;animation:cortex-skeleton-shimmer 1.8s ease-in-out infinite;border-radius:6px}.cortex-widget__thread-item{width:100%;text-align:start;padding:.75rem;border-radius:.5rem;display:flex;align-items:center;gap:.75rem;transition:background-color .15s;cursor:pointer;margin-bottom:.125rem;border:0;background:transparent;color:#475569}.cortex-widget__thread-item:hover{background:#f1f5f9}.cortex-widget__thread-item:active{background:#e8ecf1}.cortex-widget__thread-item--active{background:#e2e8f0;color:#f1f5f9}.cortex-widget__thread-icon{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:600;background:#e2e8f0;color:#64748b}[dir=rtl] .cortex-widget__thread-icon{transform:rotate(180deg)}.cortex-widget__thread-icon--active{background:#334155;color:#cbd5e1}.cortex-widget__thread-info{min-width:0;flex:1}.cortex-widget__thread-title{font-size:.8125rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.25;margin:0;color:#334155}.cortex-widget__thread-title--active{color:#f1f5f9}.cortex-widget__thread-delete{flex-shrink:0;opacity:0;width:1.75rem;height:1.75rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .15s;background:transparent;border:0;color:#94a3b8}.cortex-widget__thread-item:hover>.cortex-widget__thread-delete{opacity:1}.cortex-widget__thread-delete:hover{background:#e2e8f0}.cortex-widget__thread-delete--active:hover{background:#475569}.cortex-widget__thread-arrow{flex-shrink:0;transition:color .15s;color:#cbd5e1}[dir=rtl] .cortex-widget__thread-arrow{transform:rotate(180deg)}.cortex-widget__thread-item:hover>.cortex-widget__thread-arrow{color:#94a3b8}.cortex-widget__thread-arrow--active{color:#64748b}.cortex-widget__threads-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;text-align:center}.cortex-widget__threads-empty-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;background:#e2e8f0;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.cortex-widget__threads-empty-svg{color:#94a3b8}.cortex-widget__threads-empty-title{font-size:.8125rem;color:#94a3b8;font-weight:500;margin:0}.cortex-widget__threads-empty-subtitle{font-size:.6875rem;color:#a5afbd;margin-top:.25rem;margin-bottom:0}.cortex-widget__chat-header{flex-shrink:0;height:3rem;padding:0 1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #e2e8f0;background:#fff}.cortex-widget__back-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;color:#94a3b8;background:transparent;border:0;cursor:pointer;transition:color .15s,background-color .15s}.cortex-widget__back-btn:hover{color:#475569;background:#f1f5f9}[dir=rtl] .cortex-widget__back-icon{transform:rotate(180deg)}.cortex-widget__chat-title-wrap{min-width:0;flex:1}.cortex-widget__chat-title{font-size:.8125rem;font-weight:500;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.cortex-widget__debug-btn{flex-shrink:0;font-size:.6875rem;font-weight:500;padding:.25rem .625rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__debug-btn--on{background:#fef3c7;color:#d97706}.cortex-widget__debug-btn--on:hover{background:#fde68a}.cortex-widget__debug-btn--off{background:#f1f5f9;color:#94a3b8}.cortex-widget__debug-btn--off:hover{background:#e2e8f0}.cortex-widget__messages-skeleton{flex:1;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel{width:100%;display:flex;flex-direction:column}.cortex-widget__msg-skel--user{align-items:flex-end}.cortex-widget__msg-skel--assistant{align-items:flex-start}.cortex-widget__msg-skel-bubble{max-width:80%;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel-bubble--user{background:#f8fafc;border-bottom-right-radius:0}.cortex-widget__msg-skel-bubble--assistant{background:#f1f5f9;border-bottom-left-radius:0}.cortex-widget__msg-skel-line{height:.75rem}.cortex-widget__messages{flex:1;overflow:hidden}@keyframes cortex-working-slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes cortex-dot-wave{0%,60%,to{transform:translateY(0) scale(1);opacity:.45}30%{transform:translateY(-5px) scale(1.2);opacity:1}}@keyframes cortex-working-shimmer{0%{background-position:-200% center}to{background-position:200% center}}.cortex-widget__working{flex-shrink:0;padding:.5rem 1rem;display:flex;align-items:center;gap:.5rem;animation:cortex-working-slide-in .25s ease-out both}.cortex-widget__working-dots{display:flex;align-items:center;gap:4px}.cortex-working-dot{display:block;width:6px;height:6px;border-radius:9999px;background:#22c55e;animation:cortex-dot-wave 1.4s ease-in-out infinite}.cortex-working-dot:nth-child(2){animation-delay:.15s}.cortex-working-dot:nth-child(3){animation-delay:.3s}.cortex-widget__working-text{font-size:.75rem;font-weight:500;letter-spacing:.01em;color:#16a34a}.cortex-widget__input-area{flex-shrink:0;padding:.75rem;background:#fff;border-top:1px solid #e2e8f0}.cortex-widget__input-box{display:flex;align-items:flex-end;gap:.5rem;border-radius:.75rem;border:1px solid #e2e8f0;padding:.375rem;transition:border-color .15s,background-color .15s}.cortex-widget__input-box--disabled{background:#f1f5f9}.cortex-widget__input-box--enabled{background:#f8fafc}.cortex-widget__input-box--enabled:focus-within{border-color:#cbd5e1;background:#fff}.cortex-widget__textarea{flex:1;background:transparent;resize:none;border:0;outline:none;font-size:.8125rem;padding:.375rem .5rem;min-height:28px;max-height:120px;line-height:1.375;color:#334155}.cortex-widget__textarea::placeholder{color:#a5afbd}.cortex-widget__textarea--disabled{color:#94a3b8;cursor:not-allowed}.cortex-widget__textarea:disabled{cursor:not-allowed;border:0}@keyframes cortex-stop-pulse-ring{0%{opacity:.45;transform:scale(1)}50%{opacity:.15;transform:scale(1.12)}to{opacity:.45;transform:scale(1)}}@keyframes cortex-stop-fade-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.cortex-stop-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;background:#e11d48;color:#fff;border:0;animation:cortex-stop-fade-in .2s ease-out both;transition:background .15s ease}.cortex-stop-btn:hover{background:#be123c}.cortex-stop-btn:active{transform:scale(.92)}.cortex-stop-btn__ring{position:absolute;inset:0;border-radius:.5rem;background:#e11d48;animation:cortex-stop-pulse-ring 2s ease-in-out infinite;pointer-events:none}.cortex-stop-btn__icon{position:relative;z-index:1}.cortex-widget__send-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;border:0;transition:background-color .15s}.cortex-widget__send-btn--empty{background:#e2e8f0;color:#94a3b8}.cortex-widget__send-btn--ready{background:#1e293b;color:#fff;cursor:pointer}.cortex-widget__send-btn--ready:hover{background:#334155}[dir=rtl] .cortex-widget__send-icon{transform:rotate(180deg)}\n"] }]
|
|
1241
1683
|
}], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }, { type: i0.Output, args: ["textChange"] }] } });
|
|
1242
1684
|
|
|
1243
1685
|
/*
|