Initial commit: dashboard-elements-ui library

Angular library providing dashboard components including grid layout,
drag-and-drop widgets, resize handles, toolbar, config panel, layout
presets, and persistence services.

src/components/db-grid/db-grid.component.html

@@ -0,0 +1,44 @@
+<div class="db-grid__container" #gridRef>
+  @for (widget of widgets(); track widget.id) {
+    <div
+      class="db-grid__cell"
+      [style.grid-column]="widget.layout.col + ' / span ' + widget.layout.colSpan"
+      [style.grid-row]="widget.layout.row + ' / span ' + widget.layout.rowSpan"
+    >
+      <db-widget
+        [widget]="widget"
+        [editMode]="editMode()"
+        [fullscreen]="false"
+        [contentTemplate]="getContentTemplate(widget.type)"
+        [footerTemplate]="getFooterTemplate(widget.type)"
+        (remove)="onWidgetRemove(widget)"
+        (fullscreenToggle)="onWidgetFullscreen(widget)"
+        (configOpen)="onWidgetConfigOpen(widget)"
+        (action)="widgetAction.emit({ widget, action: $event })"
+        (resizeEnd)="onWidgetResizeEnd(widget, $event)"
+      />
+    </div>
+
+    <!-- Resize placeholder for this widget -->
+    @if (getResizePlaceholder(widget); as rp) {
+      <db-placeholder
+        [col]="rp.col"
+        [row]="rp.row"
+        [colSpan]="rp.colSpan"
+        [rowSpan]="rp.rowSpan"
+        type="resize"
+      />
+    }
+  }
+
+  <!-- Drag move placeholder -->
+  @if (dragPreview(); as dp) {
+    <db-placeholder
+      [col]="dp.col"
+      [row]="dp.row"
+      [colSpan]="dp.colSpan"
+      [rowSpan]="dp.rowSpan"
+      type="move"
+    />
+  }
+</div>