fx-form-builder-wrapper 2.0.15 → 2.0.17

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.
Files changed (5) hide show
  1. package/esm2022/lib/components/date-picker/date-picker.component.mjs +3 -3
  2. package/esm2022/lib/components/uploader/uploader.component.mjs +3 -3
  3. package/fesm2022/fx-form-builder-wrapper.mjs +4 -4
  4. package/fesm2022/fx-form-builder-wrapper.mjs.map +1 -1
  5. package/package.json +1 -1
package/fesm2022/fx-form-builder-wrapper.mjs CHANGED
@@ -1425,11 +1425,11 @@ class UploaderComponent extends FxBaseComponent {
1425
1425
  console.log(event);
1426
1426
  }
1427
1427
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UploaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: FxBuilderWrapperService }], target: i0.ɵɵFactoryTarget.Component });
1428
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: UploaderComponent, isStandalone: true, selector: "fx-uploader", usesInheritance: true, ngImport: i0, template: "<fx-component [fxData]=\"fxData\">\r\n <div class=\"custom-upload flex flex-col items-start justify-center gap-4 p-2 pb-0 rounded-sm\">\r\n <div class=\"flex gap-8 items-center mb-2\">\r\n <p class=\"text-base font-semibold\">Patient Images</p>\r\n <div class=\"flex justify-center items-center gap-2 upload\" (click)=\"fileInput.click()\">\r\n <div>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"29\" height=\"28\" viewBox=\"0 0 29 28\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\r\n d=\"M14.001 3.00195C11.5322 3.00195 9.16722 3.86956 7.23641 5.38414L7.23598 4.59695C7.23598 4.52473 7.22175 4.45321 7.19411 4.38648C7.16647 4.31975 7.12596 4.25912 7.07489 4.20804C7.02381 4.15697 6.96318 4.11646 6.89645 4.08882C6.82972 4.06118 6.7582 4.04695 6.68598 4.04695C6.61375 4.04695 6.54223 4.06118 6.4755 4.08882C6.40877 4.11646 6.34814 4.15697 6.29707 4.20804C6.24599 4.25912 6.20548 4.31975 6.17784 4.38648C6.1502 4.45321 6.13598 4.52473 6.13598 4.59695L6.13642 6.68652C6.13643 6.83239 6.19438 6.97228 6.29752 7.07542C6.40067 7.17856 6.54055 7.23651 6.68642 7.23652H8.77598C8.8482 7.23652 8.91972 7.2223 8.98645 7.19466C9.05318 7.16702 9.11381 7.12651 9.16489 7.07543C9.21596 7.02436 9.25647 6.96373 9.28411 6.897C9.31175 6.83027 9.32598 6.75875 9.32598 6.68652C9.32598 6.6143 9.31175 6.54278 9.28411 6.47605C9.25647 6.40932 9.21596 6.34869 9.16489 6.29761C9.11381 6.24654 9.05318 6.20603 8.98645 6.17839C8.91972 6.15075 8.8482 6.13652 8.77598 6.13652H8.0584C9.7702 4.84387 11.8399 4.10195 14.001 4.10195C19.4751 4.10195 23.901 8.52782 23.901 14.002C23.901 19.4761 19.4751 23.902 14.001 23.902C8.52684 23.902 4.10098 19.4761 4.10098 14.002C4.10098 12.6381 4.38263 11.2888 4.92855 10.0389C4.98691 9.90532 4.98982 9.75399 4.93665 9.61822C4.88347 9.48246 4.77855 9.37336 4.64496 9.31492C4.57877 9.28596 4.50753 9.27032 4.4353 9.2689C4.36306 9.26747 4.29126 9.2803 4.22398 9.30663C4.15671 9.33297 4.09528 9.3723 4.04321 9.42238C3.99114 9.47247 3.94944 9.53232 3.92051 9.59852C3.31393 10.9872 3.00098 12.4866 3.00098 14.002C3.00098 20.0706 7.93236 25.002 14.001 25.002C20.0696 25.002 25.001 20.0706 25.001 14.002C25.001 7.93334 20.0696 3.00195 14.001 3.00195Z\"\r\n fill=\"#F3A041\" />\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\r\n d=\"M13.9988 6.13965C9.6616 6.13965 6.13379 9.66746 6.13379 14.0046C6.13379 18.3418 9.6616 21.8696 13.9988 21.8696C18.336 21.8696 21.8638 18.3418 21.8638 14.0046C21.8638 9.66746 18.336 6.13965 13.9988 6.13965ZM13.9988 8.22965C14.1447 8.22965 14.2846 8.28759 14.3877 8.39074C14.4908 8.49388 14.5488 8.63378 14.5488 8.77965V13.7769L17.5227 16.7508C17.6258 16.8539 17.6837 16.9938 17.6837 17.1396C17.6837 17.2855 17.6258 17.4254 17.5227 17.5285C17.4195 17.6316 17.2796 17.6896 17.1338 17.6896C16.9879 17.6896 16.8481 17.6316 16.7449 17.5285L13.6099 14.3935C13.5068 14.2904 13.4488 14.1505 13.4488 14.0046V8.77965C13.4488 8.63378 13.5067 8.49388 13.6099 8.39074C13.713 8.28759 13.8529 8.22965 13.9988 8.22965Z\"\r\n fill=\"#F3A041\" />\r\n <rect width=\"28.56\" height=\"28\" rx=\"1.51479\" fill=\"#999999\" />\r\n <path\r\n d=\"M15.068 22.7391V17.6708H18.4968L14.2108 12.6025L9.9248 17.6708H13.3536V22.7391H9.06759V22.6969C8.92358 22.7053 8.78643 22.7391 8.63899 22.7391C6.93391 22.7391 5.29866 22.0717 4.09298 20.8835C2.8873 19.6954 2.20996 18.084 2.20996 16.4037C2.20996 13.1532 4.70443 10.5042 7.90523 10.141C8.18585 8.6953 8.96892 7.39118 10.1197 6.45292C11.2706 5.51465 12.7172 5.00089 14.2108 5C15.7047 5.00082 17.1515 5.51452 18.3026 6.45277C19.4537 7.39101 20.2371 8.69516 20.5181 10.141C23.7189 10.5042 26.21 13.1532 26.21 16.4037C26.21 18.084 25.5326 19.6954 24.3269 20.8835C23.1213 22.0717 21.486 22.7391 19.7809 22.7391C19.6369 22.7391 19.4981 22.7053 19.3523 22.6969V22.7391H15.068Z\"\r\n fill=\"white\" />\r\n </svg>\r\n </div>\r\n <a type=\"button\" (click)=\"openFileDialog(fileInput)\" class=\"text-base cursor-pointer\">\r\n {{ setting('upload-text') }}\r\n </a>\r\n </div>\r\n </div>\r\n <!-- <input #fileInput type=\"file\" [multiple]=\"setting('multiple-upload')\" (change)=\"onFileSelected($event)\" hidden />\r\n <div class=\"separator\"></div>\r\n <div class=\"file-list flex items-center gap-4 flex-wrap\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\" \r\n class=\"flex flex-col items-center justify-center\" (click)=\"deleteFile(i)\">\r\n <div class=\"relative\">\r\n <div class=\"close_icon cursor-pointer\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_6837_29683)\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"#F3A041\" />\r\n <mask id=\"mask0_6837_29683\" style=\"mask-type:alpha\" maskUnits=\"userSpaceOnUse\" x=\"4\" y=\"4\" width=\"24\"\r\n height=\"24\">\r\n <rect x=\"4\" y=\"4\" width=\"24\" height=\"24\" fill=\"#D9D9D9\" />\r\n </mask>\r\n <g mask=\"url(#mask0_6837_29683)\">\r\n <path\r\n d=\"M8.2045 8.99815L5.81802 6.61167L6.61351 5.81617L9 8.20266L11.3865 5.81617L12.182 6.61167L9.7955 8.99815L12.182 11.3846L11.3865 12.1801L9 9.79365L6.61351 12.1801L5.81802 11.3846L8.2045 8.99815Z\"\r\n fill=\"white\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_6837_29683\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <img class=\"file-thumbnail\" style=\"border-radius: 4px\" [src]=\"file?.result\" alt=\"\" />\r\n <div class=\"flex flex-col w-full\">\r\n <label class=\"font-semibold text-sm mb-1\">Title</label>\r\n <input [(ngModel)]=\"file.title\"\r\n name=\"title{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter title\"\r\n class=\"border border-orange-300 rounded px-3 py-2 mb-3 w-full outline-none focus:ring focus:ring-orange-200\" />\r\n \r\n <label class=\"font-semibold text-sm mb-1\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\"\r\n name=\"notes{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter notes\"\r\n class=\"border border-orange-300 rounded px-3 py-2 w-full outline-none focus:ring focus:ring-orange-200\"\r\n rows=\"2\"></textarea>\r\n </div>\r\n \r\n\r\n </div>\r\n\r\n <p>{{file?.name}}</p>\r\n </div>\r\n </ng-container>\r\n </div> -->\r\n\r\n <input #fileInput\r\n type=\"file\"\r\n [multiple]=\"setting('multiple-upload')\"\r\n (change)=\"onFileSelected($event)\"\r\n accept=\".csv,.pdf,.xls,.xlsx,.doc,.docx,.txt,image/*\"\r\n style=\"display: none;\" />\r\n\r\n\r\n\r\n \r\n <!-- <p-fileUpload mode=\"basic\" name=\"demo[]\" accept=\"image/*\" maxFileSize=\"1000000\" (onUpload)=\"onBasicUploadAuto($event)\" chooseLabel=\"Browse\" /> -->\r\n\r\n\r\n<!-- <div class=\"separator\"></div> -->\r\n\r\n<div class=\"file-list flex items-center gap-6 flex-wrap\" *ngIf=\"false\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\"\r\n class=\"flex flex-col items-center justify-center\">\r\n\r\n <div class=\"input-container p-3 border rounded-lg shadow-sm bg-white w-64\">\r\n <!-- Close icon -->\r\n <div class=\"close_icon cursor-pointer absolute top-2 right-2\" (click)=\"deleteFile(i)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"#F3A041\" />\r\n <path d=\"M8.2 9l-2.4-2.4.8-.8L9 8.2l2.4-2.4.8.8L9.8 9l2.4 2.4-.8.8L9 9.8l-2.4 2.4-.8-.8L8.2 9z\"\r\n fill=\"white\"/>\r\n </svg>\r\n </div>\r\n\r\n <!-- Thumbnail -->\r\n <ng-container *ngIf=\"file.type === 'image'; else nonImageThumb\">\r\n <img class=\"file-thumbnail w-full h-32 object-cover rounded mb-3\"\r\n [src]=\"file?.result\"\r\n alt=\"preview\" />\r\n </ng-container>\r\n\r\n <ng-template #nonImageThumb>\r\n <div class=\"file-thumbnail flex items-center justify-center border rounded mb-3 w-full h-32 bg-gray-50\">\r\n <ng-container [ngSwitch]=\"file.type\">\r\n <!-- CSV -->\r\n <svg *ngSwitchCase=\"'csv'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <text x=\"14\" y=\"34\" font-size=\"10\" font-family=\"monospace\" fill=\"#22c55e\">CSV</text>\r\n </svg>\r\n\r\n <!-- TEXT -->\r\n <svg *ngSwitchCase=\"'text'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M14 24h20M14 29h20M14 34h12\" stroke=\"#3b82f6\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n\r\n <!-- Generic -->\r\n <svg *ngSwitchDefault xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M16 30h16\" stroke=\"#9ca3af\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n </ng-container>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Metadata -->\r\n <div class=\"flex flex-col w-full\">\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Title</label>\r\n <input [(ngModel)]=\"file.title\" name=\"title{{i}}\" (ngModelChange)=\"onMetaChange()\" placeholder=\"Enter title\"\r\n class=\"border border-orange-300 rounded px-3 py-2 mb-3 w-full outline-none focus:ring focus:ring-orange-200\" />\r\n </div>\r\n \r\n <div>\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\" name=\"notes{{i}}\" (ngModelChange)=\"onMetaChange()\" placeholder=\"Enter notes\"\r\n class=\"border border-orange-300 rounded px-3 py-2 w-full outline-none focus:ring focus:ring-orange-200\"\r\n rows=\"2\"></textarea>\r\n </div>\r\n \r\n <div>\r\n <label class=\"font-semibold text-sm mt-3 mb-1 input-title\">Category</label>\r\n <select [(ngModel)]=\"file.category\" name=\"category{{i}}\" (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Select Category\"\r\n class=\"border border-orange-300 rounded px-3 py-2 w-full outline-none focus:ring focus:ring-orange-200\">\r\n <option *ngFor=\"let c of categories\" [ngValue]=\"c\">{{ c }}</option>\r\n </select>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <p class=\"mt-2 text-sm text-gray-600\">{{ file?.name }}</p>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"file-list flex items-center gap-16 flex-wrap w-full\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\"\r\n class=\"input-container p-3 border rounded-lg shadow-sm bg-white w-[450px] flex upload_file\">\r\n\r\n <!-- Close icon -->\r\n <div class=\"close_icon cursor-pointer absolute top-2 right-2\" (click)=\"deleteFile(i)\">\r\n <svg width=\"22\" height=\"22\" viewBox=\"0 0 22 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect width=\"22\" height=\"22\" rx=\"11\" fill=\"#F3A041\" />\r\n <path\r\n d=\"M7.08911 15.8889L6.11133 14.9111L10.0224 11L6.11133 7.08886L7.08911 6.11108L11.0002 10.0222L14.9113 6.11108L15.8891 7.08886L11.978 11L15.8891 14.9111L14.9113 15.8889L11.0002 11.9778L7.08911 15.8889Z\"\r\n fill=\"white\" />\r\n </svg>\r\n </div>\r\n\r\n <!-- Thumbnail on left -->\r\n <div class=\"w-28 h-28 flex-shrink-0\">\r\n <ng-container *ngIf=\"file.type === 'image'; else nonImageThumb\">\r\n <img class=\"file-thumbnail w-full h-full object-cover rounded\"\r\n [src]=\"file?.result\"\r\n alt=\"preview\" />\r\n </ng-container>\r\n\r\n <ng-template #nonImageThumb>\r\n <div class=\"file-thumbnail flex items-center justify-center border rounded w-full h-full bg-gray-50\">\r\n <ng-container [ngSwitch]=\"file.type\">\r\n <!-- CSV -->\r\n <!-- <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <text x=\"14\" y=\"34\" font-size=\"10\" font-family=\"monospace\" fill=\"#22c55e\">CSV</text>\r\n </svg> -->\r\n\r\n <svg *ngSwitchCase=\"'csv'\" width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\"\r\n fill=\"#F4F4F4\" />\r\n <path\r\n d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\"\r\n fill=\"#23A761\" />\r\n <path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\" />\r\n <path\r\n d=\"M6.94076 10.3433C6.85939 10.3433 6.78716 10.3588 6.72408 10.3899C6.66191 10.42 6.60934 10.464 6.56637 10.5216C6.52432 10.5793 6.49232 10.6489 6.47038 10.7305C6.44844 10.8122 6.43747 10.904 6.43747 11.006C6.43747 11.1435 6.45484 11.261 6.48958 11.3586C6.52523 11.4553 6.58009 11.5294 6.65414 11.5808C6.7282 11.6314 6.82373 11.6567 6.94076 11.6567C7.02212 11.6567 7.10349 11.6478 7.18486 11.6301C7.26714 11.6123 7.35628 11.587 7.45228 11.5542V11.9002C7.36359 11.9357 7.27628 11.961 7.19035 11.976C7.10441 11.992 7.00795 12 6.90099 12C6.69437 12 6.52432 11.9587 6.39084 11.8762C6.25827 11.7929 6.15999 11.6766 6.096 11.5276C6.032 11.3777 6 11.2029 6 11.0033C6 10.8561 6.02057 10.7212 6.06171 10.5988C6.10285 10.4764 6.16319 10.3704 6.24273 10.2808C6.32227 10.1912 6.42055 10.122 6.53758 10.0732C6.6546 10.0244 6.78899 10 6.94076 10C7.04041 10 7.14006 10.0124 7.23971 10.0373C7.34028 10.0612 7.43628 10.0945 7.5277 10.1371L7.39057 10.4724C7.3156 10.4378 7.24017 10.4076 7.16429 10.3819C7.08841 10.3562 7.0139 10.3433 6.94076 10.3433Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M9.06363 11.4331C9.06363 11.5485 9.03483 11.6487 8.97724 11.7339C8.91964 11.819 8.83553 11.8847 8.7249 11.9308C8.61519 11.9769 8.48172 12 8.32447 12C8.25498 12 8.18687 11.9956 8.12013 11.9867C8.05431 11.9778 7.99077 11.965 7.92951 11.9481C7.86917 11.9304 7.81157 11.9086 7.75672 11.8829V11.4997C7.8518 11.5405 7.95054 11.5773 8.05293 11.6101C8.15533 11.6429 8.25681 11.6593 8.35738 11.6593C8.42686 11.6593 8.48263 11.6505 8.52468 11.6327C8.56765 11.615 8.59874 11.5906 8.61794 11.5595C8.63714 11.5285 8.64674 11.493 8.64674 11.4531C8.64674 11.4043 8.62982 11.3626 8.596 11.328C8.56217 11.2934 8.51554 11.261 8.45612 11.2309C8.3976 11.2007 8.33132 11.1683 8.25727 11.1337C8.21064 11.1124 8.1599 11.0867 8.10505 11.0566C8.05019 11.0255 7.99808 10.9878 7.94871 10.9434C7.89934 10.8991 7.85866 10.8454 7.82666 10.7824C7.79558 10.7186 7.78003 10.6423 7.78003 10.5536C7.78003 10.4373 7.80746 10.338 7.86231 10.2555C7.91717 10.173 7.99534 10.11 8.09682 10.0665C8.19921 10.0222 8.31989 10 8.45886 10C8.56308 10 8.66228 10.012 8.75645 10.0359C8.85153 10.059 8.95072 10.0927 9.05403 10.1371L8.9169 10.4578C8.82456 10.4214 8.74182 10.3934 8.66868 10.3739C8.59554 10.3535 8.52103 10.3433 8.44515 10.3433C8.39212 10.3433 8.34686 10.3517 8.30938 10.3686C8.2719 10.3846 8.24355 10.4076 8.22436 10.4378C8.20516 10.4671 8.19556 10.5012 8.19556 10.5403C8.19556 10.5864 8.20927 10.6254 8.2367 10.6574C8.26504 10.6884 8.30709 10.7186 8.36286 10.7478C8.41955 10.7771 8.48994 10.8113 8.57405 10.8503C8.67645 10.8973 8.76376 10.9466 8.83598 10.998C8.90912 11.0486 8.96535 11.1084 9.00466 11.1776C9.04398 11.246 9.06363 11.3311 9.06363 11.4331Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M11 10.0279L10.3184 11.9734H9.85491L9.17471 10.0279H9.60395L9.98108 11.1856C9.98748 11.2051 9.99799 11.242 10.0126 11.2961C10.0272 11.3493 10.0419 11.4061 10.0565 11.4664C10.072 11.5258 10.0826 11.5751 10.088 11.6141C10.0935 11.5751 10.1031 11.5258 10.1168 11.4664C10.1315 11.407 10.1456 11.3506 10.1594 11.2974C10.174 11.2433 10.1845 11.206 10.1909 11.1856L10.5708 10.0279H11Z\"\r\n fill=\"white\" />\r\n <rect x=\"5\" y=\"7\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"5\" y=\"5\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"9\" y=\"7\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"9\" y=\"5\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n </svg>\r\n\r\n <!-- TEXT -->\r\n <!-- <svg *ngSwitchCase=\"'text'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M14 24h20M14 29h20M14 34h12\" stroke=\"#3b82f6\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg> -->\r\n <!-- <svg width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#DD2025\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M6.6084 9.96038C6.87161 9.96038 7.06366 10.0171 7.18457 10.1306C7.30548 10.2431 7.36593 10.3984 7.36593 10.5965C7.36593 10.6858 7.35245 10.7714 7.32547 10.8532C7.2985 10.9342 7.25432 11.0062 7.19294 11.0695C7.13249 11.1327 7.05157 11.1829 6.9502 11.2201C6.84882 11.2564 6.72373 11.2746 6.57492 11.2746H6.38937V12H5.95689V9.96038H6.6084ZM6.58608 10.3147H6.38937V10.9202H6.53167C6.61258 10.9202 6.6828 10.9095 6.74233 10.8881C6.80185 10.8667 6.84789 10.8332 6.88044 10.7877C6.91299 10.7421 6.92927 10.6835 6.92927 10.6119C6.92927 10.5114 6.90137 10.437 6.84556 10.3887C6.78976 10.3394 6.70326 10.3147 6.58608 10.3147ZM9.44322 10.9607C9.44322 11.1904 9.39904 11.3824 9.31069 11.5368C9.22326 11.6903 9.09631 11.8061 8.92983 11.8842C8.76335 11.9614 8.56292 12 8.32854 12H7.75098V9.96038H8.39132C8.60524 9.96038 8.79078 9.99851 8.94796 10.0748C9.10514 10.1501 9.22698 10.2622 9.31348 10.411C9.39997 10.5589 9.44322 10.7421 9.44322 10.9607ZM8.994 10.9718C8.994 10.8211 8.97168 10.6975 8.92704 10.6007C8.88332 10.5031 8.81822 10.431 8.73172 10.3845C8.64616 10.338 8.54013 10.3147 8.41364 10.3147H8.18345V11.6429H8.369C8.58012 11.6429 8.73684 11.5866 8.83915 11.4741C8.94238 11.3615 8.994 11.1941 8.994 10.9718ZM10.2914 12H9.86593V9.96038H11.035V10.3147H10.2914V10.8407H10.9834V11.1936H10.2914V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg> -->\r\n\r\n<svg *ngSwitchCase=\"'text'\" width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#1F5EBB\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M7.04353 12H6.61105V10.3203H6.0572V9.96038H7.59738V10.3203H7.04353V12ZM9.56027 12H9.06641L8.59208 11.2285L8.11775 12H7.65458L8.33119 10.9481L7.69782 9.96038H8.17494L8.6144 10.6942L9.04548 9.96038H9.51144L8.87109 10.9718L9.56027 12ZM10.6038 12H10.1713V10.3203H9.61747V9.96038H11.1576V10.3203H10.6038V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg>\r\n\r\n\r\n <!-- Generic -->\r\n <!-- <svg *ngSwitchDefault xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M16 30h16\" stroke=\"#9ca3af\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg> -->\r\n <svg *ngSwitchDefault width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#DD2025\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M6.6084 9.96038C6.87161 9.96038 7.06366 10.0171 7.18457 10.1306C7.30548 10.2431 7.36593 10.3984 7.36593 10.5965C7.36593 10.6858 7.35245 10.7714 7.32547 10.8532C7.2985 10.9342 7.25432 11.0062 7.19294 11.0695C7.13249 11.1327 7.05157 11.1829 6.9502 11.2201C6.84882 11.2564 6.72373 11.2746 6.57492 11.2746H6.38937V12H5.95689V9.96038H6.6084ZM6.58608 10.3147H6.38937V10.9202H6.53167C6.61258 10.9202 6.6828 10.9095 6.74233 10.8881C6.80185 10.8667 6.84789 10.8332 6.88044 10.7877C6.91299 10.7421 6.92927 10.6835 6.92927 10.6119C6.92927 10.5114 6.90137 10.437 6.84556 10.3887C6.78976 10.3394 6.70326 10.3147 6.58608 10.3147ZM9.44322 10.9607C9.44322 11.1904 9.39904 11.3824 9.31069 11.5368C9.22326 11.6903 9.09631 11.8061 8.92983 11.8842C8.76335 11.9614 8.56292 12 8.32854 12H7.75098V9.96038H8.39132C8.60524 9.96038 8.79078 9.99851 8.94796 10.0748C9.10514 10.1501 9.22698 10.2622 9.31348 10.411C9.39997 10.5589 9.44322 10.7421 9.44322 10.9607ZM8.994 10.9718C8.994 10.8211 8.97168 10.6975 8.92704 10.6007C8.88332 10.5031 8.81822 10.431 8.73172 10.3845C8.64616 10.338 8.54013 10.3147 8.41364 10.3147H8.18345V11.6429H8.369C8.58012 11.6429 8.73684 11.5866 8.83915 11.4741C8.94238 11.3615 8.994 11.1941 8.994 10.9718ZM10.2914 12H9.86593V9.96038H11.035V10.3147H10.2914V10.8407H10.9834V11.1936H10.2914V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg>\r\n </ng-container>\r\n </div>\r\n </ng-template>\r\n </div>\r\n\r\n <!-- Metadata on right -->\r\n <div class=\"flex flex-col flex-1 ml-4\">\r\n <!-- Title -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Title</label>\r\n <input [(ngModel)]=\"file.title\"\r\n name=\"title{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter title\"\r\n class=\"border border-orange-300 rounded px-3 py-2 mb-3 w-full outline-none focus:ring focus:ring-orange-200\" />\r\n\r\n </div>\r\n <!-- Notes -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\"\r\n name=\"notes{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter notes\"\r\n class=\"border border-orange-300 rounded px-3 py-2 mb-3 w-full outline-none focus:ring focus:ring-orange-200\"\r\n rows=\"2\"></textarea>\r\n\r\n </div>\r\n <!-- Category -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Category</label>\r\n <select [(ngModel)]=\"file.categoryId \"\r\n name=\"category{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n class=\"border border-orange-300 rounded px-3 py-2 w-full outline-none focus:ring focus:ring-orange-200\">\r\n <option value=\"\">Select Category</option>\r\n <option *ngFor=\"let c of categories\" [ngValue]=\"c.value\">{{ c.label }}</option>\r\n </select>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n\r\n\r\n </div>\r\n</fx-component>", styles: [".custom-upload{border:1px solid #ccc}.custom-upload a{color:#fff}.custom-upload .file-list .file-thumbnail{width:160px;height:100%;max-height:185px!important;border:1px solid #ccc;background-color:#fff;padding:10px}.custom-upload .separator{height:56px;width:2px;background-color:#ccc;margin:10px}.custom-upload .upload{background-color:#999;padding:2px 12px 2px 6px;border-radius:4px;margin-left:40px}.close_icon{position:absolute;top:-8px;right:-8px}[type=checkbox]{padding:12px}[type=checkbox]:checked{background-color:#f3a041!important;padding:12px;background-size:1em 1em!important}.gap-8{gap:8px}.gap-16{gap:25px}.input-title{position:absolute;bottom:auto;right:auto;left:1rem;top:-9px;padding:0rem .25rem;font-weight:600;border-radius:.25rem;z-index:1;color:#454545;background-color:#fff}.input-container{position:relative;inset:auto;z-index:auto}.upload_file{width:32%!important}select:not([size]){padding:.35rem .75rem!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: FxComponent, selector: "fx-component", inputs: ["fxData"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: FileUploadModule }] });
1428
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: UploaderComponent, isStandalone: true, selector: "fx-uploader", usesInheritance: true, ngImport: i0, template: "<fx-component [fxData]=\"fxData\">\r\n <div class=\"custom-upload flex flex-col items-start justify-center gap-4 p-2 pb-0 rounded-sm\">\r\n <div class=\"flex gap-8 items-center mb-2\">\r\n <p class=\"text-base font-semibold\">Patient Images</p>\r\n <div class=\"flex justify-center items-center gap-2 upload\" (click)=\"fileInput.click()\">\r\n <div>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"29\" height=\"28\" viewBox=\"0 0 29 28\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\r\n d=\"M14.001 3.00195C11.5322 3.00195 9.16722 3.86956 7.23641 5.38414L7.23598 4.59695C7.23598 4.52473 7.22175 4.45321 7.19411 4.38648C7.16647 4.31975 7.12596 4.25912 7.07489 4.20804C7.02381 4.15697 6.96318 4.11646 6.89645 4.08882C6.82972 4.06118 6.7582 4.04695 6.68598 4.04695C6.61375 4.04695 6.54223 4.06118 6.4755 4.08882C6.40877 4.11646 6.34814 4.15697 6.29707 4.20804C6.24599 4.25912 6.20548 4.31975 6.17784 4.38648C6.1502 4.45321 6.13598 4.52473 6.13598 4.59695L6.13642 6.68652C6.13643 6.83239 6.19438 6.97228 6.29752 7.07542C6.40067 7.17856 6.54055 7.23651 6.68642 7.23652H8.77598C8.8482 7.23652 8.91972 7.2223 8.98645 7.19466C9.05318 7.16702 9.11381 7.12651 9.16489 7.07543C9.21596 7.02436 9.25647 6.96373 9.28411 6.897C9.31175 6.83027 9.32598 6.75875 9.32598 6.68652C9.32598 6.6143 9.31175 6.54278 9.28411 6.47605C9.25647 6.40932 9.21596 6.34869 9.16489 6.29761C9.11381 6.24654 9.05318 6.20603 8.98645 6.17839C8.91972 6.15075 8.8482 6.13652 8.77598 6.13652H8.0584C9.7702 4.84387 11.8399 4.10195 14.001 4.10195C19.4751 4.10195 23.901 8.52782 23.901 14.002C23.901 19.4761 19.4751 23.902 14.001 23.902C8.52684 23.902 4.10098 19.4761 4.10098 14.002C4.10098 12.6381 4.38263 11.2888 4.92855 10.0389C4.98691 9.90532 4.98982 9.75399 4.93665 9.61822C4.88347 9.48246 4.77855 9.37336 4.64496 9.31492C4.57877 9.28596 4.50753 9.27032 4.4353 9.2689C4.36306 9.26747 4.29126 9.2803 4.22398 9.30663C4.15671 9.33297 4.09528 9.3723 4.04321 9.42238C3.99114 9.47247 3.94944 9.53232 3.92051 9.59852C3.31393 10.9872 3.00098 12.4866 3.00098 14.002C3.00098 20.0706 7.93236 25.002 14.001 25.002C20.0696 25.002 25.001 20.0706 25.001 14.002C25.001 7.93334 20.0696 3.00195 14.001 3.00195Z\"\r\n fill=\"#F3A041\" />\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\r\n d=\"M13.9988 6.13965C9.6616 6.13965 6.13379 9.66746 6.13379 14.0046C6.13379 18.3418 9.6616 21.8696 13.9988 21.8696C18.336 21.8696 21.8638 18.3418 21.8638 14.0046C21.8638 9.66746 18.336 6.13965 13.9988 6.13965ZM13.9988 8.22965C14.1447 8.22965 14.2846 8.28759 14.3877 8.39074C14.4908 8.49388 14.5488 8.63378 14.5488 8.77965V13.7769L17.5227 16.7508C17.6258 16.8539 17.6837 16.9938 17.6837 17.1396C17.6837 17.2855 17.6258 17.4254 17.5227 17.5285C17.4195 17.6316 17.2796 17.6896 17.1338 17.6896C16.9879 17.6896 16.8481 17.6316 16.7449 17.5285L13.6099 14.3935C13.5068 14.2904 13.4488 14.1505 13.4488 14.0046V8.77965C13.4488 8.63378 13.5067 8.49388 13.6099 8.39074C13.713 8.28759 13.8529 8.22965 13.9988 8.22965Z\"\r\n fill=\"#F3A041\" />\r\n <rect width=\"28.56\" height=\"28\" rx=\"1.51479\" fill=\"#999999\" />\r\n <path\r\n d=\"M15.068 22.7391V17.6708H18.4968L14.2108 12.6025L9.9248 17.6708H13.3536V22.7391H9.06759V22.6969C8.92358 22.7053 8.78643 22.7391 8.63899 22.7391C6.93391 22.7391 5.29866 22.0717 4.09298 20.8835C2.8873 19.6954 2.20996 18.084 2.20996 16.4037C2.20996 13.1532 4.70443 10.5042 7.90523 10.141C8.18585 8.6953 8.96892 7.39118 10.1197 6.45292C11.2706 5.51465 12.7172 5.00089 14.2108 5C15.7047 5.00082 17.1515 5.51452 18.3026 6.45277C19.4537 7.39101 20.2371 8.69516 20.5181 10.141C23.7189 10.5042 26.21 13.1532 26.21 16.4037C26.21 18.084 25.5326 19.6954 24.3269 20.8835C23.1213 22.0717 21.486 22.7391 19.7809 22.7391C19.6369 22.7391 19.4981 22.7053 19.3523 22.6969V22.7391H15.068Z\"\r\n fill=\"white\" />\r\n </svg>\r\n </div>\r\n <a type=\"button\" (click)=\"openFileDialog(fileInput)\" class=\"text-base cursor-pointer\">\r\n {{ setting('upload-text') }}\r\n </a>\r\n </div>\r\n </div>\r\n <!-- <input #fileInput type=\"file\" [multiple]=\"setting('multiple-upload')\" (change)=\"onFileSelected($event)\" hidden />\r\n <div class=\"separator\"></div>\r\n <div class=\"file-list flex items-center gap-4 flex-wrap\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\" \r\n class=\"flex flex-col items-center justify-center\" (click)=\"deleteFile(i)\">\r\n <div class=\"relative\">\r\n <div class=\"close_icon cursor-pointer\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_6837_29683)\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"#F3A041\" />\r\n <mask id=\"mask0_6837_29683\" style=\"mask-type:alpha\" maskUnits=\"userSpaceOnUse\" x=\"4\" y=\"4\" width=\"24\"\r\n height=\"24\">\r\n <rect x=\"4\" y=\"4\" width=\"24\" height=\"24\" fill=\"#D9D9D9\" />\r\n </mask>\r\n <g mask=\"url(#mask0_6837_29683)\">\r\n <path\r\n d=\"M8.2045 8.99815L5.81802 6.61167L6.61351 5.81617L9 8.20266L11.3865 5.81617L12.182 6.61167L9.7955 8.99815L12.182 11.3846L11.3865 12.1801L9 9.79365L6.61351 12.1801L5.81802 11.3846L8.2045 8.99815Z\"\r\n fill=\"white\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_6837_29683\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <img class=\"file-thumbnail\" style=\"border-radius: 4px\" [src]=\"file?.result\" alt=\"\" />\r\n <div class=\"flex flex-col w-full\">\r\n <label class=\"font-semibold text-sm mb-1\">Title</label>\r\n <input [(ngModel)]=\"file.title\"\r\n name=\"title{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter title\"\r\n class=\" rounded px-3 py-2 mb-3 w-full outline-none focus:ring\" />\r\n \r\n <label class=\"font-semibold text-sm mb-1\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\"\r\n name=\"notes{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter notes\"\r\n class=\" rounded px-3 py-2 w-full outline-none focus:ring\"\r\n rows=\"2\"></textarea>\r\n </div>\r\n \r\n\r\n </div>\r\n\r\n <p>{{file?.name}}</p>\r\n </div>\r\n </ng-container>\r\n </div> -->\r\n\r\n <input #fileInput\r\n type=\"file\"\r\n [multiple]=\"setting('multiple-upload')\"\r\n (change)=\"onFileSelected($event)\"\r\n accept=\".csv,.pdf,.xls,.xlsx,.doc,.docx,.txt,image/*\"\r\n style=\"display: none;\" />\r\n\r\n\r\n\r\n \r\n <!-- <p-fileUpload mode=\"basic\" name=\"demo[]\" accept=\"image/*\" maxFileSize=\"1000000\" (onUpload)=\"onBasicUploadAuto($event)\" chooseLabel=\"Browse\" /> -->\r\n\r\n\r\n<!-- <div class=\"separator\"></div> -->\r\n\r\n<div class=\"file-list flex items-center gap-6 flex-wrap\" *ngIf=\"false\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\"\r\n class=\"flex flex-col items-center justify-center\">\r\n\r\n <div class=\"input-container p-3 border rounded-lg shadow-sm bg-white w-64\">\r\n <!-- Close icon -->\r\n <div class=\"close_icon cursor-pointer absolute top-2 right-2\" (click)=\"deleteFile(i)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"#F3A041\" />\r\n <path d=\"M8.2 9l-2.4-2.4.8-.8L9 8.2l2.4-2.4.8.8L9.8 9l2.4 2.4-.8.8L9 9.8l-2.4 2.4-.8-.8L8.2 9z\"\r\n fill=\"white\"/>\r\n </svg>\r\n </div>\r\n\r\n <!-- Thumbnail -->\r\n <ng-container *ngIf=\"file.type === 'image'; else nonImageThumb\">\r\n <img class=\"file-thumbnail w-full h-32 object-cover rounded mb-3\"\r\n [src]=\"file?.result\"\r\n alt=\"preview\" />\r\n </ng-container>\r\n\r\n <ng-template #nonImageThumb>\r\n <div class=\"file-thumbnail flex items-center justify-center border rounded mb-3 w-full h-32 bg-gray-50\">\r\n <ng-container [ngSwitch]=\"file.type\">\r\n <!-- CSV -->\r\n <svg *ngSwitchCase=\"'csv'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <text x=\"14\" y=\"34\" font-size=\"10\" font-family=\"monospace\" fill=\"#22c55e\">CSV</text>\r\n </svg>\r\n\r\n <!-- TEXT -->\r\n <svg *ngSwitchCase=\"'text'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M14 24h20M14 29h20M14 34h12\" stroke=\"#3b82f6\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n\r\n <!-- Generic -->\r\n <svg *ngSwitchDefault xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M16 30h16\" stroke=\"#9ca3af\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n </ng-container>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Metadata -->\r\n <div class=\"flex flex-col w-full\">\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Title</label>\r\n <input [(ngModel)]=\"file.title\" name=\"title{{i}}\" (ngModelChange)=\"onMetaChange()\" placeholder=\"Enter title\"\r\n class=\" rounded px-3 py-2 mb-3 w-full outline-none focus:ring\" />\r\n </div>\r\n \r\n <div>\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\" name=\"notes{{i}}\" (ngModelChange)=\"onMetaChange()\" placeholder=\"Enter notes\"\r\n class=\" rounded px-3 py-2 w-full outline-none focus:ring\"\r\n rows=\"2\"></textarea>\r\n </div>\r\n \r\n <div>\r\n <label class=\"font-semibold text-sm mt-3 mb-1 input-title\">Category</label>\r\n <select [(ngModel)]=\"file.category\" name=\"category{{i}}\" (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Select Category\"\r\n class=\" rounded px-3 py-2 w-full outline-none focus:ring\">\r\n <option *ngFor=\"let c of categories\" [ngValue]=\"c\">{{ c }}</option>\r\n </select>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <p class=\"mt-2 text-sm text-gray-600\">{{ file?.name }}</p>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"file-list flex items-center gap-16 flex-wrap w-full\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\"\r\n class=\"input-container p-3 border rounded-lg shadow-sm bg-white w-[450px] flex upload_file\">\r\n\r\n <!-- Close icon -->\r\n <div class=\"close_icon cursor-pointer absolute top-2 right-2\" (click)=\"deleteFile(i)\">\r\n <svg width=\"22\" height=\"22\" viewBox=\"0 0 22 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect width=\"22\" height=\"22\" rx=\"11\" fill=\"#F3A041\" />\r\n <path\r\n d=\"M7.08911 15.8889L6.11133 14.9111L10.0224 11L6.11133 7.08886L7.08911 6.11108L11.0002 10.0222L14.9113 6.11108L15.8891 7.08886L11.978 11L15.8891 14.9111L14.9113 15.8889L11.0002 11.9778L7.08911 15.8889Z\"\r\n fill=\"white\" />\r\n </svg>\r\n </div>\r\n\r\n <!-- Thumbnail on left -->\r\n <div class=\"w-28 h-28 flex-shrink-0\">\r\n <ng-container *ngIf=\"file.type === 'image'; else nonImageThumb\">\r\n <img class=\"file-thumbnail w-full h-full object-cover rounded\"\r\n [src]=\"file?.result\"\r\n alt=\"preview\" />\r\n </ng-container>\r\n\r\n <ng-template #nonImageThumb>\r\n <div class=\"file-thumbnail flex items-center justify-center border rounded w-full h-full bg-gray-50\">\r\n <ng-container [ngSwitch]=\"file.type\">\r\n <!-- CSV -->\r\n <!-- <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <text x=\"14\" y=\"34\" font-size=\"10\" font-family=\"monospace\" fill=\"#22c55e\">CSV</text>\r\n </svg> -->\r\n\r\n <svg *ngSwitchCase=\"'csv'\" width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\"\r\n fill=\"#F4F4F4\" />\r\n <path\r\n d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\"\r\n fill=\"#23A761\" />\r\n <path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\" />\r\n <path\r\n d=\"M6.94076 10.3433C6.85939 10.3433 6.78716 10.3588 6.72408 10.3899C6.66191 10.42 6.60934 10.464 6.56637 10.5216C6.52432 10.5793 6.49232 10.6489 6.47038 10.7305C6.44844 10.8122 6.43747 10.904 6.43747 11.006C6.43747 11.1435 6.45484 11.261 6.48958 11.3586C6.52523 11.4553 6.58009 11.5294 6.65414 11.5808C6.7282 11.6314 6.82373 11.6567 6.94076 11.6567C7.02212 11.6567 7.10349 11.6478 7.18486 11.6301C7.26714 11.6123 7.35628 11.587 7.45228 11.5542V11.9002C7.36359 11.9357 7.27628 11.961 7.19035 11.976C7.10441 11.992 7.00795 12 6.90099 12C6.69437 12 6.52432 11.9587 6.39084 11.8762C6.25827 11.7929 6.15999 11.6766 6.096 11.5276C6.032 11.3777 6 11.2029 6 11.0033C6 10.8561 6.02057 10.7212 6.06171 10.5988C6.10285 10.4764 6.16319 10.3704 6.24273 10.2808C6.32227 10.1912 6.42055 10.122 6.53758 10.0732C6.6546 10.0244 6.78899 10 6.94076 10C7.04041 10 7.14006 10.0124 7.23971 10.0373C7.34028 10.0612 7.43628 10.0945 7.5277 10.1371L7.39057 10.4724C7.3156 10.4378 7.24017 10.4076 7.16429 10.3819C7.08841 10.3562 7.0139 10.3433 6.94076 10.3433Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M9.06363 11.4331C9.06363 11.5485 9.03483 11.6487 8.97724 11.7339C8.91964 11.819 8.83553 11.8847 8.7249 11.9308C8.61519 11.9769 8.48172 12 8.32447 12C8.25498 12 8.18687 11.9956 8.12013 11.9867C8.05431 11.9778 7.99077 11.965 7.92951 11.9481C7.86917 11.9304 7.81157 11.9086 7.75672 11.8829V11.4997C7.8518 11.5405 7.95054 11.5773 8.05293 11.6101C8.15533 11.6429 8.25681 11.6593 8.35738 11.6593C8.42686 11.6593 8.48263 11.6505 8.52468 11.6327C8.56765 11.615 8.59874 11.5906 8.61794 11.5595C8.63714 11.5285 8.64674 11.493 8.64674 11.4531C8.64674 11.4043 8.62982 11.3626 8.596 11.328C8.56217 11.2934 8.51554 11.261 8.45612 11.2309C8.3976 11.2007 8.33132 11.1683 8.25727 11.1337C8.21064 11.1124 8.1599 11.0867 8.10505 11.0566C8.05019 11.0255 7.99808 10.9878 7.94871 10.9434C7.89934 10.8991 7.85866 10.8454 7.82666 10.7824C7.79558 10.7186 7.78003 10.6423 7.78003 10.5536C7.78003 10.4373 7.80746 10.338 7.86231 10.2555C7.91717 10.173 7.99534 10.11 8.09682 10.0665C8.19921 10.0222 8.31989 10 8.45886 10C8.56308 10 8.66228 10.012 8.75645 10.0359C8.85153 10.059 8.95072 10.0927 9.05403 10.1371L8.9169 10.4578C8.82456 10.4214 8.74182 10.3934 8.66868 10.3739C8.59554 10.3535 8.52103 10.3433 8.44515 10.3433C8.39212 10.3433 8.34686 10.3517 8.30938 10.3686C8.2719 10.3846 8.24355 10.4076 8.22436 10.4378C8.20516 10.4671 8.19556 10.5012 8.19556 10.5403C8.19556 10.5864 8.20927 10.6254 8.2367 10.6574C8.26504 10.6884 8.30709 10.7186 8.36286 10.7478C8.41955 10.7771 8.48994 10.8113 8.57405 10.8503C8.67645 10.8973 8.76376 10.9466 8.83598 10.998C8.90912 11.0486 8.96535 11.1084 9.00466 11.1776C9.04398 11.246 9.06363 11.3311 9.06363 11.4331Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M11 10.0279L10.3184 11.9734H9.85491L9.17471 10.0279H9.60395L9.98108 11.1856C9.98748 11.2051 9.99799 11.242 10.0126 11.2961C10.0272 11.3493 10.0419 11.4061 10.0565 11.4664C10.072 11.5258 10.0826 11.5751 10.088 11.6141C10.0935 11.5751 10.1031 11.5258 10.1168 11.4664C10.1315 11.407 10.1456 11.3506 10.1594 11.2974C10.174 11.2433 10.1845 11.206 10.1909 11.1856L10.5708 10.0279H11Z\"\r\n fill=\"white\" />\r\n <rect x=\"5\" y=\"7\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"5\" y=\"5\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"9\" y=\"7\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"9\" y=\"5\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n </svg>\r\n\r\n <!-- TEXT -->\r\n <!-- <svg *ngSwitchCase=\"'text'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M14 24h20M14 29h20M14 34h12\" stroke=\"#3b82f6\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg> -->\r\n <!-- <svg width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#DD2025\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M6.6084 9.96038C6.87161 9.96038 7.06366 10.0171 7.18457 10.1306C7.30548 10.2431 7.36593 10.3984 7.36593 10.5965C7.36593 10.6858 7.35245 10.7714 7.32547 10.8532C7.2985 10.9342 7.25432 11.0062 7.19294 11.0695C7.13249 11.1327 7.05157 11.1829 6.9502 11.2201C6.84882 11.2564 6.72373 11.2746 6.57492 11.2746H6.38937V12H5.95689V9.96038H6.6084ZM6.58608 10.3147H6.38937V10.9202H6.53167C6.61258 10.9202 6.6828 10.9095 6.74233 10.8881C6.80185 10.8667 6.84789 10.8332 6.88044 10.7877C6.91299 10.7421 6.92927 10.6835 6.92927 10.6119C6.92927 10.5114 6.90137 10.437 6.84556 10.3887C6.78976 10.3394 6.70326 10.3147 6.58608 10.3147ZM9.44322 10.9607C9.44322 11.1904 9.39904 11.3824 9.31069 11.5368C9.22326 11.6903 9.09631 11.8061 8.92983 11.8842C8.76335 11.9614 8.56292 12 8.32854 12H7.75098V9.96038H8.39132C8.60524 9.96038 8.79078 9.99851 8.94796 10.0748C9.10514 10.1501 9.22698 10.2622 9.31348 10.411C9.39997 10.5589 9.44322 10.7421 9.44322 10.9607ZM8.994 10.9718C8.994 10.8211 8.97168 10.6975 8.92704 10.6007C8.88332 10.5031 8.81822 10.431 8.73172 10.3845C8.64616 10.338 8.54013 10.3147 8.41364 10.3147H8.18345V11.6429H8.369C8.58012 11.6429 8.73684 11.5866 8.83915 11.4741C8.94238 11.3615 8.994 11.1941 8.994 10.9718ZM10.2914 12H9.86593V9.96038H11.035V10.3147H10.2914V10.8407H10.9834V11.1936H10.2914V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg> -->\r\n\r\n<svg *ngSwitchCase=\"'text'\" width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#1F5EBB\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M7.04353 12H6.61105V10.3203H6.0572V9.96038H7.59738V10.3203H7.04353V12ZM9.56027 12H9.06641L8.59208 11.2285L8.11775 12H7.65458L8.33119 10.9481L7.69782 9.96038H8.17494L8.6144 10.6942L9.04548 9.96038H9.51144L8.87109 10.9718L9.56027 12ZM10.6038 12H10.1713V10.3203H9.61747V9.96038H11.1576V10.3203H10.6038V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg>\r\n\r\n\r\n <!-- Generic -->\r\n <!-- <svg *ngSwitchDefault xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M16 30h16\" stroke=\"#9ca3af\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg> -->\r\n <svg *ngSwitchDefault width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#DD2025\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M6.6084 9.96038C6.87161 9.96038 7.06366 10.0171 7.18457 10.1306C7.30548 10.2431 7.36593 10.3984 7.36593 10.5965C7.36593 10.6858 7.35245 10.7714 7.32547 10.8532C7.2985 10.9342 7.25432 11.0062 7.19294 11.0695C7.13249 11.1327 7.05157 11.1829 6.9502 11.2201C6.84882 11.2564 6.72373 11.2746 6.57492 11.2746H6.38937V12H5.95689V9.96038H6.6084ZM6.58608 10.3147H6.38937V10.9202H6.53167C6.61258 10.9202 6.6828 10.9095 6.74233 10.8881C6.80185 10.8667 6.84789 10.8332 6.88044 10.7877C6.91299 10.7421 6.92927 10.6835 6.92927 10.6119C6.92927 10.5114 6.90137 10.437 6.84556 10.3887C6.78976 10.3394 6.70326 10.3147 6.58608 10.3147ZM9.44322 10.9607C9.44322 11.1904 9.39904 11.3824 9.31069 11.5368C9.22326 11.6903 9.09631 11.8061 8.92983 11.8842C8.76335 11.9614 8.56292 12 8.32854 12H7.75098V9.96038H8.39132C8.60524 9.96038 8.79078 9.99851 8.94796 10.0748C9.10514 10.1501 9.22698 10.2622 9.31348 10.411C9.39997 10.5589 9.44322 10.7421 9.44322 10.9607ZM8.994 10.9718C8.994 10.8211 8.97168 10.6975 8.92704 10.6007C8.88332 10.5031 8.81822 10.431 8.73172 10.3845C8.64616 10.338 8.54013 10.3147 8.41364 10.3147H8.18345V11.6429H8.369C8.58012 11.6429 8.73684 11.5866 8.83915 11.4741C8.94238 11.3615 8.994 11.1941 8.994 10.9718ZM10.2914 12H9.86593V9.96038H11.035V10.3147H10.2914V10.8407H10.9834V11.1936H10.2914V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg>\r\n </ng-container>\r\n </div>\r\n </ng-template>\r\n </div>\r\n\r\n <!-- Metadata on right -->\r\n <div class=\"flex flex-col flex-1 ml-4\">\r\n <!-- Title -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Title</label>\r\n <input [(ngModel)]=\"file.title\"\r\n name=\"title{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter title\"\r\n class=\" rounded px-3 py-2 mb-3 w-full outline-none focus:ring\" />\r\n\r\n </div>\r\n <!-- Notes -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\"\r\n name=\"notes{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter notes\"\r\n class=\" rounded px-3 py-2 mb-3 w-full outline-none focus:ring\"\r\n rows=\"2\"></textarea>\r\n\r\n </div>\r\n <!-- Category -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Category</label>\r\n <select [(ngModel)]=\"file.categoryId \"\r\n name=\"category{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n class=\" rounded px-3 py-2 w-full outline-none focus:ring\">\r\n <option value=\"\">Select Category</option>\r\n <option *ngFor=\"let c of categories\" [ngValue]=\"c.value\">{{ c.label }}</option>\r\n </select>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n\r\n\r\n </div>\r\n</fx-component>", styles: [".custom-upload{border:1px solid #ccc}.custom-upload a{color:#fff}.custom-upload .file-list .file-thumbnail{width:160px;height:100%;max-height:185px!important;border:1px solid #ccc;background-color:#fff;padding:10px}.custom-upload .separator{height:56px;width:2px;background-color:#ccc;margin:10px}.custom-upload .upload{background-color:#999;padding:2px 12px 2px 6px;border-radius:4px;margin-left:40px}.close_icon{position:absolute;top:-8px;right:-8px}[type=checkbox]{padding:12px}[type=checkbox]:checked{background-color:#f3a041!important;padding:12px;background-size:1em 1em!important}.gap-8{gap:8px}.gap-16{gap:25px}.input-title{position:absolute;bottom:auto;right:auto;left:1rem;top:-9px;padding:0rem .25rem;font-weight:600;border-radius:.25rem;z-index:1;color:#454545;background-color:#fff}.input-container{position:relative;inset:auto;z-index:auto}.upload_file{width:32%!important}select:not([size]){padding:.35rem .75rem!important;border:1px solid #999!important}input,textarea,select{border:1px solid #999!important}input:focus,textarea:focus,select:focus{outline:0 none!important;outline-offset:0!important;box-shadow:0 0 0 .2rem #bfdbfe!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: FxComponent, selector: "fx-component", inputs: ["fxData"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: FileUploadModule }] });
1429
1429
  }
