ngx-lite-form 1.4.2 → 1.4.3
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/README.md +14 -6
- package/fesm2022/ngx-lite-form.mjs +62 -28
- package/fesm2022/ngx-lite-form.mjs.map +1 -1
- package/index.d.ts +9 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -62,7 +62,7 @@ Lite Form provides 15+ form and UI components. Click on any component below for
|
|
|
62
62
|
- **[LiteFile](docs/lite-file.md)** - File upload with drag & drop and camera capture
|
|
63
63
|
|
|
64
64
|
### Data Display & Navigation
|
|
65
|
-
- **[LiteTable](docs/lite-table.md)** - Flexible data table with sorting, pagination, and row actions
|
|
65
|
+
- **[LiteTable](docs/lite-table.md)** - Flexible data table with sorting, pagination, row selection, and row actions
|
|
66
66
|
- **[LitePaginator](docs/lite-paginator.md)** - Standalone pagination component
|
|
67
67
|
|
|
68
68
|
### UI Components
|
|
@@ -198,9 +198,10 @@ export class AppComponent {
|
|
|
198
198
|
showPreview: true
|
|
199
199
|
});
|
|
200
200
|
|
|
201
|
-
// Table with custom columns and
|
|
201
|
+
// Table with custom columns, sorting, and row selection
|
|
202
202
|
employeeTable = new TableFieldDto(
|
|
203
203
|
[
|
|
204
|
+
{ key: '__select__', label: '', flex: '0 0 36px', type: 'select' },
|
|
204
205
|
{ key: 'name', label: 'Name', flex: '1', sortable: true },
|
|
205
206
|
{ key: 'department', label: 'Department', flex: '0 0 150px', sortable: true },
|
|
206
207
|
{ key: 'salary', label: 'Salary', flex: '0 0 120px', sortable: true, cellTemplate: (value) => `$${value?.toLocaleString() || '0'}` }
|
|
@@ -231,6 +232,12 @@ export class AppComponent {
|
|
|
231
232
|
};
|
|
232
233
|
}
|
|
233
234
|
|
|
235
|
+
// Handle selection changes
|
|
236
|
+
onSelectionChange(selectedRows: any[]) {
|
|
237
|
+
console.log('Selected rows:', selectedRows);
|
|
238
|
+
// Enable bulk actions, update UI, etc.
|
|
239
|
+
}
|
|
240
|
+
|
|
234
241
|
// Standalone paginator
|
|
235
242
|
paginator = new PaginatorFieldDto(1, 500, 25);
|
|
236
243
|
|
|
@@ -270,10 +277,11 @@ export class AppComponent {
|
|
|
270
277
|
<lite-file [control]="fileField"></lite-file>
|
|
271
278
|
</form>
|
|
272
279
|
|
|
273
|
-
<!-- Data Table with Sorting -->
|
|
280
|
+
<!-- Data Table with Sorting and Selection -->
|
|
274
281
|
<lite-table
|
|
275
282
|
[table]="employeeTable"
|
|
276
|
-
(sortChange)="onTableSort($event)"
|
|
283
|
+
(sortChange)="onTableSort($event)"
|
|
284
|
+
(selectionChange)="onSelectionChange($event)">
|
|
277
285
|
</lite-table>
|
|
278
286
|
|
|
279
287
|
<!-- Paginated Table with Sorting -->
|
|
@@ -455,7 +463,7 @@ interface TableColumn {
|
|
|
455
463
|
flex?: string; // CSS flex property (e.g., '0 0 100px', '1')
|
|
456
464
|
sortable?: boolean; // Enable sorting for this column
|
|
457
465
|
cellTemplate?: (value: any, row: any) => string; // Custom HTML template
|
|
458
|
-
type?: 'text' | 'menu'; // Optional column type (default: 'text')
|
|
466
|
+
type?: 'text' | 'menu' | 'select'; // Optional column type (default: 'text')
|
|
459
467
|
menuItems?: Array<{ label: string; value: string; variant?: 'danger' | 'default' }>; // For 'menu' type columns
|
|
460
468
|
}
|
|
461
469
|
```
|
|
@@ -533,4 +541,4 @@ This project is licensed under the MIT License - see the [LICENSE](https://githu
|
|
|
533
541
|
|
|
534
542
|
---
|
|
535
543
|
## Changelog
|
|
536
|
-
- See [docs/CHANGELOG.md](https://github.com/liangk/lite-form/blob/main/docs/CHANGELOG.md) for the full historical record, including the latest `v1.4.
|
|
544
|
+
- See [docs/CHANGELOG.md](https://github.com/liangk/lite-form/blob/main/docs/CHANGELOG.md) for the full historical record, including the latest `v1.4.3` release with LiteTable row selection feature.
|