keevo-components 2.0.42 → 2.0.44

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.
@@ -4900,6 +4900,10 @@ class KvEditorComponent extends BaseComponentInput {
4900
4900
  this.outputRaw = new EventEmitter();
4901
4901
  this.outputHtml = new EventEmitter();
4902
4902
  this.updatingEditor = false;
4903
+ this.initLoadComplete = signal(false);
4904
+ this.editorReadyPromise = new Promise((resolve) => {
4905
+ this.editorReadyResolver = resolve;
4906
+ });
4903
4907
  /**
4904
4908
  * caso defina como "text" o texto ira ser enviado sem formatação
4905
4909
  */
@@ -4989,6 +4993,15 @@ class KvEditorComponent extends BaseComponentInput {
4989
4993
  this.outputHtml.emit(this.quill.getSemanticHTML());
4990
4994
  }
4991
4995
  });
4996
+ this.editorReadyResolver();
4997
+ this.initLoadComplete.set(true);
4998
+ setTimeout(() => {
4999
+ const control = this.formControl;
5000
+ if (control && control.markAsPristine) {
5001
+ control.markAsPristine();
5002
+ control.markAsUntouched();
5003
+ }
5004
+ }, 0);
4992
5005
  }
4993
5006
  addQuillCss() {
4994
5007
  const link = this.renderer.createElement('link');
@@ -5005,7 +5018,9 @@ class KvEditorComponent extends BaseComponentInput {
5005
5018
  this.updatingEditor = true;
5006
5019
  this.escrevaValor(value);
5007
5020
  }
5008
- escrevaValor(htmlvalue, rawvalue) {
5021
+ async escrevaValor(htmlvalue, rawvalue) {
5022
+ if (!this.initLoadComplete())
5023
+ await this.editorReadyPromise;
5009
5024
  if (this.quill) {
5010
5025
  if (this.updatingEditor) {
5011
5026
  this.quill.clipboard.dangerouslyPasteHTML(htmlvalue);
@@ -5020,11 +5035,11 @@ class KvEditorComponent extends BaseComponentInput {
5020
5035
  }
5021
5036
  }
5022
5037
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvEditorComponent, deps: [{ token: ComponentService }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
5023
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvEditorComponent, selector: "kv-editor", inputs: { readonly: "readonly", canvaHeigth: "canvaHeigth", debug: "debug", contentType: "contentType" }, outputs: { onTextChange: "onTextChange", onSelectionChange: "onSelectionChange", outputRaw: "outputRaw", outputHtml: "outputHtml" }, providers: ComponentProviders(KvEditorComponent), usesInheritance: true, ngImport: i0, template: "\r\n <div class=\"kv-editor-container\">\r\n <div #editor id=\"kv-editor-toolbar\" [ngClass]=\"{'error-border-toolbar': hasControlError()}\" >\r\n <span class=\"ql-formats\">\r\n <select class=\"ql-font\">\r\n <option value=\"roboto\">Roboto</option>\r\n <option value=\"monospace\">Monospace</option>\r\n <option value=\"inter\">Inter</option>\r\n <option selected>Sans Serif</option>\r\n <option value=\"serif\">Serif</option>\r\n </select>\r\n \r\n <select class=\"ql-header\">\r\n <option value=\"1\">Titulo</option>\r\n <option value=\"2\">Subtitulo</option>\r\n <option selected>Normal</option>\r\n </select>\r\n \r\n <span class=\"ql-format-group\">\r\n <select title=\"Size\" class=\"ql-size\">\r\n <option value=\"15px\">15px</option>\r\n <option value=\"20px\">20px</option>\r\n <option value=\"30px\">30px</option>\r\n <option value=\"40px\">40px</option>\r\n <option value=\"50px\">50px</option>\r\n <option value=\"70px\">70px</option>\r\n <option value=\"90px\">90px</option>\r\n </select>\r\n </span>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-bold\"></button>\r\n <button class=\"ql-italic\"></button>\r\n <button class=\"ql-underline\"></button>\r\n <button class=\"ql-strike\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-script\" value=\"sub\"></button>\r\n <button class=\"ql-script\" value=\"super\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-header\" value=\"1\"></button>\r\n <button class=\"ql-header\" value=\"2\"></button>\r\n <button class=\"ql-blockquote\"></button>\r\n <button class=\"ql-code-block\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-list\" value=\"ordered\"></button>\r\n <button class=\"ql-list\" value=\"bullet\"></button>\r\n <button class=\"ql-indent\" value=\"-1\"></button>\r\n <button class=\"ql-indent\" value=\"+1\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-direction\" value=\"rtl\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-link\"></button>\r\n <button class=\"ql-image\"></button>\r\n <button class=\"ql-video\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-clean\"></button>\r\n </span>\r\n </div>\r\n \r\n <div id=\"kv-editor\" [style.height]=\"canvaHeigth\" [ngClass]=\"{'error-border': hasControlError()}\" ></div>\r\n </div>\r\n <kv-error [hasError]=\"hasControlError()\">{{ erroMessage() }}</kv-error>\r\n\r\n<!------------------------------------------------------------------------------------------------------------------->\r\n\r\n <!-- <link href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\" rel=\"stylesheet\" /> -->\r\n <link href=\"https://fonts.googleapis.com/css?family=Roboto\" rel=\"stylesheet\">\r\n <script src=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.js\"></script>\r\n <script src=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js\"></script>\r\n\r\n\r\n <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\" />\r\n <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\" />\r\n <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css\" />\r\n\r\n\r\n <!-- Import fonts -->\r\n\r\n <link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin>\r\n\r\n <link href=\"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Inter:wght@100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap\" rel=\"stylesheet\">\r\n <link href=\"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Inter:wght@100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap\" rel=\"stylesheet\">\r\n", styles: [":host ::ng-deep .ql-font-roboto{font-family:Roboto,sans-serif}:host ::ng-deep .ql-font-inter{font-family:Inter var,sans-serif}:host ::ng-deep .ql-tooltip.ql-editing[data-mode=video]{transform:translate(40%)}:host ::ng-deep #kv-editor-toolbar{border-radius:10px 10px 0 0}:host ::ng-deep #kv-editor{border-radius:0 0 10px 10px}.error-border-toolbar{transition:all ease-in .2s;border-top-color:#e24c4c!important;border-bottom-color:#e24c4c!important;border-left-color:#e24c4c!important;border-right-color:#e24c4c!important}.error-border{border-color:#e24c4c!important;transition:all ease-in .2s}:host ::ng-deep .blot-formatter__resize-handle{background:#eaeaea!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: KvErrorComponent, selector: "kv-error", inputs: ["formControl", "hasError"] }] }); }
5038
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvEditorComponent, selector: "kv-editor", inputs: { readonly: "readonly", canvaHeigth: "canvaHeigth", debug: "debug", contentType: "contentType" }, outputs: { onTextChange: "onTextChange", onSelectionChange: "onSelectionChange", outputRaw: "outputRaw", outputHtml: "outputHtml" }, providers: ComponentProviders(KvEditorComponent), usesInheritance: true, ngImport: i0, template: "\r\n <div class=\"kv-editor-container\" >\r\n <div #editor id=\"kv-editor-toolbar\" [ngClass]=\"{'error-border-toolbar': hasControlError()}\" >\r\n <span class=\"ql-formats\">\r\n <select class=\"ql-font\">\r\n <option value=\"roboto\">Roboto</option>\r\n <option value=\"monospace\">Monospace</option>\r\n <option value=\"inter\">Inter</option>\r\n <option selected>Sans Serif</option>\r\n <option value=\"serif\">Serif</option>\r\n </select>\r\n \r\n <select class=\"ql-header\">\r\n <option value=\"1\">Titulo</option>\r\n <option value=\"2\">Subtitulo</option>\r\n <option selected>Normal</option>\r\n </select>\r\n \r\n <span class=\"ql-format-group\">\r\n <select title=\"Size\" class=\"ql-size\">\r\n <option value=\"15px\">15px</option>\r\n <option value=\"20px\">20px</option>\r\n <option value=\"30px\">30px</option>\r\n <option value=\"40px\">40px</option>\r\n <option value=\"50px\">50px</option>\r\n <option value=\"70px\">70px</option>\r\n <option value=\"90px\">90px</option>\r\n </select>\r\n </span>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-bold\"></button>\r\n <button class=\"ql-italic\"></button>\r\n <button class=\"ql-underline\"></button>\r\n <button class=\"ql-strike\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-script\" value=\"sub\"></button>\r\n <button class=\"ql-script\" value=\"super\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-header\" value=\"1\"></button>\r\n <button class=\"ql-header\" value=\"2\"></button>\r\n <button class=\"ql-blockquote\"></button>\r\n <button class=\"ql-code-block\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-list\" value=\"ordered\"></button>\r\n <button class=\"ql-list\" value=\"bullet\"></button>\r\n <button class=\"ql-indent\" value=\"-1\"></button>\r\n <button class=\"ql-indent\" value=\"+1\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-direction\" value=\"rtl\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-link\"></button>\r\n <button class=\"ql-image\"></button>\r\n <button class=\"ql-video\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-clean\"></button>\r\n </span>\r\n </div>\r\n \r\n <div id=\"kv-editor\" [style.height]=\"canvaHeigth\" [ngClass]=\"{'error-border': hasControlError()}\" ></div>\r\n </div>\r\n <kv-error [hasError]=\"hasControlError()\">{{ erroMessage() }}</kv-error>\r\n\r\n<!------------------------------------------------------------------------------------------------------------------->\r\n\r\n <!-- <link href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\" rel=\"stylesheet\" /> -->\r\n <link href=\"https://fonts.googleapis.com/css?family=Roboto\" rel=\"stylesheet\">\r\n <script src=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.js\"></script>\r\n <script src=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js\"></script>\r\n\r\n\r\n <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\" />\r\n <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\" />\r\n <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css\" />\r\n\r\n\r\n <!-- Import fonts -->\r\n\r\n <link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin>\r\n\r\n <link href=\"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Inter:wght@100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap\" rel=\"stylesheet\">\r\n <link href=\"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Inter:wght@100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap\" rel=\"stylesheet\">\r\n", styles: [":host ::ng-deep .ql-font-roboto{font-family:Roboto,sans-serif}:host ::ng-deep .ql-font-inter{font-family:Inter var,sans-serif}:host ::ng-deep .ql-tooltip.ql-editing[data-mode=video]{transform:translate(40%)}:host ::ng-deep #kv-editor-toolbar{border-radius:10px 10px 0 0}:host ::ng-deep #kv-editor{border-radius:0 0 10px 10px}.error-border-toolbar{transition:all ease-in .2s;border-top-color:#e24c4c!important;border-bottom-color:#e24c4c!important;border-left-color:#e24c4c!important;border-right-color:#e24c4c!important}.error-border{border-color:#e24c4c!important;transition:all ease-in .2s}:host ::ng-deep .blot-formatter__resize-handle{background:#eaeaea!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: KvErrorComponent, selector: "kv-error", inputs: ["formControl", "hasError"] }] }); }
5024
5039
  }
5025
5040
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvEditorComponent, decorators: [{
5026
5041
  type: Component,
5027
- args: [{ selector: 'kv-editor', providers: ComponentProviders(KvEditorComponent), template: "\r\n <div class=\"kv-editor-container\">\r\n <div #editor id=\"kv-editor-toolbar\" [ngClass]=\"{'error-border-toolbar': hasControlError()}\" >\r\n <span class=\"ql-formats\">\r\n <select class=\"ql-font\">\r\n <option value=\"roboto\">Roboto</option>\r\n <option value=\"monospace\">Monospace</option>\r\n <option value=\"inter\">Inter</option>\r\n <option selected>Sans Serif</option>\r\n <option value=\"serif\">Serif</option>\r\n </select>\r\n \r\n <select class=\"ql-header\">\r\n <option value=\"1\">Titulo</option>\r\n <option value=\"2\">Subtitulo</option>\r\n <option selected>Normal</option>\r\n </select>\r\n \r\n <span class=\"ql-format-group\">\r\n <select title=\"Size\" class=\"ql-size\">\r\n <option value=\"15px\">15px</option>\r\n <option value=\"20px\">20px</option>\r\n <option value=\"30px\">30px</option>\r\n <option value=\"40px\">40px</option>\r\n <option value=\"50px\">50px</option>\r\n <option value=\"70px\">70px</option>\r\n <option value=\"90px\">90px</option>\r\n </select>\r\n </span>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-bold\"></button>\r\n <button class=\"ql-italic\"></button>\r\n <button class=\"ql-underline\"></button>\r\n <button class=\"ql-strike\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-script\" value=\"sub\"></button>\r\n <button class=\"ql-script\" value=\"super\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-header\" value=\"1\"></button>\r\n <button class=\"ql-header\" value=\"2\"></button>\r\n <button class=\"ql-blockquote\"></button>\r\n <button class=\"ql-code-block\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-list\" value=\"ordered\"></button>\r\n <button class=\"ql-list\" value=\"bullet\"></button>\r\n <button class=\"ql-indent\" value=\"-1\"></button>\r\n <button class=\"ql-indent\" value=\"+1\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-direction\" value=\"rtl\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-link\"></button>\r\n <button class=\"ql-image\"></button>\r\n <button class=\"ql-video\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-clean\"></button>\r\n </span>\r\n </div>\r\n \r\n <div id=\"kv-editor\" [style.height]=\"canvaHeigth\" [ngClass]=\"{'error-border': hasControlError()}\" ></div>\r\n </div>\r\n <kv-error [hasError]=\"hasControlError()\">{{ erroMessage() }}</kv-error>\r\n\r\n<!------------------------------------------------------------------------------------------------------------------->\r\n\r\n <!-- <link href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\" rel=\"stylesheet\" /> -->\r\n <link href=\"https://fonts.googleapis.com/css?family=Roboto\" rel=\"stylesheet\">\r\n <script src=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.js\"></script>\r\n <script src=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js\"></script>\r\n\r\n\r\n <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\" />\r\n <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\" />\r\n <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css\" />\r\n\r\n\r\n <!-- Import fonts -->\r\n\r\n <link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin>\r\n\r\n <link href=\"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Inter:wght@100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap\" rel=\"stylesheet\">\r\n <link href=\"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Inter:wght@100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap\" rel=\"stylesheet\">\r\n", styles: [":host ::ng-deep .ql-font-roboto{font-family:Roboto,sans-serif}:host ::ng-deep .ql-font-inter{font-family:Inter var,sans-serif}:host ::ng-deep .ql-tooltip.ql-editing[data-mode=video]{transform:translate(40%)}:host ::ng-deep #kv-editor-toolbar{border-radius:10px 10px 0 0}:host ::ng-deep #kv-editor{border-radius:0 0 10px 10px}.error-border-toolbar{transition:all ease-in .2s;border-top-color:#e24c4c!important;border-bottom-color:#e24c4c!important;border-left-color:#e24c4c!important;border-right-color:#e24c4c!important}.error-border{border-color:#e24c4c!important;transition:all ease-in .2s}:host ::ng-deep .blot-formatter__resize-handle{background:#eaeaea!important}\n"] }]
5042
+ args: [{ selector: 'kv-editor', providers: ComponentProviders(KvEditorComponent), template: "\r\n <div class=\"kv-editor-container\" >\r\n <div #editor id=\"kv-editor-toolbar\" [ngClass]=\"{'error-border-toolbar': hasControlError()}\" >\r\n <span class=\"ql-formats\">\r\n <select class=\"ql-font\">\r\n <option value=\"roboto\">Roboto</option>\r\n <option value=\"monospace\">Monospace</option>\r\n <option value=\"inter\">Inter</option>\r\n <option selected>Sans Serif</option>\r\n <option value=\"serif\">Serif</option>\r\n </select>\r\n \r\n <select class=\"ql-header\">\r\n <option value=\"1\">Titulo</option>\r\n <option value=\"2\">Subtitulo</option>\r\n <option selected>Normal</option>\r\n </select>\r\n \r\n <span class=\"ql-format-group\">\r\n <select title=\"Size\" class=\"ql-size\">\r\n <option value=\"15px\">15px</option>\r\n <option value=\"20px\">20px</option>\r\n <option value=\"30px\">30px</option>\r\n <option value=\"40px\">40px</option>\r\n <option value=\"50px\">50px</option>\r\n <option value=\"70px\">70px</option>\r\n <option value=\"90px\">90px</option>\r\n </select>\r\n </span>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-bold\"></button>\r\n <button class=\"ql-italic\"></button>\r\n <button class=\"ql-underline\"></button>\r\n <button class=\"ql-strike\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-script\" value=\"sub\"></button>\r\n <button class=\"ql-script\" value=\"super\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-header\" value=\"1\"></button>\r\n <button class=\"ql-header\" value=\"2\"></button>\r\n <button class=\"ql-blockquote\"></button>\r\n <button class=\"ql-code-block\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-list\" value=\"ordered\"></button>\r\n <button class=\"ql-list\" value=\"bullet\"></button>\r\n <button class=\"ql-indent\" value=\"-1\"></button>\r\n <button class=\"ql-indent\" value=\"+1\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-direction\" value=\"rtl\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-link\"></button>\r\n <button class=\"ql-image\"></button>\r\n <button class=\"ql-video\"></button>\r\n </span>\r\n \r\n <span class=\"ql-formats\">\r\n <button class=\"ql-clean\"></button>\r\n </span>\r\n </div>\r\n \r\n <div id=\"kv-editor\" [style.height]=\"canvaHeigth\" [ngClass]=\"{'error-border': hasControlError()}\" ></div>\r\n </div>\r\n <kv-error [hasError]=\"hasControlError()\">{{ erroMessage() }}</kv-error>\r\n\r\n<!------------------------------------------------------------------------------------------------------------------->\r\n\r\n <!-- <link href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\" rel=\"stylesheet\" /> -->\r\n <link href=\"https://fonts.googleapis.com/css?family=Roboto\" rel=\"stylesheet\">\r\n <script src=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.js\"></script>\r\n <script src=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js\"></script>\r\n\r\n\r\n <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\" />\r\n <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\" />\r\n <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css\" />\r\n\r\n\r\n <!-- Import fonts -->\r\n\r\n <link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin>\r\n\r\n <link href=\"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Inter:wght@100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap\" rel=\"stylesheet\">\r\n <link href=\"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Inter:wght@100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap\" rel=\"stylesheet\">\r\n", styles: [":host ::ng-deep .ql-font-roboto{font-family:Roboto,sans-serif}:host ::ng-deep .ql-font-inter{font-family:Inter var,sans-serif}:host ::ng-deep .ql-tooltip.ql-editing[data-mode=video]{transform:translate(40%)}:host ::ng-deep #kv-editor-toolbar{border-radius:10px 10px 0 0}:host ::ng-deep #kv-editor{border-radius:0 0 10px 10px}.error-border-toolbar{transition:all ease-in .2s;border-top-color:#e24c4c!important;border-bottom-color:#e24c4c!important;border-left-color:#e24c4c!important;border-right-color:#e24c4c!important}.error-border{border-color:#e24c4c!important;transition:all ease-in .2s}:host ::ng-deep .blot-formatter__resize-handle{background:#eaeaea!important}\n"] }]
5028
5043
  }], ctorParameters: () => [{ type: ComponentService }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { readonly: [{
5029
5044
  type: Input
5030
5045
  }], canvaHeigth: [{
@@ -7220,13 +7235,11 @@ class ProgressBarComponent {
7220
7235
  constructor() {
7221
7236
  /**
7222
7237
  * Whether to display the progress bar value.
7223
- * @deprecated Use showValue instead.
7224
7238
  * @group Props
7225
7239
  */
7226
7240
  this.showValue = true;
7227
7241
  /**
7228
7242
  * Whether to display the progress bar value.
7229
- * @deprecated Use showValue instead.
7230
7243
  * @group Props
7231
7244
  */
7232
7245
  this.showLabel = true;
@@ -7242,11 +7255,11 @@ class ProgressBarComponent {
7242
7255
  this.mode = 'determinate';
7243
7256
  }
7244
7257
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
7245
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: ProgressBarComponent, selector: "kv-progress-bar", inputs: { value: "value", maxValue: "maxValue", label: "label", showValue: "showValue", showLabel: "showLabel", styleClass: "styleClass", labelStyleClass: "labelStyleClass", barStyleClass: "barStyleClass", style: "style", unit: "unit", mode: "mode", color: "color", progressBarHeight: "progressBarHeight" }, ngImport: i0, template: "<div\r\n role=\"progressbar\"\r\n [class]=\"styleClass ? styleClass : ''\"\r\n [attr.aria-valuemin]=\"0\"\r\n [attr.aria-valuenow]=\"value\"\r\n [attr.aria-valuemax]=\"100\"\r\n [attr.data-pc-name]=\"'progressbar'\"\r\n [attr.data-pc-section]=\"'root'\"\r\n [ngClass]=\"{'p-progressbar p-component': true, 'p-progressbar-determinate': mode === 'determinate', 'p-progressbar-indeterminate': mode === 'indeterminate'}\"\r\n [style.--progress-bar-height]=\"progressBarHeight\"\r\n>\r\n @if(mode === 'determinate') {\r\n <div class=\"p-progressbar-value p-progressbar-value-animate {{ barStyleClass }} font-semibold\"\r\n [style.width]=\"maxValue && value ? (value / maxValue) * 100 + '%' : value + '%'\"\r\n [attr.data-pc-section]=\"'value'\"\r\n >\r\n @if(label){\r\n <p class=\"text-center font-semibold text-white\">\r\n {{ label }}\r\n </p>\r\n }\r\n @else {\r\n <p style=\"color: white;\">\r\n {{ maxValue ? value + '/' + maxValue : value?.toFixed(1) + '%' }}\r\n </p>\r\n }\r\n</div>\r\n\r\n <div\r\n class=\"p-progressbar-label {{ labelStyleClass }} w-full\"\r\n [attr.data-pc-section]=\"'label'\"\r\n >\r\n </div>\r\n } @if(mode === 'indeterminate') {\r\n <div\r\n class=\"p-progressbar-indeterminate-container\"\r\n [attr.data-pc-section]=\"'container'\"\r\n >\r\n <div\r\n class=\"p-progressbar-value p-progressbar-value-animate\"\r\n [style.background]=\"color\"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n </div>\r\n }\r\n</div>\r\n", styles: ["@layer primeng{.p-progressbar{background-color:#cbd5e1!important;position:relative;overflow:hidden;height:var(--progress-bar-height, .3rem)}.p-progressbar-determinate .p-progressbar-value{height:100%;width:0%;position:absolute;display:none;border:0 none;display:flex;align-items:center;justify-content:center;overflow:hidden}.p-progressbar-determinate .p-progressbar-label{font-size:.75rem;color:#fff!important;font-weight:400;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center}.p-progressbar-determinate .p-progressbar-value-animate{background-color:#002542!important;transition:width 1s ease-in-out;border-radius:.2rem}.p-progressbar-indeterminate .p-progressbar-value:before{background-color:#002542!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite;animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.p-progressbar-indeterminate .p-progressbar-value:after{background-color:#002542!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;-webkit-animation-delay:1.15s;animation-delay:1.15s}}@-webkit-keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@-webkit-keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}@keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
7258
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: ProgressBarComponent, selector: "kv-progress-bar", inputs: { value: "value", maxValue: "maxValue", label: "label", showValue: "showValue", showLabel: "showLabel", styleClass: "styleClass", labelStyleClass: "labelStyleClass", barStyleClass: "barStyleClass", style: "style", unit: "unit", mode: "mode", color: "color" }, ngImport: i0, template: "<div\r\n role=\"progressbar\"\r\n [class]=\"styleClass ? styleClass : ''\"\r\n [ngStyle]=\"style\"\r\n [attr.aria-valuemin]=\"0\"\r\n [attr.aria-valuenow]=\"value\"\r\n [attr.aria-valuemax]=\"100\"\r\n [attr.data-pc-name]=\"'progressbar'\"\r\n [attr.data-pc-section]=\"'root'\"\r\n [ngClass]=\"{'p-progressbar p-component': true, 'p-progressbar-determinate': mode === 'determinate', 'p-progressbar-indeterminate': mode === 'indeterminate'}\"\r\n>\r\n @if(mode === 'determinate') {\r\n <div class=\"p-progressbar-value p-progressbar-value-animate {{ barStyleClass }} font-semibold\"\r\n [style.width]=\"maxValue && value ? (value / maxValue) * 100 + '%' : value + '%'\"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n\r\n <div\r\n class=\"p-progressbar-label {{ labelStyleClass }} w-full\"\r\n [attr.data-pc-section]=\"'label'\"\r\n >\r\n <label *ngIf=\"showValue && maxValue\">{{ value }}/{{ maxValue }}</label>\r\n <label *ngIf=\"showValue && !maxValue\">{{ value }}%</label>\r\n <label *ngIf=\"showLabel\">{{ label }}</label>\r\n </div>\r\n } @if(mode === 'indeterminate') {\r\n <div\r\n class=\"p-progressbar-indeterminate-container\"\r\n [attr.data-pc-section]=\"'container'\"\r\n >\r\n <div\r\n class=\"p-progressbar-value p-progressbar-value-animate\"\r\n [style.background]=\"color\"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n </div>\r\n }\r\n</div>\r\n", styles: ["@layer primeng{.p-progressbar{background-color:#adadad!important;position:relative;overflow:hidden;height:.875rem}.p-progressbar-determinate .p-progressbar-value{height:100%;width:0%;position:absolute;display:none;border:0 none;display:flex;align-items:center;justify-content:center;overflow:hidden}.p-progressbar-determinate .p-progressbar-label{font-size:.75rem;color:#fff!important;font-weight:400;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center}.p-progressbar-determinate .p-progressbar-value-animate{background-color:#004172!important;transition:width 1s ease-in-out}.p-progressbar-indeterminate .p-progressbar-value:before{background-color:#004172!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite;animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.p-progressbar-indeterminate .p-progressbar-value:after{background-color:#004172!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;-webkit-animation-delay:1.15s;animation-delay:1.15s}}@-webkit-keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@-webkit-keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}@keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
7246
7259
  }
7247
7260
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: ProgressBarComponent, decorators: [{
7248
7261
  type: Component,
7249
- args: [{ selector: 'kv-progress-bar', template: "<div\r\n role=\"progressbar\"\r\n [class]=\"styleClass ? styleClass : ''\"\r\n [attr.aria-valuemin]=\"0\"\r\n [attr.aria-valuenow]=\"value\"\r\n [attr.aria-valuemax]=\"100\"\r\n [attr.data-pc-name]=\"'progressbar'\"\r\n [attr.data-pc-section]=\"'root'\"\r\n [ngClass]=\"{'p-progressbar p-component': true, 'p-progressbar-determinate': mode === 'determinate', 'p-progressbar-indeterminate': mode === 'indeterminate'}\"\r\n [style.--progress-bar-height]=\"progressBarHeight\"\r\n>\r\n @if(mode === 'determinate') {\r\n <div class=\"p-progressbar-value p-progressbar-value-animate {{ barStyleClass }} font-semibold\"\r\n [style.width]=\"maxValue && value ? (value / maxValue) * 100 + '%' : value + '%'\"\r\n [attr.data-pc-section]=\"'value'\"\r\n >\r\n @if(label){\r\n <p class=\"text-center font-semibold text-white\">\r\n {{ label }}\r\n </p>\r\n }\r\n @else {\r\n <p style=\"color: white;\">\r\n {{ maxValue ? value + '/' + maxValue : value?.toFixed(1) + '%' }}\r\n </p>\r\n }\r\n</div>\r\n\r\n <div\r\n class=\"p-progressbar-label {{ labelStyleClass }} w-full\"\r\n [attr.data-pc-section]=\"'label'\"\r\n >\r\n </div>\r\n } @if(mode === 'indeterminate') {\r\n <div\r\n class=\"p-progressbar-indeterminate-container\"\r\n [attr.data-pc-section]=\"'container'\"\r\n >\r\n <div\r\n class=\"p-progressbar-value p-progressbar-value-animate\"\r\n [style.background]=\"color\"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n </div>\r\n }\r\n</div>\r\n", styles: ["@layer primeng{.p-progressbar{background-color:#cbd5e1!important;position:relative;overflow:hidden;height:var(--progress-bar-height, .3rem)}.p-progressbar-determinate .p-progressbar-value{height:100%;width:0%;position:absolute;display:none;border:0 none;display:flex;align-items:center;justify-content:center;overflow:hidden}.p-progressbar-determinate .p-progressbar-label{font-size:.75rem;color:#fff!important;font-weight:400;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center}.p-progressbar-determinate .p-progressbar-value-animate{background-color:#002542!important;transition:width 1s ease-in-out;border-radius:.2rem}.p-progressbar-indeterminate .p-progressbar-value:before{background-color:#002542!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite;animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.p-progressbar-indeterminate .p-progressbar-value:after{background-color:#002542!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;-webkit-animation-delay:1.15s;animation-delay:1.15s}}@-webkit-keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@-webkit-keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}@keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}\n"] }]
7262
+ args: [{ selector: 'kv-progress-bar', template: "<div\r\n role=\"progressbar\"\r\n [class]=\"styleClass ? styleClass : ''\"\r\n [ngStyle]=\"style\"\r\n [attr.aria-valuemin]=\"0\"\r\n [attr.aria-valuenow]=\"value\"\r\n [attr.aria-valuemax]=\"100\"\r\n [attr.data-pc-name]=\"'progressbar'\"\r\n [attr.data-pc-section]=\"'root'\"\r\n [ngClass]=\"{'p-progressbar p-component': true, 'p-progressbar-determinate': mode === 'determinate', 'p-progressbar-indeterminate': mode === 'indeterminate'}\"\r\n>\r\n @if(mode === 'determinate') {\r\n <div class=\"p-progressbar-value p-progressbar-value-animate {{ barStyleClass }} font-semibold\"\r\n [style.width]=\"maxValue && value ? (value / maxValue) * 100 + '%' : value + '%'\"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n\r\n <div\r\n class=\"p-progressbar-label {{ labelStyleClass }} w-full\"\r\n [attr.data-pc-section]=\"'label'\"\r\n >\r\n <label *ngIf=\"showValue && maxValue\">{{ value }}/{{ maxValue }}</label>\r\n <label *ngIf=\"showValue && !maxValue\">{{ value }}%</label>\r\n <label *ngIf=\"showLabel\">{{ label }}</label>\r\n </div>\r\n } @if(mode === 'indeterminate') {\r\n <div\r\n class=\"p-progressbar-indeterminate-container\"\r\n [attr.data-pc-section]=\"'container'\"\r\n >\r\n <div\r\n class=\"p-progressbar-value p-progressbar-value-animate\"\r\n [style.background]=\"color\"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n </div>\r\n }\r\n</div>\r\n", styles: ["@layer primeng{.p-progressbar{background-color:#adadad!important;position:relative;overflow:hidden;height:.875rem}.p-progressbar-determinate .p-progressbar-value{height:100%;width:0%;position:absolute;display:none;border:0 none;display:flex;align-items:center;justify-content:center;overflow:hidden}.p-progressbar-determinate .p-progressbar-label{font-size:.75rem;color:#fff!important;font-weight:400;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center}.p-progressbar-determinate .p-progressbar-value-animate{background-color:#004172!important;transition:width 1s ease-in-out}.p-progressbar-indeterminate .p-progressbar-value:before{background-color:#004172!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite;animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.p-progressbar-indeterminate .p-progressbar-value:after{background-color:#004172!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;-webkit-animation-delay:1.15s;animation-delay:1.15s}}@-webkit-keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@-webkit-keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}@keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}\n"] }]
7250
7263
  }], propDecorators: { value: [{
7251
7264
  type: Input
7252
7265
  }], maxValue: [{
@@ -7271,8 +7284,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
7271
7284
  type: Input
7272
7285
  }], color: [{
7273
7286
  type: Input
7274
- }], progressBarHeight: [{
7275
- type: Input
7276
7287
  }] } });
7277
7288
 
7278
7289
  class KvProgressBarModule {
@@ -9721,6 +9732,88 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
9721
9732
  }]
9722
9733
  }] });
9723
9734
 
9735
+ class KvProgressBarAlternativeComponent {
9736
+ constructor() {
9737
+ /**
9738
+ * Whether to display the progress bar value.
9739
+ * @deprecated Use showValue instead.
9740
+ * @group Props
9741
+ */
9742
+ this.showValue = true;
9743
+ /**
9744
+ * Whether to display the progress bar value.
9745
+ * @deprecated Use showValue instead.
9746
+ * @group Props
9747
+ */
9748
+ this.showLabel = true;
9749
+ /**
9750
+ * Unit sign appended to the value.
9751
+ * @group Props
9752
+ */
9753
+ this.unit = '%';
9754
+ /**
9755
+ * Defines the mode of the progress
9756
+ * @group Props
9757
+ */
9758
+ this.mode = 'determinate';
9759
+ }
9760
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvProgressBarAlternativeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
9761
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvProgressBarAlternativeComponent, selector: "kv-progress-bar-alternative", inputs: { value: "value", maxValue: "maxValue", label: "label", showValue: "showValue", showLabel: "showLabel", styleClass: "styleClass", labelStyleClass: "labelStyleClass", barStyleClass: "barStyleClass", style: "style", unit: "unit", mode: "mode", color: "color", progressBarHeight: "progressBarHeight" }, ngImport: i0, template: "<div\r\n role=\"progressbar\"\r\n [class]=\"styleClass ? styleClass : ''\"\r\n [attr.aria-valuemin]=\"0\"\r\n [attr.aria-valuenow]=\"value\"\r\n [attr.aria-valuemax]=\"100\"\r\n [attr.data-pc-name]=\"'progressbar'\"\r\n [attr.data-pc-section]=\"'root'\"\r\n [ngClass]=\"{\r\n 'p-progressbar p-component': true,\r\n 'p-progressbar-determinate': mode === 'determinate',\r\n 'p-progressbar-indeterminate': mode === 'indeterminate'\r\n }\"\r\n [style.--progress-bar-height]=\"progressBarHeight\"\r\n>\r\n @if(mode === 'determinate') {\r\n <div\r\n class=\"p-progressbar-value p-progressbar-value-animate {{\r\n barStyleClass\r\n }} font-semibold\"\r\n [style.width]=\"\r\n maxValue && value ? (value / maxValue) * 100 + '%' : value + '%'\r\n \"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n\r\n <div\r\n class=\"p-progressbar-label {{ labelStyleClass }} w-full\"\r\n [attr.data-pc-section]=\"'label'\"\r\n ></div>\r\n } @if(mode === 'indeterminate') {\r\n <div\r\n class=\"p-progressbar-indeterminate-container\"\r\n [attr.data-pc-section]=\"'container'\"\r\n >\r\n <div\r\n class=\"p-progressbar-value p-progressbar-value-animate\"\r\n [style.background]=\"color\"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n </div>\r\n }\r\n</div>\r\n", styles: ["@layer primeng{.p-progressbar{background-color:#cbd5e1!important;position:relative;overflow:hidden;height:var(--progress-bar-height, .3rem)}.p-progressbar-determinate .p-progressbar-value{height:100%;width:0%;position:absolute;display:none;border:0 none;display:flex;align-items:center;justify-content:center;overflow:hidden}.p-progressbar-determinate .p-progressbar-label{font-size:.75rem;color:#fff!important;font-weight:400;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center}.p-progressbar-determinate .p-progressbar-value-animate{background-color:#002542!important;transition:width 1s ease-in-out;border-radius:.2rem}.p-progressbar-indeterminate .p-progressbar-value:before{background-color:#002542!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite;animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.p-progressbar-indeterminate .p-progressbar-value:after{background-color:#002542!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;-webkit-animation-delay:1.15s;animation-delay:1.15s}}@-webkit-keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@-webkit-keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}@keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
9762
+ }
9763
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvProgressBarAlternativeComponent, decorators: [{
9764
+ type: Component,
9765
+ args: [{ selector: 'kv-progress-bar-alternative', standalone: false, template: "<div\r\n role=\"progressbar\"\r\n [class]=\"styleClass ? styleClass : ''\"\r\n [attr.aria-valuemin]=\"0\"\r\n [attr.aria-valuenow]=\"value\"\r\n [attr.aria-valuemax]=\"100\"\r\n [attr.data-pc-name]=\"'progressbar'\"\r\n [attr.data-pc-section]=\"'root'\"\r\n [ngClass]=\"{\r\n 'p-progressbar p-component': true,\r\n 'p-progressbar-determinate': mode === 'determinate',\r\n 'p-progressbar-indeterminate': mode === 'indeterminate'\r\n }\"\r\n [style.--progress-bar-height]=\"progressBarHeight\"\r\n>\r\n @if(mode === 'determinate') {\r\n <div\r\n class=\"p-progressbar-value p-progressbar-value-animate {{\r\n barStyleClass\r\n }} font-semibold\"\r\n [style.width]=\"\r\n maxValue && value ? (value / maxValue) * 100 + '%' : value + '%'\r\n \"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n\r\n <div\r\n class=\"p-progressbar-label {{ labelStyleClass }} w-full\"\r\n [attr.data-pc-section]=\"'label'\"\r\n ></div>\r\n } @if(mode === 'indeterminate') {\r\n <div\r\n class=\"p-progressbar-indeterminate-container\"\r\n [attr.data-pc-section]=\"'container'\"\r\n >\r\n <div\r\n class=\"p-progressbar-value p-progressbar-value-animate\"\r\n [style.background]=\"color\"\r\n [attr.data-pc-section]=\"'value'\"\r\n ></div>\r\n </div>\r\n }\r\n</div>\r\n", styles: ["@layer primeng{.p-progressbar{background-color:#cbd5e1!important;position:relative;overflow:hidden;height:var(--progress-bar-height, .3rem)}.p-progressbar-determinate .p-progressbar-value{height:100%;width:0%;position:absolute;display:none;border:0 none;display:flex;align-items:center;justify-content:center;overflow:hidden}.p-progressbar-determinate .p-progressbar-label{font-size:.75rem;color:#fff!important;font-weight:400;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center}.p-progressbar-determinate .p-progressbar-value-animate{background-color:#002542!important;transition:width 1s ease-in-out;border-radius:.2rem}.p-progressbar-indeterminate .p-progressbar-value:before{background-color:#002542!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite;animation:p-progressbar-indeterminate-anim 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.p-progressbar-indeterminate .p-progressbar-value:after{background-color:#002542!important;content:\"\";position:absolute;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;-webkit-animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation:p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;-webkit-animation-delay:1.15s;animation-delay:1.15s}}@-webkit-keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes p-progressbar-indeterminate-anim{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@-webkit-keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}@keyframes p-progressbar-indeterminate-anim-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}\n"] }]
9766
+ }], propDecorators: { value: [{
9767
+ type: Input
9768
+ }], maxValue: [{
9769
+ type: Input
9770
+ }], label: [{
9771
+ type: Input
9772
+ }], showValue: [{
9773
+ type: Input
9774
+ }], showLabel: [{
9775
+ type: Input
9776
+ }], styleClass: [{
9777
+ type: Input
9778
+ }], labelStyleClass: [{
9779
+ type: Input
9780
+ }], barStyleClass: [{
9781
+ type: Input
9782
+ }], style: [{
9783
+ type: Input
9784
+ }], unit: [{
9785
+ type: Input
9786
+ }], mode: [{
9787
+ type: Input
9788
+ }], color: [{
9789
+ type: Input
9790
+ }], progressBarHeight: [{
9791
+ type: Input
9792
+ }] } });
9793
+
9794
+ class KvProgressBarAlternativeModule {
9795
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvProgressBarAlternativeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
9796
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvProgressBarAlternativeModule, declarations: [KvProgressBarAlternativeComponent], imports: [CommonModule,
9797
+ PrimeNgModule], exports: [KvProgressBarAlternativeComponent] }); }
9798
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvProgressBarAlternativeModule, imports: [CommonModule,
9799
+ PrimeNgModule] }); }
9800
+ }
9801
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvProgressBarAlternativeModule, decorators: [{
9802
+ type: NgModule,
9803
+ args: [{
9804
+ declarations: [
9805
+ KvProgressBarAlternativeComponent
9806
+ ],
9807
+ imports: [
9808
+ CommonModule,
9809
+ PrimeNgModule,
9810
+ ],
9811
+ exports: [
9812
+ KvProgressBarAlternativeComponent
9813
+ ]
9814
+ }]
9815
+ }] });
9816
+
9724
9817
  class KvFileUploadComponent {
9725
9818
  constructor(notificationService) {
9726
9819
  this.notificationService = notificationService;
@@ -10225,5 +10318,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
10225
10318
  * Generated bundle index. Do not edit.
10226
10319
  */
10227
10320
 
10228
- export { BaseApiService, BaseChartComponent, BaseComponent, BaseComponentButton, BaseComponentCrud, BaseComponentCrudForm, BaseComponentCrudList, BaseComponentDropDown, BaseComponentDropDownExternal, BaseComponentInput, BaseComponentMultiSelect, BasecomponentTable, BreadcrumbsService, CapitalizePipe, ChatService, ComponentProviders, ComponentService, CpfCnpjPipe, DocsService, DragDirective, DynamicInputDirective, FormService, ImageCutterService, ImagensService, KeevoComponentsModule, KeevoValidators, KvAvatarComponent, KvAvatarModule, KvButtonComponent, KvButtonModule, KvButtonPersonalizeComponent, KvButtonPopupComponent, KvButtonSecondaryComponent, KvButtonSuccessComponent, KvButtonsModule, KvCardSelectionComponent, KvCardSelectionModule, KvCarouselComponent, KvCarouselModule, KvChartComponent, KvChartModule, KvCheckComponent, KvContentViewerComponent, KvContentViewerModule, KvDropdownComponent, KvEditorComponent, KvErrorComponent, KvFileUploadComponent, KvFileUploadModule, KvFileViewerComponent, KvFileViewerModule, KvFileViewerNovoComponent, KvFileViewerNovoModule, KvFilterCardComponent, KvFilterCardModule, KvFilterFieldsetComponent, KvFilterFieldsetModule, KvGIconComponent, KvGIconModule, KvHomeCardComponent, KvHomeCardModule, KvImageUploadComponent, KvImageUploadModule, KvInputCalendarComponent, KvInputMaskComponent, KvInputNumberAddonComponent, KvInputNumberComponent, KvInputPasswordComponent, KvInputTextAddonComponent, KvInputTextCheckboxComponent, KvInputTextComponent, KvInputTextareaComponent, KvInputTimeComponent, KvInputsModule, KvLayoutComponent, KvLayoutModule, KvLoaderComponent, KvLoaderModule, KvLoaderService, KvLoginComponent, KvLoginModule, KvModalComponent, KvModalModule, KvMultiSelectComponent, KvOrgchartComponent, KvOrgchartModule, KvPageFormComponent, KvPageFormModule, KvPageStepperComponent, KvPageStepperodule, KvPickListComponent, KvPickListModule, KvProgressBarModule, KvRadioGroupComponent, KvReportComponent, KvReportModule, KvSelectButtonComponent, KvSelectButtonsComponent, KvStepperComponent, KvStepperModule, KvSwitchComponent, KvTableComponent, KvTableEditComponent, KvTableEditModule, KvTableExpandableComponent, KvTableExpandableModule, KvTableModule, KvTagComponent, KvTagModule, KvTreeMultiSelectComponent, KvTreeViewComponent, KvTreetableComponent, KvTreetableModule, KvWorkspaceModule, KvtreeViewModule, MaskPipe, NotificationService, ObjectService, OrgChartService, PeriodosChart, PipesModule, PrimeNgModule, ProgressBarComponent, TablePaginate, TelefonePipe, TemplateDirective, TranslatePrimeng, WorkspaceComponent, getOrExecute, kvErrorModule, loading, mapToMenuItem };
10321
+ export { BaseApiService, BaseChartComponent, BaseComponent, BaseComponentButton, BaseComponentCrud, BaseComponentCrudForm, BaseComponentCrudList, BaseComponentDropDown, BaseComponentDropDownExternal, BaseComponentInput, BaseComponentMultiSelect, BasecomponentTable, BreadcrumbsService, CapitalizePipe, ChatService, ComponentProviders, ComponentService, CpfCnpjPipe, DocsService, DragDirective, DynamicInputDirective, FormService, ImageCutterService, ImagensService, KeevoComponentsModule, KeevoValidators, KvAvatarComponent, KvAvatarModule, KvButtonComponent, KvButtonModule, KvButtonPersonalizeComponent, KvButtonPopupComponent, KvButtonSecondaryComponent, KvButtonSuccessComponent, KvButtonsModule, KvCardSelectionComponent, KvCardSelectionModule, KvCarouselComponent, KvCarouselModule, KvChartComponent, KvChartModule, KvCheckComponent, KvContentViewerComponent, KvContentViewerModule, KvDropdownComponent, KvEditorComponent, KvErrorComponent, KvFileUploadComponent, KvFileUploadModule, KvFileViewerComponent, KvFileViewerModule, KvFileViewerNovoComponent, KvFileViewerNovoModule, KvFilterCardComponent, KvFilterCardModule, KvFilterFieldsetComponent, KvFilterFieldsetModule, KvGIconComponent, KvGIconModule, KvHomeCardComponent, KvHomeCardModule, KvImageUploadComponent, KvImageUploadModule, KvInputCalendarComponent, KvInputMaskComponent, KvInputNumberAddonComponent, KvInputNumberComponent, KvInputPasswordComponent, KvInputTextAddonComponent, KvInputTextCheckboxComponent, KvInputTextComponent, KvInputTextareaComponent, KvInputTimeComponent, KvInputsModule, KvLayoutComponent, KvLayoutModule, KvLoaderComponent, KvLoaderModule, KvLoaderService, KvLoginComponent, KvLoginModule, KvModalComponent, KvModalModule, KvMultiSelectComponent, KvOrgchartComponent, KvOrgchartModule, KvPageFormComponent, KvPageFormModule, KvPageStepperComponent, KvPageStepperodule, KvPickListComponent, KvPickListModule, KvProgressBarAlternativeComponent, KvProgressBarAlternativeModule, KvProgressBarModule, KvRadioGroupComponent, KvReportComponent, KvReportModule, KvSelectButtonComponent, KvSelectButtonsComponent, KvStepperComponent, KvStepperModule, KvSwitchComponent, KvTableComponent, KvTableEditComponent, KvTableEditModule, KvTableExpandableComponent, KvTableExpandableModule, KvTableModule, KvTagComponent, KvTagModule, KvTreeMultiSelectComponent, KvTreeViewComponent, KvTreetableComponent, KvTreetableModule, KvWorkspaceModule, KvtreeViewModule, MaskPipe, NotificationService, ObjectService, OrgChartService, PeriodosChart, PipesModule, PrimeNgModule, ProgressBarComponent, TablePaginate, TelefonePipe, TemplateDirective, TranslatePrimeng, WorkspaceComponent, getOrExecute, kvErrorModule, loading, mapToMenuItem };
10229
10322
  //# sourceMappingURL=keevo-components.mjs.map