1430
1430
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UploaderComponent, decorators: [{
1431
1431
  type: Component,
1432
- args: [{ selector: 'fx-uploader', standalone: true, imports: [CommonModule, FxComponent, FormsModule, ReactiveFormsModule, FileUploadModule], template: "<fx-component [fxData]=\"fxData\">\r\n <div class=\"custom-upload flex flex-col items-start justify-center gap-4 p-2 pb-0 rounded-sm\">\r\n <div class=\"flex gap-8 items-center mb-2\">\r\n <p class=\"text-base font-semibold\">Patient Images</p>\r\n <div class=\"flex justify-center items-center gap-2 upload\" (click)=\"fileInput.click()\">\r\n <div>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"29\" height=\"28\" viewBox=\"0 0 29 28\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\r\n d=\"M14.001 3.00195C11.5322 3.00195 9.16722 3.86956 7.23641 5.38414L7.23598 4.59695C7.23598 4.52473 7.22175 4.45321 7.19411 4.38648C7.16647 4.31975 7.12596 4.25912 7.07489 4.20804C7.02381 4.15697 6.96318 4.11646 6.89645 4.08882C6.82972 4.06118 6.7582 4.04695 6.68598 4.04695C6.61375 4.04695 6.54223 4.06118 6.4755 4.08882C6.40877 4.11646 6.34814 4.15697 6.29707 4.20804C6.24599 4.25912 6.20548 4.31975 6.17784 4.38648C6.1502 4.45321 6.13598 4.52473 6.13598 4.59695L6.13642 6.68652C6.13643 6.83239 6.19438 6.97228 6.29752 7.07542C6.40067 7.17856 6.54055 7.23651 6.68642 7.23652H8.77598C8.8482 7.23652 8.91972 7.2223 8.98645 7.19466C9.05318 7.16702 9.11381 7.12651 9.16489 7.07543C9.21596 7.02436 9.25647 6.96373 9.28411 6.897C9.31175 6.83027 9.32598 6.75875 9.32598 6.68652C9.32598 6.6143 9.31175 6.54278 9.28411 6.47605C9.25647 6.40932 9.21596 6.34869 9.16489 6.29761C9.11381 6.24654 9.05318 6.20603 8.98645 6.17839C8.91972 6.15075 8.8482 6.13652 8.77598 6.13652H8.0584C9.7702 4.84387 11.8399 4.10195 14.001 4.10195C19.4751 4.10195 23.901 8.52782 23.901 14.002C23.901 19.4761 19.4751 23.902 14.001 23.902C8.52684 23.902 4.10098 19.4761 4.10098 14.002C4.10098 12.6381 4.38263 11.2888 4.92855 10.0389C4.98691 9.90532 4.98982 9.75399 4.93665 9.61822C4.88347 9.48246 4.77855 9.37336 4.64496 9.31492C4.57877 9.28596 4.50753 9.27032 4.4353 9.2689C4.36306 9.26747 4.29126 9.2803 4.22398 9.30663C4.15671 9.33297 4.09528 9.3723 4.04321 9.42238C3.99114 9.47247 3.94944 9.53232 3.92051 9.59852C3.31393 10.9872 3.00098 12.4866 3.00098 14.002C3.00098 20.0706 7.93236 25.002 14.001 25.002C20.0696 25.002 25.001 20.0706 25.001 14.002C25.001 7.93334 20.0696 3.00195 14.001 3.00195Z\"\r\n fill=\"#F3A041\" />\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\r\n d=\"M13.9988 6.13965C9.6616 6.13965 6.13379 9.66746 6.13379 14.0046C6.13379 18.3418 9.6616 21.8696 13.9988 21.8696C18.336 21.8696 21.8638 18.3418 21.8638 14.0046C21.8638 9.66746 18.336 6.13965 13.9988 6.13965ZM13.9988 8.22965C14.1447 8.22965 14.2846 8.28759 14.3877 8.39074C14.4908 8.49388 14.5488 8.63378 14.5488 8.77965V13.7769L17.5227 16.7508C17.6258 16.8539 17.6837 16.9938 17.6837 17.1396C17.6837 17.2855 17.6258 17.4254 17.5227 17.5285C17.4195 17.6316 17.2796 17.6896 17.1338 17.6896C16.9879 17.6896 16.8481 17.6316 16.7449 17.5285L13.6099 14.3935C13.5068 14.2904 13.4488 14.1505 13.4488 14.0046V8.77965C13.4488 8.63378 13.5067 8.49388 13.6099 8.39074C13.713 8.28759 13.8529 8.22965 13.9988 8.22965Z\"\r\n fill=\"#F3A041\" />\r\n <rect width=\"28.56\" height=\"28\" rx=\"1.51479\" fill=\"#999999\" />\r\n <path\r\n d=\"M15.068 22.7391V17.6708H18.4968L14.2108 12.6025L9.9248 17.6708H13.3536V22.7391H9.06759V22.6969C8.92358 22.7053 8.78643 22.7391 8.63899 22.7391C6.93391 22.7391 5.29866 22.0717 4.09298 20.8835C2.8873 19.6954 2.20996 18.084 2.20996 16.4037C2.20996 13.1532 4.70443 10.5042 7.90523 10.141C8.18585 8.6953 8.96892 7.39118 10.1197 6.45292C11.2706 5.51465 12.7172 5.00089 14.2108 5C15.7047 5.00082 17.1515 5.51452 18.3026 6.45277C19.4537 7.39101 20.2371 8.69516 20.5181 10.141C23.7189 10.5042 26.21 13.1532 26.21 16.4037C26.21 18.084 25.5326 19.6954 24.3269 20.8835C23.1213 22.0717 21.486 22.7391 19.7809 22.7391C19.6369 22.7391 19.4981 22.7053 19.3523 22.6969V22.7391H15.068Z\"\r\n fill=\"white\" />\r\n </svg>\r\n </div>\r\n <a type=\"button\" (click)=\"openFileDialog(fileInput)\" class=\"text-base cursor-pointer\">\r\n {{ setting('upload-text') }}\r\n </a>\r\n </div>\r\n </div>\r\n <!-- <input #fileInput type=\"file\" [multiple]=\"setting('multiple-upload')\" (change)=\"onFileSelected($event)\" hidden />\r\n <div class=\"separator\"></div>\r\n <div class=\"file-list flex items-center gap-4 flex-wrap\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\" \r\n class=\"flex flex-col items-center justify-center\" (click)=\"deleteFile(i)\">\r\n <div class=\"relative\">\r\n <div class=\"close_icon cursor-pointer\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_6837_29683)\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"#F3A041\" />\r\n <mask id=\"mask0_6837_29683\" style=\"mask-type:alpha\" maskUnits=\"userSpaceOnUse\" x=\"4\" y=\"4\" width=\"24\"\r\n height=\"24\">\r\n <rect x=\"4\" y=\"4\" width=\"24\" height=\"24\" fill=\"#D9D9D9\" />\r\n </mask>\r\n <g mask=\"url(#mask0_6837_29683)\">\r\n <path\r\n d=\"M8.2045 8.99815L5.81802 6.61167L6.61351 5.81617L9 8.20266L11.3865 5.81617L12.182 6.61167L9.7955 8.99815L12.182 11.3846L11.3865 12.1801L9 9.79365L6.61351 12.1801L5.81802 11.3846L8.2045 8.99815Z\"\r\n fill=\"white\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_6837_29683\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <img class=\"file-thumbnail\" style=\"border-radius: 4px\" [src]=\"file?.result\" alt=\"\" />\r\n <div class=\"flex flex-col w-full\">\r\n <label class=\"font-semibold text-sm mb-1\">Title</label>\r\n <input [(ngModel)]=\"file.title\"\r\n name=\"title{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter title\"\r\n class=\"border border-orange-300 rounded px-3 py-2 mb-3 w-full outline-none focus:ring focus:ring-orange-200\" />\r\n \r\n <label class=\"font-semibold text-sm mb-1\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\"\r\n name=\"notes{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter notes\"\r\n class=\"border border-orange-300 rounded px-3 py-2 w-full outline-none focus:ring focus:ring-orange-200\"\r\n rows=\"2\"></textarea>\r\n </div>\r\n \r\n\r\n </div>\r\n\r\n <p>{{file?.name}}</p>\r\n </div>\r\n </ng-container>\r\n </div> -->\r\n\r\n <input #fileInput\r\n type=\"file\"\r\n [multiple]=\"setting('multiple-upload')\"\r\n (change)=\"onFileSelected($event)\"\r\n accept=\".csv,.pdf,.xls,.xlsx,.doc,.docx,.txt,image/*\"\r\n style=\"display: none;\" />\r\n\r\n\r\n\r\n \r\n <!-- <p-fileUpload mode=\"basic\" name=\"demo[]\" accept=\"image/*\" maxFileSize=\"1000000\" (onUpload)=\"onBasicUploadAuto($event)\" chooseLabel=\"Browse\" /> -->\r\n\r\n\r\n<!-- <div class=\"separator\"></div> -->\r\n\r\n<div class=\"file-list flex items-center gap-6 flex-wrap\" *ngIf=\"false\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\"\r\n class=\"flex flex-col items-center justify-center\">\r\n\r\n <div class=\"input-container p-3 border rounded-lg shadow-sm bg-white w-64\">\r\n <!-- Close icon -->\r\n <div class=\"close_icon cursor-pointer absolute top-2 right-2\" (click)=\"deleteFile(i)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"#F3A041\" />\r\n <path d=\"M8.2 9l-2.4-2.4.8-.8L9 8.2l2.4-2.4.8.8L9.8 9l2.4 2.4-.8.8L9 9.8l-2.4 2.4-.8-.8L8.2 9z\"\r\n fill=\"white\"/>\r\n </svg>\r\n </div>\r\n\r\n <!-- Thumbnail -->\r\n <ng-container *ngIf=\"file.type === 'image'; else nonImageThumb\">\r\n <img class=\"file-thumbnail w-full h-32 object-cover rounded mb-3\"\r\n [src]=\"file?.result\"\r\n alt=\"preview\" />\r\n </ng-container>\r\n\r\n <ng-template #nonImageThumb>\r\n <div class=\"file-thumbnail flex items-center justify-center border rounded mb-3 w-full h-32 bg-gray-50\">\r\n <ng-container [ngSwitch]=\"file.type\">\r\n <!-- CSV -->\r\n <svg *ngSwitchCase=\"'csv'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <text x=\"14\" y=\"34\" font-size=\"10\" font-family=\"monospace\" fill=\"#22c55e\">CSV</text>\r\n </svg>\r\n\r\n <!-- TEXT -->\r\n <svg *ngSwitchCase=\"'text'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M14 24h20M14 29h20M14 34h12\" stroke=\"#3b82f6\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n\r\n <!-- Generic -->\r\n <svg *ngSwitchDefault xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M16 30h16\" stroke=\"#9ca3af\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n </ng-container>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Metadata -->\r\n <div class=\"flex flex-col w-full\">\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Title</label>\r\n <input [(ngModel)]=\"file.title\" name=\"title{{i}}\" (ngModelChange)=\"onMetaChange()\" placeholder=\"Enter title\"\r\n class=\"border border-orange-300 rounded px-3 py-2 mb-3 w-full outline-none focus:ring focus:ring-orange-200\" />\r\n </div>\r\n \r\n <div>\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\" name=\"notes{{i}}\" (ngModelChange)=\"onMetaChange()\" placeholder=\"Enter notes\"\r\n class=\"border border-orange-300 rounded px-3 py-2 w-full outline-none focus:ring focus:ring-orange-200\"\r\n rows=\"2\"></textarea>\r\n </div>\r\n \r\n <div>\r\n <label class=\"font-semibold text-sm mt-3 mb-1 input-title\">Category</label>\r\n <select [(ngModel)]=\"file.category\" name=\"category{{i}}\" (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Select Category\"\r\n class=\"border border-orange-300 rounded px-3 py-2 w-full outline-none focus:ring focus:ring-orange-200\">\r\n <option *ngFor=\"let c of categories\" [ngValue]=\"c\">{{ c }}</option>\r\n </select>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <p class=\"mt-2 text-sm text-gray-600\">{{ file?.name }}</p>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"file-list flex items-center gap-16 flex-wrap w-full\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\"\r\n class=\"input-container p-3 border rounded-lg shadow-sm bg-white w-[450px] flex upload_file\">\r\n\r\n <!-- Close icon -->\r\n <div class=\"close_icon cursor-pointer absolute top-2 right-2\" (click)=\"deleteFile(i)\">\r\n <svg width=\"22\" height=\"22\" viewBox=\"0 0 22 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect width=\"22\" height=\"22\" rx=\"11\" fill=\"#F3A041\" />\r\n <path\r\n d=\"M7.08911 15.8889L6.11133 14.9111L10.0224 11L6.11133 7.08886L7.08911 6.11108L11.0002 10.0222L14.9113 6.11108L15.8891 7.08886L11.978 11L15.8891 14.9111L14.9113 15.8889L11.0002 11.9778L7.08911 15.8889Z\"\r\n fill=\"white\" />\r\n </svg>\r\n </div>\r\n\r\n <!-- Thumbnail on left -->\r\n <div class=\"w-28 h-28 flex-shrink-0\">\r\n <ng-container *ngIf=\"file.type === 'image'; else nonImageThumb\">\r\n <img class=\"file-thumbnail w-full h-full object-cover rounded\"\r\n [src]=\"file?.result\"\r\n alt=\"preview\" />\r\n </ng-container>\r\n\r\n <ng-template #nonImageThumb>\r\n <div class=\"file-thumbnail flex items-center justify-center border rounded w-full h-full bg-gray-50\">\r\n <ng-container [ngSwitch]=\"file.type\">\r\n <!-- CSV -->\r\n <!-- <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <text x=\"14\" y=\"34\" font-size=\"10\" font-family=\"monospace\" fill=\"#22c55e\">CSV</text>\r\n </svg> -->\r\n\r\n <svg *ngSwitchCase=\"'csv'\" width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\"\r\n fill=\"#F4F4F4\" />\r\n <path\r\n d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\"\r\n fill=\"#23A761\" />\r\n <path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\" />\r\n <path\r\n d=\"M6.94076 10.3433C6.85939 10.3433 6.78716 10.3588 6.72408 10.3899C6.66191 10.42 6.60934 10.464 6.56637 10.5216C6.52432 10.5793 6.49232 10.6489 6.47038 10.7305C6.44844 10.8122 6.43747 10.904 6.43747 11.006C6.43747 11.1435 6.45484 11.261 6.48958 11.3586C6.52523 11.4553 6.58009 11.5294 6.65414 11.5808C6.7282 11.6314 6.82373 11.6567 6.94076 11.6567C7.02212 11.6567 7.10349 11.6478 7.18486 11.6301C7.26714 11.6123 7.35628 11.587 7.45228 11.5542V11.9002C7.36359 11.9357 7.27628 11.961 7.19035 11.976C7.10441 11.992 7.00795 12 6.90099 12C6.69437 12 6.52432 11.9587 6.39084 11.8762C6.25827 11.7929 6.15999 11.6766 6.096 11.5276C6.032 11.3777 6 11.2029 6 11.0033C6 10.8561 6.02057 10.7212 6.06171 10.5988C6.10285 10.4764 6.16319 10.3704 6.24273 10.2808C6.32227 10.1912 6.42055 10.122 6.53758 10.0732C6.6546 10.0244 6.78899 10 6.94076 10C7.04041 10 7.14006 10.0124 7.23971 10.0373C7.34028 10.0612 7.43628 10.0945 7.5277 10.1371L7.39057 10.4724C7.3156 10.4378 7.24017 10.4076 7.16429 10.3819C7.08841 10.3562 7.0139 10.3433 6.94076 10.3433Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M9.06363 11.4331C9.06363 11.5485 9.03483 11.6487 8.97724 11.7339C8.91964 11.819 8.83553 11.8847 8.7249 11.9308C8.61519 11.9769 8.48172 12 8.32447 12C8.25498 12 8.18687 11.9956 8.12013 11.9867C8.05431 11.9778 7.99077 11.965 7.92951 11.9481C7.86917 11.9304 7.81157 11.9086 7.75672 11.8829V11.4997C7.8518 11.5405 7.95054 11.5773 8.05293 11.6101C8.15533 11.6429 8.25681 11.6593 8.35738 11.6593C8.42686 11.6593 8.48263 11.6505 8.52468 11.6327C8.56765 11.615 8.59874 11.5906 8.61794 11.5595C8.63714 11.5285 8.64674 11.493 8.64674 11.4531C8.64674 11.4043 8.62982 11.3626 8.596 11.328C8.56217 11.2934 8.51554 11.261 8.45612 11.2309C8.3976 11.2007 8.33132 11.1683 8.25727 11.1337C8.21064 11.1124 8.1599 11.0867 8.10505 11.0566C8.05019 11.0255 7.99808 10.9878 7.94871 10.9434C7.89934 10.8991 7.85866 10.8454 7.82666 10.7824C7.79558 10.7186 7.78003 10.6423 7.78003 10.5536C7.78003 10.4373 7.80746 10.338 7.86231 10.2555C7.91717 10.173 7.99534 10.11 8.09682 10.0665C8.19921 10.0222 8.31989 10 8.45886 10C8.56308 10 8.66228 10.012 8.75645 10.0359C8.85153 10.059 8.95072 10.0927 9.05403 10.1371L8.9169 10.4578C8.82456 10.4214 8.74182 10.3934 8.66868 10.3739C8.59554 10.3535 8.52103 10.3433 8.44515 10.3433C8.39212 10.3433 8.34686 10.3517 8.30938 10.3686C8.2719 10.3846 8.24355 10.4076 8.22436 10.4378C8.20516 10.4671 8.19556 10.5012 8.19556 10.5403C8.19556 10.5864 8.20927 10.6254 8.2367 10.6574C8.26504 10.6884 8.30709 10.7186 8.36286 10.7478C8.41955 10.7771 8.48994 10.8113 8.57405 10.8503C8.67645 10.8973 8.76376 10.9466 8.83598 10.998C8.90912 11.0486 8.96535 11.1084 9.00466 11.1776C9.04398 11.246 9.06363 11.3311 9.06363 11.4331Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M11 10.0279L10.3184 11.9734H9.85491L9.17471 10.0279H9.60395L9.98108 11.1856C9.98748 11.2051 9.99799 11.242 10.0126 11.2961C10.0272 11.3493 10.0419 11.4061 10.0565 11.4664C10.072 11.5258 10.0826 11.5751 10.088 11.6141C10.0935 11.5751 10.1031 11.5258 10.1168 11.4664C10.1315 11.407 10.1456 11.3506 10.1594 11.2974C10.174 11.2433 10.1845 11.206 10.1909 11.1856L10.5708 10.0279H11Z\"\r\n fill=\"white\" />\r\n <rect x=\"5\" y=\"7\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"5\" y=\"5\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"9\" y=\"7\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"9\" y=\"5\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n </svg>\r\n\r\n <!-- TEXT -->\r\n <!-- <svg *ngSwitchCase=\"'text'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M14 24h20M14 29h20M14 34h12\" stroke=\"#3b82f6\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg> -->\r\n <!-- <svg width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#DD2025\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M6.6084 9.96038C6.87161 9.96038 7.06366 10.0171 7.18457 10.1306C7.30548 10.2431 7.36593 10.3984 7.36593 10.5965C7.36593 10.6858 7.35245 10.7714 7.32547 10.8532C7.2985 10.9342 7.25432 11.0062 7.19294 11.0695C7.13249 11.1327 7.05157 11.1829 6.9502 11.2201C6.84882 11.2564 6.72373 11.2746 6.57492 11.2746H6.38937V12H5.95689V9.96038H6.6084ZM6.58608 10.3147H6.38937V10.9202H6.53167C6.61258 10.9202 6.6828 10.9095 6.74233 10.8881C6.80185 10.8667 6.84789 10.8332 6.88044 10.7877C6.91299 10.7421 6.92927 10.6835 6.92927 10.6119C6.92927 10.5114 6.90137 10.437 6.84556 10.3887C6.78976 10.3394 6.70326 10.3147 6.58608 10.3147ZM9.44322 10.9607C9.44322 11.1904 9.39904 11.3824 9.31069 11.5368C9.22326 11.6903 9.09631 11.8061 8.92983 11.8842C8.76335 11.9614 8.56292 12 8.32854 12H7.75098V9.96038H8.39132C8.60524 9.96038 8.79078 9.99851 8.94796 10.0748C9.10514 10.1501 9.22698 10.2622 9.31348 10.411C9.39997 10.5589 9.44322 10.7421 9.44322 10.9607ZM8.994 10.9718C8.994 10.8211 8.97168 10.6975 8.92704 10.6007C8.88332 10.5031 8.81822 10.431 8.73172 10.3845C8.64616 10.338 8.54013 10.3147 8.41364 10.3147H8.18345V11.6429H8.369C8.58012 11.6429 8.73684 11.5866 8.83915 11.4741C8.94238 11.3615 8.994 11.1941 8.994 10.9718ZM10.2914 12H9.86593V9.96038H11.035V10.3147H10.2914V10.8407H10.9834V11.1936H10.2914V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg> -->\r\n\r\n<svg *ngSwitchCase=\"'text'\" width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#1F5EBB\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M7.04353 12H6.61105V10.3203H6.0572V9.96038H7.59738V10.3203H7.04353V12ZM9.56027 12H9.06641L8.59208 11.2285L8.11775 12H7.65458L8.33119 10.9481L7.69782 9.96038H8.17494L8.6144 10.6942L9.04548 9.96038H9.51144L8.87109 10.9718L9.56027 12ZM10.6038 12H10.1713V10.3203H9.61747V9.96038H11.1576V10.3203H10.6038V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg>\r\n\r\n\r\n <!-- Generic -->\r\n <!-- <svg *ngSwitchDefault xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M16 30h16\" stroke=\"#9ca3af\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg> -->\r\n <svg *ngSwitchDefault width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#DD2025\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M6.6084 9.96038C6.87161 9.96038 7.06366 10.0171 7.18457 10.1306C7.30548 10.2431 7.36593 10.3984 7.36593 10.5965C7.36593 10.6858 7.35245 10.7714 7.32547 10.8532C7.2985 10.9342 7.25432 11.0062 7.19294 11.0695C7.13249 11.1327 7.05157 11.1829 6.9502 11.2201C6.84882 11.2564 6.72373 11.2746 6.57492 11.2746H6.38937V12H5.95689V9.96038H6.6084ZM6.58608 10.3147H6.38937V10.9202H6.53167C6.61258 10.9202 6.6828 10.9095 6.74233 10.8881C6.80185 10.8667 6.84789 10.8332 6.88044 10.7877C6.91299 10.7421 6.92927 10.6835 6.92927 10.6119C6.92927 10.5114 6.90137 10.437 6.84556 10.3887C6.78976 10.3394 6.70326 10.3147 6.58608 10.3147ZM9.44322 10.9607C9.44322 11.1904 9.39904 11.3824 9.31069 11.5368C9.22326 11.6903 9.09631 11.8061 8.92983 11.8842C8.76335 11.9614 8.56292 12 8.32854 12H7.75098V9.96038H8.39132C8.60524 9.96038 8.79078 9.99851 8.94796 10.0748C9.10514 10.1501 9.22698 10.2622 9.31348 10.411C9.39997 10.5589 9.44322 10.7421 9.44322 10.9607ZM8.994 10.9718C8.994 10.8211 8.97168 10.6975 8.92704 10.6007C8.88332 10.5031 8.81822 10.431 8.73172 10.3845C8.64616 10.338 8.54013 10.3147 8.41364 10.3147H8.18345V11.6429H8.369C8.58012 11.6429 8.73684 11.5866 8.83915 11.4741C8.94238 11.3615 8.994 11.1941 8.994 10.9718ZM10.2914 12H9.86593V9.96038H11.035V10.3147H10.2914V10.8407H10.9834V11.1936H10.2914V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg>\r\n </ng-container>\r\n </div>\r\n </ng-template>\r\n </div>\r\n\r\n <!-- Metadata on right -->\r\n <div class=\"flex flex-col flex-1 ml-4\">\r\n <!-- Title -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Title</label>\r\n <input [(ngModel)]=\"file.title\"\r\n name=\"title{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter title\"\r\n class=\"border border-orange-300 rounded px-3 py-2 mb-3 w-full outline-none focus:ring focus:ring-orange-200\" />\r\n\r\n </div>\r\n <!-- Notes -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\"\r\n name=\"notes{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter notes\"\r\n class=\"border border-orange-300 rounded px-3 py-2 mb-3 w-full outline-none focus:ring focus:ring-orange-200\"\r\n rows=\"2\"></textarea>\r\n\r\n </div>\r\n <!-- Category -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Category</label>\r\n <select [(ngModel)]=\"file.categoryId \"\r\n name=\"category{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n class=\"border border-orange-300 rounded px-3 py-2 w-full outline-none focus:ring focus:ring-orange-200\">\r\n <option value=\"\">Select Category</option>\r\n <option *ngFor=\"let c of categories\" [ngValue]=\"c.value\">{{ c.label }}</option>\r\n </select>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n\r\n\r\n </div>\r\n</fx-component>", styles: [".custom-upload{border:1px solid #ccc}.custom-upload a{color:#fff}.custom-upload .file-list .file-thumbnail{width:160px;height:100%;max-height:185px!important;border:1px solid #ccc;background-color:#fff;padding:10px}.custom-upload .separator{height:56px;width:2px;background-color:#ccc;margin:10px}.custom-upload .upload{background-color:#999;padding:2px 12px 2px 6px;border-radius:4px;margin-left:40px}.close_icon{position:absolute;top:-8px;right:-8px}[type=checkbox]{padding:12px}[type=checkbox]:checked{background-color:#f3a041!important;padding:12px;background-size:1em 1em!important}.gap-8{gap:8px}.gap-16{gap:25px}.input-title{position:absolute;bottom:auto;right:auto;left:1rem;top:-9px;padding:0rem .25rem;font-weight:600;border-radius:.25rem;z-index:1;color:#454545;background-color:#fff}.input-container{position:relative;inset:auto;z-index:auto}.upload_file{width:32%!important}select:not([size]){padding:.35rem .75rem!important}\n"] }]
1432
+ args: [{ selector: 'fx-uploader', standalone: true, imports: [CommonModule, FxComponent, FormsModule, ReactiveFormsModule, FileUploadModule], template: "<fx-component [fxData]=\"fxData\">\r\n <div class=\"custom-upload flex flex-col items-start justify-center gap-4 p-2 pb-0 rounded-sm\">\r\n <div class=\"flex gap-8 items-center mb-2\">\r\n <p class=\"text-base font-semibold\">Patient Images</p>\r\n <div class=\"flex justify-center items-center gap-2 upload\" (click)=\"fileInput.click()\">\r\n <div>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"29\" height=\"28\" viewBox=\"0 0 29 28\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\r\n d=\"M14.001 3.00195C11.5322 3.00195 9.16722 3.86956 7.23641 5.38414L7.23598 4.59695C7.23598 4.52473 7.22175 4.45321 7.19411 4.38648C7.16647 4.31975 7.12596 4.25912 7.07489 4.20804C7.02381 4.15697 6.96318 4.11646 6.89645 4.08882C6.82972 4.06118 6.7582 4.04695 6.68598 4.04695C6.61375 4.04695 6.54223 4.06118 6.4755 4.08882C6.40877 4.11646 6.34814 4.15697 6.29707 4.20804C6.24599 4.25912 6.20548 4.31975 6.17784 4.38648C6.1502 4.45321 6.13598 4.52473 6.13598 4.59695L6.13642 6.68652C6.13643 6.83239 6.19438 6.97228 6.29752 7.07542C6.40067 7.17856 6.54055 7.23651 6.68642 7.23652H8.77598C8.8482 7.23652 8.91972 7.2223 8.98645 7.19466C9.05318 7.16702 9.11381 7.12651 9.16489 7.07543C9.21596 7.02436 9.25647 6.96373 9.28411 6.897C9.31175 6.83027 9.32598 6.75875 9.32598 6.68652C9.32598 6.6143 9.31175 6.54278 9.28411 6.47605C9.25647 6.40932 9.21596 6.34869 9.16489 6.29761C9.11381 6.24654 9.05318 6.20603 8.98645 6.17839C8.91972 6.15075 8.8482 6.13652 8.77598 6.13652H8.0584C9.7702 4.84387 11.8399 4.10195 14.001 4.10195C19.4751 4.10195 23.901 8.52782 23.901 14.002C23.901 19.4761 19.4751 23.902 14.001 23.902C8.52684 23.902 4.10098 19.4761 4.10098 14.002C4.10098 12.6381 4.38263 11.2888 4.92855 10.0389C4.98691 9.90532 4.98982 9.75399 4.93665 9.61822C4.88347 9.48246 4.77855 9.37336 4.64496 9.31492C4.57877 9.28596 4.50753 9.27032 4.4353 9.2689C4.36306 9.26747 4.29126 9.2803 4.22398 9.30663C4.15671 9.33297 4.09528 9.3723 4.04321 9.42238C3.99114 9.47247 3.94944 9.53232 3.92051 9.59852C3.31393 10.9872 3.00098 12.4866 3.00098 14.002C3.00098 20.0706 7.93236 25.002 14.001 25.002C20.0696 25.002 25.001 20.0706 25.001 14.002C25.001 7.93334 20.0696 3.00195 14.001 3.00195Z\"\r\n fill=\"#F3A041\" />\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\r\n d=\"M13.9988 6.13965C9.6616 6.13965 6.13379 9.66746 6.13379 14.0046C6.13379 18.3418 9.6616 21.8696 13.9988 21.8696C18.336 21.8696 21.8638 18.3418 21.8638 14.0046C21.8638 9.66746 18.336 6.13965 13.9988 6.13965ZM13.9988 8.22965C14.1447 8.22965 14.2846 8.28759 14.3877 8.39074C14.4908 8.49388 14.5488 8.63378 14.5488 8.77965V13.7769L17.5227 16.7508C17.6258 16.8539 17.6837 16.9938 17.6837 17.1396C17.6837 17.2855 17.6258 17.4254 17.5227 17.5285C17.4195 17.6316 17.2796 17.6896 17.1338 17.6896C16.9879 17.6896 16.8481 17.6316 16.7449 17.5285L13.6099 14.3935C13.5068 14.2904 13.4488 14.1505 13.4488 14.0046V8.77965C13.4488 8.63378 13.5067 8.49388 13.6099 8.39074C13.713 8.28759 13.8529 8.22965 13.9988 8.22965Z\"\r\n fill=\"#F3A041\" />\r\n <rect width=\"28.56\" height=\"28\" rx=\"1.51479\" fill=\"#999999\" />\r\n <path\r\n d=\"M15.068 22.7391V17.6708H18.4968L14.2108 12.6025L9.9248 17.6708H13.3536V22.7391H9.06759V22.6969C8.92358 22.7053 8.78643 22.7391 8.63899 22.7391C6.93391 22.7391 5.29866 22.0717 4.09298 20.8835C2.8873 19.6954 2.20996 18.084 2.20996 16.4037C2.20996 13.1532 4.70443 10.5042 7.90523 10.141C8.18585 8.6953 8.96892 7.39118 10.1197 6.45292C11.2706 5.51465 12.7172 5.00089 14.2108 5C15.7047 5.00082 17.1515 5.51452 18.3026 6.45277C19.4537 7.39101 20.2371 8.69516 20.5181 10.141C23.7189 10.5042 26.21 13.1532 26.21 16.4037C26.21 18.084 25.5326 19.6954 24.3269 20.8835C23.1213 22.0717 21.486 22.7391 19.7809 22.7391C19.6369 22.7391 19.4981 22.7053 19.3523 22.6969V22.7391H15.068Z\"\r\n fill=\"white\" />\r\n </svg>\r\n </div>\r\n <a type=\"button\" (click)=\"openFileDialog(fileInput)\" class=\"text-base cursor-pointer\">\r\n {{ setting('upload-text') }}\r\n </a>\r\n </div>\r\n </div>\r\n <!-- <input #fileInput type=\"file\" [multiple]=\"setting('multiple-upload')\" (change)=\"onFileSelected($event)\" hidden />\r\n <div class=\"separator\"></div>\r\n <div class=\"file-list flex items-center gap-4 flex-wrap\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\" \r\n class=\"flex flex-col items-center justify-center\" (click)=\"deleteFile(i)\">\r\n <div class=\"relative\">\r\n <div class=\"close_icon cursor-pointer\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_6837_29683)\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"#F3A041\" />\r\n <mask id=\"mask0_6837_29683\" style=\"mask-type:alpha\" maskUnits=\"userSpaceOnUse\" x=\"4\" y=\"4\" width=\"24\"\r\n height=\"24\">\r\n <rect x=\"4\" y=\"4\" width=\"24\" height=\"24\" fill=\"#D9D9D9\" />\r\n </mask>\r\n <g mask=\"url(#mask0_6837_29683)\">\r\n <path\r\n d=\"M8.2045 8.99815L5.81802 6.61167L6.61351 5.81617L9 8.20266L11.3865 5.81617L12.182 6.61167L9.7955 8.99815L12.182 11.3846L11.3865 12.1801L9 9.79365L6.61351 12.1801L5.81802 11.3846L8.2045 8.99815Z\"\r\n fill=\"white\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_6837_29683\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <img class=\"file-thumbnail\" style=\"border-radius: 4px\" [src]=\"file?.result\" alt=\"\" />\r\n <div class=\"flex flex-col w-full\">\r\n <label class=\"font-semibold text-sm mb-1\">Title</label>\r\n <input [(ngModel)]=\"file.title\"\r\n name=\"title{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter title\"\r\n class=\" rounded px-3 py-2 mb-3 w-full outline-none focus:ring\" />\r\n \r\n <label class=\"font-semibold text-sm mb-1\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\"\r\n name=\"notes{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter notes\"\r\n class=\" rounded px-3 py-2 w-full outline-none focus:ring\"\r\n rows=\"2\"></textarea>\r\n </div>\r\n \r\n\r\n </div>\r\n\r\n <p>{{file?.name}}</p>\r\n </div>\r\n </ng-container>\r\n </div> -->\r\n\r\n <input #fileInput\r\n type=\"file\"\r\n [multiple]=\"setting('multiple-upload')\"\r\n (change)=\"onFileSelected($event)\"\r\n accept=\".csv,.pdf,.xls,.xlsx,.doc,.docx,.txt,image/*\"\r\n style=\"display: none;\" />\r\n\r\n\r\n\r\n \r\n <!-- <p-fileUpload mode=\"basic\" name=\"demo[]\" accept=\"image/*\" maxFileSize=\"1000000\" (onUpload)=\"onBasicUploadAuto($event)\" chooseLabel=\"Browse\" /> -->\r\n\r\n\r\n<!-- <div class=\"separator\"></div> -->\r\n\r\n<div class=\"file-list flex items-center gap-6 flex-wrap\" *ngIf=\"false\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\"\r\n class=\"flex flex-col items-center justify-center\">\r\n\r\n <div class=\"input-container p-3 border rounded-lg shadow-sm bg-white w-64\">\r\n <!-- Close icon -->\r\n <div class=\"close_icon cursor-pointer absolute top-2 right-2\" (click)=\"deleteFile(i)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <rect width=\"18\" height=\"18\" rx=\"9\" fill=\"#F3A041\" />\r\n <path d=\"M8.2 9l-2.4-2.4.8-.8L9 8.2l2.4-2.4.8.8L9.8 9l2.4 2.4-.8.8L9 9.8l-2.4 2.4-.8-.8L8.2 9z\"\r\n fill=\"white\"/>\r\n </svg>\r\n </div>\r\n\r\n <!-- Thumbnail -->\r\n <ng-container *ngIf=\"file.type === 'image'; else nonImageThumb\">\r\n <img class=\"file-thumbnail w-full h-32 object-cover rounded mb-3\"\r\n [src]=\"file?.result\"\r\n alt=\"preview\" />\r\n </ng-container>\r\n\r\n <ng-template #nonImageThumb>\r\n <div class=\"file-thumbnail flex items-center justify-center border rounded mb-3 w-full h-32 bg-gray-50\">\r\n <ng-container [ngSwitch]=\"file.type\">\r\n <!-- CSV -->\r\n <svg *ngSwitchCase=\"'csv'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <text x=\"14\" y=\"34\" font-size=\"10\" font-family=\"monospace\" fill=\"#22c55e\">CSV</text>\r\n </svg>\r\n\r\n <!-- TEXT -->\r\n <svg *ngSwitchCase=\"'text'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M14 24h20M14 29h20M14 34h12\" stroke=\"#3b82f6\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n\r\n <!-- Generic -->\r\n <svg *ngSwitchDefault xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M16 30h16\" stroke=\"#9ca3af\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg>\r\n </ng-container>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Metadata -->\r\n <div class=\"flex flex-col w-full\">\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Title</label>\r\n <input [(ngModel)]=\"file.title\" name=\"title{{i}}\" (ngModelChange)=\"onMetaChange()\" placeholder=\"Enter title\"\r\n class=\" rounded px-3 py-2 mb-3 w-full outline-none focus:ring\" />\r\n </div>\r\n \r\n <div>\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\" name=\"notes{{i}}\" (ngModelChange)=\"onMetaChange()\" placeholder=\"Enter notes\"\r\n class=\" rounded px-3 py-2 w-full outline-none focus:ring\"\r\n rows=\"2\"></textarea>\r\n </div>\r\n \r\n <div>\r\n <label class=\"font-semibold text-sm mt-3 mb-1 input-title\">Category</label>\r\n <select [(ngModel)]=\"file.category\" name=\"category{{i}}\" (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Select Category\"\r\n class=\" rounded px-3 py-2 w-full outline-none focus:ring\">\r\n <option *ngFor=\"let c of categories\" [ngValue]=\"c\">{{ c }}</option>\r\n </select>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <p class=\"mt-2 text-sm text-gray-600\">{{ file?.name }}</p>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"file-list flex items-center gap-16 flex-wrap w-full\">\r\n <ng-container *ngIf=\"uploadedFiles?.length\">\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\"\r\n class=\"input-container p-3 border rounded-lg shadow-sm bg-white w-[450px] flex upload_file\">\r\n\r\n <!-- Close icon -->\r\n <div class=\"close_icon cursor-pointer absolute top-2 right-2\" (click)=\"deleteFile(i)\">\r\n <svg width=\"22\" height=\"22\" viewBox=\"0 0 22 22\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect width=\"22\" height=\"22\" rx=\"11\" fill=\"#F3A041\" />\r\n <path\r\n d=\"M7.08911 15.8889L6.11133 14.9111L10.0224 11L6.11133 7.08886L7.08911 6.11108L11.0002 10.0222L14.9113 6.11108L15.8891 7.08886L11.978 11L15.8891 14.9111L14.9113 15.8889L11.0002 11.9778L7.08911 15.8889Z\"\r\n fill=\"white\" />\r\n </svg>\r\n </div>\r\n\r\n <!-- Thumbnail on left -->\r\n <div class=\"w-28 h-28 flex-shrink-0\">\r\n <ng-container *ngIf=\"file.type === 'image'; else nonImageThumb\">\r\n <img class=\"file-thumbnail w-full h-full object-cover rounded\"\r\n [src]=\"file?.result\"\r\n alt=\"preview\" />\r\n </ng-container>\r\n\r\n <ng-template #nonImageThumb>\r\n <div class=\"file-thumbnail flex items-center justify-center border rounded w-full h-full bg-gray-50\">\r\n <ng-container [ngSwitch]=\"file.type\">\r\n <!-- CSV -->\r\n <!-- <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#22c55e\" stroke-width=\"2\"/>\r\n <text x=\"14\" y=\"34\" font-size=\"10\" font-family=\"monospace\" fill=\"#22c55e\">CSV</text>\r\n </svg> -->\r\n\r\n <svg *ngSwitchCase=\"'csv'\" width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\"\r\n fill=\"#F4F4F4\" />\r\n <path\r\n d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\"\r\n fill=\"#23A761\" />\r\n <path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\" />\r\n <path\r\n d=\"M6.94076 10.3433C6.85939 10.3433 6.78716 10.3588 6.72408 10.3899C6.66191 10.42 6.60934 10.464 6.56637 10.5216C6.52432 10.5793 6.49232 10.6489 6.47038 10.7305C6.44844 10.8122 6.43747 10.904 6.43747 11.006C6.43747 11.1435 6.45484 11.261 6.48958 11.3586C6.52523 11.4553 6.58009 11.5294 6.65414 11.5808C6.7282 11.6314 6.82373 11.6567 6.94076 11.6567C7.02212 11.6567 7.10349 11.6478 7.18486 11.6301C7.26714 11.6123 7.35628 11.587 7.45228 11.5542V11.9002C7.36359 11.9357 7.27628 11.961 7.19035 11.976C7.10441 11.992 7.00795 12 6.90099 12C6.69437 12 6.52432 11.9587 6.39084 11.8762C6.25827 11.7929 6.15999 11.6766 6.096 11.5276C6.032 11.3777 6 11.2029 6 11.0033C6 10.8561 6.02057 10.7212 6.06171 10.5988C6.10285 10.4764 6.16319 10.3704 6.24273 10.2808C6.32227 10.1912 6.42055 10.122 6.53758 10.0732C6.6546 10.0244 6.78899 10 6.94076 10C7.04041 10 7.14006 10.0124 7.23971 10.0373C7.34028 10.0612 7.43628 10.0945 7.5277 10.1371L7.39057 10.4724C7.3156 10.4378 7.24017 10.4076 7.16429 10.3819C7.08841 10.3562 7.0139 10.3433 6.94076 10.3433Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M9.06363 11.4331C9.06363 11.5485 9.03483 11.6487 8.97724 11.7339C8.91964 11.819 8.83553 11.8847 8.7249 11.9308C8.61519 11.9769 8.48172 12 8.32447 12C8.25498 12 8.18687 11.9956 8.12013 11.9867C8.05431 11.9778 7.99077 11.965 7.92951 11.9481C7.86917 11.9304 7.81157 11.9086 7.75672 11.8829V11.4997C7.8518 11.5405 7.95054 11.5773 8.05293 11.6101C8.15533 11.6429 8.25681 11.6593 8.35738 11.6593C8.42686 11.6593 8.48263 11.6505 8.52468 11.6327C8.56765 11.615 8.59874 11.5906 8.61794 11.5595C8.63714 11.5285 8.64674 11.493 8.64674 11.4531C8.64674 11.4043 8.62982 11.3626 8.596 11.328C8.56217 11.2934 8.51554 11.261 8.45612 11.2309C8.3976 11.2007 8.33132 11.1683 8.25727 11.1337C8.21064 11.1124 8.1599 11.0867 8.10505 11.0566C8.05019 11.0255 7.99808 10.9878 7.94871 10.9434C7.89934 10.8991 7.85866 10.8454 7.82666 10.7824C7.79558 10.7186 7.78003 10.6423 7.78003 10.5536C7.78003 10.4373 7.80746 10.338 7.86231 10.2555C7.91717 10.173 7.99534 10.11 8.09682 10.0665C8.19921 10.0222 8.31989 10 8.45886 10C8.56308 10 8.66228 10.012 8.75645 10.0359C8.85153 10.059 8.95072 10.0927 9.05403 10.1371L8.9169 10.4578C8.82456 10.4214 8.74182 10.3934 8.66868 10.3739C8.59554 10.3535 8.52103 10.3433 8.44515 10.3433C8.39212 10.3433 8.34686 10.3517 8.30938 10.3686C8.2719 10.3846 8.24355 10.4076 8.22436 10.4378C8.20516 10.4671 8.19556 10.5012 8.19556 10.5403C8.19556 10.5864 8.20927 10.6254 8.2367 10.6574C8.26504 10.6884 8.30709 10.7186 8.36286 10.7478C8.41955 10.7771 8.48994 10.8113 8.57405 10.8503C8.67645 10.8973 8.76376 10.9466 8.83598 10.998C8.90912 11.0486 8.96535 11.1084 9.00466 11.1776C9.04398 11.246 9.06363 11.3311 9.06363 11.4331Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M11 10.0279L10.3184 11.9734H9.85491L9.17471 10.0279H9.60395L9.98108 11.1856C9.98748 11.2051 9.99799 11.242 10.0126 11.2961C10.0272 11.3493 10.0419 11.4061 10.0565 11.4664C10.072 11.5258 10.0826 11.5751 10.088 11.6141C10.0935 11.5751 10.1031 11.5258 10.1168 11.4664C10.1315 11.407 10.1456 11.3506 10.1594 11.2974C10.174 11.2433 10.1845 11.206 10.1909 11.1856L10.5708 10.0279H11Z\"\r\n fill=\"white\" />\r\n <rect x=\"5\" y=\"7\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"5\" y=\"5\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"9\" y=\"7\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n <rect x=\"9\" y=\"5\" width=\"3\" height=\"1\" rx=\"0.2\" fill=\"#CCCCCC\" />\r\n </svg>\r\n\r\n <!-- TEXT -->\r\n <!-- <svg *ngSwitchCase=\"'text'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#3b82f6\" stroke-width=\"2\"/>\r\n <path d=\"M14 24h20M14 29h20M14 34h12\" stroke=\"#3b82f6\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg> -->\r\n <!-- <svg width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#DD2025\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M6.6084 9.96038C6.87161 9.96038 7.06366 10.0171 7.18457 10.1306C7.30548 10.2431 7.36593 10.3984 7.36593 10.5965C7.36593 10.6858 7.35245 10.7714 7.32547 10.8532C7.2985 10.9342 7.25432 11.0062 7.19294 11.0695C7.13249 11.1327 7.05157 11.1829 6.9502 11.2201C6.84882 11.2564 6.72373 11.2746 6.57492 11.2746H6.38937V12H5.95689V9.96038H6.6084ZM6.58608 10.3147H6.38937V10.9202H6.53167C6.61258 10.9202 6.6828 10.9095 6.74233 10.8881C6.80185 10.8667 6.84789 10.8332 6.88044 10.7877C6.91299 10.7421 6.92927 10.6835 6.92927 10.6119C6.92927 10.5114 6.90137 10.437 6.84556 10.3887C6.78976 10.3394 6.70326 10.3147 6.58608 10.3147ZM9.44322 10.9607C9.44322 11.1904 9.39904 11.3824 9.31069 11.5368C9.22326 11.6903 9.09631 11.8061 8.92983 11.8842C8.76335 11.9614 8.56292 12 8.32854 12H7.75098V9.96038H8.39132C8.60524 9.96038 8.79078 9.99851 8.94796 10.0748C9.10514 10.1501 9.22698 10.2622 9.31348 10.411C9.39997 10.5589 9.44322 10.7421 9.44322 10.9607ZM8.994 10.9718C8.994 10.8211 8.97168 10.6975 8.92704 10.6007C8.88332 10.5031 8.81822 10.431 8.73172 10.3845C8.64616 10.338 8.54013 10.3147 8.41364 10.3147H8.18345V11.6429H8.369C8.58012 11.6429 8.73684 11.5866 8.83915 11.4741C8.94238 11.3615 8.994 11.1941 8.994 10.9718ZM10.2914 12H9.86593V9.96038H11.035V10.3147H10.2914V10.8407H10.9834V11.1936H10.2914V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg> -->\r\n\r\n<svg *ngSwitchCase=\"'text'\" width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#1F5EBB\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M7.04353 12H6.61105V10.3203H6.0572V9.96038H7.59738V10.3203H7.04353V12ZM9.56027 12H9.06641L8.59208 11.2285L8.11775 12H7.65458L8.33119 10.9481L7.69782 9.96038H8.17494L8.6144 10.6942L9.04548 9.96038H9.51144L8.87109 10.9718L9.56027 12ZM10.6038 12H10.1713V10.3203H9.61747V9.96038H11.1576V10.3203H10.6038V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg>\r\n\r\n\r\n <!-- Generic -->\r\n <!-- <svg *ngSwitchDefault xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\">\r\n <rect x=\"8\" y=\"6\" width=\"28\" height=\"36\" rx=\"3\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M28 6v8a2 2 0 0 0 2 2h6\" stroke=\"#9ca3af\" stroke-width=\"2\"/>\r\n <path d=\"M16 30h16\" stroke=\"#9ca3af\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n </svg> -->\r\n <svg *ngSwitchDefault width=\"180px\" height=\"180px\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M11.1757 1.17574C11.0632 1.06321 10.9106 1 10.7515 1H3.6C3.26863 1 3 1.26863 3 1.6V14.4C3 14.7314 3.26863 15 3.6 15H13.4C13.7314 15 14 14.7314 14 14.4V4.24853C14 4.0894 13.9368 3.93679 13.8243 3.82426L11.1757 1.17574Z\" fill=\"#F4F4F4\"/>\r\n<path d=\"M15 12.7C15 12.8657 14.8657 13 14.7 13H2.3C2.13431 13 2 12.8657 2 12.7V9.3C2 9.13431 2.13431 9 2.3 9H14.7C14.8657 9 15 9.13431 15 9.3V12.7Z\" fill=\"#DD2025\"/>\r\n<path d=\"M11 1L12.5 2.5L14 4H11.2C11.0895 4 11 3.91046 11 3.8V1Z\" fill=\"#D9D9D9\"/>\r\n<path d=\"M6.6084 9.96038C6.87161 9.96038 7.06366 10.0171 7.18457 10.1306C7.30548 10.2431 7.36593 10.3984 7.36593 10.5965C7.36593 10.6858 7.35245 10.7714 7.32547 10.8532C7.2985 10.9342 7.25432 11.0062 7.19294 11.0695C7.13249 11.1327 7.05157 11.1829 6.9502 11.2201C6.84882 11.2564 6.72373 11.2746 6.57492 11.2746H6.38937V12H5.95689V9.96038H6.6084ZM6.58608 10.3147H6.38937V10.9202H6.53167C6.61258 10.9202 6.6828 10.9095 6.74233 10.8881C6.80185 10.8667 6.84789 10.8332 6.88044 10.7877C6.91299 10.7421 6.92927 10.6835 6.92927 10.6119C6.92927 10.5114 6.90137 10.437 6.84556 10.3887C6.78976 10.3394 6.70326 10.3147 6.58608 10.3147ZM9.44322 10.9607C9.44322 11.1904 9.39904 11.3824 9.31069 11.5368C9.22326 11.6903 9.09631 11.8061 8.92983 11.8842C8.76335 11.9614 8.56292 12 8.32854 12H7.75098V9.96038H8.39132C8.60524 9.96038 8.79078 9.99851 8.94796 10.0748C9.10514 10.1501 9.22698 10.2622 9.31348 10.411C9.39997 10.5589 9.44322 10.7421 9.44322 10.9607ZM8.994 10.9718C8.994 10.8211 8.97168 10.6975 8.92704 10.6007C8.88332 10.5031 8.81822 10.431 8.73172 10.3845C8.64616 10.338 8.54013 10.3147 8.41364 10.3147H8.18345V11.6429H8.369C8.58012 11.6429 8.73684 11.5866 8.83915 11.4741C8.94238 11.3615 8.994 11.1941 8.994 10.9718ZM10.2914 12H9.86593V9.96038H11.035V10.3147H10.2914V10.8407H10.9834V11.1936H10.2914V12Z\" fill=\"white\"/>\r\n<rect x=\"5\" y=\"5\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"6\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n<rect x=\"5\" y=\"7\" width=\"7\" height=\"0.5\" rx=\"0.25\" fill=\"#CCCCCC\"/>\r\n</svg>\r\n </ng-container>\r\n </div>\r\n </ng-template>\r\n </div>\r\n\r\n <!-- Metadata on right -->\r\n <div class=\"flex flex-col flex-1 ml-4\">\r\n <!-- Title -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Title</label>\r\n <input [(ngModel)]=\"file.title\"\r\n name=\"title{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter title\"\r\n class=\" rounded px-3 py-2 mb-3 w-full outline-none focus:ring\" />\r\n\r\n </div>\r\n <!-- Notes -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Notes</label>\r\n <textarea [(ngModel)]=\"file.notes\"\r\n name=\"notes{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n placeholder=\"Enter notes\"\r\n class=\" rounded px-3 py-2 mb-3 w-full outline-none focus:ring\"\r\n rows=\"2\"></textarea>\r\n\r\n </div>\r\n <!-- Category -->\r\n <div class=\"input-container\">\r\n <label class=\"font-semibold text-sm mb-1 input-title\">Category</label>\r\n <select [(ngModel)]=\"file.categoryId \"\r\n name=\"category{{i}}\"\r\n (ngModelChange)=\"onMetaChange()\"\r\n class=\" rounded px-3 py-2 w-full outline-none focus:ring\">\r\n <option value=\"\">Select Category</option>\r\n <option *ngFor=\"let c of categories\" [ngValue]=\"c.value\">{{ c.label }}</option>\r\n </select>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n\r\n\r\n </div>\r\n</fx-component>", styles: [".custom-upload{border:1px solid #ccc}.custom-upload a{color:#fff}.custom-upload .file-list .file-thumbnail{width:160px;height:100%;max-height:185px!important;border:1px solid #ccc;background-color:#fff;padding:10px}.custom-upload .separator{height:56px;width:2px;background-color:#ccc;margin:10px}.custom-upload .upload{background-color:#999;padding:2px 12px 2px 6px;border-radius:4px;margin-left:40px}.close_icon{position:absolute;top:-8px;right:-8px}[type=checkbox]{padding:12px}[type=checkbox]:checked{background-color:#f3a041!important;padding:12px;background-size:1em 1em!important}.gap-8{gap:8px}.gap-16{gap:25px}.input-title{position:absolute;bottom:auto;right:auto;left:1rem;top:-9px;padding:0rem .25rem;font-weight:600;border-radius:.25rem;z-index:1;color:#454545;background-color:#fff}.input-container{position:relative;inset:auto;z-index:auto}.upload_file{width:32%!important}select:not([size]){padding:.35rem .75rem!important;border:1px solid #999!important}input,textarea,select{border:1px solid #999!important}input:focus,textarea:focus,select:focus{outline:0 none!important;outline-offset:0!important;box-shadow:0 0 0 .2rem #bfdbfe!important}\n"] }]
1433
1433
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: FxBuilderWrapperService }] });
1434
1434
 
1435
1435
  class ToggleComponent extends FxBaseComponent {
@@ -1877,11 +1877,11 @@ class DatePickerComponent extends FxBaseComponent {
1877
1877
  return [FxValidatorService.required];
1878
1878
  }
1879
1879
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DatePickerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.HttpClient }, { token: FxBuilderWrapperService }], target: i0.ɵɵFactoryTarget.Component });
1880
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DatePickerComponent, isStandalone: true, selector: "lib-date-picker", viewQueries: [{ propertyName: "fxComponent", first: true, predicate: ["fxComponent"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fx-component [fxData]=\"fxData\" #fxComponent>\r\n <div class=\"flex justify-content-center relative\">\r\n <form [formGroup]=\"datePickerForm\" class=\"flex flex-column gap-2\">\r\n <!-- <p-calendar formControlName=\"date\" [showIcon]=\"true\" [minDate]=\"minDate\" [maxDate]=\"maxDate\"\r\n [iconDisplay]=\"'input'\" [showOnFocus]=\"false\" dateFormat=\"dd/mm/yy\" [showButtonBar]=\"true\"\r\n placeholder=\"{{ setting('placeHolder') }}\">\r\n <ng-template pTemplate=\"inputicon\">\r\n <span class=\"absolute right-0 pt-2 pr-2\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"cursor-pointer\">\r\n <path\r\n d=\"M19.5624 2.25991H18.1956V3.13582C18.1956 3.61948 17.7982 4.01173 17.3078 4.01173C16.8177 4.01173 16.4202 3.61948 16.4202 3.13582V2.25991H7.58001V3.13582C7.58001 3.61948 7.18253 4.01173 6.69244 4.01173C6.20209 4.01173 5.80486 3.61948 5.80486 3.13582V2.25991H4.43787C3.26107 2.2604 2.13252 2.72182 1.30042 3.54299C0.468323 4.36441 0.000507185 5.47813 0 6.63946V19.6204C0.000495266 20.7818 0.468304 21.8955 1.30042 22.7167C2.13252 23.5381 3.26107 23.9995 4.43787 24H19.5621C20.7389 23.9995 21.8675 23.5381 22.6996 22.7167C23.5317 21.8955 23.9995 20.7818 24 19.6204V6.63946C23.9995 5.47813 23.5317 4.36441 22.6996 3.54299C21.8675 2.72183 20.7389 2.26041 19.5621 2.25991H19.5624ZM19.5624 22.2482H4.43818C3.73262 22.246 3.05655 21.9686 2.55779 21.4761C2.05878 20.9839 1.77768 20.3167 1.77546 19.6204V9.05698H22.2252V19.6204C22.2229 20.3167 21.9419 20.9839 21.4428 21.4761C20.9441 21.9686 20.268 22.246 19.5624 22.2482ZM7.58001 2.25991H5.80486L5.80505 0.87591C5.80505 0.392251 6.20227 0 6.69262 0C7.18272 0 7.58019 0.392251 7.58019 0.87591L7.58001 2.25991ZM18.1956 2.25991H16.4202L16.4202 0.87591C16.4202 0.392251 16.8177 0 17.3078 0C17.7981 0 18.1953 0.392251 18.1953 0.87591L18.1956 2.25991Z\"\r\n fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </p-calendar> -->\r\n <!-- <p-calendar formControlName=\"date\"\r\n dateFormat=\"dd/mm/yy\"\r\n placeholder=\"{{ setting('placeHolder') }}\"> -->\r\n <input type=\"date\" id=\"date\" name=\"date\" formControlName=\"date\" [min]=\"minDate\" [max]=\"maxDate\">\r\n <!-- <label for=\"date\" class=\"placeholder\">Select Date</label> -->\r\n <!-- <ng-template pTemplate=\"inputicon\">\r\n <span class=\"absolute right-0 pt-2 pr-2\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"cursor-pointer\">\r\n <path\r\n d=\"M19.5624 2.25991H18.1956V3.13582C18.1956 3.61948 17.7982 4.01173 17.3078 4.01173C16.8177 4.01173 16.4202 3.61948 16.4202 3.13582V2.25991H7.58001V3.13582C7.58001 3.61948 7.18253 4.01173 6.69244 4.01173C6.20209 4.01173 5.80486 3.61948 5.80486 3.13582V2.25991H4.43787C3.26107 2.2604 2.13252 2.72182 1.30042 3.54299C0.468323 4.36441 0.000507185 5.47813 0 6.63946V19.6204C0.000495266 20.7818 0.468304 21.8955 1.30042 22.7167C2.13252 23.5381 3.26107 23.9995 4.43787 24H19.5621C20.7389 23.9995 21.8675 23.5381 22.6996 22.7167C23.5317 21.8955 23.9995 20.7818 24 19.6204V6.63946C23.9995 5.47813 23.5317 4.36441 22.6996 3.54299C21.8675 2.72183 20.7389 2.26041 19.5621 2.25991H19.5624ZM19.5624 22.2482H4.43818C3.73262 22.246 3.05655 21.9686 2.55779 21.4761C2.05878 20.9839 1.77768 20.3167 1.77546 19.6204V9.05698H22.2252V19.6204C22.2229 20.3167 21.9419 20.9839 21.4428 21.4761C20.9441 21.9686 20.268 22.246 19.5624 22.2482ZM7.58001 2.25991H5.80486L5.80505 0.87591C5.80505 0.392251 6.20227 0 6.69262 0C7.18272 0 7.58019 0.392251 7.58019 0.87591L7.58001 2.25991ZM18.1956 2.25991H16.4202L16.4202 0.87591C16.4202 0.392251 16.8177 0 17.3078 0C17.7981 0 18.1953 0.392251 18.1953 0.87591L18.1956 2.25991Z\"\r\n fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n </svg>\r\n </span>\r\n </ng-template> -->\r\n <!-- </p-calendar> -->\r\n <div>\r\n <small *ngIf=\"datePickerForm.get('date')?.touched && datePickerForm.get('date')?.errors?.['required']\"\r\n class=\"text-red-500\">\r\n Date is required.\r\n </small>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n</fx-component>", styles: [".cursor-pointer{cursor:pointer!important}input[type=date]{appearance:none;-webkit-appearance:none;-moz-appearance:none;min-width:381px;padding:10px 14px;font-size:14px;border:1px solid #ddd;border-radius:3px;background-color:#fff;color:#333;outline:none;transition:border .3s,box-shadow .3s}input[type=date]::placeholder{color:#aaa}input[type=date]:focus{border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b33}input[type=date]::-webkit-calendar-picker-indicator{background:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f59e0b' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-2 .89-2 2v14c0 1.11.89 2 2 2h14c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zm0 16H5V9h14v11z'/%3E%3C/svg%3E\") no-repeat center;background-size:20px 20px;cursor:pointer;opacity:.8}input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}input[type=date]:not(:focus):invalid+.placeholder{color:gray;position:absolute;left:10px;top:8px;pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: FxComponent, selector: "fx-component", inputs: ["fxData"] }, { kind: "ngmodule", type: CalendarModule }] });
1880
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DatePickerComponent, isStandalone: true, selector: "lib-date-picker", viewQueries: [{ propertyName: "fxComponent", first: true, predicate: ["fxComponent"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fx-component [fxData]=\"fxData\" #fxComponent>\r\n <div class=\"flex justify-content-center relative\">\r\n <form [formGroup]=\"datePickerForm\" class=\"flex flex-column gap-2\">\r\n <!-- <p-calendar formControlName=\"date\" [showIcon]=\"true\" [minDate]=\"minDate\" [maxDate]=\"maxDate\"\r\n [iconDisplay]=\"'input'\" [showOnFocus]=\"false\" dateFormat=\"dd/mm/yy\" [showButtonBar]=\"true\"\r\n placeholder=\"{{ setting('placeHolder') }}\">\r\n <ng-template pTemplate=\"inputicon\">\r\n <span class=\"absolute right-0 pt-2 pr-2\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"cursor-pointer\">\r\n <path\r\n d=\"M19.5624 2.25991H18.1956V3.13582C18.1956 3.61948 17.7982 4.01173 17.3078 4.01173C16.8177 4.01173 16.4202 3.61948 16.4202 3.13582V2.25991H7.58001V3.13582C7.58001 3.61948 7.18253 4.01173 6.69244 4.01173C6.20209 4.01173 5.80486 3.61948 5.80486 3.13582V2.25991H4.43787C3.26107 2.2604 2.13252 2.72182 1.30042 3.54299C0.468323 4.36441 0.000507185 5.47813 0 6.63946V19.6204C0.000495266 20.7818 0.468304 21.8955 1.30042 22.7167C2.13252 23.5381 3.26107 23.9995 4.43787 24H19.5621C20.7389 23.9995 21.8675 23.5381 22.6996 22.7167C23.5317 21.8955 23.9995 20.7818 24 19.6204V6.63946C23.9995 5.47813 23.5317 4.36441 22.6996 3.54299C21.8675 2.72183 20.7389 2.26041 19.5621 2.25991H19.5624ZM19.5624 22.2482H4.43818C3.73262 22.246 3.05655 21.9686 2.55779 21.4761C2.05878 20.9839 1.77768 20.3167 1.77546 19.6204V9.05698H22.2252V19.6204C22.2229 20.3167 21.9419 20.9839 21.4428 21.4761C20.9441 21.9686 20.268 22.246 19.5624 22.2482ZM7.58001 2.25991H5.80486L5.80505 0.87591C5.80505 0.392251 6.20227 0 6.69262 0C7.18272 0 7.58019 0.392251 7.58019 0.87591L7.58001 2.25991ZM18.1956 2.25991H16.4202L16.4202 0.87591C16.4202 0.392251 16.8177 0 17.3078 0C17.7981 0 18.1953 0.392251 18.1953 0.87591L18.1956 2.25991Z\"\r\n fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </p-calendar> -->\r\n <!-- <p-calendar formControlName=\"date\"\r\n dateFormat=\"dd/mm/yy\"\r\n placeholder=\"{{ setting('placeHolder') }}\"> -->\r\n <input type=\"date\" id=\"date\" name=\"date\" formControlName=\"date\" [min]=\"minDate\" [max]=\"maxDate\">\r\n <!-- <label for=\"date\" class=\"placeholder\">Select Date</label> -->\r\n <!-- <ng-template pTemplate=\"inputicon\">\r\n <span class=\"absolute right-0 pt-2 pr-2\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"cursor-pointer\">\r\n <path\r\n d=\"M19.5624 2.25991H18.1956V3.13582C18.1956 3.61948 17.7982 4.01173 17.3078 4.01173C16.8177 4.01173 16.4202 3.61948 16.4202 3.13582V2.25991H7.58001V3.13582C7.58001 3.61948 7.18253 4.01173 6.69244 4.01173C6.20209 4.01173 5.80486 3.61948 5.80486 3.13582V2.25991H4.43787C3.26107 2.2604 2.13252 2.72182 1.30042 3.54299C0.468323 4.36441 0.000507185 5.47813 0 6.63946V19.6204C0.000495266 20.7818 0.468304 21.8955 1.30042 22.7167C2.13252 23.5381 3.26107 23.9995 4.43787 24H19.5621C20.7389 23.9995 21.8675 23.5381 22.6996 22.7167C23.5317 21.8955 23.9995 20.7818 24 19.6204V6.63946C23.9995 5.47813 23.5317 4.36441 22.6996 3.54299C21.8675 2.72183 20.7389 2.26041 19.5621 2.25991H19.5624ZM19.5624 22.2482H4.43818C3.73262 22.246 3.05655 21.9686 2.55779 21.4761C2.05878 20.9839 1.77768 20.3167 1.77546 19.6204V9.05698H22.2252V19.6204C22.2229 20.3167 21.9419 20.9839 21.4428 21.4761C20.9441 21.9686 20.268 22.246 19.5624 22.2482ZM7.58001 2.25991H5.80486L5.80505 0.87591C5.80505 0.392251 6.20227 0 6.69262 0C7.18272 0 7.58019 0.392251 7.58019 0.87591L7.58001 2.25991ZM18.1956 2.25991H16.4202L16.4202 0.87591C16.4202 0.392251 16.8177 0 17.3078 0C17.7981 0 18.1953 0.392251 18.1953 0.87591L18.1956 2.25991Z\"\r\n fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n </svg>\r\n </span>\r\n </ng-template> -->\r\n <!-- </p-calendar> -->\r\n <div>\r\n <small *ngIf=\"datePickerForm.get('date')?.touched && datePickerForm.get('date')?.errors?.['required']\"\r\n class=\"text-red-500\">\r\n Date is required.\r\n </small>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n</fx-component>", styles: [".cursor-pointer{cursor:pointer!important}input[type=date]{appearance:none;-webkit-appearance:none;-moz-appearance:none;height:38px;min-width:519px;margin-top:7px;padding:10px 14px;font-size:14px;border:1px solid #ddd;border-radius:3px;background-color:#fff;color:#333;outline:none;transition:border .3s,box-shadow .3s}input[type=date]::placeholder{color:#aaa}input[type=date]:focus{border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b33}input[type=date]::-webkit-calendar-picker-indicator{background:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f59e0b' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-2 .89-2 2v14c0 1.11.89 2 2 2h14c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zm0 16H5V9h14v11z'/%3E%3C/svg%3E\") no-repeat center;background-size:20px 20px;cursor:pointer;opacity:.8}input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}input[type=date]:not(:focus):invalid+.placeholder{color:gray;position:absolute;left:10px;top:8px;pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: FxComponent, selector: "fx-component", inputs: ["fxData"] }, { kind: "ngmodule", type: CalendarModule }] });
1881
1881
  }
1882
1882
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DatePickerComponent, decorators: [{
1883
1883
  type: Component,
1884
- args: [{ selector: 'lib-date-picker', standalone: true, imports: [CommonModule, ReactiveFormsModule, FormsModule, FxComponent, CalendarModule], template: "<fx-component [fxData]=\"fxData\" #fxComponent>\r\n <div class=\"flex justify-content-center relative\">\r\n <form [formGroup]=\"datePickerForm\" class=\"flex flex-column gap-2\">\r\n <!-- <p-calendar formControlName=\"date\" [showIcon]=\"true\" [minDate]=\"minDate\" [maxDate]=\"maxDate\"\r\n [iconDisplay]=\"'input'\" [showOnFocus]=\"false\" dateFormat=\"dd/mm/yy\" [showButtonBar]=\"true\"\r\n placeholder=\"{{ setting('placeHolder') }}\">\r\n <ng-template pTemplate=\"inputicon\">\r\n <span class=\"absolute right-0 pt-2 pr-2\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"cursor-pointer\">\r\n <path\r\n d=\"M19.5624 2.25991H18.1956V3.13582C18.1956 3.61948 17.7982 4.01173 17.3078 4.01173C16.8177 4.01173 16.4202 3.61948 16.4202 3.13582V2.25991H7.58001V3.13582C7.58001 3.61948 7.18253 4.01173 6.69244 4.01173C6.20209 4.01173 5.80486 3.61948 5.80486 3.13582V2.25991H4.43787C3.26107 2.2604 2.13252 2.72182 1.30042 3.54299C0.468323 4.36441 0.000507185 5.47813 0 6.63946V19.6204C0.000495266 20.7818 0.468304 21.8955 1.30042 22.7167C2.13252 23.5381 3.26107 23.9995 4.43787 24H19.5621C20.7389 23.9995 21.8675 23.5381 22.6996 22.7167C23.5317 21.8955 23.9995 20.7818 24 19.6204V6.63946C23.9995 5.47813 23.5317 4.36441 22.6996 3.54299C21.8675 2.72183 20.7389 2.26041 19.5621 2.25991H19.5624ZM19.5624 22.2482H4.43818C3.73262 22.246 3.05655 21.9686 2.55779 21.4761C2.05878 20.9839 1.77768 20.3167 1.77546 19.6204V9.05698H22.2252V19.6204C22.2229 20.3167 21.9419 20.9839 21.4428 21.4761C20.9441 21.9686 20.268 22.246 19.5624 22.2482ZM7.58001 2.25991H5.80486L5.80505 0.87591C5.80505 0.392251 6.20227 0 6.69262 0C7.18272 0 7.58019 0.392251 7.58019 0.87591L7.58001 2.25991ZM18.1956 2.25991H16.4202L16.4202 0.87591C16.4202 0.392251 16.8177 0 17.3078 0C17.7981 0 18.1953 0.392251 18.1953 0.87591L18.1956 2.25991Z\"\r\n fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </p-calendar> -->\r\n <!-- <p-calendar formControlName=\"date\"\r\n dateFormat=\"dd/mm/yy\"\r\n placeholder=\"{{ setting('placeHolder') }}\"> -->\r\n <input type=\"date\" id=\"date\" name=\"date\" formControlName=\"date\" [min]=\"minDate\" [max]=\"maxDate\">\r\n <!-- <label for=\"date\" class=\"placeholder\">Select Date</label> -->\r\n <!-- <ng-template pTemplate=\"inputicon\">\r\n <span class=\"absolute right-0 pt-2 pr-2\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"cursor-pointer\">\r\n <path\r\n d=\"M19.5624 2.25991H18.1956V3.13582C18.1956 3.61948 17.7982 4.01173 17.3078 4.01173C16.8177 4.01173 16.4202 3.61948 16.4202 3.13582V2.25991H7.58001V3.13582C7.58001 3.61948 7.18253 4.01173 6.69244 4.01173C6.20209 4.01173 5.80486 3.61948 5.80486 3.13582V2.25991H4.43787C3.26107 2.2604 2.13252 2.72182 1.30042 3.54299C0.468323 4.36441 0.000507185 5.47813 0 6.63946V19.6204C0.000495266 20.7818 0.468304 21.8955 1.30042 22.7167C2.13252 23.5381 3.26107 23.9995 4.43787 24H19.5621C20.7389 23.9995 21.8675 23.5381 22.6996 22.7167C23.5317 21.8955 23.9995 20.7818 24 19.6204V6.63946C23.9995 5.47813 23.5317 4.36441 22.6996 3.54299C21.8675 2.72183 20.7389 2.26041 19.5621 2.25991H19.5624ZM19.5624 22.2482H4.43818C3.73262 22.246 3.05655 21.9686 2.55779 21.4761C2.05878 20.9839 1.77768 20.3167 1.77546 19.6204V9.05698H22.2252V19.6204C22.2229 20.3167 21.9419 20.9839 21.4428 21.4761C20.9441 21.9686 20.268 22.246 19.5624 22.2482ZM7.58001 2.25991H5.80486L5.80505 0.87591C5.80505 0.392251 6.20227 0 6.69262 0C7.18272 0 7.58019 0.392251 7.58019 0.87591L7.58001 2.25991ZM18.1956 2.25991H16.4202L16.4202 0.87591C16.4202 0.392251 16.8177 0 17.3078 0C17.7981 0 18.1953 0.392251 18.1953 0.87591L18.1956 2.25991Z\"\r\n fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n </svg>\r\n </span>\r\n </ng-template> -->\r\n <!-- </p-calendar> -->\r\n <div>\r\n <small *ngIf=\"datePickerForm.get('date')?.touched && datePickerForm.get('date')?.errors?.['required']\"\r\n class=\"text-red-500\">\r\n Date is required.\r\n </small>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n</fx-component>", styles: [".cursor-pointer{cursor:pointer!important}input[type=date]{appearance:none;-webkit-appearance:none;-moz-appearance:none;min-width:381px;padding:10px 14px;font-size:14px;border:1px solid #ddd;border-radius:3px;background-color:#fff;color:#333;outline:none;transition:border .3s,box-shadow .3s}input[type=date]::placeholder{color:#aaa}input[type=date]:focus{border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b33}input[type=date]::-webkit-calendar-picker-indicator{background:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f59e0b' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-2 .89-2 2v14c0 1.11.89 2 2 2h14c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zm0 16H5V9h14v11z'/%3E%3C/svg%3E\") no-repeat center;background-size:20px 20px;cursor:pointer;opacity:.8}input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}input[type=date]:not(:focus):invalid+.placeholder{color:gray;position:absolute;left:10px;top:8px;pointer-events:none}\n"] }]
1884
+ args: [{ selector: 'lib-date-picker', standalone: true, imports: [CommonModule, ReactiveFormsModule, FormsModule, FxComponent, CalendarModule], template: "<fx-component [fxData]=\"fxData\" #fxComponent>\r\n <div class=\"flex justify-content-center relative\">\r\n <form [formGroup]=\"datePickerForm\" class=\"flex flex-column gap-2\">\r\n <!-- <p-calendar formControlName=\"date\" [showIcon]=\"true\" [minDate]=\"minDate\" [maxDate]=\"maxDate\"\r\n [iconDisplay]=\"'input'\" [showOnFocus]=\"false\" dateFormat=\"dd/mm/yy\" [showButtonBar]=\"true\"\r\n placeholder=\"{{ setting('placeHolder') }}\">\r\n <ng-template pTemplate=\"inputicon\">\r\n <span class=\"absolute right-0 pt-2 pr-2\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"cursor-pointer\">\r\n <path\r\n d=\"M19.5624 2.25991H18.1956V3.13582C18.1956 3.61948 17.7982 4.01173 17.3078 4.01173C16.8177 4.01173 16.4202 3.61948 16.4202 3.13582V2.25991H7.58001V3.13582C7.58001 3.61948 7.18253 4.01173 6.69244 4.01173C6.20209 4.01173 5.80486 3.61948 5.80486 3.13582V2.25991H4.43787C3.26107 2.2604 2.13252 2.72182 1.30042 3.54299C0.468323 4.36441 0.000507185 5.47813 0 6.63946V19.6204C0.000495266 20.7818 0.468304 21.8955 1.30042 22.7167C2.13252 23.5381 3.26107 23.9995 4.43787 24H19.5621C20.7389 23.9995 21.8675 23.5381 22.6996 22.7167C23.5317 21.8955 23.9995 20.7818 24 19.6204V6.63946C23.9995 5.47813 23.5317 4.36441 22.6996 3.54299C21.8675 2.72183 20.7389 2.26041 19.5621 2.25991H19.5624ZM19.5624 22.2482H4.43818C3.73262 22.246 3.05655 21.9686 2.55779 21.4761C2.05878 20.9839 1.77768 20.3167 1.77546 19.6204V9.05698H22.2252V19.6204C22.2229 20.3167 21.9419 20.9839 21.4428 21.4761C20.9441 21.9686 20.268 22.246 19.5624 22.2482ZM7.58001 2.25991H5.80486L5.80505 0.87591C5.80505 0.392251 6.20227 0 6.69262 0C7.18272 0 7.58019 0.392251 7.58019 0.87591L7.58001 2.25991ZM18.1956 2.25991H16.4202L16.4202 0.87591C16.4202 0.392251 16.8177 0 17.3078 0C17.7981 0 18.1953 0.392251 18.1953 0.87591L18.1956 2.25991Z\"\r\n fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </p-calendar> -->\r\n <!-- <p-calendar formControlName=\"date\"\r\n dateFormat=\"dd/mm/yy\"\r\n placeholder=\"{{ setting('placeHolder') }}\"> -->\r\n <input type=\"date\" id=\"date\" name=\"date\" formControlName=\"date\" [min]=\"minDate\" [max]=\"maxDate\">\r\n <!-- <label for=\"date\" class=\"placeholder\">Select Date</label> -->\r\n <!-- <ng-template pTemplate=\"inputicon\">\r\n <span class=\"absolute right-0 pt-2 pr-2\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"cursor-pointer\">\r\n <path\r\n d=\"M19.5624 2.25991H18.1956V3.13582C18.1956 3.61948 17.7982 4.01173 17.3078 4.01173C16.8177 4.01173 16.4202 3.61948 16.4202 3.13582V2.25991H7.58001V3.13582C7.58001 3.61948 7.18253 4.01173 6.69244 4.01173C6.20209 4.01173 5.80486 3.61948 5.80486 3.13582V2.25991H4.43787C3.26107 2.2604 2.13252 2.72182 1.30042 3.54299C0.468323 4.36441 0.000507185 5.47813 0 6.63946V19.6204C0.000495266 20.7818 0.468304 21.8955 1.30042 22.7167C2.13252 23.5381 3.26107 23.9995 4.43787 24H19.5621C20.7389 23.9995 21.8675 23.5381 22.6996 22.7167C23.5317 21.8955 23.9995 20.7818 24 19.6204V6.63946C23.9995 5.47813 23.5317 4.36441 22.6996 3.54299C21.8675 2.72183 20.7389 2.26041 19.5621 2.25991H19.5624ZM19.5624 22.2482H4.43818C3.73262 22.246 3.05655 21.9686 2.55779 21.4761C2.05878 20.9839 1.77768 20.3167 1.77546 19.6204V9.05698H22.2252V19.6204C22.2229 20.3167 21.9419 20.9839 21.4428 21.4761C20.9441 21.9686 20.268 22.246 19.5624 22.2482ZM7.58001 2.25991H5.80486L5.80505 0.87591C5.80505 0.392251 6.20227 0 6.69262 0C7.18272 0 7.58019 0.392251 7.58019 0.87591L7.58001 2.25991ZM18.1956 2.25991H16.4202L16.4202 0.87591C16.4202 0.392251 16.8177 0 17.3078 0C17.7981 0 18.1953 0.392251 18.1953 0.87591L18.1956 2.25991Z\"\r\n fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"5.33203\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"10.3711\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"11.5547\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n <rect x=\"15.4062\" y=\"16.5898\" width=\"2.96296\" height=\"2.96296\" rx=\"0.444444\" fill=\"#F3A041\" />\r\n </svg>\r\n </span>\r\n </ng-template> -->\r\n <!-- </p-calendar> -->\r\n <div>\r\n <small *ngIf=\"datePickerForm.get('date')?.touched && datePickerForm.get('date')?.errors?.['required']\"\r\n class=\"text-red-500\">\r\n Date is required.\r\n </small>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n</fx-component>", styles: [".cursor-pointer{cursor:pointer!important}input[type=date]{appearance:none;-webkit-appearance:none;-moz-appearance:none;height:38px;min-width:519px;margin-top:7px;padding:10px 14px;font-size:14px;border:1px solid #ddd;border-radius:3px;background-color:#fff;color:#333;outline:none;transition:border .3s,box-shadow .3s}input[type=date]::placeholder{color:#aaa}input[type=date]:focus{border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b33}input[type=date]::-webkit-calendar-picker-indicator{background:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f59e0b' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-2 .89-2 2v14c0 1.11.89 2 2 2h14c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zm0 16H5V9h14v11z'/%3E%3C/svg%3E\") no-repeat center;background-size:20px 20px;cursor:pointer;opacity:.8}input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}input[type=date]:not(:focus):invalid+.placeholder{color:gray;position:absolute;left:10px;top:8px;pointer-events:none}\n"] }]
1885
1885
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.HttpClient }, { type: FxBuilderWrapperService }], propDecorators: { fxComponent: [{
1886
1886
  type: ViewChild,
1887
1887
  args: ['fxComponent']