@datarailsshared/datarailsshared 1.6.37 → 1.6.41
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/datarailsshared-datarailsshared-1.6.41.tgz +0 -0
- package/esm2022/lib/dr-chat/chat.component.mjs +6 -3
- package/esm2022/lib/dr-chat/chat.module.mjs +4 -3
- package/esm2022/lib/dr-chat/dr-chat-dropped-files/dr-chat-dropped-files.component.mjs +18 -14
- package/esm2022/lib/dr-chat/dr-chat-dropped-files/pipes/file-class-name.pipe.mjs +26 -0
- package/esm2022/lib/dr-chat/dr-chat-form-dropdown/dr-chat-form-dropdown.component.mjs +32 -31
- package/fesm2022/datarailsshared-datarailsshared.mjs +78 -47
- package/fesm2022/datarailsshared-datarailsshared.mjs.map +1 -1
- package/lib/dr-chat/chat.component.d.ts +2 -1
- package/lib/dr-chat/chat.module.d.ts +8 -7
- package/lib/dr-chat/dr-chat-dropped-files/pipes/file-class-name.pipe.d.ts +7 -0
- package/lib/dr-chat/dr-chat-form-dropdown/dr-chat-form-dropdown.component.d.ts +2 -2
- package/package.json +1 -1
- package/datarailsshared-datarailsshared-1.6.37.tgz +0 -0
|
@@ -6295,26 +6295,53 @@ class ShorterNamingPipe {
|
|
|
6295
6295
|
}]
|
|
6296
6296
|
}], null, null); })();
|
|
6297
6297
|
|
|
6298
|
-
|
|
6298
|
+
class FileClassNamePipe {
|
|
6299
|
+
transform(filename) {
|
|
6300
|
+
if (!filename)
|
|
6301
|
+
return 'file';
|
|
6302
|
+
const extension = filename.split('.').pop()?.toLowerCase();
|
|
6303
|
+
switch (extension) {
|
|
6304
|
+
case 'csv':
|
|
6305
|
+
case 'xls':
|
|
6306
|
+
case 'xlsx':
|
|
6307
|
+
return 'filter-logo_excel-svg';
|
|
6308
|
+
default:
|
|
6309
|
+
return 'file';
|
|
6310
|
+
}
|
|
6311
|
+
}
|
|
6312
|
+
/** @nocollapse */ static { this.ɵfac = function FileClassNamePipe_Factory(t) { return new (t || FileClassNamePipe)(); }; }
|
|
6313
|
+
/** @nocollapse */ static { this.ɵpipe = /** @pureOrBreakMyCode */ i0.ɵɵdefinePipe({ name: "fileClassName", type: FileClassNamePipe, pure: true }); }
|
|
6314
|
+
}
|
|
6315
|
+
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FileClassNamePipe, [{
|
|
6316
|
+
type: Pipe,
|
|
6317
|
+
args: [{
|
|
6318
|
+
name: 'fileClassName',
|
|
6319
|
+
}]
|
|
6320
|
+
}], null, null); })();
|
|
6321
|
+
|
|
6322
|
+
function DrChatDroppedFilesComponent_div_1_i_6_Template(rf, ctx) { if (rf & 1) {
|
|
6299
6323
|
const _r5 = i0.ɵɵgetCurrentView();
|
|
6300
|
-
i0.ɵɵelementStart(0, "i",
|
|
6301
|
-
i0.ɵɵlistener("click", function
|
|
6324
|
+
i0.ɵɵelementStart(0, "i", 5);
|
|
6325
|
+
i0.ɵɵlistener("click", function DrChatDroppedFilesComponent_div_1_i_6_Template_i_click_0_listener($event) { i0.ɵɵrestoreView(_r5); const file_r1 = i0.ɵɵnextContext().$implicit; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.removeFile(file_r1, $event)); });
|
|
6302
6326
|
i0.ɵɵelementEnd();
|
|
6303
6327
|
} }
|
|
6304
6328
|
function DrChatDroppedFilesComponent_div_1_Template(rf, ctx) { if (rf & 1) {
|
|
6305
6329
|
i0.ɵɵelementStart(0, "div", 2);
|
|
6306
|
-
i0.ɵɵelement(1, "i"
|
|
6307
|
-
i0.ɵɵ
|
|
6308
|
-
i0.ɵɵ
|
|
6309
|
-
i0.ɵɵ
|
|
6330
|
+
i0.ɵɵelement(1, "i");
|
|
6331
|
+
i0.ɵɵpipe(2, "fileClassName");
|
|
6332
|
+
i0.ɵɵelementStart(3, "div", 3);
|
|
6333
|
+
i0.ɵɵtext(4);
|
|
6334
|
+
i0.ɵɵpipe(5, "shorterNaming");
|
|
6310
6335
|
i0.ɵɵelementEnd();
|
|
6311
|
-
i0.ɵɵtemplate(
|
|
6336
|
+
i0.ɵɵtemplate(6, DrChatDroppedFilesComponent_div_1_i_6_Template, 1, 0, "i", 4);
|
|
6312
6337
|
i0.ɵɵelementEnd();
|
|
6313
6338
|
} if (rf & 2) {
|
|
6314
6339
|
const file_r1 = ctx.$implicit;
|
|
6315
6340
|
const ctx_r0 = i0.ɵɵnextContext();
|
|
6341
|
+
i0.ɵɵadvance(1);
|
|
6342
|
+
i0.ɵɵclassMapInterpolate1("dr-icon-", i0.ɵɵpipeBind1(2, 5, file_r1.name), "");
|
|
6316
6343
|
i0.ɵɵadvance(3);
|
|
6317
|
-
i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(
|
|
6344
|
+
i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(5, 7, file_r1.name, ctx_r0.maxLengthText));
|
|
6318
6345
|
i0.ɵɵadvance(2);
|
|
6319
6346
|
i0.ɵɵproperty("ngIf", ctx_r0.isRemovable);
|
|
6320
6347
|
} }
|
|
@@ -6330,18 +6357,18 @@ class DrChatDroppedFilesComponent {
|
|
|
6330
6357
|
this.removeFileEvent.emit(file);
|
|
6331
6358
|
}
|
|
6332
6359
|
/** @nocollapse */ static { this.ɵfac = function DrChatDroppedFilesComponent_Factory(t) { return new (t || DrChatDroppedFilesComponent)(); }; }
|
|
6333
|
-
/** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChatDroppedFilesComponent, selectors: [["dr-chat-dropped-files"]], inputs: { files: "files", isRemovable: "isRemovable", maxLengthText: "maxLengthText" }, outputs: { removeFileEvent: "removeFileEvent" }, decls: 2, vars: 1, consts: [[1, "dropped-files"], ["class", "dropped-files__item", 4, "ngFor", "ngForOf"], [1, "dropped-files__item"], [1, "
|
|
6360
|
+
/** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrChatDroppedFilesComponent, selectors: [["dr-chat-dropped-files"]], inputs: { files: "files", isRemovable: "isRemovable", maxLengthText: "maxLengthText" }, outputs: { removeFileEvent: "removeFileEvent" }, decls: 2, vars: 1, consts: [[1, "dropped-files"], ["class", "dropped-files__item", 4, "ngFor", "ngForOf"], [1, "dropped-files__item"], [1, "dropped-files__item-name"], ["class", "dr-icon-noty-error dropped-files__item-remove", 3, "click", 4, "ngIf"], [1, "dr-icon-noty-error", "dropped-files__item-remove", 3, "click"]], template: function DrChatDroppedFilesComponent_Template(rf, ctx) { if (rf & 1) {
|
|
6334
6361
|
i0.ɵɵelementStart(0, "div", 0);
|
|
6335
|
-
i0.ɵɵtemplate(1, DrChatDroppedFilesComponent_div_1_Template,
|
|
6362
|
+
i0.ɵɵtemplate(1, DrChatDroppedFilesComponent_div_1_Template, 7, 10, "div", 1);
|
|
6336
6363
|
i0.ɵɵelementEnd();
|
|
6337
6364
|
} if (rf & 2) {
|
|
6338
6365
|
i0.ɵɵadvance(1);
|
|
6339
6366
|
i0.ɵɵproperty("ngForOf", ctx.files);
|
|
6340
|
-
} }, dependencies: [i1.NgForOf, i1.NgIf, ShorterNamingPipe], styles: [".dropped-files[_ngcontent-%COMP%]{display:flex;flex-direction:row;margin-bottom:.5rem;flex-wrap:wrap;gap:8px;padding-left:16px}.dropped-files__item[_ngcontent-%COMP%]{max-width:183px;display:flex;flex-direction:row;gap:4px;justify-content:space-between;align-items:center;margin-top:16px;padding:4px 8px;background-color:#f6f7f8;border:1px solid rgb(223,224,227);box-sizing:border-box;border-radius:8px}.dropped-files__item-name[_ngcontent-%COMP%]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:Poppins,sans-serif;font-size:12px;line-height:20px;font-weight:500;font-weight:400;color:#6d6e6f}.dropped-files__item-remove[_ngcontent-%COMP%]{cursor:pointer;color:#6d6e6f}"], changeDetection: 0 }); }
|
|
6367
|
+
} }, dependencies: [i1.NgForOf, i1.NgIf, ShorterNamingPipe, FileClassNamePipe], styles: [".dropped-files[_ngcontent-%COMP%]{display:flex;flex-direction:row;margin-bottom:.5rem;flex-wrap:wrap;gap:8px;padding-left:16px}.dropped-files__item[_ngcontent-%COMP%]{max-width:183px;display:flex;flex-direction:row;gap:4px;justify-content:space-between;align-items:center;margin-top:16px;padding:4px 8px;background-color:#f6f7f8;border:1px solid rgb(223,224,227);box-sizing:border-box;border-radius:8px}.dropped-files__item-name[_ngcontent-%COMP%]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:Poppins,sans-serif;font-size:12px;line-height:20px;font-weight:500;font-weight:400;color:#6d6e6f}.dropped-files__item-remove[_ngcontent-%COMP%]{cursor:pointer;color:#6d6e6f}"], changeDetection: 0 }); }
|
|
6341
6368
|
}
|
|
6342
6369
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrChatDroppedFilesComponent, [{
|
|
6343
6370
|
type: Component,
|
|
6344
|
-
args: [{ selector: 'dr-chat-dropped-files', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dropped-files\">\n <div class=\"dropped-files__item\" *ngFor=\"let file of files\">\n <i class=\"dr-icon-file\"></i>\n <div class=\"dropped-files__item-name\">{{ file.name | shorterNaming: maxLengthText }}</div>\n <i *ngIf=\"isRemovable\" class=\"dr-icon-noty-error dropped-files__item-remove\" (click)=\"removeFile(file, $event)\"></i>\n </div>\n</div>\n", styles: [".dropped-files{display:flex;flex-direction:row;margin-bottom:.5rem;flex-wrap:wrap;gap:8px;padding-left:16px}.dropped-files__item{max-width:183px;display:flex;flex-direction:row;gap:4px;justify-content:space-between;align-items:center;margin-top:16px;padding:4px 8px;background-color:#f6f7f8;border:1px solid rgb(223,224,227);box-sizing:border-box;border-radius:8px}.dropped-files__item-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:Poppins,sans-serif;font-size:12px;line-height:20px;font-weight:500;font-weight:400;color:#6d6e6f}.dropped-files__item-remove{cursor:pointer;color:#6d6e6f}\n"] }]
|
|
6371
|
+
args: [{ selector: 'dr-chat-dropped-files', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dropped-files\">\n <div class=\"dropped-files__item\" *ngFor=\"let file of files\">\n <i class=\"dr-icon-{{ file.name | fileClassName }}\"></i>\n <div class=\"dropped-files__item-name\">{{ file.name | shorterNaming: maxLengthText }}</div>\n <i *ngIf=\"isRemovable\" class=\"dr-icon-noty-error dropped-files__item-remove\" (click)=\"removeFile(file, $event)\"></i>\n </div>\n</div>\n", styles: [".dropped-files{display:flex;flex-direction:row;margin-bottom:.5rem;flex-wrap:wrap;gap:8px;padding-left:16px}.dropped-files__item{max-width:183px;display:flex;flex-direction:row;gap:4px;justify-content:space-between;align-items:center;margin-top:16px;padding:4px 8px;background-color:#f6f7f8;border:1px solid rgb(223,224,227);box-sizing:border-box;border-radius:8px}.dropped-files__item-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:Poppins,sans-serif;font-size:12px;line-height:20px;font-weight:500;font-weight:400;color:#6d6e6f}.dropped-files__item-remove{cursor:pointer;color:#6d6e6f}\n"] }]
|
|
6345
6372
|
}], null, { files: [{
|
|
6346
6373
|
type: Input
|
|
6347
6374
|
}], isRemovable: [{
|
|
@@ -6797,6 +6824,7 @@ class DrChatComponent {
|
|
|
6797
6824
|
* @type {boolean}
|
|
6798
6825
|
*/
|
|
6799
6826
|
this.waitForReply = false;
|
|
6827
|
+
this.scrollDelay = 250;
|
|
6800
6828
|
this.suggestionSelect = new EventEmitter();
|
|
6801
6829
|
}
|
|
6802
6830
|
ngAfterViewInit() {
|
|
@@ -6823,7 +6851,7 @@ class DrChatComponent {
|
|
|
6823
6851
|
this.messagesContainer.nativeElement.scrollTo(scrollToOptions);
|
|
6824
6852
|
this.cdr.markForCheck();
|
|
6825
6853
|
}
|
|
6826
|
-
});
|
|
6854
|
+
}, this.scrollDelay);
|
|
6827
6855
|
}
|
|
6828
6856
|
ngOnDestroy() {
|
|
6829
6857
|
this.destroy$.next();
|
|
@@ -6856,7 +6884,7 @@ class DrChatComponent {
|
|
|
6856
6884
|
let _t;
|
|
6857
6885
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.messagesContainer = _t.first);
|
|
6858
6886
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx._chatSuggestions = _t.first);
|
|
6859
|
-
} }, inputs: { fullScreen: "fullScreen", noMessagesPlaceholder: "noMessagesPlaceholder", contentUpdateSubject: "contentUpdateSubject", scrollBottom: "scrollBottom", suggestions: "suggestions", reopen: "reopen", waitForReply: "waitForReply" }, outputs: { suggestionSelect: "suggestionSelect" }, features: [i0.ɵɵProvidersFeature([DrChatCustomMessageService])], ngContentSelectors: _c3$3, decls: 11, vars: 6, consts: [[1, "chat"], [1, "chat__sticky-top"], [3, "ngTemplateOutlet", 4, "ngIf"], [1, "chat__alert"], ["class", "chat__empty-state", 4, "ngIf"], ["class", "chat__messages", 4, "ngIf"], ["class", "chat__suggestions", 3, "values", "fullScreen", "waitForReply", "chat__suggestions--full-height", "buttonMode", "suggestionSelect", 4, "ngIf"], [1, "form"], [3, "ngTemplateOutlet"], [1, "chat__empty-state"], [1, "chat__empty-state__text"], [1, "chat__messages"], [1, "chat__messages__container"], ["messagesContainer", ""], [1, "chat__suggestions", 3, "values", "fullScreen", "waitForReply", "buttonMode", "suggestionSelect"]], template: function DrChatComponent_Template(rf, ctx) { if (rf & 1) {
|
|
6887
|
+
} }, inputs: { fullScreen: "fullScreen", noMessagesPlaceholder: "noMessagesPlaceholder", contentUpdateSubject: "contentUpdateSubject", scrollBottom: "scrollBottom", suggestions: "suggestions", reopen: "reopen", waitForReply: "waitForReply", scrollDelay: "scrollDelay" }, outputs: { suggestionSelect: "suggestionSelect" }, features: [i0.ɵɵProvidersFeature([DrChatCustomMessageService])], ngContentSelectors: _c3$3, decls: 11, vars: 6, consts: [[1, "chat"], [1, "chat__sticky-top"], [3, "ngTemplateOutlet", 4, "ngIf"], [1, "chat__alert"], ["class", "chat__empty-state", 4, "ngIf"], ["class", "chat__messages", 4, "ngIf"], ["class", "chat__suggestions", 3, "values", "fullScreen", "waitForReply", "chat__suggestions--full-height", "buttonMode", "suggestionSelect", 4, "ngIf"], [1, "form"], [3, "ngTemplateOutlet"], [1, "chat__empty-state"], [1, "chat__empty-state__text"], [1, "chat__messages"], [1, "chat__messages__container"], ["messagesContainer", ""], [1, "chat__suggestions", 3, "values", "fullScreen", "waitForReply", "buttonMode", "suggestionSelect"]], template: function DrChatComponent_Template(rf, ctx) { if (rf & 1) {
|
|
6860
6888
|
i0.ɵɵprojectionDef(_c2$3);
|
|
6861
6889
|
i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
|
|
6862
6890
|
i0.ɵɵtemplate(2, DrChatComponent_ng_container_2_Template, 1, 1, "ng-container", 2);
|
|
@@ -6899,6 +6927,8 @@ class DrChatComponent {
|
|
|
6899
6927
|
type: Input
|
|
6900
6928
|
}], waitForReply: [{
|
|
6901
6929
|
type: Input
|
|
6930
|
+
}], scrollDelay: [{
|
|
6931
|
+
type: Input
|
|
6902
6932
|
}], messagesContainer: [{
|
|
6903
6933
|
type: ViewChild,
|
|
6904
6934
|
args: ['messagesContainer']
|
|
@@ -6920,29 +6950,29 @@ class DrChatComponent {
|
|
|
6920
6950
|
|
|
6921
6951
|
const _c0$n = ["textAreaElement"];
|
|
6922
6952
|
const _c1$9 = ["fileInput"];
|
|
6923
|
-
function
|
|
6953
|
+
function DrChatFormDropdownComponent_dr_chat_dropped_files_3_Template(rf, ctx) { if (rf & 1) {
|
|
6924
6954
|
const _r7 = i0.ɵɵgetCurrentView();
|
|
6925
6955
|
i0.ɵɵelementStart(0, "dr-chat-dropped-files", 12);
|
|
6926
|
-
i0.ɵɵlistener("removeFileEvent", function
|
|
6956
|
+
i0.ɵɵlistener("removeFileEvent", function DrChatFormDropdownComponent_dr_chat_dropped_files_3_Template_dr_chat_dropped_files_removeFileEvent_0_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r6 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r6.removeFile($event)); });
|
|
6927
6957
|
i0.ɵɵpipe(1, "async");
|
|
6928
6958
|
i0.ɵɵelementEnd();
|
|
6929
6959
|
} if (rf & 2) {
|
|
6930
6960
|
const ctx_r0 = i0.ɵɵnextContext();
|
|
6931
6961
|
i0.ɵɵproperty("files", i0.ɵɵpipeBind1(1, 3, ctx_r0.droppedFiles$))("isRemovable", true)("maxLengthText", 15);
|
|
6932
6962
|
} }
|
|
6933
|
-
function
|
|
6963
|
+
function DrChatFormDropdownComponent_i_13_Template(rf, ctx) { if (rf & 1) {
|
|
6934
6964
|
const _r9 = i0.ɵɵgetCurrentView();
|
|
6935
6965
|
i0.ɵɵelementStart(0, "i", 13);
|
|
6936
|
-
i0.ɵɵlistener("click", function
|
|
6966
|
+
i0.ɵɵlistener("click", function DrChatFormDropdownComponent_i_13_Template_i_click_0_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r8 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r8.sendMessage($event)); });
|
|
6937
6967
|
i0.ɵɵelementEnd();
|
|
6938
6968
|
} }
|
|
6939
|
-
function
|
|
6969
|
+
function DrChatFormDropdownComponent_i_14_Template(rf, ctx) { if (rf & 1) {
|
|
6940
6970
|
const _r11 = i0.ɵɵgetCurrentView();
|
|
6941
6971
|
i0.ɵɵelementStart(0, "i", 14);
|
|
6942
|
-
i0.ɵɵlistener("click", function
|
|
6972
|
+
i0.ɵɵlistener("click", function DrChatFormDropdownComponent_i_14_Template_i_click_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r10 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r10.abortMessage()); });
|
|
6943
6973
|
i0.ɵɵelementEnd();
|
|
6944
6974
|
} }
|
|
6945
|
-
function
|
|
6975
|
+
function DrChatFormDropdownComponent_dr_dot_flashing_15_Template(rf, ctx) { if (rf & 1) {
|
|
6946
6976
|
i0.ɵɵelement(0, "dr-dot-flashing", 15);
|
|
6947
6977
|
} }
|
|
6948
6978
|
const _c2$2 = function (a0) { return { "message-row_loading": a0 }; };
|
|
@@ -6956,7 +6986,7 @@ class DrChatFormDropdownComponent {
|
|
|
6956
6986
|
this.inputFocus = false;
|
|
6957
6987
|
this.inputHover = false;
|
|
6958
6988
|
this.droppedFiles$ = new BehaviorSubject([]);
|
|
6959
|
-
this.
|
|
6989
|
+
this.isUploadingFiles = false;
|
|
6960
6990
|
/**
|
|
6961
6991
|
* Predefined message text
|
|
6962
6992
|
*
|
|
@@ -7045,7 +7075,7 @@ class DrChatFormDropdownComponent {
|
|
|
7045
7075
|
if (!$event || !$event.shiftKey) {
|
|
7046
7076
|
$event?.preventDefault();
|
|
7047
7077
|
$event?.stopPropagation();
|
|
7048
|
-
if (this.waitForReply) {
|
|
7078
|
+
if (this.waitForReply || this.isUploadingFiles) {
|
|
7049
7079
|
return;
|
|
7050
7080
|
}
|
|
7051
7081
|
else if (this.droppedFiles$.value.length || String(this.message).trim().length) {
|
|
@@ -7115,32 +7145,33 @@ class DrChatFormDropdownComponent {
|
|
|
7115
7145
|
i0.ɵɵlistener("drop", function DrChatFormDropdownComponent_drop_HostBindingHandler($event) { return ctx.onDrop($event); })("dragover", function DrChatFormDropdownComponent_dragover_HostBindingHandler($event) { return ctx.onDragOver($event); })("dragleave", function DrChatFormDropdownComponent_dragleave_HostBindingHandler($event) { return ctx.onDragLeave($event); });
|
|
7116
7146
|
} if (rf & 2) {
|
|
7117
7147
|
i0.ɵɵclassProp("file-over", ctx.fileOver);
|
|
7118
|
-
} }, inputs: {
|
|
7148
|
+
} }, inputs: { isUploadingFiles: "isUploadingFiles", message: "message", messagePlaceholder: "messagePlaceholder", dropFiles: "dropFiles", dropFilePlaceholder: "dropFilePlaceholder", waitForReply: "waitForReply", showDotFlashing: "showDotFlashing" }, outputs: { send: "send", uploadFiles: "uploadFiles", abort: "abort", inputChange: "inputChange" }, ngContentSelectors: _c4$1, decls: 16, vars: 20, consts: [[1, "message-row", 3, "ngClass"], [1, "message-row__input", 3, "ngClass"], [3, "files", "isRemovable", "maxLengthText", "removeFileEvent", 4, "ngIf"], [1, "message-row__input-textarea-wrap"], ["type", "text", 3, "ngModel", "rows", "placeholder", "focus", "blur", "mouseenter", "mouseleave", "ngModelChange", "keydown.enter"], ["textAreaElement", ""], [1, "message-row__btns"], ["type", "file", "hidden", "", "multiple", "", 3, "change"], ["fileInput", ""], ["class", "dr-icon-send-arrow-up send-button", 3, "click", 4, "ngIf"], ["class", "dr-icon-stop abort-button", 3, "click", 4, "ngIf"], ["class", "wait-reply-dot-flashing", 4, "ngIf"], [3, "files", "isRemovable", "maxLengthText", "removeFileEvent"], [1, "dr-icon-send-arrow-up", "send-button", 3, "click"], [1, "dr-icon-stop", "abort-button", 3, "click"], [1, "wait-reply-dot-flashing"]], template: function DrChatFormDropdownComponent_Template(rf, ctx) { if (rf & 1) {
|
|
7119
7149
|
i0.ɵɵprojectionDef();
|
|
7120
7150
|
i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
|
|
7121
|
-
i0.ɵɵ
|
|
7122
|
-
i0.ɵɵ
|
|
7123
|
-
i0.ɵɵ
|
|
7124
|
-
i0.ɵɵ
|
|
7125
|
-
i0.ɵɵ
|
|
7151
|
+
i0.ɵɵpipe(2, "async");
|
|
7152
|
+
i0.ɵɵtemplate(3, DrChatFormDropdownComponent_dr_chat_dropped_files_3_Template, 2, 5, "dr-chat-dropped-files", 2);
|
|
7153
|
+
i0.ɵɵpipe(4, "async");
|
|
7154
|
+
i0.ɵɵelementStart(5, "div", 3)(6, "textarea", 4, 5);
|
|
7155
|
+
i0.ɵɵlistener("focus", function DrChatFormDropdownComponent_Template_textarea_focus_6_listener() { return ctx.inputFocus = true; })("blur", function DrChatFormDropdownComponent_Template_textarea_blur_6_listener() { return ctx.inputFocus = false; })("mouseenter", function DrChatFormDropdownComponent_Template_textarea_mouseenter_6_listener() { return ctx.inputHover = true; })("mouseleave", function DrChatFormDropdownComponent_Template_textarea_mouseleave_6_listener() { return ctx.inputHover = false; })("ngModelChange", function DrChatFormDropdownComponent_Template_textarea_ngModelChange_6_listener($event) { return ctx.message = $event; })("ngModelChange", function DrChatFormDropdownComponent_Template_textarea_ngModelChange_6_listener($event) { return ctx.onModelChange($event); })("keydown.enter", function DrChatFormDropdownComponent_Template_textarea_keydown_enter_6_listener($event) { return ctx.sendMessage($event); });
|
|
7156
|
+
i0.ɵɵtext(8, " ");
|
|
7126
7157
|
i0.ɵɵelementEnd()();
|
|
7127
|
-
i0.ɵɵelementStart(
|
|
7128
|
-
i0.ɵɵprojection(
|
|
7129
|
-
i0.ɵɵelementStart(
|
|
7130
|
-
i0.ɵɵlistener("change", function
|
|
7158
|
+
i0.ɵɵelementStart(9, "div", 6);
|
|
7159
|
+
i0.ɵɵprojection(10);
|
|
7160
|
+
i0.ɵɵelementStart(11, "input", 7, 8);
|
|
7161
|
+
i0.ɵɵlistener("change", function DrChatFormDropdownComponent_Template_input_change_11_listener($event) { return ctx.onFileSelected($event); });
|
|
7131
7162
|
i0.ɵɵelementEnd();
|
|
7132
|
-
i0.ɵɵtemplate(
|
|
7133
|
-
i0.ɵɵtemplate(
|
|
7134
|
-
i0.ɵɵtemplate(
|
|
7163
|
+
i0.ɵɵtemplate(13, DrChatFormDropdownComponent_i_13_Template, 1, 0, "i", 9);
|
|
7164
|
+
i0.ɵɵtemplate(14, DrChatFormDropdownComponent_i_14_Template, 1, 0, "i", 10);
|
|
7165
|
+
i0.ɵɵtemplate(15, DrChatFormDropdownComponent_dr_dot_flashing_15_Template, 1, 0, "dr-dot-flashing", 11);
|
|
7135
7166
|
i0.ɵɵelementEnd()()();
|
|
7136
7167
|
} if (rf & 2) {
|
|
7137
|
-
const _r1 = i0.ɵɵreference(
|
|
7168
|
+
const _r1 = i0.ɵɵreference(7);
|
|
7138
7169
|
let tmp_1_0;
|
|
7139
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
7170
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(15, _c2$2, ctx.isUploadingFiles));
|
|
7140
7171
|
i0.ɵɵadvance(1);
|
|
7141
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(
|
|
7142
|
-
i0.ɵɵadvance(
|
|
7143
|
-
i0.ɵɵproperty("ngIf", i0.ɵɵpipeBind1(
|
|
7172
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(17, _c3$2, ctx.inputFocus, !!(ctx.message == null ? null : (tmp_1_0 = ctx.message.trim()) == null ? null : tmp_1_0.length) || !!i0.ɵɵpipeBind1(2, 11, ctx.droppedFiles$).length));
|
|
7173
|
+
i0.ɵɵadvance(2);
|
|
7174
|
+
i0.ɵɵproperty("ngIf", i0.ɵɵpipeBind1(4, 13, ctx.droppedFiles$).length);
|
|
7144
7175
|
i0.ɵɵadvance(3);
|
|
7145
7176
|
i0.ɵɵstyleMap(ctx.getTextAreaHeight(_r1));
|
|
7146
7177
|
i0.ɵɵpropertyInterpolate("placeholder", ctx.fileOver ? ctx.dropFilePlaceholder : ctx.messagePlaceholder);
|
|
@@ -7151,18 +7182,18 @@ class DrChatFormDropdownComponent {
|
|
|
7151
7182
|
i0.ɵɵproperty("ngIf", ctx.waitForReply && !ctx.showDotFlashing);
|
|
7152
7183
|
i0.ɵɵadvance(1);
|
|
7153
7184
|
i0.ɵɵproperty("ngIf", ctx.waitForReply && ctx.showDotFlashing);
|
|
7154
|
-
} }, dependencies: [i1$2.DefaultValueAccessor, i1$2.NgControlStatus, i1$2.NgModel, i1.NgClass, i1.NgIf, DrDotFlashingComponent, DrChatDroppedFilesComponent, i1.AsyncPipe], styles: ["[_nghost-%COMP%] {--disabled-bg: linear-gradient(270.95deg, rgba(130, 210, 240, .2) 10.98%, rgba(146, 146, 255, .2) 93.38%);display:flex;flex-direction:column;align-items:center;padding:0}[_nghost-%COMP%] .message-row{display:flex;justify-content:center;width:100%;padding:0 0 21px;max-width:956px}[_nghost-%COMP%] .message-row__input{flex-direction:column;background-color:#fff;position:relative;display:flex;align-items:center;flex-grow:1;padding:14px 8px 8px 15px;height:auto;overflow:visible;min-width:265px;border-radius:24px;border:1.5px solid transparent;box-shadow:0 2px 16px -10px #603cff29;transition:.35s ease}[_nghost-%COMP%] .message-row__input .abort-button, [_nghost-%COMP%] .message-row__input .send-button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:24px;border-radius:100px;color:#fff;transition:.15s ease-in-out;background:linear-gradient(266deg,#6969ff 25.2%,#4eb7df 90.24%) border-box}[_nghost-%COMP%] .message-row__input .send-button{background:var(--disabled-bg);pointer-events:none}[_nghost-%COMP%] .message-row__input--focused{box-shadow:8px 8px 16px #6969ff40,-4px -4px 8px #40b6e340,8px 8px 60px #00000040;height:auto!important;background:#fff}[_nghost-%COMP%] .message-row__input--filled{box-shadow:8px 8px 16px #6969ff40,-4px -4px 8px #40b6e340,8px 8px 60px #00000040;background:#fff}[_nghost-%COMP%] .message-row__input--filled .send-button{background:linear-gradient(266deg,#6969ff 25.2%,#4eb7df 90.24%) border-box;pointer-events:all}[_nghost-%COMP%] .message-row__input .wait-reply-dot-flashing{display:flex;align-items:center;width:32px;height:
|
|
7185
|
+
} }, dependencies: [i1$2.DefaultValueAccessor, i1$2.NgControlStatus, i1$2.NgModel, i1.NgClass, i1.NgIf, DrDotFlashingComponent, DrChatDroppedFilesComponent, i1.AsyncPipe], styles: ["[_nghost-%COMP%] {--disabled-bg: linear-gradient(270.95deg, rgba(130, 210, 240, .2) 10.98%, rgba(146, 146, 255, .2) 93.38%);display:flex;flex-direction:column;align-items:center;padding:0}[_nghost-%COMP%] .message-row{display:flex;justify-content:center;width:100%;padding:0 0 21px;max-width:956px}[_nghost-%COMP%] .message-row__input{flex-direction:column;background-color:#fff;position:relative;display:flex;align-items:center;flex-grow:1;padding:14px 8px 8px 15px;height:auto;overflow:visible;min-width:265px;border-radius:24px;border:1.5px solid transparent;box-shadow:0 2px 16px -10px #603cff29;transition:.35s ease}[_nghost-%COMP%] .message-row__input .abort-button, [_nghost-%COMP%] .message-row__input .send-button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:24px;border-radius:100px;color:#fff;transition:.15s ease-in-out;background:linear-gradient(266deg,#6969ff 25.2%,#4eb7df 90.24%) border-box}[_nghost-%COMP%] .message-row__input .send-button, [_nghost-%COMP%] .message-row__input .abort-button{background:var(--disabled-bg);pointer-events:none}[_nghost-%COMP%] .message-row__input--focused{box-shadow:8px 8px 16px #6969ff40,-4px -4px 8px #40b6e340,8px 8px 60px #00000040;height:auto!important;background:#fff}[_nghost-%COMP%] .message-row__input--filled{box-shadow:8px 8px 16px #6969ff40,-4px -4px 8px #40b6e340,8px 8px 60px #00000040;background:#fff}[_nghost-%COMP%] .message-row__input--filled .send-button{background:linear-gradient(266deg,#6969ff 25.2%,#4eb7df 90.24%) border-box;pointer-events:all}[_nghost-%COMP%] .message-row__input .wait-reply-dot-flashing{display:flex;align-items:center;width:32px;height:32px}[_nghost-%COMP%] .message-row__input:before{content:\"\";position:absolute;inset:-3px;background:linear-gradient(266.3deg,#6969ff 25.2%,#4eb7df 90.24%);border-radius:25px;z-index:-1}[_nghost-%COMP%] .message-row__input textarea{color:#333;width:100%;outline:none;min-height:30px;flex-grow:1;resize:none;padding:4px 48px 4px 4px;margin:auto;border:none;border-radius:22.5px;font-family:Poppins,sans-serif;font-size:14px;line-height:22px}[_nghost-%COMP%] .message-row__input textarea:focus{border:none}[_nghost-%COMP%] .message-row__input textarea::placeholder{color:#9ea1aa}[_nghost-%COMP%] .message-row__btns{display:flex;justify-content:space-between;width:100%;align-items:center}[_nghost-%COMP%] .message-row__input-textarea-wrap{display:flex;width:100%;position:relative}[_nghost-%COMP%] dr-chat-dropped-files{margin-right:auto}[_nghost-%COMP%] dr-chat-dropped-files .dropped-files{padding:0}[_nghost-%COMP%] dr-chat-dropped-files .dropped-files__item{margin:0}[_nghost-%COMP%] .message-row_loading .send-button{background:var(--disabled-bg);pointer-events:none}[_nghost-%COMP%] .message-row_loading .dropped-files__item{opacity:.5;pointer-events:none}"], changeDetection: 0 }); }
|
|
7155
7186
|
}
|
|
7156
7187
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrChatFormDropdownComponent, [{
|
|
7157
7188
|
type: Component,
|
|
7158
|
-
args: [{ selector: 'dr-chat-form-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"message-row\" [ngClass]=\"{ 'message-row_loading':
|
|
7189
|
+
args: [{ selector: 'dr-chat-form-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"message-row\" [ngClass]=\"{ 'message-row_loading': isUploadingFiles }\">\n <div\n class=\"message-row__input\"\n [ngClass]=\"{\n 'message-row__input--focused': inputFocus,\n 'message-row__input--filled': !!message?.trim()?.length || !!(droppedFiles$ | async).length,\n }\">\n <dr-chat-dropped-files\n *ngIf=\"(droppedFiles$ | async).length\"\n [files]=\"droppedFiles$ | async\"\n [isRemovable]=\"true\"\n [maxLengthText]=\"15\"\n (removeFileEvent)=\"removeFile($event)\"></dr-chat-dropped-files>\n\n <div class=\"message-row__input-textarea-wrap\">\n <textarea\n #textAreaElement\n (focus)=\"inputFocus = true\"\n (blur)=\"inputFocus = false\"\n (mouseenter)=\"inputHover = true\"\n (mouseleave)=\"inputHover = false\"\n [(ngModel)]=\"message\"\n [rows]=\"1\"\n [style]=\"getTextAreaHeight(textAreaElement)\"\n (ngModelChange)=\"onModelChange($event)\"\n type=\"text\"\n placeholder=\"{{ fileOver ? dropFilePlaceholder : messagePlaceholder }}\"\n (keydown.enter)=\"sendMessage($event)\">\n </textarea>\n </div>\n <div class=\"message-row__btns\">\n <ng-content></ng-content>\n <input #fileInput type=\"file\" hidden multiple (change)=\"onFileSelected($event)\" />\n <i *ngIf=\"!waitForReply\" (click)=\"sendMessage($event)\" class=\"dr-icon-send-arrow-up send-button\"></i>\n\n <i *ngIf=\"waitForReply && !showDotFlashing\" class=\"dr-icon-stop abort-button\" (click)=\"abortMessage()\"></i>\n <dr-dot-flashing *ngIf=\"waitForReply && showDotFlashing\" class=\"wait-reply-dot-flashing\"></dr-dot-flashing>\n </div>\n </div>\n</div>\n", styles: [":host::ng-deep{--disabled-bg: linear-gradient(270.95deg, rgba(130, 210, 240, .2) 10.98%, rgba(146, 146, 255, .2) 93.38%);display:flex;flex-direction:column;align-items:center;padding:0}:host::ng-deep .message-row{display:flex;justify-content:center;width:100%;padding:0 0 21px;max-width:956px}:host::ng-deep .message-row__input{flex-direction:column;background-color:#fff;position:relative;display:flex;align-items:center;flex-grow:1;padding:14px 8px 8px 15px;height:auto;overflow:visible;min-width:265px;border-radius:24px;border:1.5px solid transparent;box-shadow:0 2px 16px -10px #603cff29;transition:.35s ease}:host::ng-deep .message-row__input .abort-button,:host::ng-deep .message-row__input .send-button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:24px;border-radius:100px;color:#fff;transition:.15s ease-in-out;background:linear-gradient(266deg,#6969ff 25.2%,#4eb7df 90.24%) border-box}:host::ng-deep .message-row__input .send-button,:host::ng-deep .message-row__input .abort-button{background:var(--disabled-bg);pointer-events:none}:host::ng-deep .message-row__input--focused{box-shadow:8px 8px 16px #6969ff40,-4px -4px 8px #40b6e340,8px 8px 60px #00000040;height:auto!important;background:#fff}:host::ng-deep .message-row__input--filled{box-shadow:8px 8px 16px #6969ff40,-4px -4px 8px #40b6e340,8px 8px 60px #00000040;background:#fff}:host::ng-deep .message-row__input--filled .send-button{background:linear-gradient(266deg,#6969ff 25.2%,#4eb7df 90.24%) border-box;pointer-events:all}:host::ng-deep .message-row__input .wait-reply-dot-flashing{display:flex;align-items:center;width:32px;height:32px}:host::ng-deep .message-row__input:before{content:\"\";position:absolute;inset:-3px;background:linear-gradient(266.3deg,#6969ff 25.2%,#4eb7df 90.24%);border-radius:25px;z-index:-1}:host::ng-deep .message-row__input textarea{color:#333;width:100%;outline:none;min-height:30px;flex-grow:1;resize:none;padding:4px 48px 4px 4px;margin:auto;border:none;border-radius:22.5px;font-family:Poppins,sans-serif;font-size:14px;line-height:22px}:host::ng-deep .message-row__input textarea:focus{border:none}:host::ng-deep .message-row__input textarea::placeholder{color:#9ea1aa}:host::ng-deep .message-row__btns{display:flex;justify-content:space-between;width:100%;align-items:center}:host::ng-deep .message-row__input-textarea-wrap{display:flex;width:100%;position:relative}:host::ng-deep dr-chat-dropped-files{margin-right:auto}:host::ng-deep dr-chat-dropped-files .dropped-files{padding:0}:host::ng-deep dr-chat-dropped-files .dropped-files__item{margin:0}:host::ng-deep .message-row_loading .send-button{background:var(--disabled-bg);pointer-events:none}:host::ng-deep .message-row_loading .dropped-files__item{opacity:.5;pointer-events:none}\n"] }]
|
|
7159
7190
|
}], function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$5.DomSanitizer }]; }, { textAreaElementRef: [{
|
|
7160
7191
|
type: ViewChild,
|
|
7161
7192
|
args: ['textAreaElement']
|
|
7162
7193
|
}], fileInput: [{
|
|
7163
7194
|
type: ViewChild,
|
|
7164
7195
|
args: ['fileInput']
|
|
7165
|
-
}],
|
|
7196
|
+
}], isUploadingFiles: [{
|
|
7166
7197
|
type: Input
|
|
7167
7198
|
}], message: [{
|
|
7168
7199
|
type: Input
|
|
@@ -13237,7 +13268,7 @@ const DR_CHAT_COMPONENTS = [
|
|
|
13237
13268
|
DrChatAlertComponent,
|
|
13238
13269
|
DrChatDroppedFilesComponent,
|
|
13239
13270
|
];
|
|
13240
|
-
const DR_CHAT_PIPES = [ShorterNamingPipe];
|
|
13271
|
+
const DR_CHAT_PIPES = [ShorterNamingPipe, FileClassNamePipe];
|
|
13241
13272
|
const DR_CHAT_DIRECTIVES = [DrChatCustomMessageDirective];
|
|
13242
13273
|
class DrChatModule {
|
|
13243
13274
|
/** @nocollapse */ static { this.ɵfac = function DrChatModule_Factory(t) { return new (t || DrChatModule)(); }; }
|
|
@@ -13275,7 +13306,7 @@ class DrChatModule {
|
|
|
13275
13306
|
DrChatSuggestionsComponent,
|
|
13276
13307
|
DrDotFlashingComponent,
|
|
13277
13308
|
DrChatAlertComponent,
|
|
13278
|
-
DrChatDroppedFilesComponent, DrChatCustomMessageDirective, ShorterNamingPipe], imports: [FormsModule,
|
|
13309
|
+
DrChatDroppedFilesComponent, DrChatCustomMessageDirective, ShorterNamingPipe, FileClassNamePipe], imports: [FormsModule,
|
|
13279
13310
|
ReactiveFormsModule,
|
|
13280
13311
|
CommonModule,
|
|
13281
13312
|
DrAvatarModule,
|