@dragonworks/ngx-dashboard 20.1.2 → 20.1.4

package/README.md

@@ -10,15 +10,14 @@ npm install @dragonworks/ngx-dashboard
 
 ## Features
 
-- **Grid-based Drag & Drop**: Advanced collision detection and boundary constraints
+- **Grid-based Drag & Drop**: Collision detection and boundary constraints
 - **Resizable Cells**: Dynamic resizing with minimum size constraints
 - **Dual-Mode Display**: Editor mode for configuration, viewer mode for presentation
-- **NgRx Signals State Management**: Modern reactive state with normalized widget storage
+- **NgRx Signals State Management**: Reactive state with normalized widget storage
 - **Material Design 3 Integration**: Full MD3 compliance with theme tokens
 - **Context Menu System**: Right-click operations with Material menu
 - **Extensible Widget System**: Factory pattern for custom widget types
 - **Performance Optimized**: 100% OnPush change detection strategy
-- **Dual-ID Architecture**: Separation of widget identity (WidgetId) from position (CellId)
 - **Provider Pattern**: Extensible dialog and settings providers
 
 ## Requirements
@@ -30,28 +29,22 @@ npm install @dragonworks/ngx-dashboard
 ## Basic Usage
 
 ```typescript
-import { Component } from '@angular/core';
-import { DashboardComponent, createEmptyDashboard } from '@dragonworks/ngx-dashboard';
-import type { DashboardData } from '@dragonworks/ngx-dashboard';
+import { Component } from "@angular/core";
+import { DashboardComponent, createEmptyDashboard } from "@dragonworks/ngx-dashboard";
+import type { DashboardData } from "@dragonworks/ngx-dashboard";
 
 @Component({
-  selector: 'app-dashboard-page',
+  selector: "app-dashboard-page",
   standalone: true,
   imports: [DashboardComponent],
-  template: `
-    <ngx-dashboard 
-      [dashboardData]="dashboard" 
-      [editMode]="true"
-      (dashboardChange)="onDashboardChange($event)">
-    </ngx-dashboard>
-  `
+  template: ` <ngx-dashboard [dashboardData]="dashboard" [editMode]="true" (dashboardChange)="onDashboardChange($event)"> </ngx-dashboard> `,
 })
 export class DashboardPageComponent {
-  dashboard = createEmptyDashboard('my-dashboard', 12, 8);
+  dashboard = createEmptyDashboard("my-dashboard", 12, 8);
 
   onDashboardChange(data: DashboardData) {
     // Handle dashboard updates
-    console.log('Dashboard changed:', data);
+    console.log("Dashboard changed:", data);
   }
 }
 ```
