keevo-components 2.0.69 → 2.0.71
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/components/kv-inputs/kv-editor/kv-editor.component.mjs +13 -3
- package/esm2022/lib/components/kv-page-form/kv-page-form.component.mjs +3 -3
- package/fesm2022/keevo-components.mjs +14 -4
- package/fesm2022/keevo-components.mjs.map +1 -1
- package/lib/components/kv-inputs/kv-editor/kv-editor.component.d.ts +2 -0
- package/package.json +1 -1
|
@@ -4913,6 +4913,7 @@ class KvEditorComponent extends BaseComponentInput {
|
|
|
4913
4913
|
this.updatingEditor = false;
|
|
4914
4914
|
this.initLoadComplete = signal(false);
|
|
4915
4915
|
this.isLoading = signal(true);
|
|
4916
|
+
this.editorToolbarHeight = signal('3rem');
|
|
4916
4917
|
this.editorReadyPromise = new Promise((resolve) => {
|
|
4917
4918
|
this.editorReadyResolver = resolve;
|
|
4918
4919
|
});
|
|
@@ -4929,6 +4930,9 @@ class KvEditorComponent extends BaseComponentInput {
|
|
|
4929
4930
|
setTimeout(() => {
|
|
4930
4931
|
this.isLoading.set(false);
|
|
4931
4932
|
}, 1000);
|
|
4933
|
+
setTimeout(() => {
|
|
4934
|
+
this.getEditorSize();
|
|
4935
|
+
}, 1050);
|
|
4932
4936
|
}
|
|
4933
4937
|
async handleInit() {
|
|
4934
4938
|
await this.loadCss();
|
|
@@ -5049,12 +5053,18 @@ class KvEditorComponent extends BaseComponentInput {
|
|
|
5049
5053
|
this.updatingEditor = false;
|
|
5050
5054
|
}
|
|
5051
5055
|
}
|
|
5056
|
+
getEditorSize() {
|
|
5057
|
+
let editorFieldHeight = document.getElementById('kv-editor-toolbar')?.offsetHeight;
|
|
5058
|
+
console.log('editorFieldHeight', editorFieldHeight);
|
|
5059
|
+
if (editorFieldHeight)
|
|
5060
|
+
this.editorToolbarHeight.set(`${editorFieldHeight}px`);
|
|
5061
|
+
}
|
|
5052
5062
|
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 }); }
|
|
5053
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvEditorComponent, selector: "kv-editor", inputs: { readonly: "readonly", debug: "debug", canvaHeigth: "canvaHeigth", contentType: "contentType" }, outputs: { onTextChange: "onTextChange", onSelectionChange: "onSelectionChange", outputRaw: "outputRaw", outputHtml: "outputHtml" }, providers: ComponentProviders(KvEditorComponent), usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"kv-editor-container h-full max-h-full flex flex-column\"\r\n>\r\n <div\r\n #editor\r\n id=\"kv-editor-toolbar\"\r\n [ngClass]=\"{ 'error-border-toolbar': hasControlError() }\"\r\n class=\"flex flex-row flex-wrap gap-2 w-full flex-initial\"\r\n >\r\n @if(isLoading()) {\r\n\r\n <div class=\"flex flex-row align-items-center gap-3\">\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n </div>\r\n }\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <button class=\"ql-direction\" value=\"rtl\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <button class=\"ql-clean\"></button>\r\n </span>\r\n </div>\r\n\r\n <div\r\n id=\"kv-editor\"\r\n [ngStyle]=\"{'height': '100%'}\"\r\n [ngClass]=\"{ 'error-border': hasControlError() }\"\r\n ></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<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n 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\r\n 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\"\r\n rel=\"stylesheet\"\r\n/>\r\n<link\r\n 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\"\r\n rel=\"stylesheet\"\r\n/>\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:6px 6px 0 0;border:1px solid #e5e7eb}:host ::ng-deep #kv-editor{border-radius:0 0 6px 6px;border:1px solid #e5e7eb}.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: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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"] }, { kind: "component", type: i10.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }] }); }
|
|
5063
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvEditorComponent, selector: "kv-editor", inputs: { readonly: "readonly", debug: "debug", canvaHeigth: "canvaHeigth", contentType: "contentType" }, outputs: { onTextChange: "onTextChange", onSelectionChange: "onSelectionChange", outputRaw: "outputRaw", outputHtml: "outputHtml" }, providers: ComponentProviders(KvEditorComponent), usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"kv-editor-container h-full max-h-full flex flex-column relative\"\r\n>\r\n <div\r\n #editor\r\n id=\"kv-editor-toolbar\"\r\n [ngClass]=\"{ 'error-border-toolbar': hasControlError() }\"\r\n class=\"flex flex-row flex-wrap gap-2 w-full flex-initial absolute\"\r\n >\r\n @if(isLoading()) {\r\n\r\n <div class=\"flex flex-row align-items-center gap-3\">\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n </div>\r\n }\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <button class=\"ql-direction\" value=\"rtl\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <button class=\"ql-clean\"></button>\r\n </span>\r\n </div>\r\n\r\n <div\r\n id=\"kv-editor\"\r\n [ngStyle]=\"{'height': '100%'}\"\r\n [style.paddingTop]=\"editorToolbarHeight()\"\r\n [ngClass]=\"{ 'error-border': hasControlError() }\"\r\n ></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<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n 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\r\n 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\"\r\n rel=\"stylesheet\"\r\n/>\r\n<link\r\n 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\"\r\n rel=\"stylesheet\"\r\n/>\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:6px 6px 0 0;border:1px solid #e5e7eb}:host ::ng-deep #kv-editor{border-radius:0 0 6px 6px;border:1px solid #e5e7eb}.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: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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"] }, { kind: "component", type: i10.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }] }); }
|
|
5054
5064
|
}
|
|
5055
5065
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvEditorComponent, decorators: [{
|
|
5056
5066
|
type: Component,
|
|
5057
|
-
args: [{ selector: 'kv-editor', providers: ComponentProviders(KvEditorComponent), template: "<div\r\n class=\"kv-editor-container h-full max-h-full flex flex-column\"\r\n>\r\n <div\r\n #editor\r\n id=\"kv-editor-toolbar\"\r\n [ngClass]=\"{ 'error-border-toolbar': hasControlError() }\"\r\n class=\"flex flex-row flex-wrap gap-2 w-full flex-initial\"\r\n >\r\n @if(isLoading()) {\r\n\r\n <div class=\"flex flex-row align-items-center gap-3\">\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n </div>\r\n }\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <button class=\"ql-direction\" value=\"rtl\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <button class=\"ql-clean\"></button>\r\n </span>\r\n </div>\r\n\r\n <div\r\n id=\"kv-editor\"\r\n [ngStyle]=\"{'height': '100%'}\"\r\n [ngClass]=\"{ 'error-border': hasControlError() }\"\r\n ></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<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n 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\r\n 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\"\r\n rel=\"stylesheet\"\r\n/>\r\n<link\r\n 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\"\r\n rel=\"stylesheet\"\r\n/>\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:6px 6px 0 0;border:1px solid #e5e7eb}:host ::ng-deep #kv-editor{border-radius:0 0 6px 6px;border:1px solid #e5e7eb}.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"] }]
|
|
5067
|
+
args: [{ selector: 'kv-editor', providers: ComponentProviders(KvEditorComponent), template: "<div\r\n class=\"kv-editor-container h-full max-h-full flex flex-column relative\"\r\n>\r\n <div\r\n #editor\r\n id=\"kv-editor-toolbar\"\r\n [ngClass]=\"{ 'error-border-toolbar': hasControlError() }\"\r\n class=\"flex flex-row flex-wrap gap-2 w-full flex-initial absolute\"\r\n >\r\n @if(isLoading()) {\r\n\r\n <div class=\"flex flex-row align-items-center gap-3\">\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n\r\n <p-skeleton\r\n styleClass=\"w-5rem\"\r\n [style]=\"{ height: '1.5rem' }\"\r\n ></p-skeleton>\r\n </div>\r\n }\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <select class=\"ql-color\"></select>\r\n <select class=\"ql-background\"></select>\r\n </span>\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <button class=\"ql-direction\" value=\"rtl\"></button>\r\n <select class=\"ql-align\"></select>\r\n </span>\r\n\r\n <span\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\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\r\n class=\"ql-formats bg-gray-100 border-round-md {{\r\n isLoading() ? 'hidden' : 'block'\r\n }}\"\r\n >\r\n <button class=\"ql-clean\"></button>\r\n </span>\r\n </div>\r\n\r\n <div\r\n id=\"kv-editor\"\r\n [ngStyle]=\"{'height': '100%'}\"\r\n [style.paddingTop]=\"editorToolbarHeight()\"\r\n [ngClass]=\"{ 'error-border': hasControlError() }\"\r\n ></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<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.bubble.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css\"\r\n/>\r\n<link\r\n rel=\"stylesheet\"\r\n 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\r\n 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\"\r\n rel=\"stylesheet\"\r\n/>\r\n<link\r\n 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\"\r\n rel=\"stylesheet\"\r\n/>\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:6px 6px 0 0;border:1px solid #e5e7eb}:host ::ng-deep #kv-editor{border-radius:0 0 6px 6px;border:1px solid #e5e7eb}.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"] }]
|
|
5058
5068
|
}], ctorParameters: () => [{ type: ComponentService }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { readonly: [{
|
|
5059
5069
|
type: Input
|
|
5060
5070
|
}], debug: [{
|
|
@@ -6966,11 +6976,11 @@ class KvPageFormComponent {
|
|
|
6966
6976
|
}
|
|
6967
6977
|
}
|
|
6968
6978
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvPageFormComponent, deps: [{ token: i2$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6969
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvPageFormComponent, selector: "kv-page-form", inputs: { formGroup: "formGroup", TituloForm: "TituloForm", SubTituloForm: "SubTituloForm", isSaveLoading: "isSaveLoading", popup: "popup", locationUseComponent: "locationUseComponent", iconBtnCancel: "iconBtnCancel", showBtnCancel: "showBtnCancel", txtBtnCancel: "txtBtnCancel", actionsCancelToogle: "actionsCancelToogle", iconBtnCancelToogle: "iconBtnCancelToogle", showBtnCancelToogle: "showBtnCancelToogle", txtBtnCancelToogle: "txtBtnCancelToogle", iconBtnSave: "iconBtnSave", showBtnSave: "showBtnSave", txtBtnSave: "txtBtnSave", disableBtnSave: "disableBtnSave", actionsSaveToogle: "actionsSaveToogle", iconBtnSaveToogle: "iconBtnSaveToogle", showBtnSaveToogle: "showBtnSaveToogle", txtBtnSaveToogle: "txtBtnSaveToogle", iconBtnSecundary: "iconBtnSecundary", showBtnSecundary: "showBtnSecundary", txtBtnSecundary: "txtBtnSecundary", colorBtnSecundary: "colorBtnSecundary", actionsToogle: "actionsToogle", iconBtnToogle: "iconBtnToogle", showBtnToogle: "showBtnToogle", txtBtnToogle: "txtBtnToogle", classBtnToogle: "classBtnToogle", disableBtnSair: "disableBtnSair", showMessageCamposObrigatorios: "showMessageCamposObrigatorios" }, outputs: { onSave: "onSave", onCancel: "onCancel", onClickSecundary: "onClickSecundary" }, viewQueries: [{ propertyName: "pageContainer", first: true, predicate: ["pageContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n [formGroup]=\"formGroup\"\r\n class=\"grid-nogutter m-0\"\r\n id=\"page-form-container\"\r\n #pageContainer\r\n [style.padding-bottom.px]=\"pageContentHeight()\"\r\n>\r\n <!-- Renderiza\u00E7\u00E3o do form -->\r\n <div class=\"col-12 p-0\" id=\"page-form-content\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <!-- Divider -->\r\n <!-- <p-divider class=\"col-12\"></p-divider> -->\r\n\r\n <!-- Barra de a\u00E7\u00F5es -->\r\n\r\n <div\r\n class=\"flex flex-column md:flex-row md:justify-content-end md:align-items-center col-12 gap-2 barra-acoes border-round-bottom-md\"\r\n id=\"barra-acoes\"\r\n >\r\n @if(showMessageCamposObrigatorios) {\r\n <span class=\"w-full text-sm\">\r\n <span class=\"font-bold\">*</span> Campos obrigat\u00F3rios</span\r\n >\r\n }\r\n <kv-button\r\n *ngIf=\"showBtnCancel\"\r\n [label]=\"txtBtnCancel\"\r\n [icon]=\"iconBtnCancel\"\r\n [disabled]=\"isSaveLoading\"\r\n (onClick)=\"cancel($event)\"\r\n class=\"w-full md:w-auto\"\r\n severity=\"secondary\"\r\n type=\"text\"\r\n >\r\n </kv-button>\r\n\r\n <kv-button\r\n *ngIf=\"actionsCancelToogle && showBtnCancelToogle\"\r\n [label]=\"txtBtnCancelToogle\"\r\n class=\"w-full md:w-auto\"\r\n [severity]=\"'secondary'\"\r\n type=\"text\"\r\n [disabled]=\"isSaveLoading\"\r\n [popup]=\"true\"\r\n [items]=\"actionsCancelToogle\"\r\n iconPosition=\"left\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"showBtnSecundary\"\r\n [label]=\"txtBtnSecundary\"\r\n [icon]=\"iconBtnSecundary\"\r\n [disabled]=\"isSaveLoading\"\r\n severity=\"tertiary\"\r\n (onClick)=\"actionSecundary($event)\"\r\n class=\"w-full md:w-auto\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"actionsToogle && showBtnToogle\"\r\n [label]=\"txtBtnToogle\"\r\n [icon]=\"iconBtnToogle\"\r\n class=\"w-full md:w-auto\"\r\n severity=\"tertiary\"\r\n [disabled]=\"isSaveLoading\"\r\n [popup]=\"true\"\r\n [items]=\"actionsToogle\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"showBtnSave\"\r\n [label]=\"txtBtnSave\"\r\n [icon]=\"iconBtnSave\"\r\n [disabled]=\"disableBtnSave\"\r\n [loading]=\"isSaveLoading\"\r\n (onClick)=\"save($event)\"\r\n severity=\"primary\"\r\n class=\"w-full md:w-auto\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"actionsSaveToogle && showBtnSaveToogle\"\r\n [label]=\"txtBtnSaveToogle\"\r\n [icon]=\"iconBtnSaveToogle\"\r\n [loading]=\"isSaveLoading\"\r\n class=\"w-full md:w-auto\"\r\n [severity]=\"'primary'\"\r\n [popup]=\"true\"\r\n [items]=\"actionsSaveToogle\"\r\n />\r\n </div>\r\n</div>\r\n", styles: ["*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{position:fixed;bottom:0;right:0;background-color:#fff;padding:10px}#page-form-container{height:100%!important;padding-bottom:40px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "iconPosition", "label", "disabled", "items", "popup"], outputs: ["iconChange", "onClick"] }, { kind: "directive", type: i2$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6979
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvPageFormComponent, selector: "kv-page-form", inputs: { formGroup: "formGroup", TituloForm: "TituloForm", SubTituloForm: "SubTituloForm", isSaveLoading: "isSaveLoading", popup: "popup", locationUseComponent: "locationUseComponent", iconBtnCancel: "iconBtnCancel", showBtnCancel: "showBtnCancel", txtBtnCancel: "txtBtnCancel", actionsCancelToogle: "actionsCancelToogle", iconBtnCancelToogle: "iconBtnCancelToogle", showBtnCancelToogle: "showBtnCancelToogle", txtBtnCancelToogle: "txtBtnCancelToogle", iconBtnSave: "iconBtnSave", showBtnSave: "showBtnSave", txtBtnSave: "txtBtnSave", disableBtnSave: "disableBtnSave", actionsSaveToogle: "actionsSaveToogle", iconBtnSaveToogle: "iconBtnSaveToogle", showBtnSaveToogle: "showBtnSaveToogle", txtBtnSaveToogle: "txtBtnSaveToogle", iconBtnSecundary: "iconBtnSecundary", showBtnSecundary: "showBtnSecundary", txtBtnSecundary: "txtBtnSecundary", colorBtnSecundary: "colorBtnSecundary", actionsToogle: "actionsToogle", iconBtnToogle: "iconBtnToogle", showBtnToogle: "showBtnToogle", txtBtnToogle: "txtBtnToogle", classBtnToogle: "classBtnToogle", disableBtnSair: "disableBtnSair", showMessageCamposObrigatorios: "showMessageCamposObrigatorios" }, outputs: { onSave: "onSave", onCancel: "onCancel", onClickSecundary: "onClickSecundary" }, viewQueries: [{ propertyName: "pageContainer", first: true, predicate: ["pageContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n [formGroup]=\"formGroup\"\r\n class=\"grid-nogutter m-0\"\r\n id=\"page-form-container\"\r\n #pageContainer\r\n [style.padding-bottom.px]=\"pageContentHeight()\"\r\n>\r\n <!-- Renderiza\u00E7\u00E3o do form -->\r\n <div class=\"col-12 p-0 h-full\" id=\"page-form-content\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <!-- Divider -->\r\n <!-- <p-divider class=\"col-12\"></p-divider> -->\r\n\r\n <!-- Barra de a\u00E7\u00F5es -->\r\n\r\n <div\r\n class=\"flex flex-column md:flex-row md:justify-content-end md:align-items-center col-12 gap-2 barra-acoes border-round-bottom-md\"\r\n id=\"barra-acoes\"\r\n >\r\n @if(showMessageCamposObrigatorios) {\r\n <span class=\"w-full text-sm\">\r\n <span class=\"font-bold\">*</span> Campos obrigat\u00F3rios</span\r\n >\r\n }\r\n <kv-button\r\n *ngIf=\"showBtnCancel\"\r\n [label]=\"txtBtnCancel\"\r\n [icon]=\"iconBtnCancel\"\r\n [disabled]=\"isSaveLoading\"\r\n (onClick)=\"cancel($event)\"\r\n class=\"w-full md:w-auto\"\r\n severity=\"secondary\"\r\n type=\"text\"\r\n >\r\n </kv-button>\r\n\r\n <kv-button\r\n *ngIf=\"actionsCancelToogle && showBtnCancelToogle\"\r\n [label]=\"txtBtnCancelToogle\"\r\n class=\"w-full md:w-auto\"\r\n [severity]=\"'secondary'\"\r\n type=\"text\"\r\n [disabled]=\"isSaveLoading\"\r\n [popup]=\"true\"\r\n [items]=\"actionsCancelToogle\"\r\n iconPosition=\"left\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"showBtnSecundary\"\r\n [label]=\"txtBtnSecundary\"\r\n [icon]=\"iconBtnSecundary\"\r\n [disabled]=\"isSaveLoading\"\r\n severity=\"tertiary\"\r\n (onClick)=\"actionSecundary($event)\"\r\n class=\"w-full md:w-auto\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"actionsToogle && showBtnToogle\"\r\n [label]=\"txtBtnToogle\"\r\n [icon]=\"iconBtnToogle\"\r\n class=\"w-full md:w-auto\"\r\n severity=\"tertiary\"\r\n [disabled]=\"isSaveLoading\"\r\n [popup]=\"true\"\r\n [items]=\"actionsToogle\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"showBtnSave\"\r\n [label]=\"txtBtnSave\"\r\n [icon]=\"iconBtnSave\"\r\n [disabled]=\"disableBtnSave\"\r\n [loading]=\"isSaveLoading\"\r\n (onClick)=\"save($event)\"\r\n severity=\"primary\"\r\n class=\"w-full md:w-auto\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"actionsSaveToogle && showBtnSaveToogle\"\r\n [label]=\"txtBtnSaveToogle\"\r\n [icon]=\"iconBtnSaveToogle\"\r\n [loading]=\"isSaveLoading\"\r\n class=\"w-full md:w-auto\"\r\n [severity]=\"'primary'\"\r\n [popup]=\"true\"\r\n [items]=\"actionsSaveToogle\"\r\n />\r\n </div>\r\n</div>\r\n", styles: ["*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{position:fixed;bottom:0;right:0;background-color:#fff;padding:10px}#page-form-container{height:100%!important;padding-bottom:40px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "iconPosition", "label", "disabled", "items", "popup"], outputs: ["iconChange", "onClick"] }, { kind: "directive", type: i2$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6970
6980
|
}
|
|
6971
6981
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvPageFormComponent, decorators: [{
|
|
6972
6982
|
type: Component,
|
|
6973
|
-
args: [{ selector: 'kv-page-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n [formGroup]=\"formGroup\"\r\n class=\"grid-nogutter m-0\"\r\n id=\"page-form-container\"\r\n #pageContainer\r\n [style.padding-bottom.px]=\"pageContentHeight()\"\r\n>\r\n <!-- Renderiza\u00E7\u00E3o do form -->\r\n <div class=\"col-12 p-0\" id=\"page-form-content\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <!-- Divider -->\r\n <!-- <p-divider class=\"col-12\"></p-divider> -->\r\n\r\n <!-- Barra de a\u00E7\u00F5es -->\r\n\r\n <div\r\n class=\"flex flex-column md:flex-row md:justify-content-end md:align-items-center col-12 gap-2 barra-acoes border-round-bottom-md\"\r\n id=\"barra-acoes\"\r\n >\r\n @if(showMessageCamposObrigatorios) {\r\n <span class=\"w-full text-sm\">\r\n <span class=\"font-bold\">*</span> Campos obrigat\u00F3rios</span\r\n >\r\n }\r\n <kv-button\r\n *ngIf=\"showBtnCancel\"\r\n [label]=\"txtBtnCancel\"\r\n [icon]=\"iconBtnCancel\"\r\n [disabled]=\"isSaveLoading\"\r\n (onClick)=\"cancel($event)\"\r\n class=\"w-full md:w-auto\"\r\n severity=\"secondary\"\r\n type=\"text\"\r\n >\r\n </kv-button>\r\n\r\n <kv-button\r\n *ngIf=\"actionsCancelToogle && showBtnCancelToogle\"\r\n [label]=\"txtBtnCancelToogle\"\r\n class=\"w-full md:w-auto\"\r\n [severity]=\"'secondary'\"\r\n type=\"text\"\r\n [disabled]=\"isSaveLoading\"\r\n [popup]=\"true\"\r\n [items]=\"actionsCancelToogle\"\r\n iconPosition=\"left\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"showBtnSecundary\"\r\n [label]=\"txtBtnSecundary\"\r\n [icon]=\"iconBtnSecundary\"\r\n [disabled]=\"isSaveLoading\"\r\n severity=\"tertiary\"\r\n (onClick)=\"actionSecundary($event)\"\r\n class=\"w-full md:w-auto\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"actionsToogle && showBtnToogle\"\r\n [label]=\"txtBtnToogle\"\r\n [icon]=\"iconBtnToogle\"\r\n class=\"w-full md:w-auto\"\r\n severity=\"tertiary\"\r\n [disabled]=\"isSaveLoading\"\r\n [popup]=\"true\"\r\n [items]=\"actionsToogle\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"showBtnSave\"\r\n [label]=\"txtBtnSave\"\r\n [icon]=\"iconBtnSave\"\r\n [disabled]=\"disableBtnSave\"\r\n [loading]=\"isSaveLoading\"\r\n (onClick)=\"save($event)\"\r\n severity=\"primary\"\r\n class=\"w-full md:w-auto\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"actionsSaveToogle && showBtnSaveToogle\"\r\n [label]=\"txtBtnSaveToogle\"\r\n [icon]=\"iconBtnSaveToogle\"\r\n [loading]=\"isSaveLoading\"\r\n class=\"w-full md:w-auto\"\r\n [severity]=\"'primary'\"\r\n [popup]=\"true\"\r\n [items]=\"actionsSaveToogle\"\r\n />\r\n </div>\r\n</div>\r\n", styles: ["*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{position:fixed;bottom:0;right:0;background-color:#fff;padding:10px}#page-form-container{height:100%!important;padding-bottom:40px}\n"] }]
|
|
6983
|
+
args: [{ selector: 'kv-page-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n [formGroup]=\"formGroup\"\r\n class=\"grid-nogutter m-0\"\r\n id=\"page-form-container\"\r\n #pageContainer\r\n [style.padding-bottom.px]=\"pageContentHeight()\"\r\n>\r\n <!-- Renderiza\u00E7\u00E3o do form -->\r\n <div class=\"col-12 p-0 h-full\" id=\"page-form-content\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <!-- Divider -->\r\n <!-- <p-divider class=\"col-12\"></p-divider> -->\r\n\r\n <!-- Barra de a\u00E7\u00F5es -->\r\n\r\n <div\r\n class=\"flex flex-column md:flex-row md:justify-content-end md:align-items-center col-12 gap-2 barra-acoes border-round-bottom-md\"\r\n id=\"barra-acoes\"\r\n >\r\n @if(showMessageCamposObrigatorios) {\r\n <span class=\"w-full text-sm\">\r\n <span class=\"font-bold\">*</span> Campos obrigat\u00F3rios</span\r\n >\r\n }\r\n <kv-button\r\n *ngIf=\"showBtnCancel\"\r\n [label]=\"txtBtnCancel\"\r\n [icon]=\"iconBtnCancel\"\r\n [disabled]=\"isSaveLoading\"\r\n (onClick)=\"cancel($event)\"\r\n class=\"w-full md:w-auto\"\r\n severity=\"secondary\"\r\n type=\"text\"\r\n >\r\n </kv-button>\r\n\r\n <kv-button\r\n *ngIf=\"actionsCancelToogle && showBtnCancelToogle\"\r\n [label]=\"txtBtnCancelToogle\"\r\n class=\"w-full md:w-auto\"\r\n [severity]=\"'secondary'\"\r\n type=\"text\"\r\n [disabled]=\"isSaveLoading\"\r\n [popup]=\"true\"\r\n [items]=\"actionsCancelToogle\"\r\n iconPosition=\"left\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"showBtnSecundary\"\r\n [label]=\"txtBtnSecundary\"\r\n [icon]=\"iconBtnSecundary\"\r\n [disabled]=\"isSaveLoading\"\r\n severity=\"tertiary\"\r\n (onClick)=\"actionSecundary($event)\"\r\n class=\"w-full md:w-auto\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"actionsToogle && showBtnToogle\"\r\n [label]=\"txtBtnToogle\"\r\n [icon]=\"iconBtnToogle\"\r\n class=\"w-full md:w-auto\"\r\n severity=\"tertiary\"\r\n [disabled]=\"isSaveLoading\"\r\n [popup]=\"true\"\r\n [items]=\"actionsToogle\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"showBtnSave\"\r\n [label]=\"txtBtnSave\"\r\n [icon]=\"iconBtnSave\"\r\n [disabled]=\"disableBtnSave\"\r\n [loading]=\"isSaveLoading\"\r\n (onClick)=\"save($event)\"\r\n severity=\"primary\"\r\n class=\"w-full md:w-auto\"\r\n />\r\n\r\n <kv-button\r\n *ngIf=\"actionsSaveToogle && showBtnSaveToogle\"\r\n [label]=\"txtBtnSaveToogle\"\r\n [icon]=\"iconBtnSaveToogle\"\r\n [loading]=\"isSaveLoading\"\r\n class=\"w-full md:w-auto\"\r\n [severity]=\"'primary'\"\r\n [popup]=\"true\"\r\n [items]=\"actionsSaveToogle\"\r\n />\r\n </div>\r\n</div>\r\n", styles: ["*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{position:fixed;bottom:0;right:0;background-color:#fff;padding:10px}#page-form-container{height:100%!important;padding-bottom:40px}\n"] }]
|
|
6974
6984
|
}], ctorParameters: () => [{ type: i2$2.FormBuilder }], propDecorators: { formGroup: [{
|
|
6975
6985
|
type: Input
|
|
6976
6986
|
}], TituloForm: [{
|