@masterteam/faris 0.0.2 → 0.0.4
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.
package/assets/faris.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
/*! tailwindcss v4.2.
|
|
2
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-leading:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-600:oklch(57.7% .245 27.325);--color-green-600:oklch(62.7% .194 149.214);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-900:oklch(20.8% .042 265.755);--color-black:#000;--spacing:.25rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--radius-md:.375rem;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.static{position:static}.start{inset-inline-start:var(--spacing)}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:calc(var(--spacing) * 0)}.mx-1{margin-inline:calc(var(--spacing) * 1)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.block{display:block}.flex{display:flex}.hidden{display:none}.
|
|
1
|
+
/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
|
|
2
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-leading:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-600:oklch(57.7% .245 27.325);--color-green-600:oklch(62.7% .194 149.214);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-900:oklch(20.8% .042 265.755);--color-black:#000;--spacing:.25rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--radius-md:.375rem;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.relative{position:relative}.static{position:static}.start{inset-inline-start:var(--spacing)}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:calc(var(--spacing) * 0)}.mx-1{margin-inline:calc(var(--spacing) * 1)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.block{display:block}.flex{display:flex}.hidden{display:none}.h-6{height:calc(var(--spacing) * 6)}.h-10{height:calc(var(--spacing) * 10)}.h-full{height:100%}.w-6{width:calc(var(--spacing) * 6)}.w-10{width:calc(var(--spacing) * 10)}.w-\[85\%\]{width:85%}.w-full{width:100%}.w-px{width:1px}.max-w-\[98\%\]{max-width:98%}.flex-1{flex:1}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:calc(var(--spacing) * 1)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-slate-200{border-color:var(--color-slate-200)}.border-slate-300{border-color:var(--color-slate-300)}.border-surface-300{border-color:var(--p-surface-300)}@supports (color:color-mix(in lab, red, red)){.border-surface-300{border-color:color-mix(in srgb, var(--p-surface-300) calc(100% * 1), transparent)}}.border-t-\[var\(--primary-color\)\]{border-top-color:var(--primary-color)}.bg-black\/10{background-color:#0000001a}@supports (color:color-mix(in lab, red, red)){.bg-black\/10{background-color:color-mix(in oklab, var(--color-black) 10%, transparent)}}.bg-slate-50{background-color:var(--color-slate-50)}.object-contain{object-fit:contain}.p-1{padding:calc(var(--spacing) * 1)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.px-2{padding-inline:calc(var(--spacing) * 2)}.py-2{padding-block:calc(var(--spacing) * 2)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.text-green-600{color:var(--color-green-600)}.text-red-600{color:var(--color-red-600)}.text-slate-600{color:var(--color-slate-600)}.text-slate-900{color:var(--color-slate-900)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}@media (hover:hover){.hover\:bg-slate-100:hover{background-color:var(--color-slate-100)}}}@keyframes enter{0%{opacity:var(--p-enter-opacity,1);transform:translate3d(var(--p-enter-translate-x,0), var(--p-enter-translate-y,0), 0) scale3d(var(--p-enter-scale,1), var(--p-enter-scale,1), var(--p-enter-scale,1)) rotate(var(--p-enter-rotate,0))}}@keyframes leave{to{opacity:var(--p-leave-opacity,1);transform:translate3d(var(--p-leave-translate-x,0), var(--p-leave-translate-y,0), 0) scale3d(var(--p-leave-scale,1), var(--p-leave-scale,1), var(--p-leave-scale,1)) rotate(var(--p-leave-rotate,0))}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, Pipe, Injectable, EventEmitter, Output, Input, Component, ViewContainerRef, forwardRef, ViewChild
|
|
2
|
+
import { inject, Pipe, Injectable, EventEmitter, Output, Input, Component, ViewContainerRef, forwardRef, ViewChild } from '@angular/core';
|
|
3
3
|
import { Button } from '@masterteam/components/button';
|
|
4
4
|
import { ConfirmationService } from '@masterteam/components/confirmation';
|
|
5
5
|
import { BehaviorSubject, of, EMPTY, Subject, Subscription } from 'rxjs';
|
|
@@ -574,11 +574,11 @@ class FarisCanvasComponent {
|
|
|
574
574
|
: null;
|
|
575
575
|
}
|
|
576
576
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: FarisCanvasComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
577
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: FarisCanvasComponent, isStandalone: true, selector: "mt-faris-canvas", inputs: { message: "message", conversationId: "conversationId" }, outputs: { closed: "closed" }, usesOnChanges: true, ngImport: i0, template: "@if (iframeUrl) {\r\n <div class=\"faris-canvas-frame\">\r\n <div class=\"faris-canvas-frame-header\">\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n aria-label=\"Close Canvas\"\r\n (click)=\"closeCanvas()\"\r\n ></mt-button>\r\n </div>\r\n\r\n <div class=\"faris-canvas-iframe-container\">\r\n @if (loading) {\r\n <div class=\"iframe-loading\">\r\n <div\r\n class=\"h-6 w-6 animate-spin rounded-full border-2 border-slate-300 border-t-[var(--primary-color)]\"\r\n ></div>\r\n </div>\r\n }\r\n\r\n <iframe\r\n [src]=\"iframeUrl\"\r\n
|
|
577
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: FarisCanvasComponent, isStandalone: true, selector: "mt-faris-canvas", inputs: { message: "message", conversationId: "conversationId" }, outputs: { closed: "closed" }, usesOnChanges: true, ngImport: i0, template: "@if (iframeUrl) {\r\n <div class=\"faris-canvas-frame\">\r\n <div class=\"faris-canvas-frame-header\">\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n aria-label=\"Close Canvas\"\r\n (click)=\"closeCanvas()\"\r\n ></mt-button>\r\n </div>\r\n\r\n <div class=\"faris-canvas-iframe-container\">\r\n @if (loading) {\r\n <div class=\"iframe-loading\">\r\n <div\r\n class=\"h-6 w-6 animate-spin rounded-full border-2 border-slate-300 border-t-[var(--primary-color)]\"\r\n ></div>\r\n </div>\r\n }\r\n\r\n <iframe\r\n [src]=\"iframeUrl\"\r\n width=\"100%\"\r\n height=\"100vh\"\r\n frameborder=\"0\"\r\n allowfullscreen\r\n (load)=\"onIframeLoad()\"\r\n ></iframe>\r\n </div>\r\n </div>\r\n} @else {\r\n <div class=\"faris-canvas-empty p-4 text-sm text-slate-600\">\r\n {{ \"faris.unable-to-load-content\" | translate }}\r\n </div>\r\n}\r\n", styles: [":host{background-color:#fff;padding:.25em}.faris-canvas-frame{border:2px solid lightgray;border-radius:var(--faris-border-radius);background:#fff;overflow:hidden;position:relative;height:calc(100vh - 1em);display:flex;flex-direction:column}.faris-canvas-frame-header{display:flex;justify-content:flex-end;align-items:center;background:#f7f9fa;border-bottom:1px solid #e0e0e0;padding:.5em 1em;min-height:48px;z-index:10}.faris-canvas-iframe-container{height:100%;width:100%;position:relative;flex:1 1 auto}.faris-canvas-iframe-container .iframe-loading{position:absolute;inset:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:2;background:#ffffffb3}.faris-canvas-iframe-container iframe{border:none;min-height:400px;height:100%;width:100%;display:block}.faris-canvas-iframe-container .spinner-border{width:1.25em;height:1.25em}\n"], dependencies: [{ kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: FarisTranslatePipe, name: "translate" }] });
|
|
578
578
|
}
|
|
579
579
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: FarisCanvasComponent, decorators: [{
|
|
580
580
|
type: Component,
|
|
581
|
-
args: [{ selector: 'mt-faris-canvas', standalone: true, imports: [FarisTranslatePipe, Button], template: "@if (iframeUrl) {\r\n <div class=\"faris-canvas-frame\">\r\n <div class=\"faris-canvas-frame-header\">\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n aria-label=\"Close Canvas\"\r\n (click)=\"closeCanvas()\"\r\n ></mt-button>\r\n </div>\r\n\r\n <div class=\"faris-canvas-iframe-container\">\r\n @if (loading) {\r\n <div class=\"iframe-loading\">\r\n <div\r\n class=\"h-6 w-6 animate-spin rounded-full border-2 border-slate-300 border-t-[var(--primary-color)]\"\r\n ></div>\r\n </div>\r\n }\r\n\r\n <iframe\r\n [src]=\"iframeUrl\"\r\n
|
|
581
|
+
args: [{ selector: 'mt-faris-canvas', standalone: true, imports: [FarisTranslatePipe, Button], template: "@if (iframeUrl) {\r\n <div class=\"faris-canvas-frame\">\r\n <div class=\"faris-canvas-frame-header\">\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n aria-label=\"Close Canvas\"\r\n (click)=\"closeCanvas()\"\r\n ></mt-button>\r\n </div>\r\n\r\n <div class=\"faris-canvas-iframe-container\">\r\n @if (loading) {\r\n <div class=\"iframe-loading\">\r\n <div\r\n class=\"h-6 w-6 animate-spin rounded-full border-2 border-slate-300 border-t-[var(--primary-color)]\"\r\n ></div>\r\n </div>\r\n }\r\n\r\n <iframe\r\n [src]=\"iframeUrl\"\r\n width=\"100%\"\r\n height=\"100vh\"\r\n frameborder=\"0\"\r\n allowfullscreen\r\n (load)=\"onIframeLoad()\"\r\n ></iframe>\r\n </div>\r\n </div>\r\n} @else {\r\n <div class=\"faris-canvas-empty p-4 text-sm text-slate-600\">\r\n {{ \"faris.unable-to-load-content\" | translate }}\r\n </div>\r\n}\r\n", styles: [":host{background-color:#fff;padding:.25em}.faris-canvas-frame{border:2px solid lightgray;border-radius:var(--faris-border-radius);background:#fff;overflow:hidden;position:relative;height:calc(100vh - 1em);display:flex;flex-direction:column}.faris-canvas-frame-header{display:flex;justify-content:flex-end;align-items:center;background:#f7f9fa;border-bottom:1px solid #e0e0e0;padding:.5em 1em;min-height:48px;z-index:10}.faris-canvas-iframe-container{height:100%;width:100%;position:relative;flex:1 1 auto}.faris-canvas-iframe-container .iframe-loading{position:absolute;inset:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:2;background:#ffffffb3}.faris-canvas-iframe-container iframe{border:none;min-height:400px;height:100%;width:100%;display:block}.faris-canvas-iframe-container .spinner-border{width:1.25em;height:1.25em}\n"] }]
|
|
582
582
|
}], propDecorators: { message: [{
|
|
583
583
|
type: Input
|
|
584
584
|
}], conversationId: [{
|
|
@@ -1502,7 +1502,7 @@ class FarisChatComponent {
|
|
|
1502
1502
|
}
|
|
1503
1503
|
}
|
|
1504
1504
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: FarisChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1505
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: FarisChatComponent, isStandalone: true, selector: "mt-faris-chat", inputs: { selectedConversation: "selectedConversation" }, outputs: { launchCanvas: "launchCanvas", selectConversation: "selectConversation" }, ngImport: i0, template: "<div class=\"
|
|
1505
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: FarisChatComponent, isStandalone: true, selector: "mt-faris-chat", inputs: { selectedConversation: "selectedConversation" }, outputs: { launchCanvas: "launchCanvas", selectConversation: "selectConversation" }, ngImport: i0, template: "<div class=\"relative flex h-full w-full flex-col justify-between\" #container>\r\n @if (!showResult) {\r\n <div class=\"welcome-user\">\r\n <span class=\"hello-gradient\"\r\n >{{ \"faris.hello\" | translate }}, {{ currentUserDisplayName }}</span\r\n >\r\n <span class=\"welcome-text\">{{\r\n \"faris.welcome-message\" | translate\r\n }}</span>\r\n </div>\r\n }\r\n\r\n <div class=\"results-container\" id=\"results-container\">\r\n <div class=\"pre-defined-questions flex w-full flex-col\">\r\n @if (!showResult) {\r\n @for (agent of agents; track agent?.title) {\r\n <mt-faris-agent-card\r\n class=\"real-content\"\r\n [agent]=\"agent\"\r\n (click)=\"sendQuery(agent.title)\"\r\n ></mt-faris-agent-card>\r\n }\r\n }\r\n\r\n @if (showResult) {\r\n @for (\r\n item of chatHistory;\r\n track item.trace_id || item.message_id || $index\r\n ) {\r\n <mt-faris-message\r\n [item]=\"item\"\r\n [currentUserPhoto]=\"currentUserPhoto\"\r\n [loading]=\"loading\"\r\n [thinkingText]=\"thinkingText\"\r\n (action)=\"takeAction($event.action, $event.item)\"\r\n (canvas)=\"launchCanvas.emit($event)\"\r\n >\r\n </mt-faris-message>\r\n }\r\n }\r\n </div>\r\n </div>\r\n\r\n <div class=\"search-box\">\r\n <form class=\"w-full\" #chatForm=\"ngForm\" (ngSubmit)=\"sendQuery(userInput)\">\r\n <div class=\"input-box\">\r\n <mt-faris-mention-input\r\n [(ngModel)]=\"userInput\"\r\n [ngModelOptions]=\"{ standalone: true }\"\r\n (keydown.enter)=\"sendQuery(userInput)\"\r\n ></mt-faris-mention-input>\r\n\r\n <mt-button\r\n type=\"submit\"\r\n icon=\"communication.send-01\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn faris-btn-lg\"\r\n [disabled]=\"!userInput || !userInput.trim() || loading\"\r\n ></mt-button>\r\n </div>\r\n </form>\r\n\r\n <small>{{ \"faris.input-message\" | translate }}</small>\r\n </div>\r\n</div>\r\n", styles: [".results-container{height:90%;overflow-y:auto;margin:0 1em 100px}.conversations-container{height:85%;overflow-y:auto;margin:0 1em 140px}.search-box{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:90px;border-top:1px solid #dee2e6;gap:.5em;padding:.5em 1em;bottom:0;left:0}.search-box small{font-size:.65em;opacity:.8}.search-box .input-box{display:flex;align-items:center;gap:.5em}.search-box .input-box textarea{border:1px solid #dee2e6;padding:.5em;border-radius:var(--faris-border-radius);box-shadow:0 5px 10px #00000014;resize:none;height:unset!important;width:100%!important;outline:none;font-size:1em}.search-box .input-box textarea::-webkit-input-placeholder{font-size:1em}.pre-defined-questions{gap:1em;width:100%}.welcome-user{display:flex;flex-direction:column;gap:.5em;font-size:1.1em;font-weight:500;padding:0 1em 1.2em;line-height:22px}.welcome-user .hello-gradient{font-size:1.5em;font-weight:700;background:-webkit-linear-gradient(315deg,#217bfe 0,#078efb 33%,#ac87eb 100%);background:linear-gradient(135deg,#217bfe 0,#078efb 33%,#ac87eb);background-size:200% 100%;display:-webkit-inline-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;word-break:break-word;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;inline-size:-webkit-fit-content;inline-size:fit-content;display:block;animation:gradient-shine 1.5s ease-in}@keyframes gradient-shine{0%{background-position:200% center;opacity:0}60%{opacity:1}to{background-position:0% center;opacity:1}}.welcome-user .welcome-text{display:inline-block;background:linear-gradient(90deg,#888 100%,transparent 0%);background-size:0% 100%;background-repeat:no-repeat;color:transparent;background-clip:text;-webkit-background-clip:text;animation:fill-gray 1.5s forwards;animation-delay:.5s}@keyframes fill-text{0%{background-size:0% 100%;opacity:0}30%{opacity:1}to{background-size:200% 100%;opacity:1}}@keyframes fill-gray{0%{background-size:0% 100%;opacity:0}30%{opacity:1}to{background-size:100% 100%;opacity:1}}:dir(rtl) .welcome-user .hello-gradient{background:linear-gradient(-135deg,#217bfe 0,#078efb 33%,#ac87eb);background-size:200% 100%;background-position:0% center;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:gradient-shine-rtl 1.5s ease-in}@keyframes gradient-shine-rtl{0%{background-position:-200% center;opacity:0}60%{opacity:1}to{background-position:0% center;opacity:1}}:dir(rtl) .welcome-user .welcome-text{background:linear-gradient(270deg,#888 100%,transparent 0%);background-size:0% 100%;background-repeat:no-repeat;background-position:right center;background-clip:text;-webkit-background-clip:text;color:transparent;animation:fill-gray-rtl 1.5s forwards;animation-delay:.5s}@keyframes fill-gray-rtl{0%{background-size:0% 100%;opacity:0}30%{opacity:1}to{background-size:100% 100%;opacity:1}}::ng-deep markdown{width:calc(100% - 28px)}::ng-deep markdown h1{font-size:1em}::ng-deep markdown h2{font-size:.9em}::ng-deep markdown h3{font-size:.8em}::ng-deep markdown h4{font-size:.7em}::ng-deep markdown h5{font-size:.6em}::ng-deep markdown h6{font-size:.5em}::ng-deep markdown p{font-size:.9em;line-height:1.5;margin:8px 0}::ng-deep markdown ul,::ng-deep markdown ol{font-size:.9em;line-height:1.5;margin-inline-start:1.5em;padding:0;list-style-type:disclosure-closed}::ng-deep markdown li{margin-bottom:.5em}::ng-deep markdown blockquote{border-inline-start:4px solid #dfe2e5;padding:.5em 1em;margin:1em 0;background-color:#f6f8fa}::ng-deep markdown code{background-color:#f6f8fa;padding:.2em .4em;border-radius:var(--faris-sm-border-radius);font-family:Courier New,Courier,monospace}::ng-deep markdown table{width:100%;border-collapse:collapse;margin:1em 0}::ng-deep markdown th,::ng-deep markdown td{border:1px solid #dfe2e5;padding:.5em;text-align:start}::ng-deep markdown th{background-color:#f6f8fa;font-weight:700}::ng-deep markdown img{max-width:100%;height:auto;display:block;margin:1em 0}::ng-deep markdown .chart-placeholder{width:100%!important}.thinking{position:absolute;inset-inline-start:0;bottom:110px}#thinkingText{font-size:12px;font-weight:700}@keyframes dots{0%{content:\".\"}33%{content:\"..\"}66%{content:\"...\"}}#dots:after{content:\".\";animation:dots 1s infinite steps(3,end)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: AgentCardComponent, selector: "mt-faris-agent-card", inputs: ["agent"] }, { kind: "component", type: FarisMessageComponent, selector: "mt-faris-message", inputs: ["item", "currentUserPhoto", "loading", "thinkingText"], outputs: ["action", "canvas"] }, { kind: "component", type: MentionInputComponent, selector: "mt-faris-mention-input" }, { kind: "pipe", type: FarisTranslatePipe, name: "translate" }] });
|
|
1506
1506
|
}
|
|
1507
1507
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: FarisChatComponent, decorators: [{
|
|
1508
1508
|
type: Component,
|
|
@@ -1513,7 +1513,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
|
|
|
1513
1513
|
FarisTranslatePipe,
|
|
1514
1514
|
FarisMessageComponent,
|
|
1515
1515
|
MentionInputComponent,
|
|
1516
|
-
], template: "<div class=\"
|
|
1516
|
+
], template: "<div class=\"relative flex h-full w-full flex-col justify-between\" #container>\r\n @if (!showResult) {\r\n <div class=\"welcome-user\">\r\n <span class=\"hello-gradient\"\r\n >{{ \"faris.hello\" | translate }}, {{ currentUserDisplayName }}</span\r\n >\r\n <span class=\"welcome-text\">{{\r\n \"faris.welcome-message\" | translate\r\n }}</span>\r\n </div>\r\n }\r\n\r\n <div class=\"results-container\" id=\"results-container\">\r\n <div class=\"pre-defined-questions flex w-full flex-col\">\r\n @if (!showResult) {\r\n @for (agent of agents; track agent?.title) {\r\n <mt-faris-agent-card\r\n class=\"real-content\"\r\n [agent]=\"agent\"\r\n (click)=\"sendQuery(agent.title)\"\r\n ></mt-faris-agent-card>\r\n }\r\n }\r\n\r\n @if (showResult) {\r\n @for (\r\n item of chatHistory;\r\n track item.trace_id || item.message_id || $index\r\n ) {\r\n <mt-faris-message\r\n [item]=\"item\"\r\n [currentUserPhoto]=\"currentUserPhoto\"\r\n [loading]=\"loading\"\r\n [thinkingText]=\"thinkingText\"\r\n (action)=\"takeAction($event.action, $event.item)\"\r\n (canvas)=\"launchCanvas.emit($event)\"\r\n >\r\n </mt-faris-message>\r\n }\r\n }\r\n </div>\r\n </div>\r\n\r\n <div class=\"search-box\">\r\n <form class=\"w-full\" #chatForm=\"ngForm\" (ngSubmit)=\"sendQuery(userInput)\">\r\n <div class=\"input-box\">\r\n <mt-faris-mention-input\r\n [(ngModel)]=\"userInput\"\r\n [ngModelOptions]=\"{ standalone: true }\"\r\n (keydown.enter)=\"sendQuery(userInput)\"\r\n ></mt-faris-mention-input>\r\n\r\n <mt-button\r\n type=\"submit\"\r\n icon=\"communication.send-01\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn faris-btn-lg\"\r\n [disabled]=\"!userInput || !userInput.trim() || loading\"\r\n ></mt-button>\r\n </div>\r\n </form>\r\n\r\n <small>{{ \"faris.input-message\" | translate }}</small>\r\n </div>\r\n</div>\r\n", styles: [".results-container{height:90%;overflow-y:auto;margin:0 1em 100px}.conversations-container{height:85%;overflow-y:auto;margin:0 1em 140px}.search-box{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:90px;border-top:1px solid #dee2e6;gap:.5em;padding:.5em 1em;bottom:0;left:0}.search-box small{font-size:.65em;opacity:.8}.search-box .input-box{display:flex;align-items:center;gap:.5em}.search-box .input-box textarea{border:1px solid #dee2e6;padding:.5em;border-radius:var(--faris-border-radius);box-shadow:0 5px 10px #00000014;resize:none;height:unset!important;width:100%!important;outline:none;font-size:1em}.search-box .input-box textarea::-webkit-input-placeholder{font-size:1em}.pre-defined-questions{gap:1em;width:100%}.welcome-user{display:flex;flex-direction:column;gap:.5em;font-size:1.1em;font-weight:500;padding:0 1em 1.2em;line-height:22px}.welcome-user .hello-gradient{font-size:1.5em;font-weight:700;background:-webkit-linear-gradient(315deg,#217bfe 0,#078efb 33%,#ac87eb 100%);background:linear-gradient(135deg,#217bfe 0,#078efb 33%,#ac87eb);background-size:200% 100%;display:-webkit-inline-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;word-break:break-word;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;inline-size:-webkit-fit-content;inline-size:fit-content;display:block;animation:gradient-shine 1.5s ease-in}@keyframes gradient-shine{0%{background-position:200% center;opacity:0}60%{opacity:1}to{background-position:0% center;opacity:1}}.welcome-user .welcome-text{display:inline-block;background:linear-gradient(90deg,#888 100%,transparent 0%);background-size:0% 100%;background-repeat:no-repeat;color:transparent;background-clip:text;-webkit-background-clip:text;animation:fill-gray 1.5s forwards;animation-delay:.5s}@keyframes fill-text{0%{background-size:0% 100%;opacity:0}30%{opacity:1}to{background-size:200% 100%;opacity:1}}@keyframes fill-gray{0%{background-size:0% 100%;opacity:0}30%{opacity:1}to{background-size:100% 100%;opacity:1}}:dir(rtl) .welcome-user .hello-gradient{background:linear-gradient(-135deg,#217bfe 0,#078efb 33%,#ac87eb);background-size:200% 100%;background-position:0% center;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:gradient-shine-rtl 1.5s ease-in}@keyframes gradient-shine-rtl{0%{background-position:-200% center;opacity:0}60%{opacity:1}to{background-position:0% center;opacity:1}}:dir(rtl) .welcome-user .welcome-text{background:linear-gradient(270deg,#888 100%,transparent 0%);background-size:0% 100%;background-repeat:no-repeat;background-position:right center;background-clip:text;-webkit-background-clip:text;color:transparent;animation:fill-gray-rtl 1.5s forwards;animation-delay:.5s}@keyframes fill-gray-rtl{0%{background-size:0% 100%;opacity:0}30%{opacity:1}to{background-size:100% 100%;opacity:1}}::ng-deep markdown{width:calc(100% - 28px)}::ng-deep markdown h1{font-size:1em}::ng-deep markdown h2{font-size:.9em}::ng-deep markdown h3{font-size:.8em}::ng-deep markdown h4{font-size:.7em}::ng-deep markdown h5{font-size:.6em}::ng-deep markdown h6{font-size:.5em}::ng-deep markdown p{font-size:.9em;line-height:1.5;margin:8px 0}::ng-deep markdown ul,::ng-deep markdown ol{font-size:.9em;line-height:1.5;margin-inline-start:1.5em;padding:0;list-style-type:disclosure-closed}::ng-deep markdown li{margin-bottom:.5em}::ng-deep markdown blockquote{border-inline-start:4px solid #dfe2e5;padding:.5em 1em;margin:1em 0;background-color:#f6f8fa}::ng-deep markdown code{background-color:#f6f8fa;padding:.2em .4em;border-radius:var(--faris-sm-border-radius);font-family:Courier New,Courier,monospace}::ng-deep markdown table{width:100%;border-collapse:collapse;margin:1em 0}::ng-deep markdown th,::ng-deep markdown td{border:1px solid #dfe2e5;padding:.5em;text-align:start}::ng-deep markdown th{background-color:#f6f8fa;font-weight:700}::ng-deep markdown img{max-width:100%;height:auto;display:block;margin:1em 0}::ng-deep markdown .chart-placeholder{width:100%!important}.thinking{position:absolute;inset-inline-start:0;bottom:110px}#thinkingText{font-size:12px;font-weight:700}@keyframes dots{0%{content:\".\"}33%{content:\"..\"}66%{content:\"...\"}}#dots:after{content:\".\";animation:dots 1s infinite steps(3,end)}\n"] }]
|
|
1517
1517
|
}], propDecorators: { selectedConversation: [{
|
|
1518
1518
|
type: Input
|
|
1519
1519
|
}], launchCanvas: [{
|
|
@@ -1685,11 +1685,11 @@ class FarisChatHistoryComponent {
|
|
|
1685
1685
|
return this.resolveConversationDate(conversation)?.getTime() ?? 0;
|
|
1686
1686
|
}
|
|
1687
1687
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: FarisChatHistoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1688
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: FarisChatHistoryComponent, isStandalone: true, selector: "mt-faris-chat-history", inputs: { userConversations: "userConversations", showChatHistory: "showChatHistory", selectedConversation: "selectedConversation" }, outputs: { selectConversation: "selectConversation", deleteConversationHandler: "deleteConversationHandler", closeHistory: "closeHistory" }, usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"conversations-history\"\r\n [class.closed-chat-history-side]=\"!showChatHistory\"\r\n>\r\n <div class=\"conversations-header\">\r\n <span class=\"conversations-title\">{{\r\n \"faris.chat-history\" | translate\r\n }}</span>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"onCloseHistory()\"\r\n ></mt-button>\r\n </div>\r\n\r\n <div class=\"conversations-list\">\r\n @for (group of groupedConversations; track group.label) {\r\n <div class=\"conversation-group-header\">{{ group.label }}</div>\r\n\r\n @for (conversation of group.conversations; track conversation.id) {\r\n <div\r\n class=\"conversation-item flex w-full cursor-pointer items-center justify-between gap-2 rounded-md p-2\"\r\n (click)=\"onSelectConversation(conversation)\"\r\n [class.active-conversation]=\"\r\n selectedConversation?.id === conversation.id\r\n \"\r\n >\r\n <mt-icon icon=\"communication.message-chat-circle\"></mt-icon>\r\n\r\n <div class=\"conversation-title-group\">\r\n <div class=\"conversation-title\">\r\n {{ (conversation?.title | parseMention) || \" \" }}\r\n </div>\r\n <div class=\"conversation-subtitle\">\r\n {{ conversation.displayDate }}\r\n </div>\r\n </div>\r\n\r\n <div class=\"conversation-actions\">\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.trash-01\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn faris-btn-muted text-red-600\"\r\n [tooltip]=\"'faris.delete' | translate\"\r\n (click)=\"onDeleteConversation($event, conversation?.id)\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>\r\n", styles: ["
|
|
1688
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: FarisChatHistoryComponent, isStandalone: true, selector: "mt-faris-chat-history", inputs: { userConversations: "userConversations", showChatHistory: "showChatHistory", selectedConversation: "selectedConversation" }, outputs: { selectConversation: "selectConversation", deleteConversationHandler: "deleteConversationHandler", closeHistory: "closeHistory" }, usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"conversations-history\"\r\n [class.closed-chat-history-side]=\"!showChatHistory\"\r\n>\r\n <div class=\"conversations-header\">\r\n <span class=\"conversations-title\">{{\r\n \"faris.chat-history\" | translate\r\n }}</span>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"onCloseHistory()\"\r\n ></mt-button>\r\n </div>\r\n\r\n <div class=\"conversations-list\">\r\n @for (group of groupedConversations; track group.label) {\r\n <div class=\"conversation-group-header\">{{ group.label }}</div>\r\n\r\n @for (conversation of group.conversations; track conversation.id) {\r\n <div\r\n class=\"conversation-item flex w-full cursor-pointer items-center justify-between gap-2 rounded-md p-2\"\r\n (click)=\"onSelectConversation(conversation)\"\r\n [class.active-conversation]=\"\r\n selectedConversation?.id === conversation.id\r\n \"\r\n >\r\n <mt-icon icon=\"communication.message-chat-circle\"></mt-icon>\r\n\r\n <div class=\"conversation-title-group\">\r\n <div class=\"conversation-title\">\r\n {{ (conversation?.title | parseMention) || \" \" }}\r\n </div>\r\n <div class=\"conversation-subtitle\">\r\n {{ conversation.displayDate }}\r\n </div>\r\n </div>\r\n\r\n <div class=\"conversation-actions\">\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.trash-01\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn faris-btn-muted text-red-600\"\r\n [tooltip]=\"'faris.delete' | translate\"\r\n (click)=\"onDeleteConversation($event, conversation?.id)\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>\r\n", styles: [".conversations-history{display:flex;flex-direction:column;height:100%;background:#f8f9fa;border-inline-end:1px solid #e0e0e0;overflow-y:auto;width:20vw;min-width:220px;max-width:320px;transition:width .2s;overflow-x:hidden}.conversations-history .conversations-header{display:flex;align-items:center;justify-content:space-between;padding:.5em .75em;font-size:1.1em;font-weight:500;color:#333;border-bottom:1px solid #e0e0e0}.conversations-history .conversations-header .history-close-button{display:flex;align-items:center;justify-content:center;border:1px solid transparent;background-color:transparent;border-radius:var(--faris-sm-border-radius);width:2em;height:2em;cursor:pointer;font-size:1.1em;padding:0;transition:all .2s ease}.conversations-history .conversations-header .history-close-button:hover{background-color:#0000000d}.conversations-history .conversations-list{display:flex;flex-direction:column;padding:.5em;gap:.5em;overflow-y:auto;height:calc(100vh - 50px)}.conversations-history .conversation-title-group{flex:1;overflow:hidden}.conversations-history .conversation-title-group .conversation-title{font-size:.98em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:inherit}.conversations-history .conversation-title-group .conversation-subtitle{font-size:.9em;opacity:.8}.conversations-history .conversation-group-header{margin-top:1em;margin-bottom:.5em;font-size:1.1em}.conversations-history .conversation-item{cursor:pointer;color:#333;border-radius:var(--faris-border-radius);transition:background .15s;-webkit-user-select:none;user-select:none}.conversations-history .conversation-item .conversation-actions{display:flex;align-items:center;gap:.5em;opacity:0;transition:all .2s ease}.conversations-history .conversation-item:hover .conversation-actions{opacity:1}.conversations-history mt-icon{font-size:1.2em}.conversations-history .conversation-item{gap:.5em}.conversations-history .conversation-item.active,.conversations-history .conversation-item.active-conversation{background:#e3f2fd;color:var(--primary-color);font-weight:600}.conversations-history .conversation-item:hover:not(.active-conversation){background:#f1f1f1}.closed-chat-history-side{width:0px!important;min-width:0px!important;border-inline-end:none!important}\n"], dependencies: [{ kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "pipe", type: FarisTranslatePipe, name: "translate" }, { kind: "pipe", type: ParseMentionPipe, name: "parseMention" }] });
|
|
1689
1689
|
}
|
|
1690
1690
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: FarisChatHistoryComponent, decorators: [{
|
|
1691
1691
|
type: Component,
|
|
1692
|
-
args: [{ selector: 'mt-faris-chat-history', standalone: true, imports: [FarisTranslatePipe, ParseMentionPipe, Button, Icon], template: "<div\r\n class=\"conversations-history\"\r\n [class.closed-chat-history-side]=\"!showChatHistory\"\r\n>\r\n <div class=\"conversations-header\">\r\n <span class=\"conversations-title\">{{\r\n \"faris.chat-history\" | translate\r\n }}</span>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"onCloseHistory()\"\r\n ></mt-button>\r\n </div>\r\n\r\n <div class=\"conversations-list\">\r\n @for (group of groupedConversations; track group.label) {\r\n <div class=\"conversation-group-header\">{{ group.label }}</div>\r\n\r\n @for (conversation of group.conversations; track conversation.id) {\r\n <div\r\n class=\"conversation-item flex w-full cursor-pointer items-center justify-between gap-2 rounded-md p-2\"\r\n (click)=\"onSelectConversation(conversation)\"\r\n [class.active-conversation]=\"\r\n selectedConversation?.id === conversation.id\r\n \"\r\n >\r\n <mt-icon icon=\"communication.message-chat-circle\"></mt-icon>\r\n\r\n <div class=\"conversation-title-group\">\r\n <div class=\"conversation-title\">\r\n {{ (conversation?.title | parseMention) || \" \" }}\r\n </div>\r\n <div class=\"conversation-subtitle\">\r\n {{ conversation.displayDate }}\r\n </div>\r\n </div>\r\n\r\n <div class=\"conversation-actions\">\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.trash-01\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn faris-btn-muted text-red-600\"\r\n [tooltip]=\"'faris.delete' | translate\"\r\n (click)=\"onDeleteConversation($event, conversation?.id)\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>\r\n", styles: ["
|
|
1692
|
+
args: [{ selector: 'mt-faris-chat-history', standalone: true, imports: [FarisTranslatePipe, ParseMentionPipe, Button, Icon], template: "<div\r\n class=\"conversations-history\"\r\n [class.closed-chat-history-side]=\"!showChatHistory\"\r\n>\r\n <div class=\"conversations-header\">\r\n <span class=\"conversations-title\">{{\r\n \"faris.chat-history\" | translate\r\n }}</span>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"onCloseHistory()\"\r\n ></mt-button>\r\n </div>\r\n\r\n <div class=\"conversations-list\">\r\n @for (group of groupedConversations; track group.label) {\r\n <div class=\"conversation-group-header\">{{ group.label }}</div>\r\n\r\n @for (conversation of group.conversations; track conversation.id) {\r\n <div\r\n class=\"conversation-item flex w-full cursor-pointer items-center justify-between gap-2 rounded-md p-2\"\r\n (click)=\"onSelectConversation(conversation)\"\r\n [class.active-conversation]=\"\r\n selectedConversation?.id === conversation.id\r\n \"\r\n >\r\n <mt-icon icon=\"communication.message-chat-circle\"></mt-icon>\r\n\r\n <div class=\"conversation-title-group\">\r\n <div class=\"conversation-title\">\r\n {{ (conversation?.title | parseMention) || \" \" }}\r\n </div>\r\n <div class=\"conversation-subtitle\">\r\n {{ conversation.displayDate }}\r\n </div>\r\n </div>\r\n\r\n <div class=\"conversation-actions\">\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.trash-01\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn faris-btn-muted text-red-600\"\r\n [tooltip]=\"'faris.delete' | translate\"\r\n (click)=\"onDeleteConversation($event, conversation?.id)\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>\r\n", styles: [".conversations-history{display:flex;flex-direction:column;height:100%;background:#f8f9fa;border-inline-end:1px solid #e0e0e0;overflow-y:auto;width:20vw;min-width:220px;max-width:320px;transition:width .2s;overflow-x:hidden}.conversations-history .conversations-header{display:flex;align-items:center;justify-content:space-between;padding:.5em .75em;font-size:1.1em;font-weight:500;color:#333;border-bottom:1px solid #e0e0e0}.conversations-history .conversations-header .history-close-button{display:flex;align-items:center;justify-content:center;border:1px solid transparent;background-color:transparent;border-radius:var(--faris-sm-border-radius);width:2em;height:2em;cursor:pointer;font-size:1.1em;padding:0;transition:all .2s ease}.conversations-history .conversations-header .history-close-button:hover{background-color:#0000000d}.conversations-history .conversations-list{display:flex;flex-direction:column;padding:.5em;gap:.5em;overflow-y:auto;height:calc(100vh - 50px)}.conversations-history .conversation-title-group{flex:1;overflow:hidden}.conversations-history .conversation-title-group .conversation-title{font-size:.98em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:inherit}.conversations-history .conversation-title-group .conversation-subtitle{font-size:.9em;opacity:.8}.conversations-history .conversation-group-header{margin-top:1em;margin-bottom:.5em;font-size:1.1em}.conversations-history .conversation-item{cursor:pointer;color:#333;border-radius:var(--faris-border-radius);transition:background .15s;-webkit-user-select:none;user-select:none}.conversations-history .conversation-item .conversation-actions{display:flex;align-items:center;gap:.5em;opacity:0;transition:all .2s ease}.conversations-history .conversation-item:hover .conversation-actions{opacity:1}.conversations-history mt-icon{font-size:1.2em}.conversations-history .conversation-item{gap:.5em}.conversations-history .conversation-item.active,.conversations-history .conversation-item.active-conversation{background:#e3f2fd;color:var(--primary-color);font-weight:600}.conversations-history .conversation-item:hover:not(.active-conversation){background:#f1f1f1}.closed-chat-history-side{width:0px!important;min-width:0px!important;border-inline-end:none!important}\n"] }]
|
|
1693
1693
|
}], propDecorators: { userConversations: [{
|
|
1694
1694
|
type: Input
|
|
1695
1695
|
}], showChatHistory: [{
|
|
@@ -1707,8 +1707,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
|
|
|
1707
1707
|
class MinimizablePopupComponent {
|
|
1708
1708
|
title = '';
|
|
1709
1709
|
maximized = false;
|
|
1710
|
-
compact = false;
|
|
1711
|
-
fullWidth = false;
|
|
1712
1710
|
closed = new EventEmitter();
|
|
1713
1711
|
direction = 'ltr';
|
|
1714
1712
|
isClosing = false;
|
|
@@ -1736,7 +1734,7 @@ class MinimizablePopupComponent {
|
|
|
1736
1734
|
}
|
|
1737
1735
|
}
|
|
1738
1736
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: MinimizablePopupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1739
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: MinimizablePopupComponent, isStandalone: true, selector: "mt-faris-popup", inputs: { title: "title", maximized: "maximized", compact: "compact", fullWidth: "fullWidth" }, outputs: { closed: "closed" }, ngImport: i0, template: "<div class=\"custom-window-backdrop\"></div>\r\n@if (!isClosing) {\r\n <div\r\n class=\"custom-window-modal\"\r\n [class.compact]=\"compact\"\r\n [class.full-width]=\"fullWidth\"\r\n [@slideInOut]=\"{\r\n value: '',\r\n params: {\r\n enterTransform: enterTransform,\r\n leaveTransform: leaveTransform,\r\n },\r\n }\"\r\n (@slideInOut.done)=\"onAnimationDone($event)\"\r\n >\r\n <ng-content select=\"[panelCanvas]\"></ng-content>\r\n <div\r\n class=\"custom-window-container\"\r\n [class.maximized]=\"maximized\"\r\n [class.compact]=\"compact\"\r\n [class.full-width]=\"fullWidth\"\r\n >\r\n <ng-content select=\"[panelSidebar]\"></ng-content>\r\n <div\r\n class=\"resizable-panel\"\r\n [class.compact]=\"compact\"\r\n [class.full-width]=\"fullWidth\"\r\n >\r\n <div class=\"panel-content\">\r\n <div\r\n class=\"modal-header flex items-center justify-between p-4 border-bottom-1 border-b border-surface-300\"\r\n >\r\n <h5 class=\"modal-title custom-window-title\">\r\n <ng-content select=\"[panelTitle]\"></ng-content>\r\n </h5>\r\n <div class=\"modal-controls flex items-center\">\r\n <ng-content select=\"[panelActions]\"></ng-content>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"close()\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n <div class=\"modal-body w-full\">\r\n <ng-content select=\"[panelChat]\"></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n}\r\n", styles: ["@keyframes smooth-appear{0%{opacity:0}to{opacity:1}}:host{display:block;position:fixed;inset:0;z-index:1501!important}.custom-window-backdrop{position:fixed;inset:0;background-color:#0003;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1500!important}.custom-window-modal{position:fixed;inset:0;display:flex;justify-content:flex-end;align-items:stretch;min-height:0;min-width:0;z-index:1501!important}.custom-window-modal .modal-header{background:#fff;border-radius:0!important;gap:.75em;min-width:0}.custom-window-modal .modal-controls{display:flex;align-items:center;justify-content:flex-end;gap:.5em;flex-shrink:0;flex-wrap:wrap}.custom-window-modal .modal-controls button{margin-left:.25em}.custom-window-modal .modal-body{display:flex;flex:1 1 auto;min-height:0;max-height:none!important;padding:0!important}.custom-window-modal .custom-window-container{display:flex;justify-content:flex-end;transition:all .4s ease;height:100%;min-height:0;min-width:0;max-width:100%}.custom-window-modal .custom-window-container.maximized,.custom-window-modal .custom-window-container.maximized .resizable-panel{flex:1}.custom-window-modal.compact{justify-content:stretch}.custom-window-title{flex:1;min-width:0;overflow:hidden}.minimized-tab{position:fixed;bottom:10px;left:0;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.resizable-container{position:fixed;inset:0;display:flex;justify-content:flex-end;pointer-events:none;transition:all .4s ease;transform:translate(0);align-items:end}.resizable-container.resizing{background-color:#0000001a;pointer-events:auto}.resizable-panel{position:relative;flex:0 1 auto;width:clamp(22rem,35vw,44rem);min-width:22rem;height:100dvh;background:#fff;pointer-events:auto;display:flex;flex-direction:column;align-items:stretch;min-height:0;max-width:100vw}.custom-window-container.compact{flex:1 1 auto;width:100%}.resizable-panel.compact{flex:1 1 auto;width:min(100vw,44rem);min-width:0;max-width:100vw}@media(max-width:1023px){.custom-window-modal{justify-content:stretch}.custom-window-container{flex:1;width:100%}.resizable-panel{flex:1 1 auto;width:min(100vw,44rem);min-width:0;max-width:100vw}}@media(max-width:639px){.resizable-panel{width:100vw}}.custom-window-modal.full-width{justify-content:stretch}.custom-window-modal.full-width .modal-header{gap:.5em;padding:.875rem!important}.custom-window-modal.full-width .modal-controls{gap:.375em;flex-wrap:nowrap}.custom-window-modal.full-width .modal-controls button{margin-left:0}.custom-window-container.full-width{flex:1 1 auto;width:100%}.resizable-panel.full-width{flex:1 1 auto;width:100vw;min-width:0;max-width:100vw}.resize-handle{height:6px;cursor:ns-resize;background:#ccc;position:absolute;top:0;left:0;right:0}.resize-handle.horizontal{width:3px;height:100%;cursor:ew-resize;z-index:1500}.panel-content{flex:1;overflow:hidden;display:flex;flex-direction:column;min-height:0;width:100%}.custom-close-badge{top:-30%;right:-10%}.minimized-tab-1{left:115px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-2{left:230px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-3{left:345px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-4{left:460px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-5{left:575px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-6{left:690px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-7{left:805px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-8{left:920px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-9{left:1035px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-10{left:1150px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-11{left:1265px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-12{left:1380px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-13{left:1495px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-14{left:1610px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-15{left:1725px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-16{left:1840px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-17{left:1955px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-18{left:2070px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-19{left:2185px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-20{left:2300px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-1{right:115px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-2{right:230px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-3{right:345px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-4{right:460px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-5{right:575px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-6{right:690px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-7{right:805px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-8{right:920px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-9{right:1035px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-10{right:1150px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-11{right:1265px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-12{right:1380px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-13{right:1495px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-14{right:1610px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-15{right:1725px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-16{right:1840px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-17{right:1955px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-18{right:2070px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-19{right:2185px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-20{right:2300px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .custom-close-badge{left:-10%;right:auto}\n"], dependencies: [{ kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }], animations: [
|
|
1737
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: MinimizablePopupComponent, isStandalone: true, selector: "mt-faris-popup", inputs: { title: "title", maximized: "maximized" }, outputs: { closed: "closed" }, ngImport: i0, template: "<div class=\"custom-window-backdrop\"></div>\r\n@if (!isClosing) {\r\n <div\r\n class=\"custom-window-modal\"\r\n [@slideInOut]=\"{\r\n value: '',\r\n params: {\r\n enterTransform: enterTransform,\r\n leaveTransform: leaveTransform,\r\n },\r\n }\"\r\n (@slideInOut.done)=\"onAnimationDone($event)\"\r\n >\r\n <ng-content select=\"[panelCanvas]\"></ng-content>\r\n <div class=\"custom-window-container\" [class.maximized]=\"maximized\">\r\n <ng-content select=\"[panelSidebar]\"></ng-content>\r\n <div class=\"resizable-panel\">\r\n <div class=\"panel-content\">\r\n <div\r\n class=\"modal-header flex items-center justify-between p-4 border-bottom-1 border-b border-surface-300\"\r\n >\r\n <h5 class=\"modal-title custom-window-title\">\r\n <ng-content select=\"[panelTitle]\"></ng-content>\r\n </h5>\r\n <div class=\"modal-controls flex items-center\">\r\n <ng-content select=\"[panelActions]\"></ng-content>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"close()\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n <div class=\"modal-body w-full\">\r\n <ng-content select=\"[panelChat]\"></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n}\r\n", styles: ["@keyframes smooth-appear{0%{opacity:0}to{opacity:1}}:host{display:block;position:fixed;inset:0;z-index:1501!important}.custom-window-backdrop{position:fixed;inset:0;background-color:#0003;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1500!important}.custom-window-modal{position:relative;display:flex;justify-content:flex-end;z-index:1501!important}.custom-window-modal .modal-header{background:#fff;border-radius:0!important}.custom-window-modal .modal-controls{display:flex;align-items:center;justify-content:flex-end;gap:.5em}.custom-window-modal .modal-controls button{margin-left:.25em}.custom-window-modal .modal-body{height:calc(100% - 79px)!important;max-height:100%!important;padding:1em 0!important}.custom-window-modal .custom-window-container{display:flex;justify-content:flex-end;transition:all .4s ease}.custom-window-modal .custom-window-container.maximized,.custom-window-modal .custom-window-container.maximized .resizable-panel{flex:1}.custom-window-title{flex:1;overflow:hidden}.minimized-tab{position:fixed;bottom:10px;left:0;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.resizable-container{position:fixed;inset:0;display:flex;justify-content:flex-end;pointer-events:none;transition:all .4s ease;transform:translate(0);align-items:end}.resizable-container.resizing{background-color:#0000001a;pointer-events:auto}.resizable-panel{position:relative;flex:1;width:35vw;min-width:600px;height:100vh;background:#fff;pointer-events:auto;display:flex;flex-direction:column;align-items:end}.resize-handle{height:6px;cursor:ns-resize;background:#ccc;position:absolute;top:0;left:0;right:0}.resize-handle.horizontal{width:3px;height:100%;cursor:ew-resize;z-index:1500}.panel-content{flex:1;overflow:auto;width:100%}.custom-close-badge{top:-30%;right:-10%}.minimized-tab-1{left:115px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-2{left:230px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-3{left:345px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-4{left:460px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-5{left:575px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-6{left:690px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-7{left:805px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-8{left:920px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-9{left:1035px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-10{left:1150px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-11{left:1265px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-12{left:1380px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-13{left:1495px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-14{left:1610px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-15{left:1725px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-16{left:1840px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-17{left:1955px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-18{left:2070px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-19{left:2185px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-20{left:2300px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-1{right:115px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-2{right:230px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-3{right:345px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-4{right:460px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-5{right:575px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-6{right:690px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-7{right:805px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-8{right:920px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-9{right:1035px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-10{right:1150px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-11{right:1265px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-12{right:1380px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-13{right:1495px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-14{right:1610px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-15{right:1725px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-16{right:1840px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-17{right:1955px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-18{right:2070px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-19{right:2185px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-20{right:2300px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .custom-close-badge{left:-10%;right:auto}\n"], dependencies: [{ kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }], animations: [
|
|
1740
1738
|
trigger('slideInOut', [
|
|
1741
1739
|
transition(':enter', [
|
|
1742
1740
|
style({ transform: '{{enterTransform}}' }),
|
|
@@ -1760,15 +1758,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
|
|
|
1760
1758
|
animate('300ms cubic-bezier(0.4,0,0.2,1)', style({ transform: '{{leaveTransform}}' })),
|
|
1761
1759
|
], { params: { leaveTransform: 'translateX(100%)' } }),
|
|
1762
1760
|
]),
|
|
1763
|
-
], template: "<div class=\"custom-window-backdrop\"></div>\r\n@if (!isClosing) {\r\n <div\r\n class=\"custom-window-modal\"\r\n [class.compact]=\"compact\"\r\n [class.full-width]=\"fullWidth\"\r\n [@slideInOut]=\"{\r\n value: '',\r\n params: {\r\n enterTransform: enterTransform,\r\n leaveTransform: leaveTransform,\r\n },\r\n }\"\r\n (@slideInOut.done)=\"onAnimationDone($event)\"\r\n >\r\n <ng-content select=\"[panelCanvas]\"></ng-content>\r\n <div\r\n class=\"custom-window-container\"\r\n [class.maximized]=\"maximized\"\r\n [class.compact]=\"compact\"\r\n [class.full-width]=\"fullWidth\"\r\n >\r\n <ng-content select=\"[panelSidebar]\"></ng-content>\r\n <div\r\n class=\"resizable-panel\"\r\n [class.compact]=\"compact\"\r\n [class.full-width]=\"fullWidth\"\r\n >\r\n <div class=\"panel-content\">\r\n <div\r\n class=\"modal-header flex items-center justify-between p-4 border-bottom-1 border-b border-surface-300\"\r\n >\r\n <h5 class=\"modal-title custom-window-title\">\r\n <ng-content select=\"[panelTitle]\"></ng-content>\r\n </h5>\r\n <div class=\"modal-controls flex items-center\">\r\n <ng-content select=\"[panelActions]\"></ng-content>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"close()\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n <div class=\"modal-body w-full\">\r\n <ng-content select=\"[panelChat]\"></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n}\r\n", styles: ["@keyframes smooth-appear{0%{opacity:0}to{opacity:1}}:host{display:block;position:fixed;inset:0;z-index:1501!important}.custom-window-backdrop{position:fixed;inset:0;background-color:#0003;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1500!important}.custom-window-modal{position:fixed;inset:0;display:flex;justify-content:flex-end;align-items:stretch;min-height:0;min-width:0;z-index:1501!important}.custom-window-modal .modal-header{background:#fff;border-radius:0!important;gap:.75em;min-width:0}.custom-window-modal .modal-controls{display:flex;align-items:center;justify-content:flex-end;gap:.5em;flex-shrink:0;flex-wrap:wrap}.custom-window-modal .modal-controls button{margin-left:.25em}.custom-window-modal .modal-body{display:flex;flex:1 1 auto;min-height:0;max-height:none!important;padding:0!important}.custom-window-modal .custom-window-container{display:flex;justify-content:flex-end;transition:all .4s ease;height:100%;min-height:0;min-width:0;max-width:100%}.custom-window-modal .custom-window-container.maximized,.custom-window-modal .custom-window-container.maximized .resizable-panel{flex:1}.custom-window-modal.compact{justify-content:stretch}.custom-window-title{flex:1;min-width:0;overflow:hidden}.minimized-tab{position:fixed;bottom:10px;left:0;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.resizable-container{position:fixed;inset:0;display:flex;justify-content:flex-end;pointer-events:none;transition:all .4s ease;transform:translate(0);align-items:end}.resizable-container.resizing{background-color:#0000001a;pointer-events:auto}.resizable-panel{position:relative;flex:0 1 auto;width:clamp(22rem,35vw,44rem);min-width:22rem;height:100dvh;background:#fff;pointer-events:auto;display:flex;flex-direction:column;align-items:stretch;min-height:0;max-width:100vw}.custom-window-container.compact{flex:1 1 auto;width:100%}.resizable-panel.compact{flex:1 1 auto;width:min(100vw,44rem);min-width:0;max-width:100vw}@media(max-width:1023px){.custom-window-modal{justify-content:stretch}.custom-window-container{flex:1;width:100%}.resizable-panel{flex:1 1 auto;width:min(100vw,44rem);min-width:0;max-width:100vw}}@media(max-width:639px){.resizable-panel{width:100vw}}.custom-window-modal.full-width{justify-content:stretch}.custom-window-modal.full-width .modal-header{gap:.5em;padding:.875rem!important}.custom-window-modal.full-width .modal-controls{gap:.375em;flex-wrap:nowrap}.custom-window-modal.full-width .modal-controls button{margin-left:0}.custom-window-container.full-width{flex:1 1 auto;width:100%}.resizable-panel.full-width{flex:1 1 auto;width:100vw;min-width:0;max-width:100vw}.resize-handle{height:6px;cursor:ns-resize;background:#ccc;position:absolute;top:0;left:0;right:0}.resize-handle.horizontal{width:3px;height:100%;cursor:ew-resize;z-index:1500}.panel-content{flex:1;overflow:hidden;display:flex;flex-direction:column;min-height:0;width:100%}.custom-close-badge{top:-30%;right:-10%}.minimized-tab-1{left:115px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-2{left:230px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-3{left:345px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-4{left:460px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-5{left:575px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-6{left:690px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-7{left:805px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-8{left:920px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-9{left:1035px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-10{left:1150px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-11{left:1265px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-12{left:1380px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-13{left:1495px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-14{left:1610px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-15{left:1725px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-16{left:1840px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-17{left:1955px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-18{left:2070px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-19{left:2185px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-20{left:2300px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-1{right:115px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-2{right:230px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-3{right:345px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-4{right:460px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-5{right:575px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-6{right:690px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-7{right:805px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-8{right:920px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-9{right:1035px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-10{right:1150px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-11{right:1265px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-12{right:1380px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-13{right:1495px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-14{right:1610px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-15{right:1725px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-16{right:1840px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-17{right:1955px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-18{right:2070px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-19{right:2185px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-20{right:2300px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .custom-close-badge{left:-10%;right:auto}\n"] }]
|
|
1761
|
+
], template: "<div class=\"custom-window-backdrop\"></div>\r\n@if (!isClosing) {\r\n <div\r\n class=\"custom-window-modal\"\r\n [@slideInOut]=\"{\r\n value: '',\r\n params: {\r\n enterTransform: enterTransform,\r\n leaveTransform: leaveTransform,\r\n },\r\n }\"\r\n (@slideInOut.done)=\"onAnimationDone($event)\"\r\n >\r\n <ng-content select=\"[panelCanvas]\"></ng-content>\r\n <div class=\"custom-window-container\" [class.maximized]=\"maximized\">\r\n <ng-content select=\"[panelSidebar]\"></ng-content>\r\n <div class=\"resizable-panel\">\r\n <div class=\"panel-content\">\r\n <div\r\n class=\"modal-header flex items-center justify-between p-4 border-bottom-1 border-b border-surface-300\"\r\n >\r\n <h5 class=\"modal-title custom-window-title\">\r\n <ng-content select=\"[panelTitle]\"></ng-content>\r\n </h5>\r\n <div class=\"modal-controls flex items-center\">\r\n <ng-content select=\"[panelActions]\"></ng-content>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.x-close\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"close()\"\r\n ></mt-button>\r\n </div>\r\n </div>\r\n <div class=\"modal-body w-full\">\r\n <ng-content select=\"[panelChat]\"></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n}\r\n", styles: ["@keyframes smooth-appear{0%{opacity:0}to{opacity:1}}:host{display:block;position:fixed;inset:0;z-index:1501!important}.custom-window-backdrop{position:fixed;inset:0;background-color:#0003;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1500!important}.custom-window-modal{position:relative;display:flex;justify-content:flex-end;z-index:1501!important}.custom-window-modal .modal-header{background:#fff;border-radius:0!important}.custom-window-modal .modal-controls{display:flex;align-items:center;justify-content:flex-end;gap:.5em}.custom-window-modal .modal-controls button{margin-left:.25em}.custom-window-modal .modal-body{height:calc(100% - 79px)!important;max-height:100%!important;padding:1em 0!important}.custom-window-modal .custom-window-container{display:flex;justify-content:flex-end;transition:all .4s ease}.custom-window-modal .custom-window-container.maximized,.custom-window-modal .custom-window-container.maximized .resizable-panel{flex:1}.custom-window-title{flex:1;overflow:hidden}.minimized-tab{position:fixed;bottom:10px;left:0;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.resizable-container{position:fixed;inset:0;display:flex;justify-content:flex-end;pointer-events:none;transition:all .4s ease;transform:translate(0);align-items:end}.resizable-container.resizing{background-color:#0000001a;pointer-events:auto}.resizable-panel{position:relative;flex:1;width:35vw;min-width:600px;height:100vh;background:#fff;pointer-events:auto;display:flex;flex-direction:column;align-items:end}.resize-handle{height:6px;cursor:ns-resize;background:#ccc;position:absolute;top:0;left:0;right:0}.resize-handle.horizontal{width:3px;height:100%;cursor:ew-resize;z-index:1500}.panel-content{flex:1;overflow:auto;width:100%}.custom-close-badge{top:-30%;right:-10%}.minimized-tab-1{left:115px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-2{left:230px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-3{left:345px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-4{left:460px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-5{left:575px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-6{left:690px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-7{left:805px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-8{left:920px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-9{left:1035px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-10{left:1150px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-11{left:1265px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-12{left:1380px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-13{left:1495px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-14{left:1610px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-15{left:1725px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-16{left:1840px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-17{left:1955px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-18{left:2070px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-19{left:2185px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}.minimized-tab-20{left:2300px;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-1{right:115px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-2{right:230px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-3{right:345px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-4{right:460px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-5{right:575px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-6{right:690px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-7{right:805px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-8{right:920px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-9{right:1035px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-10{right:1150px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-11{right:1265px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-12{right:1380px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-13{right:1495px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-14{right:1610px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-15{right:1725px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-16{right:1840px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-17{right:1955px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-18{right:2070px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-19{right:2185px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .minimized-tab-20{right:2300px;left:auto;position:fixed;bottom:10px;z-index:1501;background-color:var(--primary-color, #2a2e34);color:#fff;border:none;padding:.5em 1em;border-radius:.25em;cursor:pointer}::ng-deep [lang=ar] .custom-close-badge{left:-10%;right:auto}\n"] }]
|
|
1764
1762
|
}], propDecorators: { title: [{
|
|
1765
1763
|
type: Input
|
|
1766
1764
|
}], maximized: [{
|
|
1767
1765
|
type: Input
|
|
1768
|
-
}], compact: [{
|
|
1769
|
-
type: Input
|
|
1770
|
-
}], fullWidth: [{
|
|
1771
|
-
type: Input
|
|
1772
1766
|
}], closed: [{
|
|
1773
1767
|
type: Output
|
|
1774
1768
|
}] } });
|
|
@@ -1779,8 +1773,6 @@ const initialCanvasData = {
|
|
|
1779
1773
|
conversationId: null,
|
|
1780
1774
|
};
|
|
1781
1775
|
class FarisComponent {
|
|
1782
|
-
compactBreakpoint = 1024;
|
|
1783
|
-
fullWidthCompactBreakpoint = 768;
|
|
1784
1776
|
showChatBot = false;
|
|
1785
1777
|
showChatBotChange = new EventEmitter();
|
|
1786
1778
|
showChatHistory = false;
|
|
@@ -1788,33 +1780,13 @@ class FarisComponent {
|
|
|
1788
1780
|
selectedConversation = null;
|
|
1789
1781
|
canvasData = initialCanvasData;
|
|
1790
1782
|
maximized = false;
|
|
1791
|
-
isCompactLayout = false;
|
|
1792
|
-
useFullWidthCompactPopup = false;
|
|
1793
1783
|
subscription;
|
|
1794
1784
|
subscriptions = new Subscription();
|
|
1795
1785
|
farisService = inject(FarisService);
|
|
1796
1786
|
confirmationService = inject(ConfirmationService);
|
|
1797
|
-
get showInlineCanvas() {
|
|
1798
|
-
return !this.isCompactLayout && this.canvasData.visible;
|
|
1799
|
-
}
|
|
1800
|
-
get showInlineSidebar() {
|
|
1801
|
-
return !this.isCompactLayout;
|
|
1802
|
-
}
|
|
1803
|
-
get showMobileHistoryOverlay() {
|
|
1804
|
-
return this.isCompactLayout && this.showChatHistory;
|
|
1805
|
-
}
|
|
1806
|
-
get showCompactCanvasSurface() {
|
|
1807
|
-
return this.isCompactLayout && this.canvasData.visible;
|
|
1808
|
-
}
|
|
1809
|
-
constructor() {
|
|
1810
|
-
this.updateLayoutMode();
|
|
1811
|
-
}
|
|
1812
1787
|
getUserDetails() {
|
|
1813
1788
|
this.subscriptions.add(this.farisService.getUserDetails().subscribe());
|
|
1814
1789
|
}
|
|
1815
|
-
onWindowResize() {
|
|
1816
|
-
this.updateLayoutMode();
|
|
1817
|
-
}
|
|
1818
1790
|
ngOnChanges(changes) {
|
|
1819
1791
|
if (!changes['showChatBot']) {
|
|
1820
1792
|
return;
|
|
@@ -1860,9 +1832,6 @@ class FarisComponent {
|
|
|
1860
1832
|
}
|
|
1861
1833
|
onSelectConversation(conversation) {
|
|
1862
1834
|
this.selectConversation(conversation);
|
|
1863
|
-
if (this.isCompactLayout) {
|
|
1864
|
-
this.showChatHistory = false;
|
|
1865
|
-
}
|
|
1866
1835
|
}
|
|
1867
1836
|
onCloseHistory() {
|
|
1868
1837
|
this.showChatHistory = false;
|
|
@@ -1905,9 +1874,6 @@ class FarisComponent {
|
|
|
1905
1874
|
}
|
|
1906
1875
|
openNewChat() {
|
|
1907
1876
|
this.selectConversation(null);
|
|
1908
|
-
if (this.isCompactLayout) {
|
|
1909
|
-
this.showChatHistory = false;
|
|
1910
|
-
}
|
|
1911
1877
|
}
|
|
1912
1878
|
ngOnDestroy() {
|
|
1913
1879
|
if (this.subscription && !this.subscription.closed) {
|
|
@@ -1938,20 +1904,8 @@ class FarisComponent {
|
|
|
1938
1904
|
this.subscription.unsubscribe();
|
|
1939
1905
|
}
|
|
1940
1906
|
}
|
|
1941
|
-
getViewportWidth() {
|
|
1942
|
-
if (typeof window === 'undefined') {
|
|
1943
|
-
return Number.MAX_SAFE_INTEGER;
|
|
1944
|
-
}
|
|
1945
|
-
return window.innerWidth;
|
|
1946
|
-
}
|
|
1947
|
-
updateLayoutMode() {
|
|
1948
|
-
const viewportWidth = this.getViewportWidth();
|
|
1949
|
-
this.isCompactLayout = viewportWidth < this.compactBreakpoint;
|
|
1950
|
-
this.useFullWidthCompactPopup =
|
|
1951
|
-
viewportWidth <= this.fullWidthCompactBreakpoint;
|
|
1952
|
-
}
|
|
1953
1907
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: FarisComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1954
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: FarisComponent, isStandalone: true, selector: "mt-faris", inputs: { showChatBot: "showChatBot" }, outputs: { showChatBotChange: "showChatBotChange" },
|
|
1908
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: FarisComponent, isStandalone: true, selector: "mt-faris", inputs: { showChatBot: "showChatBot" }, outputs: { showChatBotChange: "showChatBotChange" }, usesOnChanges: true, ngImport: i0, template: "@if (showChatBot) {\r\n <mt-faris-popup\r\n class=\"chat-bot-popup\"\r\n [maximized]=\"maximized && !canvasData.visible\"\r\n (closed)=\"closeChatBot()\"\r\n >\r\n <div panelTitle class=\"faris-title-container\">\r\n <div class=\"gemini-ic has-hover\">\r\n <svg\r\n focusable=\"false\"\r\n viewBox=\"0 -960 960 960\"\r\n height=\"28\"\r\n width=\"28\"\r\n class=\"EiVpKc aoH\"\r\n >\r\n <path\r\n d=\"M480-80q2,0 2-2q0-82 31-154t85-126t126-85t154-31q2,0 2-2t-2-2q-82,0-154-31T598-598T513-724T482-878q0-2-2-2t-2,2q0,82-31,154T362-598T236-513T82-482q-2,0-2,2t2,2q82,0 154,31t126,85t85,126T478-82q0,2 2,2Z\"\r\n ></path>\r\n </svg>\r\n </div>\r\n <div class=\"faris-title-group\">\r\n <div class=\"faris-title\">Ask Faris</div>\r\n <div\r\n class=\"faris-subtitle\"\r\n [title]=\"(selectedConversation?.title | parseMention) ?? ''\"\r\n >\r\n {{\r\n (selectedConversation?.title | parseMention) ||\r\n (\"faris.new-conversation\" | translate)\r\n }}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <ng-container panelActions>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.plus\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"openNewChat()\"\r\n ></mt-button>\r\n <mt-button\r\n type=\"button\"\r\n [icon]=\"maximized ? 'layout.minimize-02' : 'layout.maximize-02'\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"maximized = !maximized\"\r\n ></mt-button>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"custom.history-sp\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"toggleChatHistory()\"\r\n ></mt-button>\r\n </ng-container>\r\n\r\n @if (canvasData.visible) {\r\n <mt-faris-canvas\r\n [message]=\"canvasData.message\"\r\n [conversationId]=\"canvasData.conversationId\"\r\n class=\"flex-1\"\r\n panelCanvas\r\n (closed)=\"canvasData.visible = false\"\r\n ></mt-faris-canvas>\r\n }\r\n\r\n <mt-faris-chat-history\r\n panelSidebar\r\n [userConversations]=\"userConversations\"\r\n [showChatHistory]=\"showChatHistory\"\r\n [selectedConversation]=\"selectedConversation\"\r\n (selectConversation)=\"onSelectConversation($event)\"\r\n (deleteConversationHandler)=\"onDeleteConversationHandler($event)\"\r\n (closeHistory)=\"onCloseHistory()\"\r\n >\r\n </mt-faris-chat-history>\r\n\r\n <div panelChat class=\"flex h-full w-full\">\r\n <mt-faris-chat\r\n class=\"w-full\"\r\n (launchCanvas)=\"launchCanvas($event)\"\r\n (selectConversation)=\"onSelectConversation($event)\"\r\n [selectedConversation]=\"selectedConversation\"\r\n >\r\n </mt-faris-chat>\r\n </div>\r\n </mt-faris-popup>\r\n}\r\n", styles: [":host{font-size:15.4545px}::ng-deep :root{--faris-border-radius: 8px;--faris-sm-border-radius: 5px;--faris-lg-border-radius: 10px}::ng-deep .faris-btn{display:flex;align-items:center;justify-content:center;border:1px solid transparent;background-color:transparent;border-radius:var(--faris-sm-border-radius);width:2em;height:2em;cursor:pointer;font-size:1.1em;padding:0;transition:all .2s ease}::ng-deep .faris-btn-muted{color:#99a1af}::ng-deep .faris-btn:hover{background-color:#0000000d}::ng-deep .faris-btn-lg{width:2.5em;height:2.5em;font-size:1.4em}::ng-deep .faris-btn:disabled{cursor:not-allowed;opacity:.7}::ng-deep .gemini-ic{display:inline-block;cursor:pointer;transition:transform .3s ease;transform-origin:center center;position:relative}::ng-deep .gemini-ic svg{fill:#4a90e2;transition:fill .3s ease;filter:drop-shadow(0 0 2px rgba(74,144,226,.5))}::ng-deep .gemini-ic.has-hover:hover{animation:gemini-hover-animation 1.5s infinite alternate ease-in-out;transform-origin:center center}::ng-deep .gemini-ic:hover svg{fill:#4a90e2;filter:drop-shadow(0 0 8px rgba(123,207,255,.9))}::ng-deep .gemini-ic.rotating{display:flex;width:22px;height:22px;animation:rotate 2s linear infinite;transform-origin:center center}@keyframes gemini-hover-animation{0%{transform:scale(1) rotate(0);filter:drop-shadow(0 0 2px rgba(74,144,226,.5))}50%{transform:scale(1.15) rotate(10deg);filter:drop-shadow(0 0 12px rgb(123,207,255))}to{transform:scale(1) rotate(-10deg);filter:drop-shadow(0 0 2px rgba(74,144,226,.5))}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.faris-title-container{display:flex;align-items:center;font-weight:500;gap:.5em;overflow:hidden}.faris-title-container .faris-title-group{flex:1;overflow:hidden}.faris-title-container .faris-title-group .faris-title{font-size:1em}.faris-title-container .faris-title-group .faris-subtitle{font-size:.9em;opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.closed-chat-history-side{min-width:60px!important}.hide-shadow-btn:focus{box-shadow:none!important}.conversation-item{height:40px}.conversation-item.active-conversation{background-color:var(--primary-color);color:var(--white)}.conversation-item.active-conversation mt-icon{color:var(--white)}.conversation-item label{font-size:15px;font-weight:600;line-height:20px}\n"], dependencies: [{ kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: MinimizablePopupComponent, selector: "mt-faris-popup", inputs: ["title", "maximized"], outputs: ["closed"] }, { kind: "component", type: FarisCanvasComponent, selector: "mt-faris-canvas", inputs: ["message", "conversationId"], outputs: ["closed"] }, { kind: "component", type: FarisChatHistoryComponent, selector: "mt-faris-chat-history", inputs: ["userConversations", "showChatHistory", "selectedConversation"], outputs: ["selectConversation", "deleteConversationHandler", "closeHistory"] }, { kind: "component", type: FarisChatComponent, selector: "mt-faris-chat", inputs: ["selectedConversation"], outputs: ["launchCanvas", "selectConversation"] }, { kind: "pipe", type: ParseMentionPipe, name: "parseMention" }, { kind: "pipe", type: FarisTranslatePipe, name: "translate" }] });
|
|
1955
1909
|
}
|
|
1956
1910
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: FarisComponent, decorators: [{
|
|
1957
1911
|
type: Component,
|
|
@@ -1963,14 +1917,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
|
|
|
1963
1917
|
FarisCanvasComponent,
|
|
1964
1918
|
FarisChatHistoryComponent,
|
|
1965
1919
|
FarisChatComponent,
|
|
1966
|
-
], template: "@if (showChatBot) {\r\n <mt-faris-popup\r\n class=\"chat-bot-popup\"\r\n [maximized]=\"maximized && !canvasData.visible
|
|
1967
|
-
}],
|
|
1920
|
+
], template: "@if (showChatBot) {\r\n <mt-faris-popup\r\n class=\"chat-bot-popup\"\r\n [maximized]=\"maximized && !canvasData.visible\"\r\n (closed)=\"closeChatBot()\"\r\n >\r\n <div panelTitle class=\"faris-title-container\">\r\n <div class=\"gemini-ic has-hover\">\r\n <svg\r\n focusable=\"false\"\r\n viewBox=\"0 -960 960 960\"\r\n height=\"28\"\r\n width=\"28\"\r\n class=\"EiVpKc aoH\"\r\n >\r\n <path\r\n d=\"M480-80q2,0 2-2q0-82 31-154t85-126t126-85t154-31q2,0 2-2t-2-2q-82,0-154-31T598-598T513-724T482-878q0-2-2-2t-2,2q0,82-31,154T362-598T236-513T82-482q-2,0-2,2t2,2q82,0 154,31t126,85t85,126T478-82q0,2 2,2Z\"\r\n ></path>\r\n </svg>\r\n </div>\r\n <div class=\"faris-title-group\">\r\n <div class=\"faris-title\">Ask Faris</div>\r\n <div\r\n class=\"faris-subtitle\"\r\n [title]=\"(selectedConversation?.title | parseMention) ?? ''\"\r\n >\r\n {{\r\n (selectedConversation?.title | parseMention) ||\r\n (\"faris.new-conversation\" | translate)\r\n }}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <ng-container panelActions>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"general.plus\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"openNewChat()\"\r\n ></mt-button>\r\n <mt-button\r\n type=\"button\"\r\n [icon]=\"maximized ? 'layout.minimize-02' : 'layout.maximize-02'\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"maximized = !maximized\"\r\n ></mt-button>\r\n <mt-button\r\n type=\"button\"\r\n icon=\"custom.history-sp\"\r\n variant=\"text\"\r\n styleClass=\"faris-btn\"\r\n (click)=\"toggleChatHistory()\"\r\n ></mt-button>\r\n </ng-container>\r\n\r\n @if (canvasData.visible) {\r\n <mt-faris-canvas\r\n [message]=\"canvasData.message\"\r\n [conversationId]=\"canvasData.conversationId\"\r\n class=\"flex-1\"\r\n panelCanvas\r\n (closed)=\"canvasData.visible = false\"\r\n ></mt-faris-canvas>\r\n }\r\n\r\n <mt-faris-chat-history\r\n panelSidebar\r\n [userConversations]=\"userConversations\"\r\n [showChatHistory]=\"showChatHistory\"\r\n [selectedConversation]=\"selectedConversation\"\r\n (selectConversation)=\"onSelectConversation($event)\"\r\n (deleteConversationHandler)=\"onDeleteConversationHandler($event)\"\r\n (closeHistory)=\"onCloseHistory()\"\r\n >\r\n </mt-faris-chat-history>\r\n\r\n <div panelChat class=\"flex h-full w-full\">\r\n <mt-faris-chat\r\n class=\"w-full\"\r\n (launchCanvas)=\"launchCanvas($event)\"\r\n (selectConversation)=\"onSelectConversation($event)\"\r\n [selectedConversation]=\"selectedConversation\"\r\n >\r\n </mt-faris-chat>\r\n </div>\r\n </mt-faris-popup>\r\n}\r\n", styles: [":host{font-size:15.4545px}::ng-deep :root{--faris-border-radius: 8px;--faris-sm-border-radius: 5px;--faris-lg-border-radius: 10px}::ng-deep .faris-btn{display:flex;align-items:center;justify-content:center;border:1px solid transparent;background-color:transparent;border-radius:var(--faris-sm-border-radius);width:2em;height:2em;cursor:pointer;font-size:1.1em;padding:0;transition:all .2s ease}::ng-deep .faris-btn-muted{color:#99a1af}::ng-deep .faris-btn:hover{background-color:#0000000d}::ng-deep .faris-btn-lg{width:2.5em;height:2.5em;font-size:1.4em}::ng-deep .faris-btn:disabled{cursor:not-allowed;opacity:.7}::ng-deep .gemini-ic{display:inline-block;cursor:pointer;transition:transform .3s ease;transform-origin:center center;position:relative}::ng-deep .gemini-ic svg{fill:#4a90e2;transition:fill .3s ease;filter:drop-shadow(0 0 2px rgba(74,144,226,.5))}::ng-deep .gemini-ic.has-hover:hover{animation:gemini-hover-animation 1.5s infinite alternate ease-in-out;transform-origin:center center}::ng-deep .gemini-ic:hover svg{fill:#4a90e2;filter:drop-shadow(0 0 8px rgba(123,207,255,.9))}::ng-deep .gemini-ic.rotating{display:flex;width:22px;height:22px;animation:rotate 2s linear infinite;transform-origin:center center}@keyframes gemini-hover-animation{0%{transform:scale(1) rotate(0);filter:drop-shadow(0 0 2px rgba(74,144,226,.5))}50%{transform:scale(1.15) rotate(10deg);filter:drop-shadow(0 0 12px rgb(123,207,255))}to{transform:scale(1) rotate(-10deg);filter:drop-shadow(0 0 2px rgba(74,144,226,.5))}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.faris-title-container{display:flex;align-items:center;font-weight:500;gap:.5em;overflow:hidden}.faris-title-container .faris-title-group{flex:1;overflow:hidden}.faris-title-container .faris-title-group .faris-title{font-size:1em}.faris-title-container .faris-title-group .faris-subtitle{font-size:.9em;opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.closed-chat-history-side{min-width:60px!important}.hide-shadow-btn:focus{box-shadow:none!important}.conversation-item{height:40px}.conversation-item.active-conversation{background-color:var(--primary-color);color:var(--white)}.conversation-item.active-conversation mt-icon{color:var(--white)}.conversation-item label{font-size:15px;font-weight:600;line-height:20px}\n"] }]
|
|
1921
|
+
}], propDecorators: { showChatBot: [{
|
|
1968
1922
|
type: Input
|
|
1969
1923
|
}], showChatBotChange: [{
|
|
1970
1924
|
type: Output
|
|
1971
|
-
}], onWindowResize: [{
|
|
1972
|
-
type: HostListener,
|
|
1973
|
-
args: ['window:resize']
|
|
1974
1925
|
}] } });
|
|
1975
1926
|
|
|
1976
1927
|
/**
|