@symphony-talent/component-library 4.63.0 → 4.64.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/atoms/input-file-upload/input-file-upload.component.mjs +23 -9
- package/esm2020/lib/atoms/input-file-upload/input-file-upload.model.mjs +1 -1
- package/esm2020/lib/atoms/input-file-upload/input-file-upload.module.mjs +7 -5
- package/esm2020/projects/component-library/lib/atoms/input-file-upload/input-file-upload.component.mjs +23 -9
- package/esm2020/projects/component-library/lib/atoms/input-file-upload/input-file-upload.model.mjs +1 -1
- package/esm2020/projects/component-library/lib/atoms/input-file-upload/input-file-upload.module.mjs +7 -5
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +19 -6
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2015/symphony-talent-component-library.mjs +19 -6
- package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +19 -6
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library.mjs +19 -6
- package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
- package/lib/atoms/input-file-upload/input-file-upload.component.d.ts +4 -1
- package/lib/atoms/input-file-upload/input-file-upload.model.d.ts +1 -0
- package/lib/atoms/input-file-upload/input-file-upload.module.d.ts +4 -3
- package/package.json +1 -1
- package/projects/component-library/global.scss +3 -0
- package/projects/component-library/lib/atoms/input-file-upload/input-file-upload.component.d.ts +4 -1
- package/projects/component-library/lib/atoms/input-file-upload/input-file-upload.model.d.ts +1 -0
- package/projects/component-library/lib/atoms/input-file-upload/input-file-upload.module.d.ts +4 -3
|
@@ -2500,10 +2500,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
|
|
|
2500
2500
|
class InputFileUploadComponent {
|
|
2501
2501
|
constructor() {
|
|
2502
2502
|
this.closeButtonClicked = new EventEmitter();
|
|
2503
|
+
this.textChanged = new EventEmitter();
|
|
2503
2504
|
this.getFileDetails = new EventEmitter();
|
|
2504
2505
|
}
|
|
2505
2506
|
ngOnInit() {
|
|
2506
|
-
this.filetypeAccepted =
|
|
2507
|
+
this.filetypeAccepted =
|
|
2508
|
+
this.inputFileUploadModel.fileFormatAccepted.join(', ');
|
|
2507
2509
|
}
|
|
2508
2510
|
onCloseButtonClick() {
|
|
2509
2511
|
this.closeButtonClicked.emit();
|
|
@@ -2512,33 +2514,44 @@ class InputFileUploadComponent {
|
|
|
2512
2514
|
this.file = event.target.files[0];
|
|
2513
2515
|
this.getFileDetails.emit(this.file);
|
|
2514
2516
|
}
|
|
2517
|
+
onTextChange(event) {
|
|
2518
|
+
if (this.inputFileUploadModel.fileValue.length === 0) {
|
|
2519
|
+
this.toolTip.hide();
|
|
2520
|
+
}
|
|
2521
|
+
this.textChanged.emit(event);
|
|
2522
|
+
}
|
|
2515
2523
|
onClick(event) {
|
|
2516
2524
|
event.target.value = null;
|
|
2517
2525
|
}
|
|
2518
2526
|
}
|
|
2519
2527
|
InputFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2520
|
-
InputFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputFileUploadComponent, selector: "symphony-input-file-upload", inputs: { inputFileUploadModel: "inputFileUploadModel" }, outputs: { closeButtonClicked: "closeButtonClicked", getFileDetails: "getFileDetails" }, ngImport: i0, template: "
|
|
2528
|
+
InputFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputFileUploadComponent, selector: "symphony-input-file-upload", inputs: { inputFileUploadModel: "inputFileUploadModel" }, outputs: { closeButtonClicked: "closeButtonClicked", textChanged: "textChanged", getFileDetails: "getFileDetails" }, viewQueries: [{ propertyName: "toolTip", first: true, predicate: ["pop"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"inputFileUploadModel\">\n <!-- File Upload -->\n <div class=\"sfx-input-label\">\n {{ inputFileUploadModel.inputLabel }}\n </div>\n <div\n class=\"sfx-input-file-upload\"\n tooltip=\"{{ inputFileUploadModel.fileValue }}\"\n containerClass=\"sfx-info-tooltip item-tooltip\"\n #pop=\"bs-tooltip\"\n [ngClass]=\"{ 'has-Close': inputFileUploadModel.hasClose }\"\n >\n <label class=\"sfx-cursor-pointer\" for=\"input-file-Upload\"> </label>\n\n <input\n type=\"file\"\n id=\"input-file-Upload\"\n name=\"input-file-Upload\"\n accept=\"{{ filetypeAccepted }}\"\n (change)=\"onFileSelect($event)\"\n (click)=\"onClick($event)\"\n />\n <input\n type=\"text\"\n name=\"input-text\"\n id=\"input-file-Upload-text\"\n class=\"input-text\"\n autocomplete=\"off\"\n placeholder=\"{{ inputFileUploadModel.placeholder }}\"\n (keyup)=\"onTextChange($event)\"\n [(ngModel)]=\"inputFileUploadModel.fileValue\"\n />\n\n <symphony-icon\n class=\"sfx-cursor-pointer\"\n *ngIf=\"inputFileUploadModel.hasClose\"\n [icon]=\"'si-close-modal'\"\n [size]=\"'20px'\"\n (clicked)=\"onCloseButtonClick()\"\n ></symphony-icon>\n <symphony-paragraph\n *ngIf=\"inputFileUploadModel.hasError\"\n class=\"sfx-txt-red-v2 sfx-pl-5 sfx-d-flex\"\n [text]=\"inputFileUploadModel.errorText\"\n ></symphony-paragraph>\n </div>\n <!-- File Upload -->\n</div>\n", styles: [".sfx-input-file-upload{position:relative}.sfx-input-file-upload symphony-tooltip-wrapper .sfx-d-inline-block{width:100%;display:block}.sfx-input-file-upload label{line-height:40px;width:40px;margin:0;height:40px;position:absolute;text-align:center;right:-5px;top:5px}.sfx-input-file-upload label span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:relative;top:5px}.sfx-input-file-upload label:before{content:\"\\e957\";font-family:library-icons!important}.sfx-input-file-upload input[type=file]{visibility:hidden;position:absolute;top:0}.sfx-input-file-upload input[type=text]{width:100%;height:40px;border-radius:4px;box-shadow:none;padding:0 30px 0 20px;border:1px solid #d0d0d0;margin:5px;outline:none}.sfx-input-file-upload.has-Close input[type=text]{width:calc(100% - 35px)}.sfx-input-file-upload.has-Close label{right:30px;top:5px}.sfx-input-file-upload.has-Close symphony-icon{position:absolute;top:15px;right:0px}.sfx-input-label{font-weight:500;margin-left:5px;margin-bottom:5px}.sfx-info-tooltip.item-tooltip{min-width:80px;opacity:1}.sfx-info-tooltip.item-tooltip .tooltip-inner{border-radius:10px!important;box-shadow:0 0 20px rgba(0,0,0,.2);font-weight:600;word-wrap:break-word}.sfx-info-tooltip.item-tooltip.top .tooltip-arrow.arrow{border-top-color:#fff}.sfx-info-tooltip.item-tooltip.right{left:5px!important}.sfx-info-tooltip.item-tooltip.right .tooltip-arrow.arrow{border-right-color:#fff}.sfx-info-tooltip.item-tooltip.bottom .tooltip-arrow.arrow{border-bottom-color:#fff}.sfx-info-tooltip.item-tooltip.left{left:-5px!important}.sfx-info-tooltip.item-tooltip.left .tooltip-arrow.arrow{border-left-color:#fff}.sfx-info-tooltip .tooltip-inner{background-color:#fff;padding:8px 15px;border-radius:0;max-width:250px;font-size:13px;color:#000}\n"], components: [{ type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["containerClass", "tooltipAnimation", "tooltipFadeDuration", "isOpen", "tooltipHtml", "tooltip", "tooltipPlacement", "placement", "tooltipIsOpen", "tooltipEnable", "isDisabled", "tooltipAppendToBody", "container", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "delay", "tooltipTrigger", "triggers", "adaptivePosition"], outputs: ["tooltipChange", "tooltipStateChanged", "onShown", "onHidden"], exportAs: ["bs-tooltip"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
2521
2529
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputFileUploadComponent, decorators: [{
|
|
2522
2530
|
type: Component,
|
|
2523
|
-
args: [{ selector: 'symphony-input-file-upload', encapsulation: ViewEncapsulation.None, template: "
|
|
2531
|
+
args: [{ selector: 'symphony-input-file-upload', encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"inputFileUploadModel\">\n <!-- File Upload -->\n <div class=\"sfx-input-label\">\n {{ inputFileUploadModel.inputLabel }}\n </div>\n <div\n class=\"sfx-input-file-upload\"\n tooltip=\"{{ inputFileUploadModel.fileValue }}\"\n containerClass=\"sfx-info-tooltip item-tooltip\"\n #pop=\"bs-tooltip\"\n [ngClass]=\"{ 'has-Close': inputFileUploadModel.hasClose }\"\n >\n <label class=\"sfx-cursor-pointer\" for=\"input-file-Upload\"> </label>\n\n <input\n type=\"file\"\n id=\"input-file-Upload\"\n name=\"input-file-Upload\"\n accept=\"{{ filetypeAccepted }}\"\n (change)=\"onFileSelect($event)\"\n (click)=\"onClick($event)\"\n />\n <input\n type=\"text\"\n name=\"input-text\"\n id=\"input-file-Upload-text\"\n class=\"input-text\"\n autocomplete=\"off\"\n placeholder=\"{{ inputFileUploadModel.placeholder }}\"\n (keyup)=\"onTextChange($event)\"\n [(ngModel)]=\"inputFileUploadModel.fileValue\"\n />\n\n <symphony-icon\n class=\"sfx-cursor-pointer\"\n *ngIf=\"inputFileUploadModel.hasClose\"\n [icon]=\"'si-close-modal'\"\n [size]=\"'20px'\"\n (clicked)=\"onCloseButtonClick()\"\n ></symphony-icon>\n <symphony-paragraph\n *ngIf=\"inputFileUploadModel.hasError\"\n class=\"sfx-txt-red-v2 sfx-pl-5 sfx-d-flex\"\n [text]=\"inputFileUploadModel.errorText\"\n ></symphony-paragraph>\n </div>\n <!-- File Upload -->\n</div>\n", styles: [".sfx-input-file-upload{position:relative}.sfx-input-file-upload symphony-tooltip-wrapper .sfx-d-inline-block{width:100%;display:block}.sfx-input-file-upload label{line-height:40px;width:40px;margin:0;height:40px;position:absolute;text-align:center;right:-5px;top:5px}.sfx-input-file-upload label span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:relative;top:5px}.sfx-input-file-upload label:before{content:\"\\e957\";font-family:library-icons!important}.sfx-input-file-upload input[type=file]{visibility:hidden;position:absolute;top:0}.sfx-input-file-upload input[type=text]{width:100%;height:40px;border-radius:4px;box-shadow:none;padding:0 30px 0 20px;border:1px solid #d0d0d0;margin:5px;outline:none}.sfx-input-file-upload.has-Close input[type=text]{width:calc(100% - 35px)}.sfx-input-file-upload.has-Close label{right:30px;top:5px}.sfx-input-file-upload.has-Close symphony-icon{position:absolute;top:15px;right:0px}.sfx-input-label{font-weight:500;margin-left:5px;margin-bottom:5px}.sfx-info-tooltip.item-tooltip{min-width:80px;opacity:1}.sfx-info-tooltip.item-tooltip .tooltip-inner{border-radius:10px!important;box-shadow:0 0 20px rgba(0,0,0,.2);font-weight:600;word-wrap:break-word}.sfx-info-tooltip.item-tooltip.top .tooltip-arrow.arrow{border-top-color:#fff}.sfx-info-tooltip.item-tooltip.right{left:5px!important}.sfx-info-tooltip.item-tooltip.right .tooltip-arrow.arrow{border-right-color:#fff}.sfx-info-tooltip.item-tooltip.bottom .tooltip-arrow.arrow{border-bottom-color:#fff}.sfx-info-tooltip.item-tooltip.left{left:-5px!important}.sfx-info-tooltip.item-tooltip.left .tooltip-arrow.arrow{border-left-color:#fff}.sfx-info-tooltip .tooltip-inner{background-color:#fff;padding:8px 15px;border-radius:0;max-width:250px;font-size:13px;color:#000}\n"] }]
|
|
2524
2532
|
}], ctorParameters: function () { return []; }, propDecorators: { inputFileUploadModel: [{
|
|
2525
2533
|
type: Input
|
|
2526
2534
|
}], closeButtonClicked: [{
|
|
2527
2535
|
type: Output
|
|
2536
|
+
}], textChanged: [{
|
|
2537
|
+
type: Output
|
|
2528
2538
|
}], getFileDetails: [{
|
|
2529
2539
|
type: Output
|
|
2540
|
+
}], toolTip: [{
|
|
2541
|
+
type: ViewChild,
|
|
2542
|
+
args: ['pop', { static: false }]
|
|
2530
2543
|
}] } });
|
|
2531
2544
|
|
|
2532
2545
|
class InputFileUploadModule {
|
|
2533
2546
|
}
|
|
2534
2547
|
InputFileUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputFileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
2535
|
-
InputFileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputFileUploadModule, declarations: [InputFileUploadComponent], imports: [CommonModule, IconModule,
|
|
2536
|
-
InputFileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputFileUploadModule, imports: [[CommonModule, IconModule,
|
|
2548
|
+
InputFileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputFileUploadModule, declarations: [InputFileUploadComponent], imports: [CommonModule, IconModule, ParagraphModule, FormsModule, i1$2.TooltipModule], exports: [InputFileUploadComponent] });
|
|
2549
|
+
InputFileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputFileUploadModule, imports: [[CommonModule, IconModule, ParagraphModule, FormsModule, TooltipModule.forRoot()]] });
|
|
2537
2550
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputFileUploadModule, decorators: [{
|
|
2538
2551
|
type: NgModule,
|
|
2539
2552
|
args: [{
|
|
2540
2553
|
declarations: [InputFileUploadComponent],
|
|
2541
|
-
imports: [CommonModule, IconModule,
|
|
2554
|
+
imports: [CommonModule, IconModule, ParagraphModule, FormsModule, TooltipModule.forRoot()],
|
|
2542
2555
|
exports: [InputFileUploadComponent],
|
|
2543
2556
|
}]
|
|
2544
2557
|
}] });
|