sapenlinea-components 0.0.6 → 0.0.7
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, EventEmitter, signal, computed, Output, Input } from '@angular/core';
|
|
2
|
+
import { Component, EventEmitter, signal, computed, Output, Input, input, output, HostListener } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
|
|
@@ -71,6 +71,64 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.13", ngImpo
|
|
|
71
71
|
type: Output
|
|
72
72
|
}] } });
|
|
73
73
|
|
|
74
|
+
class Table {
|
|
75
|
+
/** Columnas */
|
|
76
|
+
columns = input([], ...(ngDevMode ? [{ debugName: "columns" }] : []));
|
|
77
|
+
/** Datos paginados */
|
|
78
|
+
data = input([], ...(ngDevMode ? [{ debugName: "data" }] : []));
|
|
79
|
+
/** Total de registros del backend */
|
|
80
|
+
total = input(0, ...(ngDevMode ? [{ debugName: "total" }] : []));
|
|
81
|
+
/** Página actual */
|
|
82
|
+
page = input(1, ...(ngDevMode ? [{ debugName: "page" }] : []));
|
|
83
|
+
/** Tamaño de página */
|
|
84
|
+
pageSize = input(10, ...(ngDevMode ? [{ debugName: "pageSize" }] : []));
|
|
85
|
+
/** Acciones (menú contextual por fila) */
|
|
86
|
+
actions = input([], ...(ngDevMode ? [{ debugName: "actions" }] : []));
|
|
87
|
+
/** Eventos */
|
|
88
|
+
pageChange = output();
|
|
89
|
+
pageSizeChange = output();
|
|
90
|
+
actionSelected = output();
|
|
91
|
+
/** Control interno del menú */
|
|
92
|
+
selectedRow = signal(null, ...(ngDevMode ? [{ debugName: "selectedRow" }] : []));
|
|
93
|
+
// -----------------------------
|
|
94
|
+
// MÉTODOS
|
|
95
|
+
// -----------------------------
|
|
96
|
+
onClickOutside(event) {
|
|
97
|
+
const target = event.target;
|
|
98
|
+
if (!target.closest('.menu-acciones')) {
|
|
99
|
+
this.selectedRow.set(null);
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
toggleActions(row, event) {
|
|
103
|
+
event.stopPropagation();
|
|
104
|
+
if (this.selectedRow()?.['id'] === row['id']) {
|
|
105
|
+
this.selectedRow.set(null);
|
|
106
|
+
}
|
|
107
|
+
else {
|
|
108
|
+
this.selectedRow.set(row);
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
selectAction(action, row) {
|
|
112
|
+
this.actionSelected.emit({ action: action.action, row });
|
|
113
|
+
this.selectedRow.set(null);
|
|
114
|
+
}
|
|
115
|
+
onChangePage(p) {
|
|
116
|
+
this.pageChange.emit(p);
|
|
117
|
+
}
|
|
118
|
+
onChangePageSize(size) {
|
|
119
|
+
this.pageSizeChange.emit(size);
|
|
120
|
+
}
|
|
121
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.13", ngImport: i0, type: Table, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
122
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.13", type: Table, isStandalone: true, selector: "lib-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageChange: "pageChange", pageSizeChange: "pageSizeChange", actionSelected: "actionSelected" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, ngImport: i0, template: "<div class=\"table-wrapper\">\r\n <table class=\"inner-table\">\r\n <thead>\r\n <tr>\r\n @for (col of columns(); track col.key) {\r\n <th>{{ col.label }}</th>\r\n }\r\n <th></th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n @for (row of data(); track $index) {\r\n <tr>\r\n @for (col of columns(); track col.key) {\r\n <td>{{ row[col.key] }}</td>\r\n }\r\n\r\n <!-- Acciones -->\r\n <td class=\"acciones-cell\">\r\n <div class=\"menu-acciones\">\r\n <button class=\"icon-button\" (click)=\"toggleActions(row, $event)\">\r\n <div class=\"content\">\r\n <div class=\"state-layer\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"more-vert\"\r\n width=\"20\"\r\n height=\"20\"\r\n viewBox=\"0 0 24 24\"\r\n >\r\n <circle cx=\"12\" cy=\"5\" r=\"1\" />\r\n <circle cx=\"12\" cy=\"12\" r=\"1\" />\r\n <circle cx=\"12\" cy=\"19\" r=\"1\" />\r\n </svg>\r\n </div>\r\n </div>\r\n </button>\r\n\r\n @if(selectedRow()?.['id'] === row['id']) {\r\n <div class=\"modal-options\" (click)=\"$event.stopPropagation()\">\r\n <div class=\"modal-content\">\r\n <ul>\r\n @for (option of actions(); track $index) {\r\n <li\r\n class=\"option-item\"\r\n [style.color]=\"option.color\"\r\n (click)=\"selectAction(option, row)\"\r\n >\r\n <span class=\"icon\" [class]=\"option.icon\"></span>\r\n <span class=\"label\">{{ option.label }}</span>\r\n </li>\r\n }\r\n </ul>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </td>\r\n </tr>\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n", styles: [".table-wrapper{width:100%;border-radius:12px;border:1px solid #c7c7ad;overflow:hidden}.inner-table{width:100%;border-collapse:separate;border-spacing:0}.inner-table thead{background:#f0f0db}.acciones-cell{position:relative}.modal-options{position:absolute;right:0;top:32px;background:#fff;border-radius:8px;border:1px solid #ddd;z-index:100;min-width:180px}\n"] });
|
|
123
|
+
}
|
|
124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.13", ngImport: i0, type: Table, decorators: [{
|
|
125
|
+
type: Component,
|
|
126
|
+
args: [{ selector: 'lib-table', imports: [], template: "<div class=\"table-wrapper\">\r\n <table class=\"inner-table\">\r\n <thead>\r\n <tr>\r\n @for (col of columns(); track col.key) {\r\n <th>{{ col.label }}</th>\r\n }\r\n <th></th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n @for (row of data(); track $index) {\r\n <tr>\r\n @for (col of columns(); track col.key) {\r\n <td>{{ row[col.key] }}</td>\r\n }\r\n\r\n <!-- Acciones -->\r\n <td class=\"acciones-cell\">\r\n <div class=\"menu-acciones\">\r\n <button class=\"icon-button\" (click)=\"toggleActions(row, $event)\">\r\n <div class=\"content\">\r\n <div class=\"state-layer\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"more-vert\"\r\n width=\"20\"\r\n height=\"20\"\r\n viewBox=\"0 0 24 24\"\r\n >\r\n <circle cx=\"12\" cy=\"5\" r=\"1\" />\r\n <circle cx=\"12\" cy=\"12\" r=\"1\" />\r\n <circle cx=\"12\" cy=\"19\" r=\"1\" />\r\n </svg>\r\n </div>\r\n </div>\r\n </button>\r\n\r\n @if(selectedRow()?.['id'] === row['id']) {\r\n <div class=\"modal-options\" (click)=\"$event.stopPropagation()\">\r\n <div class=\"modal-content\">\r\n <ul>\r\n @for (option of actions(); track $index) {\r\n <li\r\n class=\"option-item\"\r\n [style.color]=\"option.color\"\r\n (click)=\"selectAction(option, row)\"\r\n >\r\n <span class=\"icon\" [class]=\"option.icon\"></span>\r\n <span class=\"label\">{{ option.label }}</span>\r\n </li>\r\n }\r\n </ul>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </td>\r\n </tr>\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n", styles: [".table-wrapper{width:100%;border-radius:12px;border:1px solid #c7c7ad;overflow:hidden}.inner-table{width:100%;border-collapse:separate;border-spacing:0}.inner-table thead{background:#f0f0db}.acciones-cell{position:relative}.modal-options{position:absolute;right:0;top:32px;background:#fff;border-radius:8px;border:1px solid #ddd;z-index:100;min-width:180px}\n"] }]
|
|
127
|
+
}], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], pageChange: [{ type: i0.Output, args: ["pageChange"] }], pageSizeChange: [{ type: i0.Output, args: ["pageSizeChange"] }], actionSelected: [{ type: i0.Output, args: ["actionSelected"] }], onClickOutside: [{
|
|
128
|
+
type: HostListener,
|
|
129
|
+
args: ['document:click', ['$event']]
|
|
130
|
+
}] } });
|
|
131
|
+
|
|
74
132
|
// src/app/components/public-api.ts
|
|
75
133
|
// Exportar el componente
|
|
76
134
|
|
|
@@ -78,5 +136,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.13", ngImpo
|
|
|
78
136
|
* Generated bundle index. Do not edit.
|
|
79
137
|
*/
|
|
80
138
|
|
|
81
|
-
export { MyComponent, PaginationComponent };
|
|
139
|
+
export { MyComponent, PaginationComponent, Table };
|
|
82
140
|
//# sourceMappingURL=sapenlinea-components.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sapenlinea-components.mjs","sources":["../../../projects/sapenlinea-components/src/lib/components/my-component/my-component.ts","../../../projects/sapenlinea-components/src/lib/components/my-component/my-component.html","../../../projects/sapenlinea-components/src/lib/components/pagination/pagination.ts","../../../projects/sapenlinea-components/src/lib/components/pagination/pagination.html","../../../projects/sapenlinea-components/src/public-api.ts","../../../projects/sapenlinea-components/src/sapenlinea-components.ts"],"sourcesContent":["import { Component } from '@angular/core';\r\n\r\n@Component({\r\n selector: 'lib-my-component',\r\n imports: [],\r\n templateUrl: './my-component.html',\r\n styleUrl: './my-component.css',\r\n})\r\nexport class MyComponent {\r\n\r\n}\r\n","<p>my-component works!</p>\r\n","import { Component, Input, Output, EventEmitter, computed, signal } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\n@Component({\r\n selector: 'app-pagination',\r\n standalone: true,\r\n imports: [CommonModule],\r\n templateUrl: './pagination.html',\r\n styleUrls: ['./pagination.css']\r\n})\r\nexport class PaginationComponent {\r\n @Input() page = 1;\r\n @Input() pageSize = 10;\r\n @Input() totalItems = 0;\r\n\r\n @Input() showPageSizeSelector = false;\r\n @Input() pageSizeOptions: number[] = [5, 10, 20, 50];\r\n\r\n @Output() pageChange = new EventEmitter<number>();\r\n @Output() pageSizeChange = new EventEmitter<number>();\r\n\r\n pageSizeValue = signal(this.pageSize);\r\n isOpen = signal(false);\r\n isDisabled = signal(false);\r\n showPageSizeMenu = signal(false);\r\n\r\n totalPages = computed(() => {\r\n const size = this.pageSizeValue();\r\n const total = this.totalItems;\r\n return size > 0 ? Math.ceil(total / size) : 1;\r\n });\r\n\r\n pages = computed(() => {\r\n const tp = this.totalPages();\r\n return Array.from({ length: tp }, (_, i) => i + 1);\r\n });\r\n\r\n selectedPageSize = computed(() => this.pageSizeValue());\r\n\r\n goToPage(p: number) {\r\n if (p < 1 || p > this.totalPages()) return;\r\n this.pageChange.emit(p);\r\n }\r\n\r\n togglePageSizeMenu() {\r\n this.isOpen.update(v => !v);\r\n this.showPageSizeMenu.update(v => !v);\r\n }\r\n\r\n selectPageSize(size: number) {\r\n this.pageSizeValue.set(size);\r\n this.pageSizeChange.emit(size);\r\n this.showPageSizeMenu.set(false);\r\n this.isOpen.set(false);\r\n }\r\n}\r\n","<div class=\"pagination-container\">\r\n <div class=\"pagination\">\r\n <!-- Botón doble atrás -->\r\n <button class=\"icon-button\" (click)=\"goToPage(1)\" [disabled]=\"page === 1\">\r\n ««\r\n </button>\r\n\r\n <!-- Botón atrás -->\r\n <button class=\"icon-button\" (click)=\"goToPage(page - 1)\" [disabled]=\"page === 1\">\r\n «\r\n </button>\r\n\r\n <!-- Números de página -->\r\n <div class=\"pages\">\r\n <button\r\n class=\"page-btn\"\r\n *ngFor=\"let p of pages(); let idx = index\"\r\n [class.active]=\"page === idx + 1\"\r\n (click)=\"goToPage(idx + 1)\"\r\n >\r\n {{ idx + 1 }}\r\n </button>\r\n </div>\r\n\r\n <!-- Botón siguiente -->\r\n <button class=\"icon-button\" (click)=\"goToPage(page + 1)\" [disabled]=\"page === totalPages()\">\r\n »\r\n </button>\r\n\r\n <!-- Botón doble adelante -->\r\n <button class=\"icon-button\" (click)=\"goToPage(totalPages())\" [disabled]=\"page === totalPages()\">\r\n »»\r\n </button>\r\n </div>\r\n\r\n <!-- Selector Items por página -->\r\n <div *ngIf=\"showPageSizeSelector\">\r\n <div class=\"pagination-v-4\">\r\n <div class=\"label-pagination\">Items por página</div>\r\n <div class=\"elements-pagination\">\r\n <div class=\"split-button\" (click)=\"togglePageSizeMenu()\">\r\n <div class=\"leading-button\">\r\n <div class=\"state-layer\">\r\n <div class=\"label\">{{ pageSizeValue() }}</div>\r\n </div>\r\n </div>\r\n <div class=\"trailing-button\">\r\n <div class=\"arrow\" [class.open]=\"isOpen()\">\r\n <svg class=\"arrow\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" fill=\"none\" stroke-width=\"2\">\r\n <polyline points=\"6 9 12 15 18 9\"></polyline>\r\n </svg>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Menú desplegable -->\r\n <div class=\"page-size-menu\" *ngIf=\"showPageSizeMenu()\">\r\n <div\r\n class=\"menu-option\"\r\n *ngFor=\"let opt of pageSizeOptions\"\r\n [class.active]=\"opt === pageSizeValue()\"\r\n (click)=\"selectPageSize(opt)\"\r\n >\r\n {{ opt }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n","// src/app/components/public-api.ts\r\n\r\n// Exportar el componente\r\nexport * from './lib/components/my-component/my-component';\r\nexport * from './lib/components/pagination/pagination';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"sapenlinea-components.mjs","sources":["../../../projects/sapenlinea-components/src/lib/components/my-component/my-component.ts","../../../projects/sapenlinea-components/src/lib/components/my-component/my-component.html","../../../projects/sapenlinea-components/src/lib/components/pagination/pagination.ts","../../../projects/sapenlinea-components/src/lib/components/pagination/pagination.html","../../../projects/sapenlinea-components/src/lib/components/table/table.ts","../../../projects/sapenlinea-components/src/lib/components/table/table.html","../../../projects/sapenlinea-components/src/public-api.ts","../../../projects/sapenlinea-components/src/sapenlinea-components.ts"],"sourcesContent":["import { Component } from '@angular/core';\r\n\r\n@Component({\r\n selector: 'lib-my-component',\r\n imports: [],\r\n templateUrl: './my-component.html',\r\n styleUrl: './my-component.css',\r\n})\r\nexport class MyComponent {\r\n\r\n}\r\n","<p>my-component works!</p>\r\n","import { Component, Input, Output, EventEmitter, computed, signal } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\n@Component({\r\n selector: 'app-pagination',\r\n standalone: true,\r\n imports: [CommonModule],\r\n templateUrl: './pagination.html',\r\n styleUrls: ['./pagination.css']\r\n})\r\nexport class PaginationComponent {\r\n @Input() page = 1;\r\n @Input() pageSize = 10;\r\n @Input() totalItems = 0;\r\n\r\n @Input() showPageSizeSelector = false;\r\n @Input() pageSizeOptions: number[] = [5, 10, 20, 50];\r\n\r\n @Output() pageChange = new EventEmitter<number>();\r\n @Output() pageSizeChange = new EventEmitter<number>();\r\n\r\n pageSizeValue = signal(this.pageSize);\r\n isOpen = signal(false);\r\n isDisabled = signal(false);\r\n showPageSizeMenu = signal(false);\r\n\r\n totalPages = computed(() => {\r\n const size = this.pageSizeValue();\r\n const total = this.totalItems;\r\n return size > 0 ? Math.ceil(total / size) : 1;\r\n });\r\n\r\n pages = computed(() => {\r\n const tp = this.totalPages();\r\n return Array.from({ length: tp }, (_, i) => i + 1);\r\n });\r\n\r\n selectedPageSize = computed(() => this.pageSizeValue());\r\n\r\n goToPage(p: number) {\r\n if (p < 1 || p > this.totalPages()) return;\r\n this.pageChange.emit(p);\r\n }\r\n\r\n togglePageSizeMenu() {\r\n this.isOpen.update(v => !v);\r\n this.showPageSizeMenu.update(v => !v);\r\n }\r\n\r\n selectPageSize(size: number) {\r\n this.pageSizeValue.set(size);\r\n this.pageSizeChange.emit(size);\r\n this.showPageSizeMenu.set(false);\r\n this.isOpen.set(false);\r\n }\r\n}\r\n","<div class=\"pagination-container\">\r\n <div class=\"pagination\">\r\n <!-- Botón doble atrás -->\r\n <button class=\"icon-button\" (click)=\"goToPage(1)\" [disabled]=\"page === 1\">\r\n ««\r\n </button>\r\n\r\n <!-- Botón atrás -->\r\n <button class=\"icon-button\" (click)=\"goToPage(page - 1)\" [disabled]=\"page === 1\">\r\n «\r\n </button>\r\n\r\n <!-- Números de página -->\r\n <div class=\"pages\">\r\n <button\r\n class=\"page-btn\"\r\n *ngFor=\"let p of pages(); let idx = index\"\r\n [class.active]=\"page === idx + 1\"\r\n (click)=\"goToPage(idx + 1)\"\r\n >\r\n {{ idx + 1 }}\r\n </button>\r\n </div>\r\n\r\n <!-- Botón siguiente -->\r\n <button class=\"icon-button\" (click)=\"goToPage(page + 1)\" [disabled]=\"page === totalPages()\">\r\n »\r\n </button>\r\n\r\n <!-- Botón doble adelante -->\r\n <button class=\"icon-button\" (click)=\"goToPage(totalPages())\" [disabled]=\"page === totalPages()\">\r\n »»\r\n </button>\r\n </div>\r\n\r\n <!-- Selector Items por página -->\r\n <div *ngIf=\"showPageSizeSelector\">\r\n <div class=\"pagination-v-4\">\r\n <div class=\"label-pagination\">Items por página</div>\r\n <div class=\"elements-pagination\">\r\n <div class=\"split-button\" (click)=\"togglePageSizeMenu()\">\r\n <div class=\"leading-button\">\r\n <div class=\"state-layer\">\r\n <div class=\"label\">{{ pageSizeValue() }}</div>\r\n </div>\r\n </div>\r\n <div class=\"trailing-button\">\r\n <div class=\"arrow\" [class.open]=\"isOpen()\">\r\n <svg class=\"arrow\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" fill=\"none\" stroke-width=\"2\">\r\n <polyline points=\"6 9 12 15 18 9\"></polyline>\r\n </svg>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Menú desplegable -->\r\n <div class=\"page-size-menu\" *ngIf=\"showPageSizeMenu()\">\r\n <div\r\n class=\"menu-option\"\r\n *ngFor=\"let opt of pageSizeOptions\"\r\n [class.active]=\"opt === pageSizeValue()\"\r\n (click)=\"selectPageSize(opt)\"\r\n >\r\n {{ opt }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n","import { Component, HostListener, input, output, signal } from '@angular/core';\r\nimport { TableAction, TableColumn, TableRow } from '../../interfaces/table';\r\n\r\n@Component({\r\n selector: 'lib-table',\r\n imports: [],\r\n templateUrl: './table.html',\r\n styleUrl: './table.css',\r\n})\r\nexport class Table {\r\n /** Columnas */\r\n columns = input<TableColumn[]>([]);\r\n\r\n /** Datos paginados */\r\n data = input<TableRow[]>([]);\r\n\r\n /** Total de registros del backend */\r\n total = input<number>(0);\r\n\r\n /** Página actual */\r\n page = input<number>(1);\r\n\r\n /** Tamaño de página */\r\n pageSize = input<number>(10);\r\n\r\n /** Acciones (menú contextual por fila) */\r\n actions = input<TableAction[]>([]);\r\n\r\n /** Eventos */\r\n pageChange = output<number>();\r\n pageSizeChange = output<number>();\r\n actionSelected = output<{ action: string; row: TableRow }>();\r\n\r\n /** Control interno del menú */\r\n selectedRow = signal<TableRow | null>(null);\r\n\r\n // -----------------------------\r\n // MÉTODOS\r\n // -----------------------------\r\n\r\n @HostListener('document:click', ['$event'])\r\n onClickOutside(event: MouseEvent) {\r\n const target = event.target as HTMLElement;\r\n if (!target.closest('.menu-acciones')) {\r\n this.selectedRow.set(null);\r\n }\r\n }\r\n\r\n toggleActions(row: TableRow, event: MouseEvent) {\r\n event.stopPropagation();\r\n\r\n if (this.selectedRow()?.['id'] === row['id']) {\r\n this.selectedRow.set(null);\r\n } else {\r\n this.selectedRow.set(row);\r\n }\r\n }\r\n\r\n selectAction(action: TableAction, row: TableRow) {\r\n this.actionSelected.emit({ action: action.action, row });\r\n this.selectedRow.set(null);\r\n }\r\n\r\n onChangePage(p: number) {\r\n this.pageChange.emit(p);\r\n }\r\n\r\n onChangePageSize(size: number) {\r\n this.pageSizeChange.emit(size);\r\n }\r\n}\r\n","<div class=\"table-wrapper\">\r\n <table class=\"inner-table\">\r\n <thead>\r\n <tr>\r\n @for (col of columns(); track col.key) {\r\n <th>{{ col.label }}</th>\r\n }\r\n <th></th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n @for (row of data(); track $index) {\r\n <tr>\r\n @for (col of columns(); track col.key) {\r\n <td>{{ row[col.key] }}</td>\r\n }\r\n\r\n <!-- Acciones -->\r\n <td class=\"acciones-cell\">\r\n <div class=\"menu-acciones\">\r\n <button class=\"icon-button\" (click)=\"toggleActions(row, $event)\">\r\n <div class=\"content\">\r\n <div class=\"state-layer\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"more-vert\"\r\n width=\"20\"\r\n height=\"20\"\r\n viewBox=\"0 0 24 24\"\r\n >\r\n <circle cx=\"12\" cy=\"5\" r=\"1\" />\r\n <circle cx=\"12\" cy=\"12\" r=\"1\" />\r\n <circle cx=\"12\" cy=\"19\" r=\"1\" />\r\n </svg>\r\n </div>\r\n </div>\r\n </button>\r\n\r\n @if(selectedRow()?.['id'] === row['id']) {\r\n <div class=\"modal-options\" (click)=\"$event.stopPropagation()\">\r\n <div class=\"modal-content\">\r\n <ul>\r\n @for (option of actions(); track $index) {\r\n <li\r\n class=\"option-item\"\r\n [style.color]=\"option.color\"\r\n (click)=\"selectAction(option, row)\"\r\n >\r\n <span class=\"icon\" [class]=\"option.icon\"></span>\r\n <span class=\"label\">{{ option.label }}</span>\r\n </li>\r\n }\r\n </ul>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </td>\r\n </tr>\r\n }\r\n </tbody>\r\n </table>\r\n</div>\r\n","// src/app/components/public-api.ts\r\n\r\n// Exportar el componente\r\nexport * from './lib/components/my-component/my-component';\r\nexport * from './lib/components/pagination/pagination';\r\nexport * from './lib/components/table/table';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/index.d.ts
CHANGED
|
@@ -28,4 +28,49 @@ declare class PaginationComponent {
|
|
|
28
28
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PaginationComponent, "app-pagination", never, { "page": { "alias": "page"; "required": false; }; "pageSize": { "alias": "pageSize"; "required": false; }; "totalItems": { "alias": "totalItems"; "required": false; }; "showPageSizeSelector": { "alias": "showPageSizeSelector"; "required": false; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; }; }, { "pageChange": "pageChange"; "pageSizeChange": "pageSizeChange"; }, never, never, true, never>;
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
-
|
|
31
|
+
interface TableColumn {
|
|
32
|
+
key: string;
|
|
33
|
+
label: string;
|
|
34
|
+
}
|
|
35
|
+
interface TableRow {
|
|
36
|
+
[key: string]: any;
|
|
37
|
+
}
|
|
38
|
+
interface TableAction {
|
|
39
|
+
icon: string;
|
|
40
|
+
label: string;
|
|
41
|
+
color?: string;
|
|
42
|
+
action: string;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
declare class Table {
|
|
46
|
+
/** Columnas */
|
|
47
|
+
columns: _angular_core.InputSignal<TableColumn[]>;
|
|
48
|
+
/** Datos paginados */
|
|
49
|
+
data: _angular_core.InputSignal<TableRow[]>;
|
|
50
|
+
/** Total de registros del backend */
|
|
51
|
+
total: _angular_core.InputSignal<number>;
|
|
52
|
+
/** Página actual */
|
|
53
|
+
page: _angular_core.InputSignal<number>;
|
|
54
|
+
/** Tamaño de página */
|
|
55
|
+
pageSize: _angular_core.InputSignal<number>;
|
|
56
|
+
/** Acciones (menú contextual por fila) */
|
|
57
|
+
actions: _angular_core.InputSignal<TableAction[]>;
|
|
58
|
+
/** Eventos */
|
|
59
|
+
pageChange: _angular_core.OutputEmitterRef<number>;
|
|
60
|
+
pageSizeChange: _angular_core.OutputEmitterRef<number>;
|
|
61
|
+
actionSelected: _angular_core.OutputEmitterRef<{
|
|
62
|
+
action: string;
|
|
63
|
+
row: TableRow;
|
|
64
|
+
}>;
|
|
65
|
+
/** Control interno del menú */
|
|
66
|
+
selectedRow: _angular_core.WritableSignal<TableRow | null>;
|
|
67
|
+
onClickOutside(event: MouseEvent): void;
|
|
68
|
+
toggleActions(row: TableRow, event: MouseEvent): void;
|
|
69
|
+
selectAction(action: TableAction, row: TableRow): void;
|
|
70
|
+
onChangePage(p: number): void;
|
|
71
|
+
onChangePageSize(size: number): void;
|
|
72
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<Table, never>;
|
|
73
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<Table, "lib-table", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "total": { "alias": "total"; "required": false; "isSignal": true; }; "page": { "alias": "page"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; }, { "pageChange": "pageChange"; "pageSizeChange": "pageSizeChange"; "actionSelected": "actionSelected"; }, never, never, true, never>;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
export { MyComponent, PaginationComponent, Table };
|