@datarailsshared/datarailsshared 1.6.137 → 1.6.141
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/styles/_storybook-styles.scss +2 -2
- package/assets/styles/colors.scss +11 -1
- package/assets/styles/mixins.scss +79 -96
- package/assets/styles/vars.scss +23 -21
- package/datarailsshared-datarailsshared-1.6.141.tgz +0 -0
- package/esm2022/lib/dr-accordion/accordion-item-header.component.mjs +3 -3
- package/esm2022/lib/dr-alert/dr-alert.component.mjs +2 -2
- package/esm2022/lib/dr-avatar/dr-avatar.component.mjs +2 -2
- package/esm2022/lib/dr-badge-status/dr-badge-status.component.mjs +2 -2
- package/esm2022/lib/dr-chat/chat.component.mjs +2 -2
- package/esm2022/lib/dr-chat/dr-chat-alert/dr-chat-alert.component.mjs +2 -2
- package/esm2022/lib/dr-chat/dr-chat-dropped-files/dr-chat-dropped-files.component.mjs +2 -2
- package/esm2022/lib/dr-chat/dr-chat-form-dropdown/dr-chat-form-dropdown.component.mjs +2 -2
- package/esm2022/lib/dr-chat/dr-chat-suggestions/chat-suggestions.component.mjs +2 -2
- package/esm2022/lib/dr-chip/dr-chip.component.mjs +2 -2
- package/esm2022/lib/dr-code-editor/dr-code-editor.component.mjs +2 -2
- package/esm2022/lib/dr-dialog/components/dialog-modal-wrapper/dialog-modal-wrapper.component.mjs +2 -2
- package/esm2022/lib/dr-dialog/components/dialog-wrapper/dialog-wrapper.component.mjs +2 -2
- package/esm2022/lib/dr-dropdown/dr-dropdown-item/dr-dropdown-item.component.mjs +2 -2
- package/esm2022/lib/dr-inputs/button/button.component.mjs +2 -2
- package/esm2022/lib/dr-inputs/checkbox/checkbox.component.mjs +2 -2
- package/esm2022/lib/dr-inputs/date-pickers/dr-date-picker-range/dr-date-picker-range.component.mjs +2 -2
- package/esm2022/lib/dr-inputs/date-pickers/dr-date-picker-with-timeframe/dr-date-picker-with-timeframe.component.mjs +2 -2
- package/esm2022/lib/dr-inputs/date-pickers/week-selector/week-selector.component.mjs +2 -2
- package/esm2022/lib/dr-inputs/dr-input/dr-input.component.mjs +2 -2
- package/esm2022/lib/dr-inputs/dr-link/dr-link.component.mjs +2 -2
- package/esm2022/lib/dr-inputs/dr-select/dr-select.component.mjs +2 -2
- package/esm2022/lib/dr-progress-bar/dr-progress-bar.component.mjs +2 -2
- package/esm2022/lib/dr-toastr/default-toastr/default-toastr.component.mjs +2 -2
- package/esm2022/lib/dr-tooltip/components/tooltip-default/tooltip-default.component.mjs +2 -2
- package/esm2022/lib/dr-tooltip/components/tooltip-info/tooltip-info.component.mjs +2 -2
- package/esm2022/lib/filter-dropdown/filter-dropdown.component.mjs +2 -2
- package/esm2022/lib/separate-table/separate-table.component.mjs +2 -2
- package/esm2022/lib/stepper/stepper.component.mjs +2 -2
- package/fesm2022/datarailsshared-datarailsshared.mjs +58 -58
- package/fesm2022/datarailsshared-datarailsshared.mjs.map +1 -1
- package/package.json +1 -1
- package/datarailsshared-datarailsshared-1.6.137.tgz +0 -0
|
@@ -238,7 +238,7 @@ export class DrDatePickerWithTimeframeComponent extends DrDatePickerComponent {
|
|
|
238
238
|
i0.ɵɵproperty("ngIf", !ctx.disabled);
|
|
239
239
|
i0.ɵɵadvance(1);
|
|
240
240
|
i0.ɵɵproperty("calendarHeaderComponent", ctx.customHeader)("panelClass", ctx.datePickerService.isUsingDateTagPresets ? "date-picker-preset-tag" : "dr-timeframe-datepicker");
|
|
241
|
-
} }, dependencies: [i3.DrButtonComponent, i4.DefaultValueAccessor, i4.NgControlStatus, i4.NgModel, i5.NgIf, i5.NgTemplateOutlet, i6.MatDatepicker, i6.MatDatepickerInput, i7.DrTooltipDirective, i5.AsyncPipe], styles: ["[_nghost-%COMP%]{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}[_nghost-%COMP%]:hover{border-color:#9ea1aa}.active[_nghost-%COMP%], [_nghost-%COMP%]:focus-within{border-color:#4646ce!important;color:#333}.disabled[_nghost-%COMP%]{pointer-events:none;border:1px solid #aeabac;background:#f0f1f4;color:#aeabac}.disabled[_nghost-%COMP%]:after{color:#aeabac}.ng-valid.ng-dirty[_nghost-%COMP%]{border-color:#037c5a}.ng-invalid.ng-dirty[_nghost-%COMP%]:not(:focus-within){border-color:#bf1d30!important}.ng-untouched.ng-valid[_nghost-%COMP%]{border-color:#9ea1aa}[_nghost-%COMP%]:after, [_nghost-%COMP%]:before{position:absolute;display:flex;border-color:#6d6e6f transparent transparent;color:#6d6e6f}[_nghost-%COMP%]:after{font-family:DataRails!important;content:\"\\ea17\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}[_nghost-%COMP%] i[_ngcontent-%COMP%]{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}[_nghost-%COMP%] input[_ngcontent-%COMP%]{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}[_nghost-%COMP%] input.when-quarter[_ngcontent-%COMP%]{position:absolute;visibility:hidden}[_nghost-%COMP%] input[_ngcontent-%COMP%]:disabled{border:none;color:#aeabac;background:transparent}[_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-decoration, [_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-cancel-button, [_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-results-button, [_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-results-decoration{-webkit-appearance:none}[_nghost-%COMP%] input[_ngcontent-%COMP%]::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}[_nghost-%COMP%] .range-input[_ngcontent-%COMP%]{position:absolute;height:0;width:0;bottom:0;left:0;z-index:-1} .mat-datepicker-popup .dr-week-datepicker{width:386px!important} .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range:before{background:initial!important} .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range .mat-calendar-body-selected, .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range .mat-calendar-body-cell-content{background:#f2f2fb!important;color:#4646ce!important;font-weight:600!important} .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important} .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit} .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit} .mat-datepicker-popup .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical), .mat-datepicker-popup .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#fff} .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#f2f2fb;color:#4646ce;font-weight:600} .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600} .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none} .mat-datepicker-popup .mat-button-focus-overlay{background:#f5f5f5} .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#f5f5f5;transition:opacity .2s cubic-bezier(.35,0,.25,1)} .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#f5f5f5;transition:background .2s cubic-bezier(.35,0,.25,1)} .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333} .mat-datepicker-popup .mat-calendar-table-header-divider{display:none} .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0} .mat-datepicker-popup .mat-calendar-body>tr[aria-hidden=true]>.mat-calendar-body-label{display:none} .mat-datepicker-popup .mat-calendar-content{display:flex} .mat-datepicker-popup .mat-calendar-content dr-week-selector{flex:0} .mat-datepicker-popup .mat-calendar-content mat-month-view, .mat-datepicker-popup .mat-calendar-content mat-multi-year-view, .mat-datepicker-popup .mat-calendar-content mat-year-view{flex:1}[_nghost-%COMP%]{border:none;display:flex;align-items:center}.disabled[_nghost-%COMP%]{background:transparent;color:#aeabac}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%]{border:none;padding:0 8px}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{text-decoration:none;color:#aeabac;font-weight:400}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container[_ngcontent-%COMP%] i[_ngcontent-%COMP%]{color:#aeabac}.dr-date-picker-on-dashboard[_nghost-%COMP%]{width:-moz-fit-content;width:fit-content;justify-content:space-between}.dr-date-picker-on-dashboard[_nghost-%COMP%] mat-datepicker[_ngcontent-%COMP%]{position:absolute}.dr-date-picker-on-dashboard[_nghost-%COMP%]:after{visibility:hidden}.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container[_ngcontent-%COMP%]{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{font-weight:600;width:auto;margin-left:5px}.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container[_ngcontent-%COMP%] .dr-icon-date[_ngcontent-%COMP%]{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}[_nghost-%COMP%] .dr-datepicker-input-container[_ngcontent-%COMP%] input[_ngcontent-%COMP%]{visibility:hidden;position:absolute;width:100%}[_nghost-%COMP%] .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{width:100px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}[_nghost-%COMP%] .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce} .date-picker-preset-tag{width:386px!important} .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}@media screen and (max-width: 410px){.mat-datepicker-input[_ngcontent-%COMP%]{width:100vw!important} .date-picker-preset-tag{width:calc(100vw - 16px)!important} .date-picker-preset-tag .dr-datepicker-preset-date__tags{justify-content:center;margin-left:-32px;margin-right:-32px}
|
|
241
|
+
} }, dependencies: [i3.DrButtonComponent, i4.DefaultValueAccessor, i4.NgControlStatus, i4.NgModel, i5.NgIf, i5.NgTemplateOutlet, i6.MatDatepicker, i6.MatDatepickerInput, i7.DrTooltipDirective, i5.AsyncPipe], styles: ["[_nghost-%COMP%]{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}[_nghost-%COMP%]:hover{border-color:#9ea1aa}.active[_nghost-%COMP%], [_nghost-%COMP%]:focus-within{border-color:#4646ce!important;color:#333}.disabled[_nghost-%COMP%]{pointer-events:none;border:1px solid #aeabac;background:#f0f1f4;color:#aeabac}.disabled[_nghost-%COMP%]:after{color:#aeabac}.ng-valid.ng-dirty[_nghost-%COMP%]{border-color:#037c5a}.ng-invalid.ng-dirty[_nghost-%COMP%]:not(:focus-within){border-color:#bf1d30!important}.ng-untouched.ng-valid[_nghost-%COMP%]{border-color:#9ea1aa}[_nghost-%COMP%]:after, [_nghost-%COMP%]:before{position:absolute;display:flex;border-color:#6d6e6f transparent transparent;color:#6d6e6f}[_nghost-%COMP%]:after{font-family:DataRails!important;content:\"\\ea17\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}[_nghost-%COMP%] i[_ngcontent-%COMP%]{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}[_nghost-%COMP%] input[_ngcontent-%COMP%]{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}[_nghost-%COMP%] input.when-quarter[_ngcontent-%COMP%]{position:absolute;visibility:hidden}[_nghost-%COMP%] input[_ngcontent-%COMP%]:disabled{border:none;color:#aeabac;background:transparent}[_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-decoration, [_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-cancel-button, [_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-results-button, [_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-results-decoration{-webkit-appearance:none}[_nghost-%COMP%] input[_ngcontent-%COMP%]::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}[_nghost-%COMP%] .range-input[_ngcontent-%COMP%]{position:absolute;height:0;width:0;bottom:0;left:0;z-index:-1} .mat-datepicker-popup .dr-week-datepicker{width:386px!important} .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range:before{background:initial!important} .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range .mat-calendar-body-selected, .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range .mat-calendar-body-cell-content{background:#f2f2fb!important;color:#4646ce!important;font-weight:600!important} .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important} .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit} .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit} .mat-datepicker-popup .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical), .mat-datepicker-popup .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#fff} .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#f2f2fb;color:#4646ce;font-weight:600} .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600} .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none} .mat-datepicker-popup .mat-button-focus-overlay{background:#f5f5f5} .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#f5f5f5;transition:opacity .2s cubic-bezier(.35,0,.25,1)} .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#f5f5f5;transition:background .2s cubic-bezier(.35,0,.25,1)} .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333} .mat-datepicker-popup .mat-calendar-table-header-divider{display:none} .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0} .mat-datepicker-popup .mat-calendar-body>tr[aria-hidden=true]>.mat-calendar-body-label{display:none} .mat-datepicker-popup .mat-calendar-content{display:flex} .mat-datepicker-popup .mat-calendar-content dr-week-selector{flex:0} .mat-datepicker-popup .mat-calendar-content mat-month-view, .mat-datepicker-popup .mat-calendar-content mat-multi-year-view, .mat-datepicker-popup .mat-calendar-content mat-year-view{flex:1}[_nghost-%COMP%]{border:none;display:flex;align-items:center}.disabled[_nghost-%COMP%]{background:transparent;color:#aeabac}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%]{border:none;padding:0 8px}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{text-decoration:none;color:#aeabac;font-weight:400}.disabled.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container[_ngcontent-%COMP%] i[_ngcontent-%COMP%]{color:#aeabac}.dr-date-picker-on-dashboard[_nghost-%COMP%]{width:-moz-fit-content;width:fit-content;justify-content:space-between}.dr-date-picker-on-dashboard[_nghost-%COMP%] mat-datepicker[_ngcontent-%COMP%]{position:absolute}.dr-date-picker-on-dashboard[_nghost-%COMP%]:after{visibility:hidden}.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container[_ngcontent-%COMP%]{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{font-weight:600;width:auto;margin-left:5px}.dr-date-picker-on-dashboard[_nghost-%COMP%] .dr-datepicker-input-container[_ngcontent-%COMP%] .dr-icon-date[_ngcontent-%COMP%]{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}[_nghost-%COMP%] .dr-datepicker-input-container[_ngcontent-%COMP%] input[_ngcontent-%COMP%]{visibility:hidden;position:absolute;width:100%}[_nghost-%COMP%] .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]{width:100px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}[_nghost-%COMP%] .dr-datepicker-input-container__formatted-value-display[_ngcontent-%COMP%]:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce} .date-picker-preset-tag{width:386px!important} .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}@media screen and (max-width: 410px){.mat-datepicker-input[_ngcontent-%COMP%]{width:100vw!important} .date-picker-preset-tag{width:calc(100vw - 16px)!important} .date-picker-preset-tag .dr-datepicker-preset-date__tags{justify-content:center;margin-left:-32px;margin-right:-32px}}"], changeDetection: 0 }); }
|
|
242
242
|
}
|
|
243
243
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDatePickerWithTimeframeComponent, [{
|
|
244
244
|
type: Component,
|
|
@@ -246,7 +246,7 @@ export class DrDatePickerWithTimeframeComponent extends DrDatePickerComponent {
|
|
|
246
246
|
{ provide: NG_VALUE_ACCESSOR, useExisting: DrDatePickerWithTimeframeComponent, multi: true },
|
|
247
247
|
{ provide: DateAdapter, useClass: CustomDateAdapter },
|
|
248
248
|
{ provide: DrDatePickerService },
|
|
249
|
-
], template: "<dr-button\n [disabled]=\"isPrevDateDisabled\"\n *ngIf=\"!disabled\"\n theme=\"icon\"\n icon=\"dr-icon-arrow-left\"\n (click)=\"pagingClicked(false)\"></dr-button>\n<div\n [drTooltip]=\"datepickerTooltip\"\n [drTooltipPosition]=\"datepickerTooltipPosition\"\n [drTooltipMousleaveTimeout]=\"datepickerTooltipTimeout\"\n class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <ng-container\n [ngTemplateOutlet]=\"formattedValueTmpl\"\n [ngTemplateOutletContext]=\"{\n formattedValue: displayedFormattedValue$ | async,\n }\">\n </ng-container>\n <ng-template #formattedValueTmpl let-value=\"formattedValue\">\n <span>\n {{\n datePickerService.isUsingDateTagPresets && !!presetTagSelected\n ? presetTagSelected + ' (' + value + ')'\n : value\n }}\n </span>\n </ng-template>\n </div>\n <input\n #datepickerInput\n [ngModel]=\"displayValue$ | async\"\n (ngModelChange)=\"valueChangedInCalendar($event)\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\" />\n</div>\n<dr-button\n [disabled]=\"isNextDateDisabled\"\n *ngIf=\"!disabled\"\n theme=\"icon\"\n icon=\"dr-icon-arrow-right\"\n (click)=\"pagingClicked(true)\"></dr-button>\n\n<mat-datepicker\n #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR, datePicker)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH, datePicker)\"\n (opened)=\"onOpen()\"\n (closed)=\"onCLose()\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\">\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #aeabac;background:#f0f1f4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6d6e6f transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea17\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}:host .range-input{position:absolute;height:0;width:0;bottom:0;left:0;z-index:-1}::ng-deep .mat-datepicker-popup .dr-week-datepicker{width:386px!important}::ng-deep .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range:before{background:initial!important}::ng-deep .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range .mat-calendar-body-selected,::ng-deep .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range .mat-calendar-body-cell-content{background:#f2f2fb!important;color:#4646ce!important;font-weight:600!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),::ng-deep .mat-datepicker-popup .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#fff}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#f2f2fb;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#f5f5f5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#f5f5f5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#f5f5f5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}::ng-deep .mat-datepicker-popup .mat-calendar-body>tr[aria-hidden=true]>.mat-calendar-body-label{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-content{display:flex}::ng-deep .mat-datepicker-popup .mat-calendar-content dr-week-selector{flex:0}::ng-deep .mat-datepicker-popup .mat-calendar-content mat-month-view,::ng-deep .mat-datepicker-popup .mat-calendar-content mat-multi-year-view,::ng-deep .mat-datepicker-popup .mat-calendar-content mat-year-view{flex:1}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:#aeabac}:host.disabled.dr-date-picker-on-dashboard{border:none;padding:0 8px}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{text-decoration:none;color:#aeabac;font-weight:400}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container i{color:#aeabac}:host.dr-date-picker-on-dashboard{width:-moz-fit-content;width:fit-content;justify-content:space-between}:host.dr-date-picker-on-dashboard mat-datepicker{position:absolute}:host.dr-date-picker-on-dashboard:after{visibility:hidden}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{font-weight:600;width:auto;margin-left:5px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container .dr-icon-date{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}:host .dr-datepicker-input-container input{visibility:hidden;position:absolute;width:100%}:host .dr-datepicker-input-container__formatted-value-display{width:100px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}:host .dr-datepicker-input-container__formatted-value-display:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}::ng-deep .date-picker-preset-tag{width:386px!important}::ng-deep .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}@media screen and (max-width: 410px){.mat-datepicker-input{width:100vw!important}::ng-deep .date-picker-preset-tag{width:calc(100vw - 16px)!important}::ng-deep .date-picker-preset-tag .dr-datepicker-preset-date__tags{justify-content:center;margin-left:-32px;margin-right:-32px}
|
|
249
|
+
], template: "<dr-button\n [disabled]=\"isPrevDateDisabled\"\n *ngIf=\"!disabled\"\n theme=\"icon\"\n icon=\"dr-icon-arrow-left\"\n (click)=\"pagingClicked(false)\"></dr-button>\n<div\n [drTooltip]=\"datepickerTooltip\"\n [drTooltipPosition]=\"datepickerTooltipPosition\"\n [drTooltipMousleaveTimeout]=\"datepickerTooltipTimeout\"\n class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <ng-container\n [ngTemplateOutlet]=\"formattedValueTmpl\"\n [ngTemplateOutletContext]=\"{\n formattedValue: displayedFormattedValue$ | async,\n }\">\n </ng-container>\n <ng-template #formattedValueTmpl let-value=\"formattedValue\">\n <span>\n {{\n datePickerService.isUsingDateTagPresets && !!presetTagSelected\n ? presetTagSelected + ' (' + value + ')'\n : value\n }}\n </span>\n </ng-template>\n </div>\n <input\n #datepickerInput\n [ngModel]=\"displayValue$ | async\"\n (ngModelChange)=\"valueChangedInCalendar($event)\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\" />\n</div>\n<dr-button\n [disabled]=\"isNextDateDisabled\"\n *ngIf=\"!disabled\"\n theme=\"icon\"\n icon=\"dr-icon-arrow-right\"\n (click)=\"pagingClicked(true)\"></dr-button>\n\n<mat-datepicker\n #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR, datePicker)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH, datePicker)\"\n (opened)=\"onOpen()\"\n (closed)=\"onCLose()\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\">\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #aeabac;background:#f0f1f4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6d6e6f transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea17\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}:host .range-input{position:absolute;height:0;width:0;bottom:0;left:0;z-index:-1}::ng-deep .mat-datepicker-popup .dr-week-datepicker{width:386px!important}::ng-deep .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range:before{background:initial!important}::ng-deep .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range .mat-calendar-body-selected,::ng-deep .mat-datepicker-popup .dr-week-datepicker .mat-calendar-body-in-range .mat-calendar-body-cell-content{background:#f2f2fb!important;color:#4646ce!important;font-weight:600!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),::ng-deep .mat-datepicker-popup .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#fff}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#f2f2fb;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#f5f5f5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#f5f5f5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#f5f5f5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}::ng-deep .mat-datepicker-popup .mat-calendar-body>tr[aria-hidden=true]>.mat-calendar-body-label{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-content{display:flex}::ng-deep .mat-datepicker-popup .mat-calendar-content dr-week-selector{flex:0}::ng-deep .mat-datepicker-popup .mat-calendar-content mat-month-view,::ng-deep .mat-datepicker-popup .mat-calendar-content mat-multi-year-view,::ng-deep .mat-datepicker-popup .mat-calendar-content mat-year-view{flex:1}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:#aeabac}:host.disabled.dr-date-picker-on-dashboard{border:none;padding:0 8px}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{text-decoration:none;color:#aeabac;font-weight:400}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container i{color:#aeabac}:host.dr-date-picker-on-dashboard{width:-moz-fit-content;width:fit-content;justify-content:space-between}:host.dr-date-picker-on-dashboard mat-datepicker{position:absolute}:host.dr-date-picker-on-dashboard:after{visibility:hidden}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{font-weight:600;width:auto;margin-left:5px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container .dr-icon-date{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}:host .dr-datepicker-input-container input{visibility:hidden;position:absolute;width:100%}:host .dr-datepicker-input-container__formatted-value-display{width:100px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}:host .dr-datepicker-input-container__formatted-value-display:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}::ng-deep .date-picker-preset-tag{width:386px!important}::ng-deep .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}@media screen and (max-width: 410px){.mat-datepicker-input{width:100vw!important}::ng-deep .date-picker-preset-tag{width:calc(100vw - 16px)!important}::ng-deep .date-picker-preset-tag .dr-datepicker-preset-date__tags{justify-content:center;margin-left:-32px;margin-right:-32px}}\n"] }]
|
|
250
250
|
}], function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.DateAdapter }, { type: i2.DrDatePickerService }]; }, { isDashboardClassDisplayed: [{
|
|
251
251
|
type: HostBinding,
|
|
252
252
|
args: ['class.dr-date-picker-on-dashboard']
|
|
@@ -82,10 +82,10 @@ export class WeekSelectorComponent {
|
|
|
82
82
|
} if (rf & 2) {
|
|
83
83
|
i0.ɵɵadvance(4);
|
|
84
84
|
i0.ɵɵproperty("ngForOf", ctx.currentMonthWeeks);
|
|
85
|
-
} }, dependencies: [CommonModule, i1.NgForOf], styles: ["[_nghost-%COMP%]{font-size:14px;font-weight:400;
|
|
85
|
+
} }, dependencies: [CommonModule, i1.NgForOf], styles: ["[_nghost-%COMP%]{font-size:14px;line-height:24px;font-weight:400;text-align:center;color:#333;display:flex}[_nghost-%COMP%] .weeks[_ngcontent-%COMP%]{height:100%;flex-direction:column;display:flex}[_nghost-%COMP%] .weeks-border[_ngcontent-%COMP%]{height:100%;width:1px;background-color:#dfe0e3;margin:0 4px}[_nghost-%COMP%] .weeks__container[_ngcontent-%COMP%]{display:flex;flex-direction:column;justify-content:space-between;height:100%}[_nghost-%COMP%] .weeks[_ngcontent-%COMP%] .header[_ngcontent-%COMP%]{font-weight:600;color:#19181a;padding-bottom:8px;line-height:16px}[_nghost-%COMP%] .weeks[_ngcontent-%COMP%] .btn[_ngcontent-%COMP%]{padding:9px 16px;border-radius:40px;cursor:pointer}[_nghost-%COMP%] .weeks[_ngcontent-%COMP%] .btn[_ngcontent-%COMP%]:hover{font-weight:600;background-color:#f2f2fb;color:#4646ce}[_nghost-%COMP%] .weeks[_ngcontent-%COMP%] .btn.selected[_ngcontent-%COMP%]{font-weight:600;background-color:#4646ce;color:#fff}"], changeDetection: 0 }); }
|
|
86
86
|
}
|
|
87
87
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WeekSelectorComponent, [{
|
|
88
88
|
type: Component,
|
|
89
|
-
args: [{ selector: 'dr-week-selector', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"weeks\">\n <div class=\"header\">Week</div>\n\n <div class=\"weeks__container\">\n <div\n (click)=\"service.datePickerInstance.close(); service.weekSelectionChange$.next(week)\"\n class=\"btn\"\n [class.selected]=\"week.selected\"\n *ngFor=\"let week of currentMonthWeeks\">\n W{{ week.yearWeekNumber }}\n </div>\n </div>\n</div>\n<div class=\"weeks-border\"></div>\n", styles: [":host{font-size:14px;font-weight:400;
|
|
89
|
+
args: [{ selector: 'dr-week-selector', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"weeks\">\n <div class=\"header\">Week</div>\n\n <div class=\"weeks__container\">\n <div\n (click)=\"service.datePickerInstance.close(); service.weekSelectionChange$.next(week)\"\n class=\"btn\"\n [class.selected]=\"week.selected\"\n *ngFor=\"let week of currentMonthWeeks\">\n W{{ week.yearWeekNumber }}\n </div>\n </div>\n</div>\n<div class=\"weeks-border\"></div>\n", styles: [":host{font-size:14px;line-height:24px;font-weight:400;text-align:center;color:#333;display:flex}:host .weeks{height:100%;flex-direction:column;display:flex}:host .weeks-border{height:100%;width:1px;background-color:#dfe0e3;margin:0 4px}:host .weeks__container{display:flex;flex-direction:column;justify-content:space-between;height:100%}:host .weeks .header{font-weight:600;color:#19181a;padding-bottom:8px;line-height:16px}:host .weeks .btn{padding:9px 16px;border-radius:40px;cursor:pointer}:host .weeks .btn:hover{font-weight:600;background-color:#f2f2fb;color:#4646ce}:host .weeks .btn.selected{font-weight:600;background-color:#4646ce;color:#fff}\n"] }]
|
|
90
90
|
}], function () { return []; }, null); })();
|
|
91
91
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2Vlay1zZWxlY3Rvci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kYXRhcmFpbHNzaGFyZWQvc3JjL2xpYi9kci1pbnB1dHMvZGF0ZS1waWNrZXJzL3dlZWstc2VsZWN0b3Ivd2Vlay1zZWxlY3Rvci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kYXRhcmFpbHNzaGFyZWQvc3JjL2xpYi9kci1pbnB1dHMvZGF0ZS1waWNrZXJzL3dlZWstc2VsZWN0b3Ivd2Vlay1zZWxlY3Rvci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsaUJBQWlCLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUcsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBYSxXQUFXLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUN0RSxPQUFPLEVBQUUsU0FBUyxFQUFFLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxNQUFNLENBQUM7QUFDckQsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sb0NBQW9DLENBQUM7QUFDekUsT0FBTyxNQUFrQixNQUFNLFFBQVEsQ0FBQzs7Ozs7SUNEaEMsOEJBSTJDO0lBSHZDLG1OQUFTLHlDQUFrQyxTQUFFLGVBQUEsaURBQXVDLENBQUEsSUFBQztJQUlyRixZQUNKO0lBQUEsaUJBQU07OztJQUhGLDRDQUFnQztJQUVoQyxlQUNKO0lBREksd0RBQ0o7O0FEZVIsTUFBTSxPQUFPLHFCQUFxQjtJQVE5QjtRQVBTLFlBQU8sR0FBRyxNQUFNLENBQUMsbUJBQW1CLENBQUMsQ0FBQztRQUM5QixhQUFRLEdBQUcsTUFBTSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQy9CLFFBQUcsR0FBRyxNQUFNLENBQUMsaUJBQWlCLENBQUMsQ0FBQztRQUNoQyxhQUFRLEdBQUcsSUFBSSxPQUFPLEVBQVEsQ0FBQztRQUVoRCxzQkFBaUIsR0FBZSxFQUFFLENBQUM7UUFHL0IsTUFBTSxDQUFDLFVBQVUsRUFBRSxFQUFFLFFBQVEsRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxHQUFHLEVBQUU7WUFDbEQsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLEVBQUUsQ0FBQztZQUNyQixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsRUFBRSxDQUFDO1FBQzdCLENBQUMsQ0FBQyxDQUFDO1FBRUgsSUFBSSxDQUFDLFFBQVEsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLEdBQUcsRUFBRTtZQUN0RixVQUFVLENBQUMsR0FBRyxFQUFFO2dCQUNaLE1BQU0sVUFBVSxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLFVBQVUsQ0FBQyxDQUFDO2dCQUNwRCxNQUFNLGFBQWEsR0FBc0IsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUM7Z0JBQ2hFLElBQUksQ0FBQyxpQkFBaUIsR0FBRyxJQUFJLENBQUMsZUFBZSxDQUFDLFVBQVUsRUFBRSxhQUFhLENBQUMsQ0FBQztnQkFDekUsSUFBSSxDQUFDLEdBQUcsQ0FBQyxhQUFhLEVBQUUsQ0FBQztZQUM3QixDQUFDLENBQUMsQ0FBQztRQUNQLENBQUMsQ0FBQyxDQUFDO0lBQ1AsQ0FBQztJQUVPLGVBQWUsQ0FBQyxJQUFZLEVBQUUsYUFBZ0M7UUFDbEUsTUFBTSxLQUFLLEdBQWUsRUFBRSxDQUFDO1FBQzdCLE1BQU0sUUFBUSxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDL0MsTUFBTSxPQUFPLEdBQUcsTUFBTSxDQUFDLElBQUksQ0FBQyxDQUFDLEtBQUssQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUU1QyxNQUFNLGNBQWMsR0FBRyxNQUFNLENBQUMsUUFBUSxDQUFDLENBQUMsT0FBTyxDQUFDLFNBQVMsQ0FBQyxDQUFDO1FBQzNELE1BQU0sV0FBVyxHQUFHLE1BQU0sQ0FBQyxPQUFPLENBQUMsQ0FBQyxLQUFLLENBQUMsU0FBUyxDQUFDLENBQUM7UUFFckQsSUFBSSxnQkFBZ0IsR0FBRyxNQUFNLENBQUMsY0FBYyxDQUFDLENBQUM7UUFDOUMsSUFBSSxVQUFVLEdBQUcsQ0FBQyxDQUFDO1FBRW5CLE9BQU8sZ0JBQWdCLENBQUMsY0FBYyxDQUFDLFdBQVcsQ0FBQyxFQUFFO1lBQ2pELE1BQU0sT0FBTyxHQUFHLE1BQU0sQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDLEtBQUssQ0FBQyxTQUFTLENBQUMsQ0FBQztZQUMxRCxNQUFNLElBQUksR0FBYSxFQUFFLENBQUM7WUFFMUIsS0FBSyxJQUFJLENBQUMsR0FBRyxDQUFDLEVBQUUsQ0FBQyxHQUFHLENBQUMsRUFBRSxDQUFDLEVBQUUsRUFBRTtnQkFDeEIsSUFBSSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsZ0JBQWdCLENBQUMsQ0FBQyxHQUFHLENBQUMsQ0FBQyxFQUFFLE1BQU0sQ0FBQyxDQUFDLENBQUM7YUFDdEQ7WUFFRCxNQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsR0FBRyxFQUFFLEVBQUUsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxNQUFNLENBQUMsSUFBSSxFQUFFLE9BQU8sQ0FBQyxDQUFDLENBQUM7WUFDakUsTUFBTSxRQUFRLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLEdBQUcsRUFBRSxFQUFFLENBQUMsR0FBRyxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsS0FBSyxFQUFFLEtBQUssQ0FBQyxDQUFDLENBQUM7WUFFNUUsK0NBQStDO1lBQy9DLE1BQU0sY0FBYyxHQUFHLE1BQU0sQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDLE9BQU8sRUFBRSxDQUFDO1lBRTFELEtBQUssQ0FBQyxJQUFJLENBQUM7Z0JBQ1AsVUFBVTtnQkFDVixjQUFjO2dCQUNkLEtBQUssRUFBRSxNQUFNLENBQUMsZ0JBQWdCLENBQUM7Z0JBQy9CLEdBQUcsRUFBRSxNQUFNLENBQUMsT0FBTyxDQUFDO2dCQUNwQixJQUFJO2dCQUNKLFNBQVM7Z0JBQ1QsUUFBUTthQUNYLENBQUMsQ0FBQztZQUVILGdCQUFnQixDQUFDLEdBQUcsQ0FBQyxDQUFDLEVBQUUsTUFBTSxDQUFDLENBQUM7WUFDaEMsVUFBVSxFQUFFLENBQUM7U0FDaEI7UUFFRCxPQUFPLEtBQUssQ0FBQztJQUNqQixDQUFDO3lHQWhFUSxxQkFBcUI7bUdBQXJCLHFCQUFxQjtZQ3pCbEMsOEJBQW1CLGFBQUE7WUFDSyxvQkFBSTtZQUFBLGlCQUFNO1lBRTlCLDhCQUE4QjtZQUMxQixzRUFNTTtZQUNWLGlCQUFNLEVBQUE7WUFFVix5QkFBZ0M7O1lBTEgsZUFBb0I7WUFBcEIsK0NBQW9COzRCRFluQyxZQUFZOzt1RkFLYixxQkFBcUI7Y0FSakMsU0FBUzsyQkFDSSxrQkFBa0IsY0FDaEIsSUFBSSxXQUNQLENBQUMsWUFBWSxDQUFDLG1CQUdOLHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ2hhbmdlRGV0ZWN0b3JSZWYsIENvbXBvbmVudCwgRGVzdHJveVJlZiwgaW5qZWN0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgRGF0ZVJhbmdlLCBNYXRDYWxlbmRhciB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2RhdGVwaWNrZXInO1xuaW1wb3J0IHsgc3RhcnRXaXRoLCBTdWJqZWN0LCB0YWtlVW50aWwgfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IERyRGF0ZVBpY2tlclNlcnZpY2UgfSBmcm9tICcuLi9zZXJ2aWNlcy9kci1kYXRlLXBpY2tlci5zZXJ2aWNlJztcbmltcG9ydCBtb21lbnQsIHsgTW9tZW50IH0gZnJvbSAnbW9tZW50JztcblxuZXhwb3J0IGludGVyZmFjZSBXZWVrSW5mbyB7XG4gICAgd2Vla051bWJlcjogbnVtYmVyO1xuICAgIHllYXJXZWVrTnVtYmVyOiBudW1iZXI7XG4gICAgc3RhcnQ6IE1vbWVudDtcbiAgICBlbmQ6IE1vbWVudDtcbiAgICBkYXlzOiBNb21lbnRbXTtcbiAgICBpc1BhcnRpYWw6IGJvb2xlYW47XG4gICAgc2VsZWN0ZWQ6IGJvb2xlYW47XG59XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnZHItd2Vlay1zZWxlY3RvcicsXG4gICAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlXSxcbiAgICB0ZW1wbGF0ZVVybDogJy4vd2Vlay1zZWxlY3Rvci5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vd2Vlay1zZWxlY3Rvci5jb21wb25lbnQuc2NzcyddLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBXZWVrU2VsZWN0b3JDb21wb25lbnQge1xuICAgIHJlYWRvbmx5IHNlcnZpY2UgPSBpbmplY3QoRHJEYXRlUGlja2VyU2VydmljZSk7XG4gICAgcHJpdmF0ZSByZWFkb25seSBjYWxlbmRhciA9IGluamVjdChNYXRDYWxlbmRhcik7XG4gICAgcHJpdmF0ZSByZWFkb25seSBjZHIgPSBpbmplY3QoQ2hhbmdlRGV0ZWN0b3JSZWYpO1xuICAgIHByaXZhdGUgcmVhZG9ubHkgZGVzdHJveSQgPSBuZXcgU3ViamVjdDx2b2lkPigpO1xuXG4gICAgY3VycmVudE1vbnRoV2Vla3M6IFdlZWtJbmZvW10gPSBbXTtcblxuICAgIGNvbnN0cnVjdG9yKCkge1xuICAgICAgICBpbmplY3QoRGVzdHJveVJlZiwgeyBza2lwU2VsZjogdHJ1ZSB9KS5vbkRlc3Ryb3koKCkgPT4ge1xuICAgICAgICAgICAgdGhpcy5kZXN0cm95JC5uZXh0KCk7XG4gICAgICAgICAgICB0aGlzLmRlc3Ryb3kkLmNvbXBsZXRlKCk7XG4gICAgICAgIH0pO1xuXG4gICAgICAgIHRoaXMuY2FsZW5kYXIuc3RhdGVDaGFuZ2VzLnBpcGUoc3RhcnRXaXRoKG51bGwpLCB0YWtlVW50aWwodGhpcy5kZXN0cm95JCkpLnN1YnNjcmliZSgoKSA9PiB7XG4gICAgICAgICAgICBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgICAgICAgICBjb25zdCBhY3RpdmVEYXRlID0gbW9tZW50KHRoaXMuY2FsZW5kYXIuYWN0aXZlRGF0ZSk7XG4gICAgICAgICAgICAgICAgY29uc3Qgc2VsZWN0ZWRSYW5nZTogRGF0ZVJhbmdlPE1vbWVudD4gPSB0aGlzLmNhbGVuZGFyLnNlbGVjdGVkO1xuICAgICAgICAgICAgICAgIHRoaXMuY3VycmVudE1vbnRoV2Vla3MgPSB0aGlzLmdldFdlZWtzSW5Nb250aChhY3RpdmVEYXRlLCBzZWxlY3RlZFJhbmdlKTtcbiAgICAgICAgICAgICAgICB0aGlzLmNkci5kZXRlY3RDaGFuZ2VzKCk7XG4gICAgICAgICAgICB9KTtcbiAgICAgICAgfSk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBnZXRXZWVrc0luTW9udGgoZGF0ZTogTW9tZW50LCBzZWxlY3RlZFJhbmdlOiBEYXRlUmFuZ2U8TW9tZW50Pik6IFdlZWtJbmZvW10ge1xuICAgICAgICBjb25zdCB3ZWVrczogV2Vla0luZm9bXSA9IFtdO1xuICAgICAgICBjb25zdCBmaXJzdERheSA9IG1vbWVudChkYXRlKS5zdGFydE9mKCdtb250aCcpO1xuICAgICAgICBjb25zdCBsYXN0RGF5ID0gbW9tZW50KGRhdGUpLmVuZE9mKCdtb250aCcpO1xuXG4gICAgICAgIGNvbnN0IGZpcnN0V2Vla1N0YXJ0ID0gbW9tZW50KGZpcnN0RGF5KS5zdGFydE9mKCdpc29XZWVrJyk7XG4gICAgICAgIGNvbnN0IGxhc3RXZWVrRW5kID0gbW9tZW50KGxhc3REYXkpLmVuZE9mKCdpc29XZWVrJyk7XG5cbiAgICAgICAgbGV0IGN1cnJlbnRXZWVrU3RhcnQgPSBtb21lbnQoZmlyc3RXZWVrU3RhcnQpO1xuICAgICAgICBsZXQgd2Vla051bWJlciA9IDE7XG5cbiAgICAgICAgd2hpbGUgKGN1cnJlbnRXZWVrU3RhcnQuaXNTYW1lT3JCZWZvcmUobGFzdFdlZWtFbmQpKSB7XG4gICAgICAgICAgICBjb25zdCB3ZWVrRW5kID0gbW9tZW50KGN1cnJlbnRXZWVrU3RhcnQpLmVuZE9mKCdpc29XZWVrJyk7XG4gICAgICAgICAgICBjb25zdCBkYXlzOiBNb21lbnRbXSA9IFtdO1xuXG4gICAgICAgICAgICBmb3IgKGxldCBpID0gMDsgaSA8IDc7IGkrKykge1xuICAgICAgICAgICAgICAgIGRheXMucHVzaChtb21lbnQoY3VycmVudFdlZWtTdGFydCkuYWRkKGksICdkYXlzJykpO1xuICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICBjb25zdCBpc1BhcnRpYWwgPSBkYXlzLnNvbWUoKGRheSkgPT4gIWRheS5pc1NhbWUoZGF0ZSwgJ21vbnRoJykpO1xuICAgICAgICAgICAgY29uc3Qgc2VsZWN0ZWQgPSBkYXlzLnNvbWUoKGRheSkgPT4gZGF5LmlzU2FtZShzZWxlY3RlZFJhbmdlLnN0YXJ0LCAnZGF5JykpO1xuXG4gICAgICAgICAgICAvLyBpc29XZWVrKCkgcmV0dXJucyB0aGUgSVNPIHdlZWsgbnVtYmVyICgxLTUzKVxuICAgICAgICAgICAgY29uc3QgeWVhcldlZWtOdW1iZXIgPSBtb21lbnQoY3VycmVudFdlZWtTdGFydCkuaXNvV2VlaygpO1xuXG4gICAgICAgICAgICB3ZWVrcy5wdXNoKHtcbiAgICAgICAgICAgICAgICB3ZWVrTnVtYmVyLFxuICAgICAgICAgICAgICAgIHllYXJXZWVrTnVtYmVyLFxuICAgICAgICAgICAgICAgIHN0YXJ0OiBtb21lbnQoY3VycmVudFdlZWtTdGFydCksXG4gICAgICAgICAgICAgICAgZW5kOiBtb21lbnQod2Vla0VuZCksXG4gICAgICAgICAgICAgICAgZGF5cyxcbiAgICAgICAgICAgICAgICBpc1BhcnRpYWwsXG4gICAgICAgICAgICAgICAgc2VsZWN0ZWQsXG4gICAgICAgICAgICB9KTtcblxuICAgICAgICAgICAgY3VycmVudFdlZWtTdGFydC5hZGQoMSwgJ3dlZWsnKTtcbiAgICAgICAgICAgIHdlZWtOdW1iZXIrKztcbiAgICAgICAgfVxuXG4gICAgICAgIHJldHVybiB3ZWVrcztcbiAgICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwid2Vla3NcIj5cbiAgICA8ZGl2IGNsYXNzPVwiaGVhZGVyXCI+V2VlazwvZGl2PlxuXG4gICAgPGRpdiBjbGFzcz1cIndlZWtzX19jb250YWluZXJcIj5cbiAgICAgICAgPGRpdlxuICAgICAgICAgICAgKGNsaWNrKT1cInNlcnZpY2UuZGF0ZVBpY2tlckluc3RhbmNlLmNsb3NlKCk7IHNlcnZpY2Uud2Vla1NlbGVjdGlvbkNoYW5nZSQubmV4dCh3ZWVrKVwiXG4gICAgICAgICAgICBjbGFzcz1cImJ0blwiXG4gICAgICAgICAgICBbY2xhc3Muc2VsZWN0ZWRdPVwid2Vlay5zZWxlY3RlZFwiXG4gICAgICAgICAgICAqbmdGb3I9XCJsZXQgd2VlayBvZiBjdXJyZW50TW9udGhXZWVrc1wiPlxuICAgICAgICAgICAgV3t7IHdlZWsueWVhcldlZWtOdW1iZXIgfX1cbiAgICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG48L2Rpdj5cbjxkaXYgY2xhc3M9XCJ3ZWVrcy1ib3JkZXJcIj48L2Rpdj5cbiJdfQ==
|
|
@@ -260,7 +260,7 @@ export class DrInputComponent {
|
|
|
260
260
|
i0.ɵɵproperty("ngIf", ctx.type === "search");
|
|
261
261
|
i0.ɵɵadvance(2);
|
|
262
262
|
i0.ɵɵproperty("ngIf", ctx._buttonOptions.show || ctx._buttonOptions.showOnFocus && ctx._buttonOptions.focusSet);
|
|
263
|
-
} }, dependencies: [i1.NgxMaskDirective, i2.DefaultValueAccessor, i2.NgControlStatus, i2.MinLengthValidator, i2.MaxLengthValidator, i2.NgModel, i3.NgIf, i4.DrModelDebounceChangeDirective], styles: ["[_nghost-%COMP%]{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;
|
|
263
|
+
} }, dependencies: [i1.NgxMaskDirective, i2.DefaultValueAccessor, i2.NgControlStatus, i2.MinLengthValidator, i2.MaxLengthValidator, i2.NgModel, i3.NgIf, i4.DrModelDebounceChangeDirective], styles: ["[_nghost-%COMP%]{font-size:14px;line-height:24px;font-weight:400;position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;background:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;padding:0 8px;overflow:hidden;outline:none}[_nghost-%COMP%]:hover{border-color:#4646ce}[_nghost-%COMP%]:focus-within{border-color:#4646ce!important;color:#333}.disabled[_nghost-%COMP%]{pointer-events:none;color:#aeabac;border-color:#aeabac;background:#f0f1f4}.ng-valid.ng-dirty[_nghost-%COMP%]{border-color:#037c5a}.ng-invalid.ng-dirty[_nghost-%COMP%]:not(:focus-within){border-color:#bf1d30!important}.ng-untouched.ng-valid[_nghost-%COMP%]{border-color:#9ea1aa}[_nghost-%COMP%] input[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400;display:flex;flex-grow:1;height:100%;border:none;padding:4px 0;text-align:left;box-sizing:border-box;outline:none}[_nghost-%COMP%] input[_ngcontent-%COMP%]::placeholder{font-size:14px;line-height:24px;font-weight:400;color:#6d6e6f}[_nghost-%COMP%] input[_ngcontent-%COMP%]:disabled{border:none;color:#aeabac;background:transparent}[_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-decoration, [_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-cancel-button, [_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-results-button, [_nghost-%COMP%] input[_ngcontent-%COMP%]::-webkit-search-results-decoration{-webkit-appearance:none}[_nghost-%COMP%] .clear-icon[_ngcontent-%COMP%]{visibility:hidden}.clearable[_nghost-%COMP%] .clear-icon[_ngcontent-%COMP%], .ng-touched.ng-invalid[_nghost-%COMP%] .clear-icon[_ngcontent-%COMP%]{visibility:visible;content:url('data:image/svg+xml; utf8, <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.91783 5.00001L9.03353 1.88395C9.11924 1.79818 9.16651 1.68374 9.16665 1.56171C9.16665 1.43962 9.11937 1.32504 9.03353 1.2394L8.76047 0.966415C8.67463 0.880433 8.56023 0.833344 8.43808 0.833344C8.31612 0.833344 8.20166 0.880433 8.11582 0.966415L5.00013 4.08227L1.88428 0.966415C1.79858 0.880433 1.68404 0.833344 1.56196 0.833344C1.44001 0.833344 1.32556 0.880433 1.23985 0.966415L0.966646 1.2394C0.788869 1.41719 0.788869 1.70637 0.966646 1.88395L4.08242 5.00001L0.966646 8.11593C0.880873 8.20184 0.833677 8.31628 0.833677 8.43831C0.833677 8.56034 0.880873 8.67478 0.966646 8.76062L1.23978 9.03361C1.32548 9.11952 1.44 9.16668 1.56188 9.16668C1.68397 9.16668 1.7985 9.11952 1.88421 9.03361L5.00005 5.91769L8.11575 9.03361C8.20159 9.11952 8.31605 9.16668 8.438 9.16668H8.43815C8.56017 9.16668 8.67456 9.11952 8.7604 9.03361L9.03346 8.76062C9.11916 8.67484 9.16643 8.56034 9.16643 8.43831C9.16643 8.31628 9.11916 8.20184 9.03346 8.116L5.91783 5.00001Z\" fill=\"%2351566F\"/></svg> ');margin:auto 0 auto 8px;cursor:pointer}[_nghost-%COMP%] span[_ngcontent-%COMP%] + span[_ngcontent-%COMP%], [_nghost-%COMP%] span[_ngcontent-%COMP%] + img[_ngcontent-%COMP%]{margin-left:0}.search-type[_nghost-%COMP%]{padding:0 16px;border-radius:16px}.search-type[_nghost-%COMP%] .search-icon[_ngcontent-%COMP%]{content:url('data:image/svg+xml; utf8, <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M11.5816 10.2097C11.4878 10.1157 11.3605 10.0629 11.2277 10.0629H10.8175C10.7473 10.0629 10.6799 10.035 10.6303 9.98534C10.5322 9.88724 10.527 9.73044 10.6132 9.62178C11.4154 8.6112 11.8925 7.33534 11.8925 5.94625C11.8925 2.66209 9.23042 0 5.94625 0C2.66209 0 0 2.66209 0 5.94625C0 9.23042 2.66209 11.8925 5.94625 11.8925C7.33523 11.8925 8.611 11.4155 9.62155 10.6172C9.7304 10.5312 9.88711 10.5366 9.9852 10.6347C10.0349 10.6845 10.0629 10.7519 10.0629 10.8223V11.2277C10.0629 11.3605 10.1157 11.4878 10.2097 11.5816L14.2834 15.6472C14.4787 15.8421 14.795 15.8419 14.9901 15.6468L15.6468 14.9901C15.8419 14.795 15.8421 14.4787 15.6472 14.2834L11.5816 10.2097ZM5.94625 10.0629C3.67296 10.0629 1.82962 8.21955 1.82962 5.94625C1.82962 3.67296 3.67296 1.82962 5.94625 1.82962C8.21955 1.82962 10.0629 3.67296 10.0629 5.94625C10.0629 8.21955 8.21955 10.0629 5.94625 10.0629Z\" fill=\"%23BCBCBC\"/></svg> ');margin:auto 0 auto 8px;cursor:pointer}.search-type.clearable[_nghost-%COMP%] .search-icon[_ngcontent-%COMP%]{margin-left:26px}.search-type.clearable[_nghost-%COMP%] .clear-icon[_ngcontent-%COMP%] + .search-icon[_ngcontent-%COMP%]{margin-left:8px}.search-type-mini[_nghost-%COMP%]{width:200px;min-height:28px;height:28px}.with-button[_nghost-%COMP%]{padding-right:0}.with-button[_nghost-%COMP%] button[_ngcontent-%COMP%]{color:#fff;background:#4646ce;height:100%;width:auto;padding:0 8px;display:flex;align-items:center;border:none;border-left:1px solid #9ea1aa}.with-button.disabled[_nghost-%COMP%] button[_ngcontent-%COMP%]{color:#aeabac;background:#f0f1f4;border-left:1px solid #aeabac}[_nghost-%COMP%] img[prefixIcon], [_nghost-%COMP%] img[suffixIcon], [_nghost-%COMP%] i[prefixIcon], [_nghost-%COMP%] i[suffixIcon]{position:relative;margin:auto 8px}[_nghost-%COMP%] img[prefixIcon], [_nghost-%COMP%] i[prefixIcon]{margin-left:0}[_nghost-%COMP%] img[suffixIcon], [_nghost-%COMP%] i[suffixIcon]{margin-right:0}"], changeDetection: 0 }); }
|
|
264
264
|
}
|
|
265
265
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrInputComponent, [{
|
|
266
266
|
type: Component,
|
|
@@ -270,7 +270,7 @@ export class DrInputComponent {
|
|
|
270
270
|
useExisting: forwardRef((() => DrInputComponent)),
|
|
271
271
|
multi: true,
|
|
272
272
|
},
|
|
273
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[prefixIcon]\"></ng-content>\n\n<ng-container *ngIf=\"!mask; else maskedInput\">\n <input\n [attr.id]=\"id\"\n #inputRef\n [(ngModel)]=\"value\"\n (ngModelChange)=\"updateChanges()\"\n (ngModelDebounceChange)=\"modelDebounceChange.emit($event)\"\n (blur)=\"blur.emit(value); onTouched()\"\n (focus)=\"focused.emit($event)\"\n [disabled]=\"_disabled\"\n [readonly]=\"readonly\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n [minlength]=\"minlength\"\n [maxlength]=\"maxlength\"\n [step]=\"step\" />\n</ng-container>\n<ng-template #maskedInput>\n <input\n [attr.id]=\"id\"\n #inputRef\n [(ngModel)]=\"value\"\n (ngModelChange)=\"updateChanges()\"\n (ngModelDebounceChange)=\"modelDebounceChange.emit($event)\"\n (blur)=\"blur.emit(value); onTouched()\"\n (focus)=\"focused.emit($event)\"\n [disabled]=\"_disabled\"\n [readonly]=\"readonly\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n [minlength]=\"minlength\"\n [maxlength]=\"maxlength\"\n [mask]=\"mask\"\n [suffix]=\"suffix\"\n [prefix]=\"prefix\"\n [step]=\"step\" />\n</ng-template>\n<span *ngIf=\"value\" class=\"clear-icon\" (click)=\"onClear($event)\"></span>\n<span *ngIf=\"type === 'search'\" class=\"search-icon\" (click)=\"onSearchClicked()\"></span>\n<ng-content select=\"[suffixIcon]\"></ng-content>\n<button *ngIf=\"_buttonOptions.show || (_buttonOptions.showOnFocus && _buttonOptions.focusSet)\" (click)=\"onButtonClicked($event)\">\n {{ _buttonOptions.text }}\n</button>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;
|
|
273
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[prefixIcon]\"></ng-content>\n\n<ng-container *ngIf=\"!mask; else maskedInput\">\n <input\n [attr.id]=\"id\"\n #inputRef\n [(ngModel)]=\"value\"\n (ngModelChange)=\"updateChanges()\"\n (ngModelDebounceChange)=\"modelDebounceChange.emit($event)\"\n (blur)=\"blur.emit(value); onTouched()\"\n (focus)=\"focused.emit($event)\"\n [disabled]=\"_disabled\"\n [readonly]=\"readonly\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n [minlength]=\"minlength\"\n [maxlength]=\"maxlength\"\n [step]=\"step\" />\n</ng-container>\n<ng-template #maskedInput>\n <input\n [attr.id]=\"id\"\n #inputRef\n [(ngModel)]=\"value\"\n (ngModelChange)=\"updateChanges()\"\n (ngModelDebounceChange)=\"modelDebounceChange.emit($event)\"\n (blur)=\"blur.emit(value); onTouched()\"\n (focus)=\"focused.emit($event)\"\n [disabled]=\"_disabled\"\n [readonly]=\"readonly\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n [minlength]=\"minlength\"\n [maxlength]=\"maxlength\"\n [mask]=\"mask\"\n [suffix]=\"suffix\"\n [prefix]=\"prefix\"\n [step]=\"step\" />\n</ng-template>\n<span *ngIf=\"value\" class=\"clear-icon\" (click)=\"onClear($event)\"></span>\n<span *ngIf=\"type === 'search'\" class=\"search-icon\" (click)=\"onSearchClicked()\"></span>\n<ng-content select=\"[suffixIcon]\"></ng-content>\n<button *ngIf=\"_buttonOptions.show || (_buttonOptions.showOnFocus && _buttonOptions.focusSet)\" (click)=\"onButtonClicked($event)\">\n {{ _buttonOptions.text }}\n</button>\n", styles: [":host{font-size:14px;line-height:24px;font-weight:400;position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;background:#fff;border:1px solid #9ea1aa;border-radius:6px;color:#333;padding:0 8px;overflow:hidden;outline:none}:host:hover{border-color:#4646ce}:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;color:#aeabac;border-color:#aeabac;background:#f0f1f4}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host input{font-size:14px;line-height:24px;font-weight:400;display:flex;flex-grow:1;height:100%;border:none;padding:4px 0;text-align:left;box-sizing:border-box;outline:none}:host input::placeholder{font-size:14px;line-height:24px;font-weight:400;color:#6d6e6f}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host .clear-icon{visibility:hidden}:host.clearable .clear-icon,:host.ng-touched.ng-invalid .clear-icon{visibility:visible;content:url('data:image/svg+xml; utf8, <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.91783 5.00001L9.03353 1.88395C9.11924 1.79818 9.16651 1.68374 9.16665 1.56171C9.16665 1.43962 9.11937 1.32504 9.03353 1.2394L8.76047 0.966415C8.67463 0.880433 8.56023 0.833344 8.43808 0.833344C8.31612 0.833344 8.20166 0.880433 8.11582 0.966415L5.00013 4.08227L1.88428 0.966415C1.79858 0.880433 1.68404 0.833344 1.56196 0.833344C1.44001 0.833344 1.32556 0.880433 1.23985 0.966415L0.966646 1.2394C0.788869 1.41719 0.788869 1.70637 0.966646 1.88395L4.08242 5.00001L0.966646 8.11593C0.880873 8.20184 0.833677 8.31628 0.833677 8.43831C0.833677 8.56034 0.880873 8.67478 0.966646 8.76062L1.23978 9.03361C1.32548 9.11952 1.44 9.16668 1.56188 9.16668C1.68397 9.16668 1.7985 9.11952 1.88421 9.03361L5.00005 5.91769L8.11575 9.03361C8.20159 9.11952 8.31605 9.16668 8.438 9.16668H8.43815C8.56017 9.16668 8.67456 9.11952 8.7604 9.03361L9.03346 8.76062C9.11916 8.67484 9.16643 8.56034 9.16643 8.43831C9.16643 8.31628 9.11916 8.20184 9.03346 8.116L5.91783 5.00001Z\" fill=\"%2351566F\"/></svg> ');margin:auto 0 auto 8px;cursor:pointer}:host span+span,:host span+img{margin-left:0}:host.search-type{padding:0 16px;border-radius:16px}:host.search-type .search-icon{content:url('data:image/svg+xml; utf8, <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M11.5816 10.2097C11.4878 10.1157 11.3605 10.0629 11.2277 10.0629H10.8175C10.7473 10.0629 10.6799 10.035 10.6303 9.98534C10.5322 9.88724 10.527 9.73044 10.6132 9.62178C11.4154 8.6112 11.8925 7.33534 11.8925 5.94625C11.8925 2.66209 9.23042 0 5.94625 0C2.66209 0 0 2.66209 0 5.94625C0 9.23042 2.66209 11.8925 5.94625 11.8925C7.33523 11.8925 8.611 11.4155 9.62155 10.6172C9.7304 10.5312 9.88711 10.5366 9.9852 10.6347C10.0349 10.6845 10.0629 10.7519 10.0629 10.8223V11.2277C10.0629 11.3605 10.1157 11.4878 10.2097 11.5816L14.2834 15.6472C14.4787 15.8421 14.795 15.8419 14.9901 15.6468L15.6468 14.9901C15.8419 14.795 15.8421 14.4787 15.6472 14.2834L11.5816 10.2097ZM5.94625 10.0629C3.67296 10.0629 1.82962 8.21955 1.82962 5.94625C1.82962 3.67296 3.67296 1.82962 5.94625 1.82962C8.21955 1.82962 10.0629 3.67296 10.0629 5.94625C10.0629 8.21955 8.21955 10.0629 5.94625 10.0629Z\" fill=\"%23BCBCBC\"/></svg> ');margin:auto 0 auto 8px;cursor:pointer}:host.search-type.clearable .search-icon{margin-left:26px}:host.search-type.clearable .clear-icon+.search-icon{margin-left:8px}:host.search-type-mini{width:200px;min-height:28px;height:28px}:host.with-button{padding-right:0}:host.with-button button{color:#fff;background:#4646ce;height:100%;width:auto;padding:0 8px;display:flex;align-items:center;border:none;border-left:1px solid #9ea1aa}:host.with-button.disabled button{color:#aeabac;background:#f0f1f4;border-left:1px solid #aeabac}:host ::ng-deep img[prefixIcon],:host ::ng-deep img[suffixIcon],:host ::ng-deep i[prefixIcon],:host ::ng-deep i[suffixIcon]{position:relative;margin:auto 8px}:host ::ng-deep img[prefixIcon],:host ::ng-deep i[prefixIcon]{margin-left:0}:host ::ng-deep img[suffixIcon],:host ::ng-deep i[suffixIcon]{margin-right:0}\n"] }]
|
|
274
274
|
}], function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }]; }, { id: [{
|
|
275
275
|
type: Input
|
|
276
276
|
}], hostId: [{
|
|
@@ -25,11 +25,11 @@ export class DrLinkComponent {
|
|
|
25
25
|
i0.ɵɵclassMap(ctx.theme);
|
|
26
26
|
i0.ɵɵstyleProp("font-weight", ctx.fontWeight)("font-size", ctx.fontSize);
|
|
27
27
|
i0.ɵɵproperty("href", ctx.link, i0.ɵɵsanitizeUrl);
|
|
28
|
-
} }, styles: [".dr-link[_ngcontent-%COMP%]{display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Poppins,sans-serif;font-style:normal;font-size:14px;font-weight:400;line-height:
|
|
28
|
+
} }, styles: [".dr-link[_ngcontent-%COMP%]{display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Poppins,sans-serif;font-style:normal;font-size:14px;font-weight:400;line-height:24px;color:#4646ce}.dr-link.DEFAULT[_ngcontent-%COMP%]{text-decoration:none!important}.dr-link.DEFAULT_UNDERLINE[_ngcontent-%COMP%]{text-decoration:underline!important}.dr-link.GRAY_UNDERLINE[_ngcontent-%COMP%]{color:#6d6e6f;text-decoration:underline!important}"] }); }
|
|
29
29
|
}
|
|
30
30
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrLinkComponent, [{
|
|
31
31
|
type: Component,
|
|
32
|
-
args: [{ selector: 'dr-link', template: "<a class=\"dr-link\" [class]=\"theme\" [href]=\"link\" [style.font-weight]=\"fontWeight\" [style.font-size]=\"fontSize\">\n <ng-content></ng-content>\n</a>\n", styles: [".dr-link{display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Poppins,sans-serif;font-style:normal;font-size:14px;font-weight:400;line-height:
|
|
32
|
+
args: [{ selector: 'dr-link', template: "<a class=\"dr-link\" [class]=\"theme\" [href]=\"link\" [style.font-weight]=\"fontWeight\" [style.font-size]=\"fontSize\">\n <ng-content></ng-content>\n</a>\n", styles: [".dr-link{display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Poppins,sans-serif;font-style:normal;font-size:14px;font-weight:400;line-height:24px;color:#4646ce}.dr-link.DEFAULT{text-decoration:none!important}.dr-link.DEFAULT_UNDERLINE{text-decoration:underline!important}.dr-link.GRAY_UNDERLINE{color:#6d6e6f;text-decoration:underline!important}\n"] }]
|
|
33
33
|
}], null, { link: [{
|
|
34
34
|
type: Input,
|
|
35
35
|
args: [{ required: true }]
|
|
@@ -313,7 +313,7 @@ export class DrSelectComponent {
|
|
|
313
313
|
i0.ɵɵproperty("ngIf", ctx.groupBy);
|
|
314
314
|
i0.ɵɵadvance(2);
|
|
315
315
|
i0.ɵɵproperty("ngIf", ctx.type === "search-input");
|
|
316
|
-
} }, dependencies: [i1.NgControlStatus, i1.NgModel, i2.NgIf, i2.NgTemplateOutlet, i3.NgSelectComponent, i3.NgOptgroupTemplateDirective, i3.NgOptionTemplateDirective, i3.NgLabelTemplateDirective, i3.NgMultiLabelTemplateDirective, i3.NgHeaderTemplateDirective, i3.NgFooterTemplateDirective, i3.NgLoadingSpinnerTemplateDirective, i4.DrSpinnerDirective, i5.DrInputComponent], styles: ["[_nghost-%COMP%]{width:100%;height:32px;font-family:Poppins,sans-serif}.textView[_nghost-%COMP%] {width:auto}.textView[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border:none!important;cursor:pointer}.textView[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container{padding:0;color:#4646ce}.textView[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container:hover{text-decoration-line:underline}.textView[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none}.textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container, .textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:hover, .textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#fff!important;border:none!important;cursor:default}.textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value, .textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value, .textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}.textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}.textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-value-container:hover{text-decoration-line:none}.no-left-border-radius[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.no-right-border-radius[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}.no-right-border[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-right:none!important}.no-left-border[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-left:none!important}[_nghost-%COMP%] ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px;border:1px solid #9ea1aa;box-shadow:none!important}[_nghost-%COMP%] ng-select.ng-select .ng-select-container:hover{border-color:#4646ce}[_nghost-%COMP%] ng-select.ng-select .ng-select-container:focus-within{border-color:#4646ce}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#333;font-size:14px;font-weight:400}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-input input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto;font-size:14px;line-height:18px}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper{margin-right:7px}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:before{font-family:DataRails!important;content:\"\\ea17\";font-size:24px;color:#6d6e6f}[_nghost-%COMP%] ng-select.ng-select.ng-select-opened .ng-select-container{border-radius:6px}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px;font-size:14px;line-height:18px}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#333;height:24px;padding:2px 16px;font-size:12px;margin:2px 4px 2px 0;background:#f0f1f4;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0!important;width:20px;display:flex;align-items:center;color:transparent;margin-left:4px}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:before{font-family:DataRails!important;content:\"\\ea73\";font-size:20px;color:#333}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon, [_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container, [_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:hover, [_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#f0f1f4!important;border:1px solid #aeabac!important}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value, [_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value, [_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow{color:#aeabac}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow:before{color:#aeabac}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}[_nghost-%COMP%] ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container, [_nghost-%COMP%] ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#bf1d30}[_nghost-%COMP%] ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container{max-height:88px}[_nghost-%COMP%] ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container .ng-value-container{max-height:88px}[_nghost-%COMP%] ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value, [_nghost-%COMP%] ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value{padding:0}[_nghost-%COMP%] ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value .ng-select-user-label, [_nghost-%COMP%] ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-select-user-label{height:100%}.ng-invalid.ng-touched[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-color:#bf1d30}[_nghost-%COMP%] .dr-select__loading[_ngcontent-%COMP%]{position:relative;height:32px;width:24px}.search-input[_nghost-%COMP%]{position:relative}.search-input[_nghost-%COMP%] .search-icon[_ngcontent-%COMP%]{position:absolute;top:4px;right:16px;color:#6d6e6f;z-index:1001}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-radius:16px}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none!important}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-clear-wrapper{display:flex;justify-content:center;align-items:center;right:40px;top:1px;width:24px;height:24px}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-clear-wrapper .ng-clear{font-size:24px;font-weight:300;color:#6d6e6f}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-input, .search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 16px!important;width:calc(100% - 63px)}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-input input, .search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container input{height:100%} ng-dropdown-panel.ng-dropdown-panel.dr-select{font-family:Poppins,sans-serif;border:1px solid #dfe0e3;border-radius:4px!important;margin:8px 0;box-shadow:0 4px 8px 1px #00000040;background-color:#fff;overflow:hidden;padding:8px 0} ng-dropdown-panel.ng-dropdown-panel.dr-select.textView{width:auto!important} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px;background:#fff} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#f5f5f5} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected, ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#eaeaff;color:#333} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span, ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:400!important} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled{cursor:default} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div{color:#aeabac} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div.dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#aeabac} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]{font-size:14px;line-height:22px;color:#aeabac;cursor:default} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:not(:first-of-type){border-top:1px solid #dfe0e3} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:hover{background:#fff} ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper{color:#333} ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:-moz-fit-content;max-width:fit-content;word-break:break-word;white-space:normal;color:#6d6e6f;font-weight:400;font-size:12px;line-height:20px} ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description, ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#6d6e6f} .ng-dropdown-panel--with-search .ng-dropdown-header{border-bottom:none}.custom-backdrop[_ngcontent-%COMP%]{position:fixed;inset:0;overflow:hidden;pointer-events:none}"] }); }
|
|
316
|
+
} }, dependencies: [i1.NgControlStatus, i1.NgModel, i2.NgIf, i2.NgTemplateOutlet, i3.NgSelectComponent, i3.NgOptgroupTemplateDirective, i3.NgOptionTemplateDirective, i3.NgLabelTemplateDirective, i3.NgMultiLabelTemplateDirective, i3.NgHeaderTemplateDirective, i3.NgFooterTemplateDirective, i3.NgLoadingSpinnerTemplateDirective, i4.DrSpinnerDirective, i5.DrInputComponent], styles: ["[_nghost-%COMP%]{width:100%;height:32px;font-family:Poppins,sans-serif}.textView[_nghost-%COMP%] {width:auto}.textView[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border:none!important;cursor:pointer}.textView[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container{padding:0;color:#4646ce}.textView[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container:hover{text-decoration-line:underline}.textView[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none}.textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container, .textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:hover, .textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#fff!important;border:none!important;cursor:default}.textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value, .textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value, .textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}.textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}.textView[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-value-container:hover{text-decoration-line:none}.no-left-border-radius[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.no-right-border-radius[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}.no-right-border[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-right:none!important}.no-left-border[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-left:none!important}[_nghost-%COMP%] ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px;border:1px solid #9ea1aa;box-shadow:none!important}[_nghost-%COMP%] ng-select.ng-select .ng-select-container:hover{border-color:#4646ce}[_nghost-%COMP%] ng-select.ng-select .ng-select-container:focus-within{border-color:#4646ce}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-input{font-size:14px;line-height:24px;font-weight:400;top:0!important;padding:0 50px 0 8px!important;color:#333}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-input input::placeholder{font-size:14px;line-height:24px;font-weight:400;color:#6d6e6f}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container{font-size:14px;line-height:24px;font-weight:400;padding:0 0 0 8px;height:100%;overflow:auto}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper{margin-right:7px}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:before{font-family:DataRails!important;content:\"\\ea17\";font-size:24px;color:#6d6e6f}[_nghost-%COMP%] ng-select.ng-select.ng-select-opened .ng-select-container{border-radius:6px}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{font-size:14px;line-height:24px;font-weight:400;max-height:58px}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{font-size:12px;line-height:16px;font-weight:400;color:#333;height:24px;padding:2px 16px;margin:2px 4px 2px 0;background:#f0f1f4;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{padding:0!important}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0!important;width:20px;display:flex;align-items:center;color:transparent;margin-left:4px}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:before{font-family:DataRails!important;content:\"\\ea73\";font-size:20px;color:#333}[_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon, [_nghost-%COMP%] ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container, [_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:hover, [_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#f0f1f4!important;border:1px solid #aeabac!important}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value, [_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value, [_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow{color:#aeabac}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow:before{color:#aeabac}[_nghost-%COMP%] ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}[_nghost-%COMP%] ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container, [_nghost-%COMP%] ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#bf1d30}[_nghost-%COMP%] ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container{max-height:88px}[_nghost-%COMP%] ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container .ng-value-container{max-height:88px}[_nghost-%COMP%] ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value, [_nghost-%COMP%] ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value{padding:0}[_nghost-%COMP%] ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value .ng-select-user-label, [_nghost-%COMP%] ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-select-user-label{height:100%}.ng-invalid.ng-touched[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-color:#bf1d30}[_nghost-%COMP%] .dr-select__loading[_ngcontent-%COMP%]{position:relative;height:32px;width:24px}.search-input[_nghost-%COMP%]{position:relative}.search-input[_nghost-%COMP%] .search-icon[_ngcontent-%COMP%]{position:absolute;top:4px;right:16px;color:#6d6e6f;z-index:1001}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container{border-radius:16px}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none!important}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-clear-wrapper{display:flex;justify-content:center;align-items:center;right:40px;top:1px;width:24px;height:24px}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-clear-wrapper .ng-clear{font-size:24px;font-weight:300;color:#6d6e6f}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-input, .search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 16px!important;width:calc(100% - 63px)}.search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-input input, .search-input[_nghost-%COMP%] ng-select.ng-select .ng-select-container .ng-value-container input{height:100%} ng-dropdown-panel.ng-dropdown-panel.dr-select{font-family:Poppins,sans-serif;border:1px solid #dfe0e3;border-radius:4px!important;margin:8px 0;box-shadow:0 4px 8px 1px #00000040;background-color:#fff;overflow:hidden;padding:8px 0} ng-dropdown-panel.ng-dropdown-panel.dr-select.textView{width:auto!important} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px;background:#fff} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#f5f5f5} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected, ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#eaeaff;color:#333} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span, ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:400!important} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled{cursor:default} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div{color:#aeabac} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div.dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#aeabac} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]{font-size:14px;line-height:22px;color:#aeabac;cursor:default} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:not(:first-of-type){border-top:1px solid #dfe0e3} ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:hover{background:#fff} ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper{color:#333} ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:-moz-fit-content;max-width:fit-content;word-break:break-word;white-space:normal;color:#6d6e6f;font-weight:400;font-size:12px;line-height:20px} ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description, ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#6d6e6f} .ng-dropdown-panel--with-search .ng-dropdown-header{border-bottom:none}.custom-backdrop[_ngcontent-%COMP%]{position:fixed;inset:0;overflow:hidden;pointer-events:none}"] }); }
|
|
317
317
|
}
|
|
318
318
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrSelectComponent, [{
|
|
319
319
|
type: Component,
|
|
@@ -323,7 +323,7 @@ export class DrSelectComponent {
|
|
|
323
323
|
useExisting: DrSelectComponent,
|
|
324
324
|
multi: true,
|
|
325
325
|
},
|
|
326
|
-
], template: "<ng-select\n [(ngModel)]=\"selectedItem\"\n [items]=\"items\"\n [bindLabel]=\"bindLabel\"\n [bindValue]=\"bindValue\"\n [multiple]=\"multiple\"\n [addTag]=\"addTag\"\n [appendTo]=\"appendTo\"\n [clearable]=\"clearable\"\n [searchable]=\"searchable\"\n [hideSelected]=\"hideSelected\"\n [placeholder]=\"placeholder\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText\"\n [readonly]=\"readonly\"\n [closeOnSelect]=\"closeOnSelect\"\n [disabled]=\"disabled\"\n [labelForId]=\"id\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [keyDownFn]=\"keyDownFn\"\n [searchFn]=\"searchFn\"\n [isOpen]=\"(type !== 'search-input' || !!selectComponent.searchTerm?.length) && isOpen\"\n [groupBy]=\"groupBy\"\n [attr.autofocus]=\"autofocus\"\n [selectOnTab]=\"selectOnTabKeyPress\"\n (keydown.tab)=\"onTabKeypress($event)\"\n (change)=\"onValueSelected(selectedItem)\"\n (open)=\"open.emit($event); onDropdownOpen()\"\n (close)=\"onClose($event)\"\n class=\"dr-select\"\n [class.ng-select--no-value-padding]=\"noValuePadding\"\n [class.ng-select--multiple-height-increased]=\"multipleHeightIncreased\"\n #selectComponent>\n <ng-template *ngIf=\"optionHeaderTemplate\" ng-header-tmp let-item=\"item\">\n <ng-container [ngTemplateOutlet]=\"optionHeaderTemplate\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-container>\n </ng-template>\n <ng-template\n ng-header-tmp\n *ngIf=\"!optionHeaderTemplate && isDisplayingSearchInHeader && items?.length >= minItemsToDisplaySearchInHeader\"\n let-item=\"item\">\n <dr-input\n class=\"dr-select__search\"\n [ngModel]=\"selectComponent.searchTerm\"\n (ngModelChange)=\"selectComponent.itemsList.filter($event + '')\"\n type=\"search\">\n </dr-input>\n </ng-template>\n <ng-template *ngIf=\"labelTemplate\" ng-label-tmp let-item=\"item\">\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-container>\n </ng-template>\n <ng-template *ngIf=\"multiLabelTemplate\" ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\">\n <ng-container [ngTemplateOutlet]=\"multiLabelTemplate\" [ngTemplateOutletContext]=\"{ items: items, clear: clear }\">\n </ng-container>\n </ng-template>\n <ng-template *ngIf=\"optionTemplate\" ng-option-tmp let-item=\"item\" let-item$=\"item$\">\n <ng-container [ngTemplateOutlet]=\"optionTemplate\" [ngTemplateOutletContext]=\"{ item: item, item$: item$ }\"></ng-container>\n </ng-template>\n <ng-template *ngIf=\"optionWithDescription\" ng-option-tmp let-item=\"item\">\n <div class=\"dr-select__option-with-desc__wrapper\">\n <div>{{ item.name }}</div>\n <div class=\"dr-select__option-with-desc__description\">{{ item?.description }}</div>\n </div>\n </ng-template>\n <ng-template *ngIf=\"optionFooterTemplate\" ng-footer-tmp let-item=\"item\">\n <ng-container\n [ngTemplateOutlet]=\"optionFooterTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, close: selectComponent.close.bind(selectComponent) }\"></ng-container>\n </ng-template>\n <ng-template *ngIf=\"groupBy\" ng-optgroup-tmp let-item=\"item\">\n {{ item[groupBy] }}\n </ng-template>\n <ng-template ng-loadingspinner-tmp>\n <div\n *ngIf=\"loading\"\n class=\"dr-select__loading\"\n [drSpinner]=\"loading\"\n [drSpinnerType]=\"'circle'\"\n [drSpinnerSize]=\"'small'\"\n [drSpinnerNoOverlay]=\"true\"></div>\n </ng-template>\n</ng-select>\n<i *ngIf=\"type === 'search-input'\" class=\"search-icon dr-icon-search\"></i>\n", styles: [":host{width:100%;height:32px;font-family:Poppins,sans-serif}:host.textView::ng-deep{width:auto}:host.textView::ng-deep ng-select.ng-select .ng-select-container{border:none!important;cursor:pointer}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0;color:#4646ce}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-value-container:hover{text-decoration-line:underline}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none}:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#fff!important;border:none!important;cursor:default}:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-value-container:hover{text-decoration-line:none}:host.no-left-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}:host.no-right-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}:host.no-right-border ::ng-deep ng-select.ng-select .ng-select-container{border-right:none!important}:host.no-left-border ::ng-deep ng-select.ng-select .ng-select-container{border-left:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px;border:1px solid #9ea1aa;box-shadow:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container:hover{border-color:#4646ce}:host ::ng-deep ng-select.ng-select .ng-select-container:focus-within{border-color:#4646ce}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#333;font-size:14px;font-weight:400}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{margin-right:7px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:before{font-family:DataRails!important;content:\"\\ea17\";font-size:24px;color:#6d6e6f}:host ::ng-deep ng-select.ng-select.ng-select-opened .ng-select-container{border-radius:6px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#333;height:24px;padding:2px 16px;font-size:12px;margin:2px 4px 2px 0;background:#f0f1f4;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0!important;width:20px;display:flex;align-items:center;color:transparent;margin-left:4px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:before{font-family:DataRails!important;content:\"\\ea73\";font-size:20px;color:#333}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon,:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#f0f1f4!important;border:1px solid #aeabac!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow:before{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#bf1d30}:host ::ng-deep ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container{max-height:88px}:host ::ng-deep ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container .ng-value-container{max-height:88px}:host ::ng-deep ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value,:host ::ng-deep ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value{padding:0}:host ::ng-deep ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value .ng-select-user-label,:host ::ng-deep ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-select-user-label{height:100%}:host.ng-invalid.ng-touched::ng-deep ng-select.ng-select .ng-select-container{border-color:#bf1d30}:host .dr-select__loading{position:relative;height:32px;width:24px}:host.search-input{position:relative}:host.search-input .search-icon{position:absolute;top:4px;right:16px;color:#6d6e6f;z-index:1001}:host.search-input::ng-deep ng-select.ng-select .ng-select-container{border-radius:16px}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none!important}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-clear-wrapper{display:flex;justify-content:center;align-items:center;right:40px;top:1px;width:24px;height:24px}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-clear-wrapper .ng-clear{font-size:24px;font-weight:300;color:#6d6e6f}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-input,:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 16px!important;width:calc(100% - 63px)}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-input input,:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-value-container input{height:100%}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select{font-family:Poppins,sans-serif;border:1px solid #dfe0e3;border-radius:4px!important;margin:8px 0;box-shadow:0 4px 8px 1px #00000040;background-color:#fff;overflow:hidden;padding:8px 0}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.textView{width:auto!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px;background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#f5f5f5}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#eaeaff;color:#333}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:400!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled{cursor:default}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div{color:#aeabac}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div.dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#aeabac}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]{font-size:14px;line-height:22px;color:#aeabac;cursor:default}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:not(:first-of-type){border-top:1px solid #dfe0e3}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:hover{background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper{color:#333}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:-moz-fit-content;max-width:fit-content;word-break:break-word;white-space:normal;color:#6d6e6f;font-weight:400;font-size:12px;line-height:20px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#6d6e6f}::ng-deep .ng-dropdown-panel--with-search .ng-dropdown-header{border-bottom:none}.custom-backdrop{position:fixed;inset:0;overflow:hidden;pointer-events:none}\n"] }]
|
|
326
|
+
], template: "<ng-select\n [(ngModel)]=\"selectedItem\"\n [items]=\"items\"\n [bindLabel]=\"bindLabel\"\n [bindValue]=\"bindValue\"\n [multiple]=\"multiple\"\n [addTag]=\"addTag\"\n [appendTo]=\"appendTo\"\n [clearable]=\"clearable\"\n [searchable]=\"searchable\"\n [hideSelected]=\"hideSelected\"\n [placeholder]=\"placeholder\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText\"\n [readonly]=\"readonly\"\n [closeOnSelect]=\"closeOnSelect\"\n [disabled]=\"disabled\"\n [labelForId]=\"id\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [keyDownFn]=\"keyDownFn\"\n [searchFn]=\"searchFn\"\n [isOpen]=\"(type !== 'search-input' || !!selectComponent.searchTerm?.length) && isOpen\"\n [groupBy]=\"groupBy\"\n [attr.autofocus]=\"autofocus\"\n [selectOnTab]=\"selectOnTabKeyPress\"\n (keydown.tab)=\"onTabKeypress($event)\"\n (change)=\"onValueSelected(selectedItem)\"\n (open)=\"open.emit($event); onDropdownOpen()\"\n (close)=\"onClose($event)\"\n class=\"dr-select\"\n [class.ng-select--no-value-padding]=\"noValuePadding\"\n [class.ng-select--multiple-height-increased]=\"multipleHeightIncreased\"\n #selectComponent>\n <ng-template *ngIf=\"optionHeaderTemplate\" ng-header-tmp let-item=\"item\">\n <ng-container [ngTemplateOutlet]=\"optionHeaderTemplate\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-container>\n </ng-template>\n <ng-template\n ng-header-tmp\n *ngIf=\"!optionHeaderTemplate && isDisplayingSearchInHeader && items?.length >= minItemsToDisplaySearchInHeader\"\n let-item=\"item\">\n <dr-input\n class=\"dr-select__search\"\n [ngModel]=\"selectComponent.searchTerm\"\n (ngModelChange)=\"selectComponent.itemsList.filter($event + '')\"\n type=\"search\">\n </dr-input>\n </ng-template>\n <ng-template *ngIf=\"labelTemplate\" ng-label-tmp let-item=\"item\">\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-container>\n </ng-template>\n <ng-template *ngIf=\"multiLabelTemplate\" ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\">\n <ng-container [ngTemplateOutlet]=\"multiLabelTemplate\" [ngTemplateOutletContext]=\"{ items: items, clear: clear }\">\n </ng-container>\n </ng-template>\n <ng-template *ngIf=\"optionTemplate\" ng-option-tmp let-item=\"item\" let-item$=\"item$\">\n <ng-container [ngTemplateOutlet]=\"optionTemplate\" [ngTemplateOutletContext]=\"{ item: item, item$: item$ }\"></ng-container>\n </ng-template>\n <ng-template *ngIf=\"optionWithDescription\" ng-option-tmp let-item=\"item\">\n <div class=\"dr-select__option-with-desc__wrapper\">\n <div>{{ item.name }}</div>\n <div class=\"dr-select__option-with-desc__description\">{{ item?.description }}</div>\n </div>\n </ng-template>\n <ng-template *ngIf=\"optionFooterTemplate\" ng-footer-tmp let-item=\"item\">\n <ng-container\n [ngTemplateOutlet]=\"optionFooterTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, close: selectComponent.close.bind(selectComponent) }\"></ng-container>\n </ng-template>\n <ng-template *ngIf=\"groupBy\" ng-optgroup-tmp let-item=\"item\">\n {{ item[groupBy] }}\n </ng-template>\n <ng-template ng-loadingspinner-tmp>\n <div\n *ngIf=\"loading\"\n class=\"dr-select__loading\"\n [drSpinner]=\"loading\"\n [drSpinnerType]=\"'circle'\"\n [drSpinnerSize]=\"'small'\"\n [drSpinnerNoOverlay]=\"true\"></div>\n </ng-template>\n</ng-select>\n<i *ngIf=\"type === 'search-input'\" class=\"search-icon dr-icon-search\"></i>\n", styles: [":host{width:100%;height:32px;font-family:Poppins,sans-serif}:host.textView::ng-deep{width:auto}:host.textView::ng-deep ng-select.ng-select .ng-select-container{border:none!important;cursor:pointer}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0;color:#4646ce}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-value-container:hover{text-decoration-line:underline}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none}:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#fff!important;border:none!important;cursor:default}:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}:host.textView::ng-deep ng-select.ng-select.ng-select-disabled .ng-value-container:hover{text-decoration-line:none}:host.no-left-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}:host.no-right-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}:host.no-right-border ::ng-deep ng-select.ng-select .ng-select-container{border-right:none!important}:host.no-left-border ::ng-deep ng-select.ng-select .ng-select-container{border-left:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px;border:1px solid #9ea1aa;box-shadow:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container:hover{border-color:#4646ce}:host ::ng-deep ng-select.ng-select .ng-select-container:focus-within{border-color:#4646ce}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input{font-size:14px;line-height:24px;font-weight:400;top:0!important;padding:0 50px 0 8px!important;color:#333}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input input::placeholder{font-size:14px;line-height:24px;font-weight:400;color:#6d6e6f}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{font-size:14px;line-height:24px;font-weight:400;padding:0 0 0 8px;height:100%;overflow:auto}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{margin-right:7px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow{border:none;width:auto;height:auto;display:flex;text-decoration-line:none;top:0}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:before{font-family:DataRails!important;content:\"\\ea17\";font-size:24px;color:#6d6e6f}:host ::ng-deep ng-select.ng-select.ng-select-opened .ng-select-container{border-radius:6px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{font-size:14px;line-height:24px;font-weight:400;max-height:58px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{font-size:12px;line-height:16px;font-weight:400;color:#333;height:24px;padding:2px 16px;margin:2px 4px 2px 0;background:#f0f1f4;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{padding:0!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0!important;width:20px;display:flex;align-items:center;color:transparent;margin-left:4px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:before{font-family:DataRails!important;content:\"\\ea73\";font-size:20px;color:#333}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon,:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#f0f1f4!important;border:1px solid #aeabac!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#aeabac!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-arrow:before{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-input input::placeholder{color:#aeabac}:host ::ng-deep ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#bf1d30}:host ::ng-deep ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container{max-height:88px}:host ::ng-deep ng-select.ng-select--multiple-height-increased.ng-select-multiple .ng-select-container .ng-value-container{max-height:88px}:host ::ng-deep ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value,:host ::ng-deep ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value{padding:0}:host ::ng-deep ng-select.ng-select--no-value-padding .ng-select-container .ng-value-container .ng-value .ng-select-user-label,:host ::ng-deep ng-select.ng-select--no-value-padding.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-select-user-label{height:100%}:host.ng-invalid.ng-touched::ng-deep ng-select.ng-select .ng-select-container{border-color:#bf1d30}:host .dr-select__loading{position:relative;height:32px;width:24px}:host.search-input{position:relative}:host.search-input .search-icon{position:absolute;top:4px;right:16px;color:#6d6e6f;z-index:1001}:host.search-input::ng-deep ng-select.ng-select .ng-select-container{border-radius:16px}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-arrow-wrapper{display:none!important}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-clear-wrapper{display:flex;justify-content:center;align-items:center;right:40px;top:1px;width:24px;height:24px}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-clear-wrapper .ng-clear{font-size:24px;font-weight:300;color:#6d6e6f}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-input,:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 16px!important;width:calc(100% - 63px)}:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-input input,:host.search-input::ng-deep ng-select.ng-select .ng-select-container .ng-value-container input{height:100%}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select{font-family:Poppins,sans-serif;border:1px solid #dfe0e3;border-radius:4px!important;margin:8px 0;box-shadow:0 4px 8px 1px #00000040;background-color:#fff;overflow:hidden;padding:8px 0}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.textView{width:auto!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px;background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#f5f5f5}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#eaeaff;color:#333}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:400!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled{cursor:default}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div{color:#aeabac}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled>div.dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#aeabac}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]{font-size:14px;line-height:22px;color:#aeabac;cursor:default}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:not(:first-of-type){border-top:1px solid #dfe0e3}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-disabled[role=group]:hover{background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper{color:#333}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:-moz-fit-content;max-width:fit-content;word-break:break-word;white-space:normal;color:#6d6e6f;font-weight:400;font-size:12px;line-height:20px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#6d6e6f}::ng-deep .ng-dropdown-panel--with-search .ng-dropdown-header{border-bottom:none}.custom-backdrop{position:fixed;inset:0;overflow:hidden;pointer-events:none}\n"] }]
|
|
327
327
|
}], function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, { type: [{
|
|
328
328
|
type: Input
|
|
329
329
|
}, {
|
|
@@ -34,11 +34,11 @@ export class DrProgressBarComponent {
|
|
|
34
34
|
i0.ɵɵstyleProp("width", (ctx.progress || 0) + "%");
|
|
35
35
|
i0.ɵɵadvance(3);
|
|
36
36
|
i0.ɵɵproperty("ngIf", ctx.showValue);
|
|
37
|
-
} }, dependencies: [CommonModule, i1.NgIf], styles: ["[_nghost-%COMP%], .progress-bar[_ngcontent-%COMP%]{display:flex;align-items:center;width:100%;gap:8px}__value[_nghost-%COMP%], .progress-bar__value[_ngcontent-%COMP%]{display:flex;align-items:center;color:#6d6e6f;font-
|
|
37
|
+
} }, dependencies: [CommonModule, i1.NgIf], styles: ["[_nghost-%COMP%], .progress-bar[_ngcontent-%COMP%]{display:flex;align-items:center;width:100%;gap:8px}__value[_nghost-%COMP%], .progress-bar__value[_ngcontent-%COMP%]{display:flex;align-items:center;color:#6d6e6f;font-size:14px;line-height:24px;font-weight:400}__background[_nghost-%COMP%], .progress-bar__background[_ngcontent-%COMP%]{display:flex;flex-grow:1;position:relative;height:4px;background:#f0f1f4;border-radius:20px}__background__fill[_nghost-%COMP%], .progress-bar__background__fill[_ngcontent-%COMP%]{transition:all .5s;position:absolute;left:0;top:0;width:0;height:100%;background:#7f7fdd;border-radius:20px}"] }); }
|
|
38
38
|
}
|
|
39
39
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrProgressBarComponent, [{
|
|
40
40
|
type: Component,
|
|
41
|
-
args: [{ selector: 'dr-progress-bar', standalone: true, imports: [CommonModule], template: "<div class=\"progress-bar__background\">\n <div class=\"progress-bar__background__fill\" [style.width]=\"(progress || 0) + '%'\"></div>\n</div>\n<span class=\"progress-bar__value\">\n <ng-content></ng-content>\n <ng-container *ngIf=\"showValue\">{{ progress || 0 }}%</ng-container>\n</span>\n", styles: [":host,.progress-bar{display:flex;align-items:center;width:100%;gap:8px}:host__value,.progress-bar__value{display:flex;align-items:center;color:#6d6e6f;font-
|
|
41
|
+
args: [{ selector: 'dr-progress-bar', standalone: true, imports: [CommonModule], template: "<div class=\"progress-bar__background\">\n <div class=\"progress-bar__background__fill\" [style.width]=\"(progress || 0) + '%'\"></div>\n</div>\n<span class=\"progress-bar__value\">\n <ng-content></ng-content>\n <ng-container *ngIf=\"showValue\">{{ progress || 0 }}%</ng-container>\n</span>\n", styles: [":host,.progress-bar{display:flex;align-items:center;width:100%;gap:8px}:host__value,.progress-bar__value{display:flex;align-items:center;color:#6d6e6f;font-size:14px;line-height:24px;font-weight:400}:host__background,.progress-bar__background{display:flex;flex-grow:1;position:relative;height:4px;background:#f0f1f4;border-radius:20px}:host__background__fill,.progress-bar__background__fill{transition:all .5s;position:absolute;left:0;top:0;width:0;height:100%;background:#7f7fdd;border-radius:20px}\n"] }]
|
|
42
42
|
}], null, { progress: [{
|
|
43
43
|
type: Input,
|
|
44
44
|
args: [{ required: true }]
|
|
@@ -60,11 +60,11 @@ export class DefaultToastrComponent extends Toast {
|
|
|
60
60
|
i0.ɵɵtextInterpolate1(" ", ctx.data.title, " ");
|
|
61
61
|
i0.ɵɵadvance(1);
|
|
62
62
|
i0.ɵɵproperty("ngIf", !ctx.data.isHtmlBody)("ngIfElse", _r1);
|
|
63
|
-
} }, dependencies: [i2.NgClass, i2.NgIf], styles: [".toastr-bottom-left{left:24px!important;bottom:24px!important} dr-default-toastr:not(:last-child){margin-bottom:24px!important}.ngx-toastr[_nghost-%COMP%]{display:flex;flex-direction:column;background:#fff;position:relative;overflow:hidden;pointer-events:auto;min-width:280px;max-width:480px;width:-moz-fit-content;width:fit-content;border-radius:6px;padding:0;margin:0;box-shadow:0 4px 14px #00000040}.ngx-toastr[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{display:flex;width:100%;height:5px}.ngx-toastr[_nghost-%COMP%] .content[_ngcontent-%COMP%]{display:flex;flex-grow:1;padding:12px 16px}.ngx-toastr[_nghost-%COMP%] .content__close-icon[_ngcontent-%COMP%]{color:#6d6e6f;cursor:pointer}.ngx-toastr[_nghost-%COMP%] .content__container[_ngcontent-%COMP%]{display:flex;flex-direction:column;flex-grow:1;padding:0 4px}.ngx-toastr[_nghost-%COMP%] .content__container__title[_ngcontent-%COMP%], .ngx-toastr[_nghost-%COMP%] .content__container__message[_ngcontent-%COMP%]{color:#333;word-break:break-word}.ngx-toastr[_nghost-%COMP%] .content__container__title[_ngcontent-%COMP%]{font-
|
|
63
|
+
} }, dependencies: [i2.NgClass, i2.NgIf], styles: [".toastr-bottom-left{left:24px!important;bottom:24px!important} dr-default-toastr:not(:last-child){margin-bottom:24px!important}.ngx-toastr[_nghost-%COMP%]{display:flex;flex-direction:column;background:#fff;position:relative;overflow:hidden;pointer-events:auto;min-width:280px;max-width:480px;width:-moz-fit-content;width:fit-content;border-radius:6px;padding:0;margin:0;box-shadow:0 4px 14px #00000040}.ngx-toastr[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{display:flex;width:100%;height:5px}.ngx-toastr[_nghost-%COMP%] .content[_ngcontent-%COMP%]{display:flex;flex-grow:1;padding:12px 16px}.ngx-toastr[_nghost-%COMP%] .content__close-icon[_ngcontent-%COMP%]{color:#6d6e6f;cursor:pointer}.ngx-toastr[_nghost-%COMP%] .content__container[_ngcontent-%COMP%]{display:flex;flex-direction:column;flex-grow:1;padding:0 4px}.ngx-toastr[_nghost-%COMP%] .content__container__title[_ngcontent-%COMP%], .ngx-toastr[_nghost-%COMP%] .content__container__message[_ngcontent-%COMP%]{color:#333;word-break:break-word}.ngx-toastr[_nghost-%COMP%] .content__container__title[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:600}.ngx-toastr[_nghost-%COMP%] .content__container__message[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400}.ngx-toastr[_nghost-%COMP%] .content__container__message[_ngcontent-%COMP%] a[_ngcontent-%COMP%]{text-decoration:underline!important}.ngx-toastr.status-success[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{background-color:#03a678}.ngx-toastr.status-success[_nghost-%COMP%] .content__status-icon[_ngcontent-%COMP%]{color:#03a678}.ngx-toastr.status-info[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{background-color:#0061ff}.ngx-toastr.status-info[_nghost-%COMP%] .content__status-icon[_ngcontent-%COMP%]{color:#0061ff}.ngx-toastr.status-warning[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{background-color:#fda014}.ngx-toastr.status-warning[_nghost-%COMP%] .content__status-icon[_ngcontent-%COMP%]{color:#fda014}.ngx-toastr.status-danger[_nghost-%COMP%] .status-bar[_ngcontent-%COMP%]{background-color:#de2833}.ngx-toastr.status-danger[_nghost-%COMP%] .content__status-icon[_ngcontent-%COMP%]{color:#de2833}"], changeDetection: 0 }); }
|
|
64
64
|
}
|
|
65
65
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DefaultToastrComponent, [{
|
|
66
66
|
type: Component,
|
|
67
|
-
args: [{ selector: 'dr-default-toastr', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"status-bar\"></div>\n<div class=\"content\">\n <i class=\"content__status-icon\" [ngClass]=\"icon\"></i>\n <div class=\"content__container\">\n <span class=\"content__container__title\">\n {{ data.title }}\n </span>\n\n <div class=\"content__container__message\" *ngIf=\"!data.isHtmlBody; else htmlBody\">\n {{ data.message }}\n </div>\n\n <ng-template #htmlBody>\n <div class=\"content__container__message\" [innerHTML]=\"data.message\"></div>\n </ng-template>\n </div>\n <i class=\"content__close-icon dr-icon-exit\"></i>\n</div>\n", styles: ["::ng-deep .toastr-bottom-left{left:24px!important;bottom:24px!important}::ng-deep dr-default-toastr:not(:last-child){margin-bottom:24px!important}:host.ngx-toastr{display:flex;flex-direction:column;background:#fff;position:relative;overflow:hidden;pointer-events:auto;min-width:280px;max-width:480px;width:-moz-fit-content;width:fit-content;border-radius:6px;padding:0;margin:0;box-shadow:0 4px 14px #00000040}:host.ngx-toastr .status-bar{display:flex;width:100%;height:5px}:host.ngx-toastr .content{display:flex;flex-grow:1;padding:12px 16px}:host.ngx-toastr .content__close-icon{color:#6d6e6f;cursor:pointer}:host.ngx-toastr .content__container{display:flex;flex-direction:column;flex-grow:1;padding:0 4px}:host.ngx-toastr .content__container__title,:host.ngx-toastr .content__container__message{color:#333;word-break:break-word}:host.ngx-toastr .content__container__title{font-
|
|
67
|
+
args: [{ selector: 'dr-default-toastr', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"status-bar\"></div>\n<div class=\"content\">\n <i class=\"content__status-icon\" [ngClass]=\"icon\"></i>\n <div class=\"content__container\">\n <span class=\"content__container__title\">\n {{ data.title }}\n </span>\n\n <div class=\"content__container__message\" *ngIf=\"!data.isHtmlBody; else htmlBody\">\n {{ data.message }}\n </div>\n\n <ng-template #htmlBody>\n <div class=\"content__container__message\" [innerHTML]=\"data.message\"></div>\n </ng-template>\n </div>\n <i class=\"content__close-icon dr-icon-exit\"></i>\n</div>\n", styles: ["::ng-deep .toastr-bottom-left{left:24px!important;bottom:24px!important}::ng-deep dr-default-toastr:not(:last-child){margin-bottom:24px!important}:host.ngx-toastr{display:flex;flex-direction:column;background:#fff;position:relative;overflow:hidden;pointer-events:auto;min-width:280px;max-width:480px;width:-moz-fit-content;width:fit-content;border-radius:6px;padding:0;margin:0;box-shadow:0 4px 14px #00000040}:host.ngx-toastr .status-bar{display:flex;width:100%;height:5px}:host.ngx-toastr .content{display:flex;flex-grow:1;padding:12px 16px}:host.ngx-toastr .content__close-icon{color:#6d6e6f;cursor:pointer}:host.ngx-toastr .content__container{display:flex;flex-direction:column;flex-grow:1;padding:0 4px}:host.ngx-toastr .content__container__title,:host.ngx-toastr .content__container__message{color:#333;word-break:break-word}:host.ngx-toastr .content__container__title{font-size:14px;line-height:24px;font-weight:600}:host.ngx-toastr .content__container__message{font-size:14px;line-height:24px;font-weight:400}:host.ngx-toastr .content__container__message a{text-decoration:underline!important}:host.ngx-toastr.status-success .status-bar{background-color:#03a678}:host.ngx-toastr.status-success .content__status-icon{color:#03a678}:host.ngx-toastr.status-info .status-bar{background-color:#0061ff}:host.ngx-toastr.status-info .content__status-icon{color:#0061ff}:host.ngx-toastr.status-warning .status-bar{background-color:#fda014}:host.ngx-toastr.status-warning .content__status-icon{color:#fda014}:host.ngx-toastr.status-danger .status-bar{background-color:#de2833}:host.ngx-toastr.status-danger .content__status-icon{color:#de2833}\n"] }]
|
|
68
68
|
}], function () { return [{ type: i1.ToastrService }, { type: i1.ToastPackage }]; }, { class: [{
|
|
69
69
|
type: HostBinding,
|
|
70
70
|
args: ['class']
|
|
@@ -15,11 +15,11 @@ export class TooltipDefaultComponent {
|
|
|
15
15
|
i0.ɵɵprojection(1);
|
|
16
16
|
} if (rf & 2) {
|
|
17
17
|
i0.ɵɵproperty("innerHTML", ctx.content, i0.ɵɵsanitizeHtml);
|
|
18
|
-
} }, styles: ["[_nghost-%COMP%]{
|
|
18
|
+
} }, styles: ["[_nghost-%COMP%]{font-size:12px;line-height:16px;font-weight:400;display:flex;padding:6px 8px;white-space:pre;text-overflow:ellipsis;overflow:hidden}[_nghost-%COMP%] .content[_ngcontent-%COMP%]:empty{display:none}.dark[_nghost-%COMP%]{font-size:12px;line-height:16px;font-weight:400;padding:6px 8px}[_nghost-%COMP%] a{color:#4646ce}[_nghost-%COMP%] a:hover{cursor:pointer;text-decoration:underline!important}"], changeDetection: 0 }); }
|
|
19
19
|
}
|
|
20
20
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TooltipDefaultComponent, [{
|
|
21
21
|
type: Component,
|
|
22
|
-
args: [{ selector: 'dr-tooltip-default', template: '<span class="content" [innerHTML]="content"></span><ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{
|
|
22
|
+
args: [{ selector: 'dr-tooltip-default', template: '<span class="content" [innerHTML]="content"></span><ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{font-size:12px;line-height:16px;font-weight:400;display:flex;padding:6px 8px;white-space:pre;text-overflow:ellipsis;overflow:hidden}:host .content:empty{display:none}:host.dark{font-size:12px;line-height:16px;font-weight:400;padding:6px 8px}:host::ng-deep a{color:#4646ce}:host::ng-deep a:hover{cursor:pointer;text-decoration:underline!important}\n"] }]
|
|
23
23
|
}], null, { content: [{
|
|
24
24
|
type: Input
|
|
25
25
|
}], theme: [{
|
|
@@ -71,11 +71,11 @@ export class TooltipInfoComponent {
|
|
|
71
71
|
i0.ɵɵproperty("ngIf", (ctx.data == null ? null : ctx.data.title) && (ctx.data == null ? null : ctx.data.description) && !(ctx.data == null ? null : ctx.data.hideDivider));
|
|
72
72
|
i0.ɵɵadvance(1);
|
|
73
73
|
i0.ɵɵproperty("ngIf", ctx.data == null ? null : ctx.data.description);
|
|
74
|
-
} }, dependencies: [i1.NgClass, i1.NgIf], styles: [".tooltip-info[_ngcontent-%COMP%]{width:auto;display:flex;padding:10px 12px}.tooltip-info__icon[_ngcontent-%COMP%]{position:relative;padding-right:8px;color:#0b5af9}.tooltip-info__icon.info[_ngcontent-%COMP%]{color:#0b5af9}.tooltip-info__icon.success[_ngcontent-%COMP%]{color:#037c5a}.tooltip-info__icon.warning[_ngcontent-%COMP%]{color:#9e5f00}.tooltip-info__icon.error[_ngcontent-%COMP%]{color:#bf1d30}.tooltip-info__content[_ngcontent-%COMP%]{display:flex;flex-direction:column}.tooltip-info__content__header[_ngcontent-%COMP%]{font-
|
|
74
|
+
} }, dependencies: [i1.NgClass, i1.NgIf], styles: [".tooltip-info[_ngcontent-%COMP%]{width:auto;display:flex;padding:10px 12px}.tooltip-info__icon[_ngcontent-%COMP%]{position:relative;padding-right:8px;color:#0b5af9}.tooltip-info__icon.info[_ngcontent-%COMP%]{color:#0b5af9}.tooltip-info__icon.success[_ngcontent-%COMP%]{color:#037c5a}.tooltip-info__icon.warning[_ngcontent-%COMP%]{color:#9e5f00}.tooltip-info__icon.error[_ngcontent-%COMP%]{color:#bf1d30}.tooltip-info__content[_ngcontent-%COMP%]{display:flex;flex-direction:column}.tooltip-info__content__header[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:600}.tooltip-info__content__divider[_ngcontent-%COMP%]{width:100%;margin:8px 0;border-top:1px solid #dfe0e3}.tooltip-info__content__description[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400}.tooltip-info__content__description[_ngcontent-%COMP%] ul[_ngcontent-%COMP%]{padding:0}.tooltip-info__content__description[_ngcontent-%COMP%] ul[_ngcontent-%COMP%] > li[_ngcontent-%COMP%]{list-style-position:inside;list-style-type:disc}"], changeDetection: 0 }); }
|
|
75
75
|
}
|
|
76
76
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TooltipInfoComponent, [{
|
|
77
77
|
type: Component,
|
|
78
|
-
args: [{ selector: 'dr-tooltip-info', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"tooltip-info\" [style.min-width]=\"data?.minWidth\" [style.max-width]=\"data?.maxWidth\">\n <div *ngIf=\"!data?.hideIcon\" class=\"tooltip-info__icon\" [ngClass]=\"data?.iconTheme\">\n <i [ngClass]=\"data?.icon || 'dr-icon-noty-notification'\"></i>\n </div>\n <div class=\"tooltip-info__content\">\n <div *ngIf=\"data?.title\" class=\"tooltip-info__content__header\">\n <span>{{ data.title }}</span>\n </div>\n <div *ngIf=\"data?.title && data?.description && !data?.hideDivider\" class=\"tooltip-info__content__divider\"></div>\n <div *ngIf=\"data?.description\" class=\"tooltip-info__content__description\">\n <span *ngIf=\"!data.useDescriptionAsHTML\">{{ data.description }}</span>\n <div *ngIf=\"data.useDescriptionAsHTML\" [innerHTML]=\"data.description\"></div>\n </div>\n </div>\n</div>\n", styles: [".tooltip-info{width:auto;display:flex;padding:10px 12px}.tooltip-info__icon{position:relative;padding-right:8px;color:#0b5af9}.tooltip-info__icon.info{color:#0b5af9}.tooltip-info__icon.success{color:#037c5a}.tooltip-info__icon.warning{color:#9e5f00}.tooltip-info__icon.error{color:#bf1d30}.tooltip-info__content{display:flex;flex-direction:column}.tooltip-info__content__header{font-
|
|
78
|
+
args: [{ selector: 'dr-tooltip-info', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"tooltip-info\" [style.min-width]=\"data?.minWidth\" [style.max-width]=\"data?.maxWidth\">\n <div *ngIf=\"!data?.hideIcon\" class=\"tooltip-info__icon\" [ngClass]=\"data?.iconTheme\">\n <i [ngClass]=\"data?.icon || 'dr-icon-noty-notification'\"></i>\n </div>\n <div class=\"tooltip-info__content\">\n <div *ngIf=\"data?.title\" class=\"tooltip-info__content__header\">\n <span>{{ data.title }}</span>\n </div>\n <div *ngIf=\"data?.title && data?.description && !data?.hideDivider\" class=\"tooltip-info__content__divider\"></div>\n <div *ngIf=\"data?.description\" class=\"tooltip-info__content__description\">\n <span *ngIf=\"!data.useDescriptionAsHTML\">{{ data.description }}</span>\n <div *ngIf=\"data.useDescriptionAsHTML\" [innerHTML]=\"data.description\"></div>\n </div>\n </div>\n</div>\n", styles: [".tooltip-info{width:auto;display:flex;padding:10px 12px}.tooltip-info__icon{position:relative;padding-right:8px;color:#0b5af9}.tooltip-info__icon.info{color:#0b5af9}.tooltip-info__icon.success{color:#037c5a}.tooltip-info__icon.warning{color:#9e5f00}.tooltip-info__icon.error{color:#bf1d30}.tooltip-info__content{display:flex;flex-direction:column}.tooltip-info__content__header{font-size:14px;line-height:24px;font-weight:600}.tooltip-info__content__divider{width:100%;margin:8px 0;border-top:1px solid #dfe0e3}.tooltip-info__content__description{font-size:14px;line-height:24px;font-weight:400}.tooltip-info__content__description ul{padding:0}.tooltip-info__content__description ul>li{list-style-position:inside;list-style-type:disc}\n"] }]
|
|
79
79
|
}], function () { return []; }, { data: [{
|
|
80
80
|
type: Input
|
|
81
81
|
}] }); })();
|
|
@@ -368,7 +368,7 @@ export class FilterDropdownComponent {
|
|
|
368
368
|
i0.ɵɵproperty("ngIf", ctx.hasSelection)("ngIfElse", _r3);
|
|
369
369
|
} }, dependencies: [CommonModule, i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.SlicePipe, DrPopoverModule, i2.DrPopoverDirective, DrDropdownModule, i3.DrDropdownComponent, i4.DrDropdownItemComponent, DrInputsModule, i5.CheckboxComponent, i6.DrInputComponent, i7.DrButtonComponent, SearchPipe,
|
|
370
370
|
FormsModule, i8.NgControlStatus, i8.NgModel, LetDirective,
|
|
371
|
-
AutofocusDirective], styles: [".filter-value[_ngcontent-%COMP%]{font-weight:600}.filter-value-all[_ngcontent-%COMP%]{font-weight:400}.dropdown__wrapper[_ngcontent-%COMP%]{min-width:250px;padding:8px 0 0}.dropdown__wrapper[_ngcontent-%COMP%] .dr-dropdown__container{padding:0;max-height:none;overflow:visible}.dropdown__wrapper[_ngcontent-%COMP%] .dr-dropdown-item.item-disabled{cursor:not-allowed}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list[_ngcontent-%COMP%]{overflow:auto;display:block;max-height:180px}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item[_ngcontent-%COMP%]{margin-bottom:4px}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item[_ngcontent-%COMP%] .dr-dropdown-item{padding:4px 16px;height:auto}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item[_ngcontent-%COMP%] .dr-dropdown-item .text-ellipsis{text-overflow:ellipsis;overflow:hidden}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item-checkbox[_ngcontent-%COMP%]{margin-right:4px;pointer-events:none}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item-checkbox[_ngcontent-%COMP%] label input+span{margin:0}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item-checkbox[_ngcontent-%COMP%] label input+span:before{margin:3px}.dropdown__search[_ngcontent-%COMP%]{padding:4px 8px}.dropdown__header[_ngcontent-%COMP%]{display:flex;align-items:center;margin:2px 0;padding:4px 16px;
|
|
371
|
+
AutofocusDirective], styles: [".filter-value[_ngcontent-%COMP%]{font-weight:600}.filter-value-all[_ngcontent-%COMP%]{font-weight:400}.dropdown__wrapper[_ngcontent-%COMP%]{min-width:250px;padding:8px 0 0}.dropdown__wrapper[_ngcontent-%COMP%] .dr-dropdown__container{padding:0;max-height:none;overflow:visible}.dropdown__wrapper[_ngcontent-%COMP%] .dr-dropdown-item.item-disabled{cursor:not-allowed}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list[_ngcontent-%COMP%]{overflow:auto;display:block;max-height:180px}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item[_ngcontent-%COMP%]{margin-bottom:4px}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item[_ngcontent-%COMP%] .dr-dropdown-item{padding:4px 16px;height:auto}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item[_ngcontent-%COMP%] .dr-dropdown-item .text-ellipsis{text-overflow:ellipsis;overflow:hidden}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item-checkbox[_ngcontent-%COMP%]{margin-right:4px;pointer-events:none}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item-checkbox[_ngcontent-%COMP%] label input+span{margin:0}.dropdown__wrapper[_ngcontent-%COMP%] .dr-filter-list__item-checkbox[_ngcontent-%COMP%] label input+span:before{margin:3px}.dropdown__search[_ngcontent-%COMP%]{padding:4px 8px}.dropdown__header[_ngcontent-%COMP%]{font-size:12px;line-height:16px;font-weight:400;display:flex;align-items:center;margin:2px 0;padding:4px 16px;white-space:nowrap}.dropdown__header-title[_ngcontent-%COMP%]{flex-grow:1;overflow:hidden;text-overflow:ellipsis;color:#6d6e6f;text-transform:uppercase}.dropdown__header-select-all[_ngcontent-%COMP%]{color:#4646ce;margin-left:8px}.dropdown__actions[_ngcontent-%COMP%]{gap:8px;padding:8px 16px;display:flex;justify-content:flex-end;border-top:1px solid #dbdee3}.dropdown__no-result[_ngcontent-%COMP%]{padding:4px 16px 16px}"], changeDetection: 0 }); }
|
|
372
372
|
}
|
|
373
373
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FilterDropdownComponent, [{
|
|
374
374
|
type: Component,
|
|
@@ -382,7 +382,7 @@ export class FilterDropdownComponent {
|
|
|
382
382
|
LetDirective,
|
|
383
383
|
AutofocusDirective,
|
|
384
384
|
DrButtonComponent,
|
|
385
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<dr-button\n theme=\"dropdown\"\n iconAfter=\"dr-icon-arrow-down\"\n iconAfterSize=\"18\"\n [drPopover]=\"popover\"\n (drPopoverClose)=\"onPopoverClose()\"\n (click)=\"$event.stopPropagation()\"\n [isActive]=\"hasSelection\"\n [disabled]=\"disabled\"\n [drPopoverPosition]=\"dropdownPosition\">\n {{ label }}:\n\n <span class=\"filter-value\">\n <ng-container *ngIf=\"hasSelection; else noSelection\">\n <ng-container *ngIf=\"selectedArr.length <= showManyLimit; else manyTemplate\">\n <ng-container *ngFor=\"let item of selectedArr | slice: 0 : showInLabelLimit; let i = index\">\n <ng-container *ngIf=\"i\">,</ng-container>\n <ng-container\n [ngTemplateOutlet]=\"labelItemTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\">\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"selectedArr.length > showInLabelLimit\">\n + {{ selectedArr.length - showInLabelLimit }}</ng-container\n >\n </ng-container>\n </ng-container>\n </span>\n <ng-template #manyTemplate>Many</ng-template>\n <ng-template #noSelection>\n <ng-container *ngIf=\"useNoneTemplate && !isSelectedAll; else allTemplate\">\n <span class=\"filter-value-all\">None</span>\n </ng-container>\n </ng-template>\n <ng-template #allTemplate><span class=\"filter-value-all\">All</span></ng-template>\n <ng-template #defaultLabelTemplate let-item>{{ _item(item) }}</ng-template>\n</dr-button>\n\n<ng-template #popover let-close=\"closePopover\">\n <div\n class=\"dropdown__wrapper\"\n [ngClass]=\"dropdownClass\"\n tabindex=\"0\"\n *ngLet=\"items | search: search : searchBy as filteredItems\">\n <div class=\"dropdown__search\" *ngIf=\"showSearch\">\n <dr-input\n data-analytics=\"filter-dropdown_input-0\"\n drAutofocus\n #searchRef\n [class.with-value]=\"search\"\n type=\"search\"\n tabindex=\"0\"\n placeholder=\"Search\"\n [clearable]=\"true\"\n [(ngModel)]=\"search\" />\n </div>\n\n <div class=\"dropdown__header\">\n <div class=\"dropdown__header-title\">Filter by {{ label }}</div>\n <a *ngIf=\"showSelectAll\" href=\"javascript: void(0)\" (click)=\"onSelectAll()\" class=\"dropdown__header-select-all\">{{\n isSelectedAll ? 'Select none' : 'Select all'\n }}</a>\n </div>\n\n <dr-dropdown class=\"dr-filter-list\" *ngIf=\"filteredItems.length; else noDataPlaceholder\" tabindex=\"0\">\n <dr-dropdown-item\n *ngFor=\"let item of filteredItems; trackBy: trackByFn\"\n class=\"dr-filter-list__item\"\n [selected]=\"isSelected(item)\"\n [disabled]=\"item.disabled\"\n tabindex=\"0\"\n #itemRef\n (keyup.enter)=\"!itemRef.selected && selectedChange.emit(item)\"\n (click)=\"!itemRef.disabled && onSelectedItemChanged(item, itemRef.selected, close)\">\n <ng-container dropdownItemContent>\n <dr-checkbox\n data-analytics=\"filter-dropdown_checkbox-0\"\n *ngIf=\"multiple\"\n class=\"dr-filter-list__item-checkbox\"\n [checkedStatus]=\"itemRef.selected\"\n [disabled]=\"item.disabled\" />\n <ng-container dropdownItemContent>\n <ng-container\n [ngTemplateOutlet]=\"dropdownItemTemplate || defaultDropdownItemTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </ng-container>\n\n <ng-template #defaultDropdownItemTemplate>\n <span class=\"text-ellipsis\">\n {{ _item(item) }}\n </span>\n </ng-template>\n </ng-container>\n </dr-dropdown-item>\n </dr-dropdown>\n\n <ng-template #noDataPlaceholder>\n <div class=\"dropdown__no-result\" *ngIf=\"noItemsPlaceholder\">\n {{ noItemsPlaceholder }}\n </div>\n </ng-template>\n\n <div *ngIf=\"multiple\" class=\"dropdown__actions\">\n <dr-button\n *ngIf=\"clearable && hasSelection\"\n theme=\"secondary\"\n data-analytics=\"filter-dropdown_button-1\"\n class=\"dropdown__clear\"\n (click)=\"onClear(close)\">\n Clear\n </dr-button>\n <dr-button data-analytics=\"filter-dropdown_button-0\" (click)=\"onApply(close)\">Apply</dr-button>\n </div>\n </div>\n</ng-template>\n", styles: [".filter-value{font-weight:600}.filter-value-all{font-weight:400}.dropdown__wrapper{min-width:250px;padding:8px 0 0}.dropdown__wrapper::ng-deep .dr-dropdown__container{padding:0;max-height:none;overflow:visible}.dropdown__wrapper::ng-deep .dr-dropdown-item.item-disabled{cursor:not-allowed}.dropdown__wrapper .dr-filter-list{overflow:auto;display:block;max-height:180px}.dropdown__wrapper .dr-filter-list__item{margin-bottom:4px}.dropdown__wrapper .dr-filter-list__item::ng-deep .dr-dropdown-item{padding:4px 16px;height:auto}.dropdown__wrapper .dr-filter-list__item::ng-deep .dr-dropdown-item .text-ellipsis{text-overflow:ellipsis;overflow:hidden}.dropdown__wrapper .dr-filter-list__item-checkbox{margin-right:4px;pointer-events:none}.dropdown__wrapper .dr-filter-list__item-checkbox::ng-deep label input+span{margin:0}.dropdown__wrapper .dr-filter-list__item-checkbox::ng-deep label input+span:before{margin:3px}.dropdown__search{padding:4px 8px}.dropdown__header{display:flex;align-items:center;margin:2px 0;padding:4px 16px;
|
|
385
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<dr-button\n theme=\"dropdown\"\n iconAfter=\"dr-icon-arrow-down\"\n iconAfterSize=\"18\"\n [drPopover]=\"popover\"\n (drPopoverClose)=\"onPopoverClose()\"\n (click)=\"$event.stopPropagation()\"\n [isActive]=\"hasSelection\"\n [disabled]=\"disabled\"\n [drPopoverPosition]=\"dropdownPosition\">\n {{ label }}:\n\n <span class=\"filter-value\">\n <ng-container *ngIf=\"hasSelection; else noSelection\">\n <ng-container *ngIf=\"selectedArr.length <= showManyLimit; else manyTemplate\">\n <ng-container *ngFor=\"let item of selectedArr | slice: 0 : showInLabelLimit; let i = index\">\n <ng-container *ngIf=\"i\">,</ng-container>\n <ng-container\n [ngTemplateOutlet]=\"labelItemTemplate || defaultLabelTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\">\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"selectedArr.length > showInLabelLimit\">\n + {{ selectedArr.length - showInLabelLimit }}</ng-container\n >\n </ng-container>\n </ng-container>\n </span>\n <ng-template #manyTemplate>Many</ng-template>\n <ng-template #noSelection>\n <ng-container *ngIf=\"useNoneTemplate && !isSelectedAll; else allTemplate\">\n <span class=\"filter-value-all\">None</span>\n </ng-container>\n </ng-template>\n <ng-template #allTemplate><span class=\"filter-value-all\">All</span></ng-template>\n <ng-template #defaultLabelTemplate let-item>{{ _item(item) }}</ng-template>\n</dr-button>\n\n<ng-template #popover let-close=\"closePopover\">\n <div\n class=\"dropdown__wrapper\"\n [ngClass]=\"dropdownClass\"\n tabindex=\"0\"\n *ngLet=\"items | search: search : searchBy as filteredItems\">\n <div class=\"dropdown__search\" *ngIf=\"showSearch\">\n <dr-input\n data-analytics=\"filter-dropdown_input-0\"\n drAutofocus\n #searchRef\n [class.with-value]=\"search\"\n type=\"search\"\n tabindex=\"0\"\n placeholder=\"Search\"\n [clearable]=\"true\"\n [(ngModel)]=\"search\" />\n </div>\n\n <div class=\"dropdown__header\">\n <div class=\"dropdown__header-title\">Filter by {{ label }}</div>\n <a *ngIf=\"showSelectAll\" href=\"javascript: void(0)\" (click)=\"onSelectAll()\" class=\"dropdown__header-select-all\">{{\n isSelectedAll ? 'Select none' : 'Select all'\n }}</a>\n </div>\n\n <dr-dropdown class=\"dr-filter-list\" *ngIf=\"filteredItems.length; else noDataPlaceholder\" tabindex=\"0\">\n <dr-dropdown-item\n *ngFor=\"let item of filteredItems; trackBy: trackByFn\"\n class=\"dr-filter-list__item\"\n [selected]=\"isSelected(item)\"\n [disabled]=\"item.disabled\"\n tabindex=\"0\"\n #itemRef\n (keyup.enter)=\"!itemRef.selected && selectedChange.emit(item)\"\n (click)=\"!itemRef.disabled && onSelectedItemChanged(item, itemRef.selected, close)\">\n <ng-container dropdownItemContent>\n <dr-checkbox\n data-analytics=\"filter-dropdown_checkbox-0\"\n *ngIf=\"multiple\"\n class=\"dr-filter-list__item-checkbox\"\n [checkedStatus]=\"itemRef.selected\"\n [disabled]=\"item.disabled\" />\n <ng-container dropdownItemContent>\n <ng-container\n [ngTemplateOutlet]=\"dropdownItemTemplate || defaultDropdownItemTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </ng-container>\n\n <ng-template #defaultDropdownItemTemplate>\n <span class=\"text-ellipsis\">\n {{ _item(item) }}\n </span>\n </ng-template>\n </ng-container>\n </dr-dropdown-item>\n </dr-dropdown>\n\n <ng-template #noDataPlaceholder>\n <div class=\"dropdown__no-result\" *ngIf=\"noItemsPlaceholder\">\n {{ noItemsPlaceholder }}\n </div>\n </ng-template>\n\n <div *ngIf=\"multiple\" class=\"dropdown__actions\">\n <dr-button\n *ngIf=\"clearable && hasSelection\"\n theme=\"secondary\"\n data-analytics=\"filter-dropdown_button-1\"\n class=\"dropdown__clear\"\n (click)=\"onClear(close)\">\n Clear\n </dr-button>\n <dr-button data-analytics=\"filter-dropdown_button-0\" (click)=\"onApply(close)\">Apply</dr-button>\n </div>\n </div>\n</ng-template>\n", styles: [".filter-value{font-weight:600}.filter-value-all{font-weight:400}.dropdown__wrapper{min-width:250px;padding:8px 0 0}.dropdown__wrapper::ng-deep .dr-dropdown__container{padding:0;max-height:none;overflow:visible}.dropdown__wrapper::ng-deep .dr-dropdown-item.item-disabled{cursor:not-allowed}.dropdown__wrapper .dr-filter-list{overflow:auto;display:block;max-height:180px}.dropdown__wrapper .dr-filter-list__item{margin-bottom:4px}.dropdown__wrapper .dr-filter-list__item::ng-deep .dr-dropdown-item{padding:4px 16px;height:auto}.dropdown__wrapper .dr-filter-list__item::ng-deep .dr-dropdown-item .text-ellipsis{text-overflow:ellipsis;overflow:hidden}.dropdown__wrapper .dr-filter-list__item-checkbox{margin-right:4px;pointer-events:none}.dropdown__wrapper .dr-filter-list__item-checkbox::ng-deep label input+span{margin:0}.dropdown__wrapper .dr-filter-list__item-checkbox::ng-deep label input+span:before{margin:3px}.dropdown__search{padding:4px 8px}.dropdown__header{font-size:12px;line-height:16px;font-weight:400;display:flex;align-items:center;margin:2px 0;padding:4px 16px;white-space:nowrap}.dropdown__header-title{flex-grow:1;overflow:hidden;text-overflow:ellipsis;color:#6d6e6f;text-transform:uppercase}.dropdown__header-select-all{color:#4646ce;margin-left:8px}.dropdown__actions{gap:8px;padding:8px 16px;display:flex;justify-content:flex-end;border-top:1px solid #dbdee3}.dropdown__no-result{padding:4px 16px 16px}\n"] }]
|
|
386
386
|
}], null, { dropdownItemTemplate: [{
|
|
387
387
|
type: ContentChild,
|
|
388
388
|
args: ['dropdownItemTemplate', { read: TemplateRef }]
|
|
@@ -97,11 +97,11 @@ export class SeparateTableComponent {
|
|
|
97
97
|
i0.ɵɵattribute("aria-rowcount", ctx.rows.length);
|
|
98
98
|
i0.ɵɵadvance(2);
|
|
99
99
|
i0.ɵɵproperty("ngForOf", ctx.rows)("ngForTrackBy", ctx.trackByFn);
|
|
100
|
-
} }, dependencies: [CommonModule, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle], styles: ["[_nghost-%COMP%]{display:block}[_nghost-%COMP%] .table[_ngcontent-%COMP%]{display:flex;flex-direction:column}[_nghost-%COMP%] .table__rows[_ngcontent-%COMP%]{display:flex;flex-direction:column;gap:16px}[_nghost-%COMP%] .table__header[_ngcontent-%COMP%]{
|
|
100
|
+
} }, dependencies: [CommonModule, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle], styles: ["[_nghost-%COMP%]{display:block}[_nghost-%COMP%] .table[_ngcontent-%COMP%]{display:flex;flex-direction:column}[_nghost-%COMP%] .table__rows[_ngcontent-%COMP%]{display:flex;flex-direction:column;gap:16px}[_nghost-%COMP%] .table__header[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400;display:flex;align-items:center;text-align:left;color:#6d6e6f}[_nghost-%COMP%] .table__col[_ngcontent-%COMP%]{padding:6px 24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}[_nghost-%COMP%] .table__item[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400;display:flex;align-items:center;border:1px solid #dfe0e3;border-radius:12px;background-color:#fff;color:#333;transition:background-color .2s ease-in;cursor:pointer}[_nghost-%COMP%] .table__item[_ngcontent-%COMP%]:hover{background-color:#f5f5f5}[_nghost-%COMP%] .table__cell[_ngcontent-%COMP%]{padding:12px 24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}[_nghost-%COMP%] .table__cell[_ngcontent-%COMP%]:last-child{padding-right:18px;padding-left:0}[_nghost-%COMP%] .table__cell[_ngcontent-%COMP%]:first-child{padding-left:24px}"], changeDetection: 0 }); }
|
|
101
101
|
}
|
|
102
102
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SeparateTableComponent, [{
|
|
103
103
|
type: Component,
|
|
104
|
-
args: [{ selector: 'dr-separate-table', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\n<div class=\"table\" role=\"table\" [attr.aria-rowcount]=\"rows.length\">\n <div class=\"table__rows\">\n <div class=\"table__row\" *ngFor=\"let row of rows; let rowIndex = index; let first = first; trackBy: trackByFn\">\n <div class=\"table__header\" role=\"rowheader\" *ngIf=\"first\" [attr.aria-colcount]=\"columns.length\">\n <div\n *ngFor=\"let column of columns; let columnIndex = index\"\n class=\"table__col\"\n [ngStyle]=\"column.styles\"\n role=\"columnheader\"\n [attr.aria-colindex]=\"columnIndex + 1\"\n [attr.aria-label]=\"column.header || column.field\">\n {{ column.header }}\n </div>\n </div>\n <div\n class=\"table__item\"\n (click)=\"rowClick.emit(row)\"\n role=\"row\"\n tabindex=\"0\"\n (keydown.enter)=\"rowClick.emit(row)\"\n [attr.aria-rowindex]=\"rowIndex + 1\">\n <div\n *ngFor=\"let column of columns\"\n class=\"table__cell\"\n [ngStyle]=\"column.styles\"\n role=\"cell\"\n (click)=\"column.stopCellClickPropagation && $event.stopPropagation()\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cellTemplate || defaultCellTemplate;\n context: { $implicit: row, column: column }\n \">\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<ng-template #defaultCellTemplate let-item let-column=\"column\">\n {{ item[column.field] }}\n</ng-template>\n", styles: [":host{display:block}:host .table{display:flex;flex-direction:column}:host .table__rows{display:flex;flex-direction:column;gap:16px}:host .table__header{
|
|
104
|
+
args: [{ selector: 'dr-separate-table', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\n<div class=\"table\" role=\"table\" [attr.aria-rowcount]=\"rows.length\">\n <div class=\"table__rows\">\n <div class=\"table__row\" *ngFor=\"let row of rows; let rowIndex = index; let first = first; trackBy: trackByFn\">\n <div class=\"table__header\" role=\"rowheader\" *ngIf=\"first\" [attr.aria-colcount]=\"columns.length\">\n <div\n *ngFor=\"let column of columns; let columnIndex = index\"\n class=\"table__col\"\n [ngStyle]=\"column.styles\"\n role=\"columnheader\"\n [attr.aria-colindex]=\"columnIndex + 1\"\n [attr.aria-label]=\"column.header || column.field\">\n {{ column.header }}\n </div>\n </div>\n <div\n class=\"table__item\"\n (click)=\"rowClick.emit(row)\"\n role=\"row\"\n tabindex=\"0\"\n (keydown.enter)=\"rowClick.emit(row)\"\n [attr.aria-rowindex]=\"rowIndex + 1\">\n <div\n *ngFor=\"let column of columns\"\n class=\"table__cell\"\n [ngStyle]=\"column.styles\"\n role=\"cell\"\n (click)=\"column.stopCellClickPropagation && $event.stopPropagation()\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cellTemplate || defaultCellTemplate;\n context: { $implicit: row, column: column }\n \">\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<ng-template #defaultCellTemplate let-item let-column=\"column\">\n {{ item[column.field] }}\n</ng-template>\n", styles: [":host{display:block}:host .table{display:flex;flex-direction:column}:host .table__rows{display:flex;flex-direction:column;gap:16px}:host .table__header{font-size:14px;line-height:24px;font-weight:400;display:flex;align-items:center;text-align:left;color:#6d6e6f}:host .table__col{padding:6px 24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}:host .table__item{font-size:14px;line-height:24px;font-weight:400;display:flex;align-items:center;border:1px solid #dfe0e3;border-radius:12px;background-color:#fff;color:#333;transition:background-color .2s ease-in;cursor:pointer}:host .table__item:hover{background-color:#f5f5f5}:host .table__cell{padding:12px 24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}:host .table__cell:last-child{padding-right:18px;padding-left:0}:host .table__cell:first-child{padding-left:24px}\n"] }]
|
|
105
105
|
}], null, { rows: [{
|
|
106
106
|
type: Input,
|
|
107
107
|
args: [{ required: true }]
|