intelica-library-ui 0.1.99 → 0.1.100

package/fesm2022/intelica-library-ui.mjs

@@ -31,6 +31,8 @@ import * as i3$2 from 'primeng/ripple';
 import { RippleModule } from 'primeng/ripple';
 import { Dialog } from 'primeng/dialog';
 import * as echarts from 'echarts';
+import * as i1$3 from 'primeng/skeleton';
+import { SkeletonModule } from 'primeng/skeleton';
 import * as XLSX from 'xlsx';
 import { Workbook } from 'exceljs';
 import { saveAs } from 'file-saver';
@@ -2748,6 +2750,70 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
                 args: ["document:click", ["$event"]]
             }] } });
 
+class SkeletonService {
+    isLoading = signal(false);
+    hide() {
+        this.isLoading.set(false);
+    }
+    show() {
+        this.isLoading.set(true);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkeletonService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkeletonService, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkeletonService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }] });
+
+class SkeletonComponent {
+    skeletonService = inject(SkeletonService);
+    isLoading = this.skeletonService.isLoading;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkeletonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkeletonComponent, isStandalone: true, selector: "intelica-skeleton", ngImport: i0, template: "@if(isLoading()){\r\n<ng-content></ng-content>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkeletonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "intelica-skeleton", imports: [CommonModule], template: "@if(isLoading()){\r\n<ng-content></ng-content>\r\n}\r\n" }]
+        }] });
+
+class SkeletonTableComponent {
+    /**
+     * @description number of rows to display
+     * @default 6
+     * @type number
+     * @example <intelica-skeleton-table [rows]="6"></intelica-skeleton-table>
+     */
+    rows = 6;
+    /**
+     * @description number of columns to display
+     * @default 6
+     * @type number
+     * @example <intelica-skeleton-table [columns]="6"></intelica-skeleton-table>
+     */
+    columns = 6;
+    columnSizes = [];
+    ngOnInit() {
+        const baseSize = 12 / this.columns;
+        this.columnSizes = Array.from({ length: this.columns }, (_, i) => {
+            return `col-${baseSize}`;
+        });
+    }
+    getRows() {
+        return new Array(this.rows);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkeletonTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkeletonTableComponent, isStandalone: true, selector: "intelica-skeleton-table", inputs: { rows: "rows", columns: "columns" }, ngImport: i0, template: "<div class=\"skeletonTable\">\r\n\t<div class=\"mb-2 row justify-content-between\">\r\n\t\t<div class=\"col-1 px-0\">\r\n\t\t\t<p-skeleton class=\"prSkeleton\" [height]=\"'3rem'\"></p-skeleton>\r\n\t\t</div>\r\n\t\t<div class=\"col-3 px-0\">\r\n\t\t\t<p-skeleton class=\"prSkeleton\" [height]=\"'3rem'\"></p-skeleton>\r\n\t\t</div>\r\n\t</div>\r\n\t<div class=\"row\">\r\n\t\t<div class=\"col-12 px-0 mb-2\">\r\n\t\t\t<p-skeleton class=\"prSkeleton\" [height]=\"'4rem'\"></p-skeleton>\r\n\t\t</div>\r\n\t</div>\r\n\t@for (row of getRows(); track $index) {\r\n\t<div class=\"row borderBottomRow\">\r\n\t\t@for (column of columnSizes; track $index) {\r\n\t\t<div class=\"{{ column }} px-0\">\r\n\t\t\t<div class=\"bodyPaddingTable\">\r\n\t\t\t\t<p-skeleton class=\"prSkeleton\" [height]=\"'2rem'\"></p-skeleton>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t\t}\r\n\t</div>\r\n\t}\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i1$3.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkeletonTableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "intelica-skeleton-table", imports: [CommonModule, SkeletonModule], template: "<div class=\"skeletonTable\">\r\n\t<div class=\"mb-2 row justify-content-between\">\r\n\t\t<div class=\"col-1 px-0\">\r\n\t\t\t<p-skeleton class=\"prSkeleton\" [height]=\"'3rem'\"></p-skeleton>\r\n\t\t</div>\r\n\t\t<div class=\"col-3 px-0\">\r\n\t\t\t<p-skeleton class=\"prSkeleton\" [height]=\"'3rem'\"></p-skeleton>\r\n\t\t</div>\r\n\t</div>\r\n\t<div class=\"row\">\r\n\t\t<div class=\"col-12 px-0 mb-2\">\r\n\t\t\t<p-skeleton class=\"prSkeleton\" [height]=\"'4rem'\"></p-skeleton>\r\n\t\t</div>\r\n\t</div>\r\n\t@for (row of getRows(); track $index) {\r\n\t<div class=\"row borderBottomRow\">\r\n\t\t@for (column of columnSizes; track $index) {\r\n\t\t<div class=\"{{ column }} px-0\">\r\n\t\t\t<div class=\"bodyPaddingTable\">\r\n\t\t\t\t<p-skeleton class=\"prSkeleton\" [height]=\"'2rem'\"></p-skeleton>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t\t}\r\n\t</div>\r\n\t}\r\n</div>\r\n" }]
+        }], propDecorators: { rows: [{
+                type: Input
+            }], columns: [{
+                type: Input
+            }] } });
+
 class HtmlToExcelService {
     ExportTOExcel(idTabla, html, filename, tabname, extension) {
         let Table = document.getElementById(idTabla);
@@ -4145,6 +4211,22 @@ const IntelicaTheme = definePreset(Aura, {
         },
     },
     components: {
+        skeleton: {
+            colorScheme: {
+                light: {
+                    root: {
+                        background: "{surface.200}",
+                        animationBackground: "rgba(0,0,0,0.4)",
+                    },
+                },
+                dark: {
+                    root: {
+                        background: "rgba(0, 0, 0, 0.06)",
+                        animationBackground: "rgba(0, 0, 0, 0.04)",
+                    },
+                },
+            },
+        },
         accordion: {
             root: {
                 transitionDuration: "{transition.duration}",
@@ -5970,5 +6052,5 @@ const IntelicaTheme = definePreset(Aura, {
  * Generated bundle index. Do not edit.
  */
 
-export { ActionDirective, ActionsMenuComponent, ButtonSplitComponent, Color, ColumnComponent, ColumnGroupComponent, CompareByField, ConfigService, CookieAttributesGeneral, DynamicInputValidation, EchartComponent, EchartService, EmailInputValidation, ErrorInterceptor, FeatureFlagService, GlobalFeatureFlagService, GlobalTermService, HtmlToExcelService, InitializeConfigService, InputValidation, IntelicaTheme, ItemSplitDirective, LanguageService, ModalDialogComponent, OrderConstants, PaginatorComponent, Patterns, PopoverComponent, ProfileService, RecordPerPageComponent, RefreshTokenInterceptor, RowResumenComponent, SearchComponent, SharedService, SortingComponent, SpinnerComponent, SpinnerService, SweetAlertService, TableComponent, TemplateMenuComponent, TermGuard, TermPipe, TermService, decryptData, encryptData, getColor };
+export { ActionDirective, ActionsMenuComponent, ButtonSplitComponent, Color, ColumnComponent, ColumnGroupComponent, CompareByField, ConfigService, CookieAttributesGeneral, DynamicInputValidation, EchartComponent, EchartService, EmailInputValidation, ErrorInterceptor, FeatureFlagService, GlobalFeatureFlagService, GlobalTermService, HtmlToExcelService, InitializeConfigService, InputValidation, IntelicaTheme, ItemSplitDirective, LanguageService, ModalDialogComponent, OrderConstants, PaginatorComponent, Patterns, PopoverComponent, ProfileService, RecordPerPageComponent, RefreshTokenInterceptor, RowResumenComponent, SearchComponent, SharedService, SkeletonComponent, SkeletonService, SkeletonTableComponent, SortingComponent, SpinnerComponent, SpinnerService, SweetAlertService, TableComponent, TemplateMenuComponent, TermGuard, TermPipe, TermService, decryptData, encryptData, getColor };
 //# sourceMappingURL=intelica-library-ui.mjs.map