@@ -61,11 +54,11 @@ export class DashboardPageComponent {
 Register custom widgets with the `DashboardService`:
 
 ```typescript
-import { Injectable } from '@angular/core';
-import { DashboardService } from '@dragonworks/ngx-dashboard';
-import { MyCustomWidget } from './widgets/my-custom-widget.component';
+import { Injectable } from "@angular/core";
+import { DashboardService } from "@dragonworks/ngx-dashboard";
+import { MyCustomWidget } from "./widgets/my-custom-widget.component";
 
-@Injectable({ providedIn: 'root' })
+@Injectable({ providedIn: "root" })
 export class WidgetSetupService {
   constructor(private dashboardService: DashboardService) {
     this.registerWidgets();
@@ -97,23 +90,6 @@ export class WidgetSetupService {
 - `CellData` - Individual cell/widget data
 - `WidgetMetadata` - Widget type definition
 
-## Advanced Features
-
-### Custom Settings Dialog Provider
-
-```typescript
-import { CELL_SETTINGS_DIALOG_PROVIDER, DefaultCellSettingsDialogProvider } from '@dragonworks/ngx-dashboard';
-
-@Component({
-  providers: [
-    { 
-      provide: CELL_SETTINGS_DIALOG_PROVIDER, 
-      useClass: DefaultCellSettingsDialogProvider 
-    }
-  ]
-})
-```
-
 ### Widget State Management
 
 Widgets can implement optional lifecycle methods:
@@ -126,14 +102,6 @@ export interface DashboardWidgetComponent {
 }
 ```
 
-## Architecture Highlights
-
-- **NgRx Signals Store**: Feature-based state management with normalized widget storage
-- **Signal-based Architecture**: Modern Angular signals throughout
-- **Material Design 3**: Complete MD3 compliance with design tokens
-- **Performance First**: OnPush change detection, computed signals, memoization
-- **TypeScript Strict Mode**: Full type safety (no `any` types in public API)
-
 ## Documentation
 
 See the [main repository](https://github.com/TobyBackstrom/ngx-dashboard) for full documentation, examples, and demo application.

package/fesm2022/dragonworks-ngx-dashboard.mjs

@@ -173,7 +173,6 @@ const WidgetIdUtils = {
 function createEmptyDashboard(dashboardId, rows, columns, gutterSize = '0.5em') {
     return {
         version: '1.0.0',
-        dashboardId,
         rows,
         columns,
         gutterSize,
@@ -777,11 +776,13 @@ withMethods((store) => ({
         store._endResize(apply, {
             updateWidgetSpan: (cellId, rowSpan, colSpan) => {
                 // Adapter: find widget by cellId and update using widgetId
-                const widget = store.cells().find(c => CellIdUtils.equals(c.cellId, cellId));
+                const widget = store
+                    .cells()
+                    .find((c) => CellIdUtils.equals(c.cellId, cellId));
                 if (widget) {
                     store.updateWidgetSpan(widget.widgetId, rowSpan, colSpan);
                 }
-            }
+            },
         });
     },
     // EXPORT/IMPORT METHODS (need access to multiple features)
@@ -790,11 +791,11 @@ withMethods((store) => ({
         const liveWidgetStates = getCurrentWidgetStates?.() || new Map();
         return {
             version: '1.0.0',
-            dashboardId: store.dashboardId(),
             rows: store.rows(),
             columns: store.columns(),
             gutterSize: store.gutterSize(),
-            cells: store.cells()
+            cells: store
+                .cells()
                 .filter((cell) => cell.widgetFactory.widgetTypeid !== '__internal/unknown-widget')
                 .map((cell) => {
                 const cellIdString = CellIdUtils.toString(cell.cellId);
@@ -831,7 +832,6 @@ withMethods((store) => ({
             widgetsById[WidgetIdUtils.toString(widgetId)] = cell;
         });
         patchState(store, {
-            dashboardId: data.dashboardId,
             rows: data.rows,
             columns: data.columns,
             gutterSize: data.gutterSize,
@@ -859,7 +859,6 @@ withMethods((store) => ({
             widgetsById[WidgetIdUtils.toString(widgetId)] = cell;
         });
         patchState(store, {
-            dashboardId: dashboardData.dashboardId,
             rows: dashboardData.rows,
             columns: dashboardData.columns,
             gutterSize: dashboardData.gutterSize,
@@ -2246,5 +2245,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { CELL_SETTINGS_DIALOG_PROVIDER, CellIdUtils, CellSettingsDialogProvider, DEFAULT_RESERVED_SPACE, DashboardComponent, DashboardEditorComponent, DashboardService, DashboardViewerComponent, DefaultCellSettingsDialogProvider, WidgetIdUtils, WidgetListComponent, createDefaultDashboard, createEmptyDashboard, createFactoryFromComponent };
+export { CELL_SETTINGS_DIALOG_PROVIDER, CellSettingsDialogProvider, DashboardComponent, DashboardService, DefaultCellSettingsDialogProvider, WidgetListComponent, createDefaultDashboard, createEmptyDashboard };
 //# sourceMappingURL=dragonworks-ngx-dashboard.mjs.map