@simpleangularcontrols/sac-bootstrap3 13.0.0-rc.11 → 13.0.0-rc.13

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.
@@ -857,7 +857,7 @@ SacDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
857
857
  multi: true,
858
858
  useExisting: forwardRef(() => SacDateComponent),
859
859
  },
860
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div\r\n style=\"position: relative\"\r\n [style.width.px]=\"componentHeight === ControlHeight.Small ? 120 : componentHeight === ControlHeight.Large ? 180 : 140\">\r\n <div\r\n class=\"datetime-textbox input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- this class comes in the div above when disabled [ngClass]=\"[disablelabel === false ? 'col-md-' + _inputsize : 'col-md-12']\" -->\r\n <input\r\n id=\"{{ name }}\"\r\n \u00F6\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control date-control\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [imask]=\"imaskDate\"\r\n placeholder=\"dd.mm.yyyy\"\r\n [attr.placeholder]=\"placeholder\"\r\n [value]=\"valuestring\"\r\n maxlength=\"10\"\r\n size=\"10\"\r\n (blur)=\"onTouch()\"\r\n (accept)=\"setValueString($event)\"\r\n [disabled]=\"isdisabled\"\r\n (click)=\"showDateSelector()\" />\r\n <span class=\"input-group-btn\">\r\n <button\r\n #pickerbutton\r\n class=\"btn btn-default\"\r\n type=\"button\"\r\n (click)=\"showDateSelector()\"\r\n [disabled]=\"isdisabled\">\r\n <i [class]=\"IconSelector\"></i>\r\n </button>\r\n </span>\r\n </div>\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n\r\n <div\r\n #picker\r\n *ngIf=\"_showselector\">\r\n <div\r\n class=\"popover in\"\r\n role=\"tooltip\"\r\n style=\"display: block; max-width: unset; margin: 0\"\r\n [class.bottom]=\"GetPickerPosition() == TooltipPosition.bottom || GetPickerPosition() == TooltipPosition.bottomend\"\r\n [class.top]=\"GetPickerPosition() == TooltipPosition.top || GetPickerPosition() == TooltipPosition.topend\"\r\n [style.left.px]=\"posPopupLeft\"\r\n [style.top.px]=\"posPopupTop\">\r\n <div\r\n #pickerarrow\r\n style=\"margin: 0\"\r\n class=\"arrow\"\r\n [style.top.px]=\"posArrowTop\"\r\n [style.left.px]=\"posArrowLeft\">\r\n </div>\r\n\r\n <div class=\"popover-content\">\r\n <sac-dateselector\r\n *ngIf=\"_showselector\"\r\n [initialvalue]=\"value\"\r\n (selectdate)=\"dateselect($event)\"\r\n dateselection=\"true\">\r\n </sac-dateselector>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }, { type: SacDateSelectorComponent, selector: "sac-dateselector" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.IMaskDirective, selector: "[imask]", inputs: ["imaskElement", "imask", "unmask"], outputs: ["accept", "complete"], exportAs: ["imask"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe, "async": i3.AsyncPipe } });
860
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div\r\n style=\"position: relative\"\r\n [style.width.px]=\"componentHeight === ControlHeight.Small ? 120 : componentHeight === ControlHeight.Large ? 180 : 140\">\r\n <div\r\n class=\"datetime-textbox input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- this class comes in the div above when disabled [ngClass]=\"[disablelabel === false ? 'col-md-' + _inputsize : 'col-md-12']\" -->\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control date-control\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [imask]=\"imaskDate\"\r\n [attr.placeholder]=\"placeholder\"\r\n [value]=\"valuestring\"\r\n (blur)=\"onTouch()\"\r\n (accept)=\"setValueString($event)\"\r\n [disabled]=\"isdisabled\"\r\n (click)=\"showDateSelector()\" />\r\n <span class=\"input-group-btn\">\r\n <button\r\n #pickerbutton\r\n class=\"btn btn-default\"\r\n type=\"button\"\r\n (click)=\"showDateSelector()\"\r\n [disabled]=\"isdisabled\">\r\n <i [class]=\"IconSelector\"></i>\r\n </button>\r\n </span>\r\n </div>\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n\r\n <div\r\n #picker\r\n *ngIf=\"_showselector\">\r\n <div\r\n class=\"popover in\"\r\n role=\"tooltip\"\r\n style=\"display: block; max-width: unset; margin: 0\"\r\n [class.bottom]=\"GetPickerPosition() == TooltipPosition.bottom || GetPickerPosition() == TooltipPosition.bottomend\"\r\n [class.top]=\"GetPickerPosition() == TooltipPosition.top || GetPickerPosition() == TooltipPosition.topend\"\r\n [style.left.px]=\"posPopupLeft\"\r\n [style.top.px]=\"posPopupTop\">\r\n <div\r\n #pickerarrow\r\n style=\"margin: 0\"\r\n class=\"arrow\"\r\n [style.top.px]=\"posArrowTop\"\r\n [style.left.px]=\"posArrowLeft\">\r\n </div>\r\n\r\n <div class=\"popover-content\">\r\n <sac-dateselector\r\n *ngIf=\"_showselector\"\r\n [initialvalue]=\"value\"\r\n (selectdate)=\"dateselect($event)\"\r\n dateselection=\"true\">\r\n </sac-dateselector>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }, { type: SacDateSelectorComponent, selector: "sac-dateselector" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.IMaskDirective, selector: "[imask]", inputs: ["imaskElement", "imask", "unmask"], outputs: ["accept", "complete"], exportAs: ["imask"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe, "async": i3.AsyncPipe } });
861
861
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacDateComponent, decorators: [{
862
862
  type: Component,
863
863
  args: [{ selector: 'sac-date', providers: [
@@ -871,7 +871,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
871
871
  multi: true,
872
872
  useExisting: forwardRef(() => SacDateComponent),
873
873
  },
874
- ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div\r\n style=\"position: relative\"\r\n [style.width.px]=\"componentHeight === ControlHeight.Small ? 120 : componentHeight === ControlHeight.Large ? 180 : 140\">\r\n <div\r\n class=\"datetime-textbox input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- this class comes in the div above when disabled [ngClass]=\"[disablelabel === false ? 'col-md-' + _inputsize : 'col-md-12']\" -->\r\n <input\r\n id=\"{{ name }}\"\r\n \u00F6\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control date-control\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [imask]=\"imaskDate\"\r\n placeholder=\"dd.mm.yyyy\"\r\n [attr.placeholder]=\"placeholder\"\r\n [value]=\"valuestring\"\r\n maxlength=\"10\"\r\n size=\"10\"\r\n (blur)=\"onTouch()\"\r\n (accept)=\"setValueString($event)\"\r\n [disabled]=\"isdisabled\"\r\n (click)=\"showDateSelector()\" />\r\n <span class=\"input-group-btn\">\r\n <button\r\n #pickerbutton\r\n class=\"btn btn-default\"\r\n type=\"button\"\r\n (click)=\"showDateSelector()\"\r\n [disabled]=\"isdisabled\">\r\n <i [class]=\"IconSelector\"></i>\r\n </button>\r\n </span>\r\n </div>\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n\r\n <div\r\n #picker\r\n *ngIf=\"_showselector\">\r\n <div\r\n class=\"popover in\"\r\n role=\"tooltip\"\r\n style=\"display: block; max-width: unset; margin: 0\"\r\n [class.bottom]=\"GetPickerPosition() == TooltipPosition.bottom || GetPickerPosition() == TooltipPosition.bottomend\"\r\n [class.top]=\"GetPickerPosition() == TooltipPosition.top || GetPickerPosition() == TooltipPosition.topend\"\r\n [style.left.px]=\"posPopupLeft\"\r\n [style.top.px]=\"posPopupTop\">\r\n <div\r\n #pickerarrow\r\n style=\"margin: 0\"\r\n class=\"arrow\"\r\n [style.top.px]=\"posArrowTop\"\r\n [style.left.px]=\"posArrowLeft\">\r\n </div>\r\n\r\n <div class=\"popover-content\">\r\n <sac-dateselector\r\n *ngIf=\"_showselector\"\r\n [initialvalue]=\"value\"\r\n (selectdate)=\"dateselect($event)\"\r\n dateselection=\"true\">\r\n </sac-dateselector>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
874
+ ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div\r\n style=\"position: relative\"\r\n [style.width.px]=\"componentHeight === ControlHeight.Small ? 120 : componentHeight === ControlHeight.Large ? 180 : 140\">\r\n <div\r\n class=\"datetime-textbox input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- this class comes in the div above when disabled [ngClass]=\"[disablelabel === false ? 'col-md-' + _inputsize : 'col-md-12']\" -->\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control date-control\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [imask]=\"imaskDate\"\r\n [attr.placeholder]=\"placeholder\"\r\n [value]=\"valuestring\"\r\n (blur)=\"onTouch()\"\r\n (accept)=\"setValueString($event)\"\r\n [disabled]=\"isdisabled\"\r\n (click)=\"showDateSelector()\" />\r\n <span class=\"input-group-btn\">\r\n <button\r\n #pickerbutton\r\n class=\"btn btn-default\"\r\n type=\"button\"\r\n (click)=\"showDateSelector()\"\r\n [disabled]=\"isdisabled\">\r\n <i [class]=\"IconSelector\"></i>\r\n </button>\r\n </span>\r\n </div>\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n\r\n <div\r\n #picker\r\n *ngIf=\"_showselector\">\r\n <div\r\n class=\"popover in\"\r\n role=\"tooltip\"\r\n style=\"display: block; max-width: unset; margin: 0\"\r\n [class.bottom]=\"GetPickerPosition() == TooltipPosition.bottom || GetPickerPosition() == TooltipPosition.bottomend\"\r\n [class.top]=\"GetPickerPosition() == TooltipPosition.top || GetPickerPosition() == TooltipPosition.topend\"\r\n [style.left.px]=\"posPopupLeft\"\r\n [style.top.px]=\"posPopupTop\">\r\n <div\r\n #pickerarrow\r\n style=\"margin: 0\"\r\n class=\"arrow\"\r\n [style.top.px]=\"posArrowTop\"\r\n [style.left.px]=\"posArrowLeft\">\r\n </div>\r\n\r\n <div class=\"popover-content\">\r\n <sac-dateselector\r\n *ngIf=\"_showselector\"\r\n [initialvalue]=\"value\"\r\n (selectdate)=\"dateselect($event)\"\r\n dateselection=\"true\">\r\n </sac-dateselector>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
875
875
  }], ctorParameters: function () {
876
876
  return [{ type: SacFormLayoutDirective, decorators: [{
877
877
  type: Host
@@ -1221,7 +1221,7 @@ SacInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
1221
1221
  multi: true,
1222
1222
  useExisting: forwardRef(() => SacInputComponent),
1223
1223
  },
1224
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe, "async": i3.AsyncPipe } });
1224
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxtextlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe, "async": i3.AsyncPipe } });
1225
1225
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacInputComponent, decorators: [{
1226
1226
  type: Component,
1227
1227
  args: [{ selector: 'sac-input', providers: [
@@ -1231,7 +1231,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
1231
1231
  multi: true,
1232
1232
  useExisting: forwardRef(() => SacInputComponent),
1233
1233
  },
1234
- ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n" }]
1234
+ ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxtextlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n" }]
1235
1235
  }], ctorParameters: function () {
1236
1236
  return [{ type: SacFormLayoutDirective, decorators: [{
1237
1237
  type: Host
@@ -1413,7 +1413,7 @@ SacInputEmailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
1413
1413
  multi: true,
1414
1414
  useExisting: forwardRef(() => SacInputEmailComponent),
1415
1415
  },
1416
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.clearfix]=\"helptextmode === 'tooltip' && helptext && disablelabel\">\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static pull-right\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n\r\n <div\r\n class=\"input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"input-group-addon\">@</div>\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n autocomplete=\"email\"\r\n [attr.maxlength]=\"maxlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe, "async": i3.AsyncPipe } });
1416
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.clearfix]=\"helptextmode === 'tooltip' && helptext && disablelabel\">\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static pull-right\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n\r\n <div\r\n class=\"input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"input-group-addon\">@</div>\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n autocomplete=\"email\"\r\n [attr.maxlength]=\"maxtextlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe, "async": i3.AsyncPipe } });
1417
1417
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacInputEmailComponent, decorators: [{
1418
1418
  type: Component,
1419
1419
  args: [{ selector: 'sac-inputemail', providers: [
@@ -1427,7 +1427,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
1427
1427
  multi: true,
1428
1428
  useExisting: forwardRef(() => SacInputEmailComponent),
1429
1429
  },
1430
- ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.clearfix]=\"helptextmode === 'tooltip' && helptext && disablelabel\">\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static pull-right\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n\r\n <div\r\n class=\"input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"input-group-addon\">@</div>\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n autocomplete=\"email\"\r\n [attr.maxlength]=\"maxlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n" }]
1430
+ ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.clearfix]=\"helptextmode === 'tooltip' && helptext && disablelabel\">\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static pull-right\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n\r\n <div\r\n class=\"input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"input-group-addon\">@</div>\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n autocomplete=\"email\"\r\n [attr.maxlength]=\"maxtextlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n" }]
1431
1431
  }], ctorParameters: function () {
1432
1432
  return [{ type: SacFormLayoutDirective, decorators: [{
1433
1433
  type: Host
@@ -1505,7 +1505,7 @@ SacInputPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
1505
1505
  multi: true,
1506
1506
  useExisting: forwardRef(() => SacInputPasswordComponent),
1507
1507
  },
1508
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n type=\"password\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxlength\"\r\n autocomplete=\"new-password\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe, "async": i3.AsyncPipe } });
1508
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n type=\"password\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxtextlength\"\r\n autocomplete=\"new-password\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe, "async": i3.AsyncPipe } });
1509
1509
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacInputPasswordComponent, decorators: [{
1510
1510
  type: Component,
1511
1511
  args: [{ selector: 'sac-inputpassword', providers: [
@@ -1519,7 +1519,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
1519
1519
  multi: true,
1520
1520
  useExisting: forwardRef(() => SacInputPasswordComponent),
1521
1521
  },
1522
- ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n type=\"password\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxlength\"\r\n autocomplete=\"new-password\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n" }]
1522
+ ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n type=\"password\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxtextlength\"\r\n autocomplete=\"new-password\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n" }]
1523
1523
  }], ctorParameters: function () {
1524
1524
  return [{ type: SacFormLayoutDirective, decorators: [{
1525
1525
  type: Host
@@ -1551,7 +1551,7 @@ SacInputSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
1551
1551
  multi: true,
1552
1552
  useExisting: forwardRef(() => SacInputSearchComponent),
1553
1553
  },
1554
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.clearfix]=\"helptextmode === 'tooltip' && helptext && disablelabel\">\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static pull-right\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n\r\n <div\r\n class=\"input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n <span class=\"input-group-btn\">\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-default\"\r\n id=\"{{ name }}_search\"\r\n (click)=\"searchClick()\">\r\n <i\r\n *ngIf=\"buttonmode === 'icon' || buttonmode === 'mixed'\"\r\n [class]=\"iconname\"\r\n [style.margin-right.px]=\"buttonmode === 'mixed' ? 7 : null\">\r\n </i>\r\n <ng-container *ngIf=\"buttonmode === 'text' || buttonmode === 'mixed'\">{{ buttontext }}</ng-container>\r\n </button>\r\n </span>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe } });
1554
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.clearfix]=\"helptextmode === 'tooltip' && helptext && disablelabel\">\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static pull-right\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n\r\n <div\r\n class=\"input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxtextlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n <span class=\"input-group-btn\">\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-default\"\r\n id=\"{{ name }}_search\"\r\n (click)=\"searchClick()\">\r\n <i\r\n *ngIf=\"buttonmode === 'icon' || buttonmode === 'mixed'\"\r\n [class]=\"iconname\"\r\n [style.margin-right.px]=\"buttonmode === 'mixed' ? 7 : null\">\r\n </i>\r\n <ng-container *ngIf=\"buttonmode === 'text' || buttonmode === 'mixed'\">{{ buttontext }}</ng-container>\r\n </button>\r\n </span>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n </div>\r\n</div>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "toControlHeight": SacToControlHeightPipe } });
1555
1555
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacInputSearchComponent, decorators: [{
1556
1556
  type: Component,
1557
1557
  args: [{ selector: 'sac-inputsearch', providers: [
@@ -1565,7 +1565,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
1565
1565
  multi: true,
1566
1566
  useExisting: forwardRef(() => SacInputSearchComponent),
1567
1567
  },
1568
- ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.clearfix]=\"helptextmode === 'tooltip' && helptext && disablelabel\">\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static pull-right\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n\r\n <div\r\n class=\"input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n <span class=\"input-group-btn\">\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-default\"\r\n id=\"{{ name }}_search\"\r\n (click)=\"searchClick()\">\r\n <i\r\n *ngIf=\"buttonmode === 'icon' || buttonmode === 'mixed'\"\r\n [class]=\"iconname\"\r\n [style.margin-right.px]=\"buttonmode === 'mixed' ? 7 : null\">\r\n </i>\r\n <ng-container *ngIf=\"buttonmode === 'text' || buttonmode === 'mixed'\">{{ buttontext }}</ng-container>\r\n </button>\r\n </span>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n </div>\r\n</div>\r\n" }]
1568
+ ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.clearfix]=\"helptextmode === 'tooltip' && helptext && disablelabel\">\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static pull-right\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n\r\n <div\r\n class=\"input-group\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <input\r\n id=\"{{ name }}\"\r\n name=\"{{ name }}\"\r\n type=\"text\"\r\n class=\"form-control\"\r\n [ngClass]=\"[componentHeight | toControlHeight]\"\r\n [value]=\"value\"\r\n [attr.placeholder]=\"placeholder\"\r\n (blur)=\"onTouch()\"\r\n (input)=\"setValue($event.target.value)\"\r\n [attr.maxlength]=\"maxtextlength\"\r\n [disabled]=\"isdisabled\"\r\n [readonly]=\"readonly\" />\r\n <span class=\"input-group-btn\">\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-default\"\r\n id=\"{{ name }}_search\"\r\n (click)=\"searchClick()\">\r\n <i\r\n *ngIf=\"buttonmode === 'icon' || buttonmode === 'mixed'\"\r\n [class]=\"iconname\"\r\n [style.margin-right.px]=\"buttonmode === 'mixed' ? 7 : null\">\r\n </i>\r\n <ng-container *ngIf=\"buttonmode === 'text' || buttonmode === 'mixed'\">{{ buttontext }}</ng-container>\r\n </button>\r\n </span>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n </div>\r\n</div>\r\n" }]
1569
1569
  }], ctorParameters: function () {
1570
1570
  return [{ type: SacFormLayoutDirective, decorators: [{
1571
1571
  type: Host
@@ -2087,7 +2087,7 @@ SacTreeviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
2087
2087
  useExisting: forwardRef(() => SacTreeviewComponent),
2088
2088
  multi: true,
2089
2089
  },
2090
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row mb-3\"\r\n [class.g-0]=\"disablelabel\"\r\n [class.has-error]=\"invalid && (dirty || touched)\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.has-error]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.width.%]=\"helptextmode === 'tooltip' && helptext && disablelabel ? '100' : null\">\r\n <table\r\n class=\"table table-hover table-condensed\"\r\n id=\"{{ name }}\"\r\n style=\"table-layout: fixed\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\"\r\n [class.border]=\"invalid && (dirty || touched)\"\r\n [class.border-danger]=\"invalid && (dirty || touched)\">\r\n <tbody>\r\n <ng-container *ngFor=\"let node of data\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"treeItem\"\r\n [ngTemplateOutletContext]=\"{ node: node, deep: 0 }\">\r\n </ng-template>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<ng-template\r\n #treeItem\r\n let-node=\"node\"\r\n let-deep=\"deep\">\r\n <tr [class.active]=\"isSelectedState(node)\">\r\n <td>\r\n <div\r\n class=\"py-1 px-2 d-flex align-items-center\"\r\n style=\"display: flex; flex-direction: row; cursor: pointer; align-items: center\"\r\n (mouseenter)=\"setHoverState(node, true)\"\r\n (mouseleave)=\"setHoverState(node, false)\">\r\n <div\r\n style=\"margin-right: 15px\"\r\n *ngFor=\"let i of count(deep)\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n *ngIf=\"expandedstate === 'true' || expandedstate === true\"\r\n style=\"margin-right: 15px\"\r\n [ngClass]=\"!hasChildren(node) ? iconFolderEmpty : !isExpandedState(node) ? iconFolderCollabsed : isExpandedState(node) ? iconFolderOpen : ''\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n *ngIf=\"attricon && getStringField(node, attricon)\"\r\n style=\"margin-right: 15px\"\r\n [ngClass]=\"getStringField(node, attricon)\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n style=\"padding-top: 7px; padding-bottom: 7px; flex-grow: 1\"\r\n [style.max-width.%]=\"enableellipsis ? '100' : null\"\r\n [style.overflow]=\"enableellipsis ? 'hidden' : null\"\r\n [style.text-overflow]=\"enableellipsis ? 'ellipsis' : null\"\r\n [style.white-space]=\"enableellipsis ? 'nowrap' : null\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templatelabel || defaultTemplateLabel\"\r\n [ngTemplateOutletContext]=\"{ node: node, label: getStringField(node, attrlabel) }\">\r\n </ng-template>\r\n </div>\r\n\r\n <div\r\n (click)=\"setSelectedState(node)\"\r\n style=\"flex-shrink: 0\"\r\n *ngIf=\"!isDisabledState(node) && (showactionalways || isSelectedState(node) || isHoverState(node))\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templateaction || defaultTemplateAction\"\r\n [ngTemplateOutletContext]=\"{ node: node, actionhandler: onActionClicked.bind(this) }\">\r\n </ng-template>\r\n </div>\r\n </div>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"isExpandedState(node)\">\r\n <ng-template\r\n *ngFor=\"let child of getChildren(node)\"\r\n [ngTemplateOutlet]=\"treeItem\"\r\n [ngTemplateOutletContext]=\"{ node: child, deep: deep + 1 }\">\r\n </ng-template>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateLabel\r\n let-label=\"label\"\r\n let-node=\"node\">\r\n <span [title]=\"label\">\r\n {{ label }}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateAction\r\n let-node=\"node\"\r\n let-actionhandler=\"actionhandler\">\r\n <a\r\n class=\"btn btn-link text-secondary\"\r\n (click)=\"actionhandler({ action: 'default', node: node })\">\r\n <i [class]=\"iconAction\"></i>\r\n </a>\r\n</ng-template>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2090
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row mb-3\"\r\n [class.g-0]=\"disablelabel\"\r\n [class.has-error]=\"invalid && (dirty || touched)\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.has-error]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.width.%]=\"helptextmode === 'tooltip' && helptext && disablelabel ? '100' : null\">\r\n <table\r\n class=\"table table-hover table-condensed\"\r\n id=\"{{ name }}\"\r\n style=\"table-layout: fixed\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\"\r\n [class.border]=\"invalid && (dirty || touched)\"\r\n [class.border-danger]=\"invalid && (dirty || touched)\">\r\n <tbody>\r\n <ng-container *ngFor=\"let node of data\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"treeItem\"\r\n [ngTemplateOutletContext]=\"{ node: node, deep: 0, path: '', textpath: '' }\">\r\n </ng-template>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<ng-template\r\n #treeItem\r\n let-node=\"node\"\r\n let-deep=\"deep\"\r\n let-path=\"path\"\r\n let-textpath=\"textpath\">\r\n <tr\r\n [class.active]=\"isSelectedState(node)\"\r\n attr.data-path=\"{{ path }}/{{ getStringField(node, attrid) }}\"\r\n attr.data-textpath=\"{{ textpath }}/{{ getStringField(node, attrlabel) }}\">\r\n <td>\r\n <div\r\n class=\"py-1 px-2 d-flex align-items-center\"\r\n style=\"display: flex; flex-direction: row; cursor: pointer; align-items: center\"\r\n (mouseenter)=\"setHoverState(node, true)\"\r\n (mouseleave)=\"setHoverState(node, false)\">\r\n <div\r\n style=\"margin-right: 15px\"\r\n *ngFor=\"let i of count(deep)\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n *ngIf=\"expandedstate === 'true' || expandedstate === true\"\r\n style=\"margin-right: 15px\"\r\n [ngClass]=\"!hasChildren(node) ? iconFolderEmpty : !isExpandedState(node) ? iconFolderCollabsed : isExpandedState(node) ? iconFolderOpen : ''\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n *ngIf=\"attricon && getStringField(node, attricon)\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templateicon || defaultTemplateIcon\"\r\n [ngTemplateOutletContext]=\"{ node: node }\">\r\n </ng-template>\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n style=\"padding-top: 7px; padding-bottom: 7px; flex-grow: 1\"\r\n [style.max-width.%]=\"enableellipsis ? '100' : null\"\r\n [style.overflow]=\"enableellipsis ? 'hidden' : null\"\r\n [style.text-overflow]=\"enableellipsis ? 'ellipsis' : null\"\r\n [style.white-space]=\"enableellipsis ? 'nowrap' : null\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templatelabel || defaultTemplateLabel\"\r\n [ngTemplateOutletContext]=\"{ node: node, label: getStringField(node, attrlabel) }\">\r\n </ng-template>\r\n </div>\r\n\r\n <div\r\n (click)=\"setSelectedState(node)\"\r\n style=\"flex-shrink: 0\"\r\n *ngIf=\"!isDisabledState(node) && (showactionalways || isSelectedState(node) || isHoverState(node))\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templateaction || defaultTemplateAction\"\r\n [ngTemplateOutletContext]=\"{ node: node, actionhandler: onActionClicked.bind(this) }\">\r\n </ng-template>\r\n </div>\r\n </div>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"isExpandedState(node)\">\r\n <ng-template\r\n *ngFor=\"let child of getChildren(node)\"\r\n [ngTemplateOutlet]=\"treeItem\"\r\n [ngTemplateOutletContext]=\"{\r\n node: child,\r\n deep: deep + 1,\r\n path: path + '/' + getStringField(node, attrid),\r\n textpath: textpath + '/' + getStringField(node, attrlabel)\r\n }\">\r\n </ng-template>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateLabel\r\n let-label=\"label\"\r\n let-node=\"node\">\r\n <span [title]=\"label\">\r\n {{ label }}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateIcon\r\n let-node=\"node\">\r\n <div\r\n style=\"margin-right: 15px\"\r\n [ngClass]=\"getStringField(node, attricon)\">\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateAction\r\n let-node=\"node\"\r\n let-actionhandler=\"actionhandler\">\r\n <a\r\n class=\"btn btn-link text-secondary\"\r\n (click)=\"actionhandler({ action: 'default', node: node })\">\r\n <i [class]=\"iconAction\"></i>\r\n </a>\r\n</ng-template>\r\n", components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2091
2091
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacTreeviewComponent, decorators: [{
2092
2092
  type: Component,
2093
2093
  args: [{ selector: 'sac-treeview', providers: [
@@ -2101,7 +2101,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
2101
2101
  useExisting: forwardRef(() => SacTreeviewComponent),
2102
2102
  multi: true,
2103
2103
  },
2104
- ], template: "<div\r\n class=\"row mb-3\"\r\n [class.g-0]=\"disablelabel\"\r\n [class.has-error]=\"invalid && (dirty || touched)\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.has-error]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.width.%]=\"helptextmode === 'tooltip' && helptext && disablelabel ? '100' : null\">\r\n <table\r\n class=\"table table-hover table-condensed\"\r\n id=\"{{ name }}\"\r\n style=\"table-layout: fixed\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\"\r\n [class.border]=\"invalid && (dirty || touched)\"\r\n [class.border-danger]=\"invalid && (dirty || touched)\">\r\n <tbody>\r\n <ng-container *ngFor=\"let node of data\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"treeItem\"\r\n [ngTemplateOutletContext]=\"{ node: node, deep: 0 }\">\r\n </ng-template>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<ng-template\r\n #treeItem\r\n let-node=\"node\"\r\n let-deep=\"deep\">\r\n <tr [class.active]=\"isSelectedState(node)\">\r\n <td>\r\n <div\r\n class=\"py-1 px-2 d-flex align-items-center\"\r\n style=\"display: flex; flex-direction: row; cursor: pointer; align-items: center\"\r\n (mouseenter)=\"setHoverState(node, true)\"\r\n (mouseleave)=\"setHoverState(node, false)\">\r\n <div\r\n style=\"margin-right: 15px\"\r\n *ngFor=\"let i of count(deep)\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n *ngIf=\"expandedstate === 'true' || expandedstate === true\"\r\n style=\"margin-right: 15px\"\r\n [ngClass]=\"!hasChildren(node) ? iconFolderEmpty : !isExpandedState(node) ? iconFolderCollabsed : isExpandedState(node) ? iconFolderOpen : ''\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n *ngIf=\"attricon && getStringField(node, attricon)\"\r\n style=\"margin-right: 15px\"\r\n [ngClass]=\"getStringField(node, attricon)\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n style=\"padding-top: 7px; padding-bottom: 7px; flex-grow: 1\"\r\n [style.max-width.%]=\"enableellipsis ? '100' : null\"\r\n [style.overflow]=\"enableellipsis ? 'hidden' : null\"\r\n [style.text-overflow]=\"enableellipsis ? 'ellipsis' : null\"\r\n [style.white-space]=\"enableellipsis ? 'nowrap' : null\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templatelabel || defaultTemplateLabel\"\r\n [ngTemplateOutletContext]=\"{ node: node, label: getStringField(node, attrlabel) }\">\r\n </ng-template>\r\n </div>\r\n\r\n <div\r\n (click)=\"setSelectedState(node)\"\r\n style=\"flex-shrink: 0\"\r\n *ngIf=\"!isDisabledState(node) && (showactionalways || isSelectedState(node) || isHoverState(node))\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templateaction || defaultTemplateAction\"\r\n [ngTemplateOutletContext]=\"{ node: node, actionhandler: onActionClicked.bind(this) }\">\r\n </ng-template>\r\n </div>\r\n </div>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"isExpandedState(node)\">\r\n <ng-template\r\n *ngFor=\"let child of getChildren(node)\"\r\n [ngTemplateOutlet]=\"treeItem\"\r\n [ngTemplateOutletContext]=\"{ node: child, deep: deep + 1 }\">\r\n </ng-template>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateLabel\r\n let-label=\"label\"\r\n let-node=\"node\">\r\n <span [title]=\"label\">\r\n {{ label }}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateAction\r\n let-node=\"node\"\r\n let-actionhandler=\"actionhandler\">\r\n <a\r\n class=\"btn btn-link text-secondary\"\r\n (click)=\"actionhandler({ action: 'default', node: node })\">\r\n <i [class]=\"iconAction\"></i>\r\n </a>\r\n</ng-template>\r\n" }]
2104
+ ], template: "<div\r\n class=\"row mb-3\"\r\n [class.g-0]=\"disablelabel\"\r\n [class.has-error]=\"invalid && (dirty || touched)\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [class.has-error]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <div [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.width.%]=\"helptextmode === 'tooltip' && helptext && disablelabel ? '100' : null\">\r\n <table\r\n class=\"table table-hover table-condensed\"\r\n id=\"{{ name }}\"\r\n style=\"table-layout: fixed\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\"\r\n [class.border]=\"invalid && (dirty || touched)\"\r\n [class.border-danger]=\"invalid && (dirty || touched)\">\r\n <tbody>\r\n <ng-container *ngFor=\"let node of data\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"treeItem\"\r\n [ngTemplateOutletContext]=\"{ node: node, deep: 0, path: '', textpath: '' }\">\r\n </ng-template>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<ng-template\r\n #treeItem\r\n let-node=\"node\"\r\n let-deep=\"deep\"\r\n let-path=\"path\"\r\n let-textpath=\"textpath\">\r\n <tr\r\n [class.active]=\"isSelectedState(node)\"\r\n attr.data-path=\"{{ path }}/{{ getStringField(node, attrid) }}\"\r\n attr.data-textpath=\"{{ textpath }}/{{ getStringField(node, attrlabel) }}\">\r\n <td>\r\n <div\r\n class=\"py-1 px-2 d-flex align-items-center\"\r\n style=\"display: flex; flex-direction: row; cursor: pointer; align-items: center\"\r\n (mouseenter)=\"setHoverState(node, true)\"\r\n (mouseleave)=\"setHoverState(node, false)\">\r\n <div\r\n style=\"margin-right: 15px\"\r\n *ngFor=\"let i of count(deep)\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n *ngIf=\"expandedstate === 'true' || expandedstate === true\"\r\n style=\"margin-right: 15px\"\r\n [ngClass]=\"!hasChildren(node) ? iconFolderEmpty : !isExpandedState(node) ? iconFolderCollabsed : isExpandedState(node) ? iconFolderOpen : ''\">\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n *ngIf=\"attricon && getStringField(node, attricon)\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templateicon || defaultTemplateIcon\"\r\n [ngTemplateOutletContext]=\"{ node: node }\">\r\n </ng-template>\r\n </div>\r\n\r\n <div\r\n (click)=\"onNodeClicked(node)\"\r\n style=\"padding-top: 7px; padding-bottom: 7px; flex-grow: 1\"\r\n [style.max-width.%]=\"enableellipsis ? '100' : null\"\r\n [style.overflow]=\"enableellipsis ? 'hidden' : null\"\r\n [style.text-overflow]=\"enableellipsis ? 'ellipsis' : null\"\r\n [style.white-space]=\"enableellipsis ? 'nowrap' : null\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templatelabel || defaultTemplateLabel\"\r\n [ngTemplateOutletContext]=\"{ node: node, label: getStringField(node, attrlabel) }\">\r\n </ng-template>\r\n </div>\r\n\r\n <div\r\n (click)=\"setSelectedState(node)\"\r\n style=\"flex-shrink: 0\"\r\n *ngIf=\"!isDisabledState(node) && (showactionalways || isSelectedState(node) || isHoverState(node))\">\r\n <ng-template\r\n [ngTemplateOutlet]=\"templateaction || defaultTemplateAction\"\r\n [ngTemplateOutletContext]=\"{ node: node, actionhandler: onActionClicked.bind(this) }\">\r\n </ng-template>\r\n </div>\r\n </div>\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"isExpandedState(node)\">\r\n <ng-template\r\n *ngFor=\"let child of getChildren(node)\"\r\n [ngTemplateOutlet]=\"treeItem\"\r\n [ngTemplateOutletContext]=\"{\r\n node: child,\r\n deep: deep + 1,\r\n path: path + '/' + getStringField(node, attrid),\r\n textpath: textpath + '/' + getStringField(node, attrlabel)\r\n }\">\r\n </ng-template>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateLabel\r\n let-label=\"label\"\r\n let-node=\"node\">\r\n <span [title]=\"label\">\r\n {{ label }}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateIcon\r\n let-node=\"node\">\r\n <div\r\n style=\"margin-right: 15px\"\r\n [ngClass]=\"getStringField(node, attricon)\">\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultTemplateAction\r\n let-node=\"node\"\r\n let-actionhandler=\"actionhandler\">\r\n <a\r\n class=\"btn btn-link text-secondary\"\r\n (click)=\"actionhandler({ action: 'default', node: node })\">\r\n <i [class]=\"iconAction\"></i>\r\n </a>\r\n</ng-template>\r\n" }]
2105
2105
  }], ctorParameters: function () {
2106
2106
  return [{ type: SacFormLayoutDirective, decorators: [{
2107
2107
  type: Host
@@ -2161,7 +2161,7 @@ SacDropzoneMultipleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
2161
2161
  multi: true,
2162
2162
  useExisting: forwardRef(() => SacDropzoneMultipleComponent),
2163
2163
  },
2164
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"img-rounded dropzone control-label\"\r\n (drop)=\"dropHandler($event)\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n [class.active]=\"active\"\r\n [style.min-height]=\"uploadheight\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\">\r\n <div\r\n class=\"content\"\r\n *ngIf=\"uploads.length === 0\">\r\n <div>\r\n <div [class.is-invalid]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"uploads.length > 0\">\r\n <div>\r\n <div\r\n class=\"dropzone-uploadstates\"\r\n [class.mt-1]=\"i > 0\"\r\n *ngFor=\"let file of uploads; let i = index\">\r\n <div\r\n class=\"input-group upload-component upload-component-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress border-secondary\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <input\r\n #files\r\n multiple\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n <small\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </small>\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block help-block-error\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"], components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2164
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n id=\"{{ name }}\"\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}_uploadinput\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"img-rounded dropzone control-label\"\r\n (drop)=\"dropHandler($event)\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n [class.active]=\"active\"\r\n [style.min-height]=\"uploadheight\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\">\r\n <div\r\n class=\"content\"\r\n *ngIf=\"uploads.length === 0\">\r\n <div>\r\n <div [class.is-invalid]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"uploads.length > 0\">\r\n <div>\r\n <div\r\n class=\"dropzone-uploadstates\"\r\n [class.mt-1]=\"i > 0\"\r\n *ngFor=\"let file of uploads; let i = index\">\r\n <div\r\n class=\"input-group upload-component upload-component-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress border-secondary\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <input\r\n #files\r\n multiple\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n <small\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </small>\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block help-block-error\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"], components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2165
2165
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacDropzoneMultipleComponent, decorators: [{
2166
2166
  type: Component,
2167
2167
  args: [{ selector: 'sac-dropzonemultiple', providers: [
@@ -2175,7 +2175,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
2175
2175
  multi: true,
2176
2176
  useExisting: forwardRef(() => SacDropzoneMultipleComponent),
2177
2177
  },
2178
- ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"img-rounded dropzone control-label\"\r\n (drop)=\"dropHandler($event)\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n [class.active]=\"active\"\r\n [style.min-height]=\"uploadheight\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\">\r\n <div\r\n class=\"content\"\r\n *ngIf=\"uploads.length === 0\">\r\n <div>\r\n <div [class.is-invalid]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"uploads.length > 0\">\r\n <div>\r\n <div\r\n class=\"dropzone-uploadstates\"\r\n [class.mt-1]=\"i > 0\"\r\n *ngFor=\"let file of uploads; let i = index\">\r\n <div\r\n class=\"input-group upload-component upload-component-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress border-secondary\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <input\r\n #files\r\n multiple\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n <small\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </small>\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block help-block-error\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"] }]
2178
+ ], template: "<div\r\n id=\"{{ name }}\"\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}_uploadinput\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"img-rounded dropzone control-label\"\r\n (drop)=\"dropHandler($event)\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n [class.active]=\"active\"\r\n [style.min-height]=\"uploadheight\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\">\r\n <div\r\n class=\"content\"\r\n *ngIf=\"uploads.length === 0\">\r\n <div>\r\n <div [class.is-invalid]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"uploads.length > 0\">\r\n <div>\r\n <div\r\n class=\"dropzone-uploadstates\"\r\n [class.mt-1]=\"i > 0\"\r\n *ngFor=\"let file of uploads; let i = index\">\r\n <div\r\n class=\"input-group upload-component upload-component-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress border-secondary\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <input\r\n #files\r\n multiple\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n <small\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </small>\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block help-block-error\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"] }]
2179
2179
  }], ctorParameters: function () {
2180
2180
  return [{ type: SacFormLayoutDirective, decorators: [{
2181
2181
  type: Host
@@ -2221,7 +2221,7 @@ SacDropzoneSingleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
2221
2221
  multi: true,
2222
2222
  useExisting: forwardRef(() => SacDropzoneSingleComponent),
2223
2223
  },
2224
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"img-rounded dropzone control-label\"\r\n (drop)=\"dropHandler($event)\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n [style.min-height]=\"uploadheight\"\r\n [class.active]=\"active\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\">\r\n <div\r\n class=\"content\"\r\n *ngIf=\"uploads.length === 0\">\r\n <div>\r\n <div [class.is-invalid]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"uploads.length > 0\">\r\n <div>\r\n <div\r\n class=\"dropzone-uploadstates\"\r\n *ngFor=\"let file of uploads\">\r\n <div\r\n class=\"input-group upload-component upload-component-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <input\r\n #files\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n <small\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </small>\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block help-block-error\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"], components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2224
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n id=\"{{ name }}\"\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}_uploadinput\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"img-rounded dropzone control-label\"\r\n (drop)=\"dropHandler($event)\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n [style.min-height]=\"uploadheight\"\r\n [class.active]=\"active\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\">\r\n <div\r\n class=\"content\"\r\n *ngIf=\"uploads.length === 0\">\r\n <div>\r\n <div [class.is-invalid]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"uploads.length > 0\">\r\n <div>\r\n <div\r\n class=\"dropzone-uploadstates\"\r\n *ngFor=\"let file of uploads\">\r\n <div\r\n class=\"input-group upload-component upload-component-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <input\r\n #files\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n <small\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </small>\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block help-block-error\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"], components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2225
2225
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacDropzoneSingleComponent, decorators: [{
2226
2226
  type: Component,
2227
2227
  args: [{ selector: 'sac-dropzonesingle', providers: [
@@ -2235,7 +2235,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
2235
2235
  multi: true,
2236
2236
  useExisting: forwardRef(() => SacDropzoneSingleComponent),
2237
2237
  },
2238
- ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"img-rounded dropzone control-label\"\r\n (drop)=\"dropHandler($event)\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n [style.min-height]=\"uploadheight\"\r\n [class.active]=\"active\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\">\r\n <div\r\n class=\"content\"\r\n *ngIf=\"uploads.length === 0\">\r\n <div>\r\n <div [class.is-invalid]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"uploads.length > 0\">\r\n <div>\r\n <div\r\n class=\"dropzone-uploadstates\"\r\n *ngFor=\"let file of uploads\">\r\n <div\r\n class=\"input-group upload-component upload-component-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <input\r\n #files\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n <small\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </small>\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block help-block-error\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"] }]
2238
+ ], template: "<div\r\n id=\"{{ name }}\"\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}_uploadinput\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"img-rounded dropzone control-label\"\r\n (drop)=\"dropHandler($event)\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n [style.min-height]=\"uploadheight\"\r\n [class.active]=\"active\"\r\n [class.is-invalid]=\"invalid && (dirty || touched)\">\r\n <div\r\n class=\"content\"\r\n *ngIf=\"uploads.length === 0\">\r\n <div>\r\n <div [class.is-invalid]=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"uploads.length > 0\">\r\n <div>\r\n <div\r\n class=\"dropzone-uploadstates\"\r\n *ngFor=\"let file of uploads\">\r\n <div\r\n class=\"input-group upload-component upload-component-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <input\r\n #files\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n <small\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </small>\r\n <div\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\"\r\n class=\"help-block help-block-error\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"] }]
2239
2239
  }], ctorParameters: function () {
2240
2240
  return [{ type: SacFormLayoutDirective, decorators: [{
2241
2241
  type: Host
@@ -2270,7 +2270,7 @@ SacUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
2270
2270
  multi: true,
2271
2271
  useExisting: forwardRef(() => SacUploadComponent),
2272
2272
  },
2273
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"input-group upload-component upload-single\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-input -->\r\n <div\r\n class=\"btn upload-input custom-file\"\r\n [class.disabled]=\"HasQueueItem()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <i [class]=\"IconBrowse\"></i>\r\n <span class=\"upload-browse\">{{ lngResourceService.GetString(validationKeyService.UploadButtonBrowse) | async }}</span>\r\n <input\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n #files\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n multiple\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n </div>\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"Progress() === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"Progress()\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"Progress()\">\r\n <span class=\"progress-text text-dark\">{{ Filename() | async }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancelAll()\"\r\n [attr.disabled]=\"HasQueueItem() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && IsPaused() === false)\"\r\n class=\"btn\"\r\n (click)=\"pauseAll()\"\r\n [attr.disabled]=\"IsUploading() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && IsPaused()\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [attr.disabled]=\"IsStateToUpload() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"], components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2273
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n id=\"{{ name }}\"\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}_uploadinput\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"input-group upload-component upload-single\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-input -->\r\n <div\r\n class=\"btn upload-input custom-file\"\r\n [class.disabled]=\"HasQueueItem()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <i [class]=\"IconBrowse\"></i>\r\n <span class=\"upload-browse\">{{ lngResourceService.GetString(validationKeyService.UploadButtonBrowse) | async }}</span>\r\n <input\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n #files\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n multiple\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n </div>\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"Progress() === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"Progress()\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"Progress()\">\r\n <span class=\"progress-text text-dark\">{{ Filename() | async }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancelAll()\"\r\n [attr.disabled]=\"HasQueueItem() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && IsPaused() === false)\"\r\n class=\"btn\"\r\n (click)=\"pauseAll()\"\r\n [attr.disabled]=\"IsUploading() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && IsPaused()\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [attr.disabled]=\"IsStateToUpload() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"], components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2274
2274
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacUploadComponent, decorators: [{
2275
2275
  type: Component,
2276
2276
  args: [{ selector: 'sac-upload', providers: [
@@ -2284,7 +2284,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
2284
2284
  multi: true,
2285
2285
  useExisting: forwardRef(() => SacUploadComponent),
2286
2286
  },
2287
- ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"input-group upload-component upload-single\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-input -->\r\n <div\r\n class=\"btn upload-input custom-file\"\r\n [class.disabled]=\"HasQueueItem()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <i [class]=\"IconBrowse\"></i>\r\n <span class=\"upload-browse\">{{ lngResourceService.GetString(validationKeyService.UploadButtonBrowse) | async }}</span>\r\n <input\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n #files\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n multiple\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n </div>\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"Progress() === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"Progress()\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"Progress()\">\r\n <span class=\"progress-text text-dark\">{{ Filename() | async }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancelAll()\"\r\n [attr.disabled]=\"HasQueueItem() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && IsPaused() === false)\"\r\n class=\"btn\"\r\n (click)=\"pauseAll()\"\r\n [attr.disabled]=\"IsUploading() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && IsPaused()\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [attr.disabled]=\"IsStateToUpload() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"] }]
2287
+ ], template: "<div\r\n id=\"{{ name }}\"\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}_uploadinput\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div [style.flex-grow]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 1 : null\">\r\n <div\r\n class=\"input-group upload-component upload-single\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-input -->\r\n <div\r\n class=\"btn upload-input custom-file\"\r\n [class.disabled]=\"HasQueueItem()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <i [class]=\"IconBrowse\"></i>\r\n <span class=\"upload-browse\">{{ lngResourceService.GetString(validationKeyService.UploadButtonBrowse) | async }}</span>\r\n <input\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n #files\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n multiple\r\n [disabled]=\"HasQueueItem()\" />\r\n </div>\r\n </div>\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"Progress() === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"Progress()\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"Progress()\">\r\n <span class=\"progress-text text-dark\">{{ Filename() | async }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"input-group-btn\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancelAll()\"\r\n [attr.disabled]=\"HasQueueItem() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && IsPaused() === false)\"\r\n class=\"btn\"\r\n (click)=\"pauseAll()\"\r\n [attr.disabled]=\"IsUploading() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && IsPaused()\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [attr.disabled]=\"IsStateToUpload() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"] }]
2288
2288
  }], ctorParameters: function () {
2289
2289
  return [{ type: SacFormLayoutDirective, decorators: [{
2290
2290
  type: Host
@@ -2319,7 +2319,7 @@ SacUploadMultipleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
2319
2319
  multi: true,
2320
2320
  useExisting: forwardRef(() => SacUploadMultipleComponent),
2321
2321
  },
2322
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div class=\"upload-component\">\r\n <div class=\"row\">\r\n <div\r\n class=\"col-xs-12\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div\r\n class=\"btn-group\"\r\n [class.btn-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.btn-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div\r\n class=\"btn upload-input custom-file\"\r\n [class.disabled]=\"maxfiles > 0 && uploads.length >= maxfiles\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <i [class]=\"IconBrowse\"></i>\r\n <span class=\"upload-browse\">Browse</span>\r\n <input\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n #files\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n multiple\r\n [disabled]=\"maxfiles > 0 && uploads.length >= maxfiles\" />\r\n </div>\r\n\r\n <div\r\n class=\"btn-group\"\r\n [class.btn-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.btn-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancelAll()\"\r\n [attr.disabled]=\"HasQueueItem() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && IsPaused() === false)\"\r\n class=\"btn\"\r\n (click)=\"pauseAll()\"\r\n [attr.disabled]=\"IsUploading() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && IsPaused() === true\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [attr.disabled]=\"IsStateToUpload() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngFor=\"let file of uploads\"\r\n style=\"margin-top: 5px\">\r\n <div\r\n class=\"input-group upload-component upload-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text text-dark\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"input-group-btn\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && file.status !== 'paused')\"\r\n class=\"btn\"\r\n (click)=\"pause(file.uploadId)\"\r\n [attr.disabled]=\"file.status !== 'uploading' ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && file.status === 'paused'\"\r\n class=\"btn\"\r\n (click)=\"upload(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"upload(file.uploadId)\"\r\n [attr.disabled]=\"file.status !== 'added' && file.status !== 'paused' ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"], components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2322
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n id=\"{{ name }}\"\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}_uploadinput\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div class=\"upload-component\">\r\n <div class=\"row\">\r\n <div\r\n class=\"col-xs-12\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div\r\n class=\"btn-group\"\r\n [class.btn-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.btn-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div\r\n class=\"btn upload-input custom-file\"\r\n [class.disabled]=\"maxfiles > 0 && uploads.length >= maxfiles\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <i [class]=\"IconBrowse\"></i>\r\n <span class=\"upload-browse\">Browse</span>\r\n <input\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n #files\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n multiple\r\n [disabled]=\"maxfiles > 0 && uploads.length >= maxfiles\" />\r\n </div>\r\n\r\n <div\r\n class=\"btn-group\"\r\n [class.btn-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.btn-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancelAll()\"\r\n [attr.disabled]=\"HasQueueItem() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && IsPaused() === false)\"\r\n class=\"btn\"\r\n (click)=\"pauseAll()\"\r\n [attr.disabled]=\"IsUploading() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && IsPaused() === true\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [attr.disabled]=\"IsStateToUpload() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngFor=\"let file of uploads\"\r\n style=\"margin-top: 5px\">\r\n <div\r\n class=\"input-group upload-component upload-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text text-dark\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"input-group-btn\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && file.status !== 'paused')\"\r\n class=\"btn\"\r\n (click)=\"pause(file.uploadId)\"\r\n [attr.disabled]=\"file.status !== 'uploading' ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && file.status === 'paused'\"\r\n class=\"btn\"\r\n (click)=\"upload(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"upload(file.uploadId)\"\r\n [attr.disabled]=\"file.status !== 'added' && file.status !== 'paused' ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"], components: [{ type: SacTooltipComponent, selector: "sac-tooltip" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "toLabelHeight": SacToLabelHeightPipe, "toLabelWidthCss": SacToLabelWidthCssPipe, "toControlWidthCss": SacToControlWidthCssPipe, "async": i3.AsyncPipe } });
2323
2323
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SacUploadMultipleComponent, decorators: [{
2324
2324
  type: Component,
2325
2325
  args: [{ selector: 'sac-uploadmultiple', providers: [
@@ -2333,7 +2333,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
2333
2333
  multi: true,
2334
2334
  useExisting: forwardRef(() => SacUploadMultipleComponent),
2335
2335
  },
2336
- ], template: "<div\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div class=\"upload-component\">\r\n <div class=\"row\">\r\n <div\r\n class=\"col-xs-12\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div\r\n class=\"btn-group\"\r\n [class.btn-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.btn-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div\r\n class=\"btn upload-input custom-file\"\r\n [class.disabled]=\"maxfiles > 0 && uploads.length >= maxfiles\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <i [class]=\"IconBrowse\"></i>\r\n <span class=\"upload-browse\">Browse</span>\r\n <input\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n #files\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n multiple\r\n [disabled]=\"maxfiles > 0 && uploads.length >= maxfiles\" />\r\n </div>\r\n\r\n <div\r\n class=\"btn-group\"\r\n [class.btn-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.btn-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancelAll()\"\r\n [attr.disabled]=\"HasQueueItem() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && IsPaused() === false)\"\r\n class=\"btn\"\r\n (click)=\"pauseAll()\"\r\n [attr.disabled]=\"IsUploading() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && IsPaused() === true\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [attr.disabled]=\"IsStateToUpload() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngFor=\"let file of uploads\"\r\n style=\"margin-top: 5px\">\r\n <div\r\n class=\"input-group upload-component upload-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text text-dark\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"input-group-btn\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && file.status !== 'paused')\"\r\n class=\"btn\"\r\n (click)=\"pause(file.uploadId)\"\r\n [attr.disabled]=\"file.status !== 'uploading' ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && file.status === 'paused'\"\r\n class=\"btn\"\r\n (click)=\"upload(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"upload(file.uploadId)\"\r\n [attr.disabled]=\"file.status !== 'added' && file.status !== 'paused' ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"] }]
2336
+ ], template: "<div\r\n id=\"{{ name }}\"\r\n class=\"row form-group\"\r\n [class.has-error]=\"invalid && (dirty || touched)\"\r\n [ngClass]=\"componentHeight | toLabelHeight\">\r\n <label\r\n *ngIf=\"disablelabel === false && !isAdaptiveLabel\"\r\n id=\"{{ name }}label\"\r\n for=\"{{ name }}_uploadinput\"\r\n class=\"col-xs-12 control-label\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toLabelWidthCss) : 'sr-only']\"\r\n [class.required]=\"isrequired\">\r\n <span class=\"text\">{{ label }}</span>\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </label>\r\n <div\r\n class=\"col-xs-12\"\r\n [ngClass]=\"[disablelabel === false ? (this.labelSizes | toControlWidthCss) : '']\">\r\n <div class=\"upload-component\">\r\n <div class=\"row\">\r\n <div\r\n class=\"col-xs-12\"\r\n [style.display]=\"helptextmode === 'tooltip' && helptext && disablelabel ? 'flex' : null\">\r\n <div\r\n class=\"btn-group\"\r\n [class.btn-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.btn-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div\r\n class=\"btn upload-input custom-file\"\r\n [class.disabled]=\"maxfiles > 0 && uploads.length >= maxfiles\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <i [class]=\"IconBrowse\"></i>\r\n <span class=\"upload-browse\">Browse</span>\r\n <input\r\n id=\"{{ name }}_uploadinput\"\r\n type=\"file\"\r\n class=\"custom-file-input\"\r\n #files\r\n (click)=\"files.value = ''\"\r\n (uploadxState)=\"onUpload($event)\"\r\n multiple\r\n [disabled]=\"maxfiles > 0 && uploads.length >= maxfiles\" />\r\n </div>\r\n\r\n <div\r\n class=\"btn-group\"\r\n [class.btn-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.btn-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancelAll()\"\r\n [attr.disabled]=\"HasQueueItem() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && IsPaused() === false)\"\r\n class=\"btn\"\r\n (click)=\"pauseAll()\"\r\n [attr.disabled]=\"IsUploading() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && IsPaused() === true\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"uploadAll()\"\r\n [attr.disabled]=\"IsStateToUpload() === false ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"helptextmode === 'tooltip' && helptext && disablelabel\"\r\n class=\"form-control-static\"\r\n style=\"margin-left: 5px\">\r\n <sac-tooltip\r\n *ngIf=\"helptextmode === 'tooltip' && helptext\"\r\n [tooltiptext]=\"helptext\"\r\n [inlinemode]=\"true\">\r\n <span\r\n [class]=\"HelptextTooltipIcon\"\r\n style=\"margin-left: 5px; margin-right: 5px\">\r\n </span>\r\n </sac-tooltip>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngFor=\"let file of uploads\"\r\n style=\"margin-top: 5px\">\r\n <div\r\n class=\"input-group upload-component upload-multiple\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <div class=\"form-control upload-progress\">\r\n <div class=\"progress\">\r\n <div\r\n class=\"progress-bar\"\r\n [class.progress-bar-success]=\"file.progress === 100\"\r\n role=\"progressbar\"\r\n [attr.aria-valuenow]=\"file.progress\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n [style.width.%]=\"file.progress\">\r\n <span class=\"progress-text text-dark\">{{ file.name }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"input-group-btn\"\r\n [class.input-group-sm]=\"componentHeight === ControlHeight.Small\"\r\n [class.input-group-lg]=\"componentHeight === ControlHeight.Large\">\r\n <!-- image-preview-clear button -->\r\n <a\r\n class=\"btn\"\r\n (click)=\"cancel(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconDelete\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"(autoupload === false && enablepause) || (autoupload && enablepause && file.status !== 'paused')\"\r\n class=\"btn\"\r\n (click)=\"pause(file.uploadId)\"\r\n [attr.disabled]=\"file.status !== 'uploading' ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconPause\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload && enablepause && file.status === 'paused'\"\r\n class=\"btn\"\r\n (click)=\"upload(file.uploadId)\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconContinue\"></span>\r\n </a>\r\n <a\r\n *ngIf=\"autoupload === false\"\r\n class=\"btn\"\r\n (click)=\"upload(file.uploadId)\"\r\n [attr.disabled]=\"file.status !== 'added' && file.status !== 'paused' ? 'disabled' : null\"\r\n [class.btn-default]=\"!(invalid && (dirty || touched))\"\r\n [class.btn-danger]=\"invalid && (dirty || touched)\">\r\n <span [class]=\"IconUpload\"></span> {{ lngResourceService.GetString(validationKeyService.UploadButtonUpload) | async }}\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <p\r\n *ngIf=\"helptextmode === 'text' && helptext\"\r\n class=\"help-block\">\r\n {{ helptext }}\r\n </p>\r\n <div\r\n class=\"help-block help-block-error\"\r\n *ngIf=\"isinlineerrorenabled && invalid && (dirty || touched)\">\r\n {{ GetErrorMessage() | async }}\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".upload-component .upload-input{position:relative}.upload-component .custom-file>i{margin-right:15px}.upload-component .custom-file .custom-file-input{inset:0;position:absolute;overflow:hidden;z-index:2;width:100%;margin:0;display:inline-block;opacity:0}.upload-component.upload-multiple .upload-progress .progress{border-top-right-radius:0;border-bottom-right-radius:0}.upload-component.upload-single .upload-progress .progress{border-radius:0}.upload-component .upload-progress{padding:0}.upload-component .upload-progress .progress{height:100%}.upload-component .upload-progress .progress .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone{min-height:120px;width:100%;text-align:center;border-style:dashed;border-width:2px;padding-top:50px;padding-bottom:50px;position:relative}.dropzone.active{background-color:#add8e6}.dropzone .progress{border-radius:0}.dropzone .progress .progress-bar{display:flex;justify-content:center;text-align:center;flex-direction:column;border-top-right-radius:0;border-bottom-right-radius:0}.dropzone .progress .progress-bar .progress-text{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:table-cell;line-height:34px;height:34px;color:#000}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;width:100%}.dropzone .dropzone-uploadstates{max-width:450px;margin-left:auto;margin-right:auto;margin-top:6px;width:80%}\n"] }]
2337
2337
  }], ctorParameters: function () {
2338
2338
  return [{ type: SacFormLayoutDirective, decorators: [{
2339
2339
  type: Host