@forgeroute/ui 0.4.19 → 0.4.21

package/fesm2022/forgeroute-ui.mjs

@@ -496,6 +496,7 @@ var PaginationComponent = class PaginationComponent {
 		this.pageSize = input(25, ...ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []);
 		this.totalItems = input(0, ...ngDevMode ? [{ debugName: "totalItems" }] : /* istanbul ignore next */ []);
 		this.detached = input(false, ...ngDevMode ? [{ debugName: "detached" }] : /* istanbul ignore next */ []);
+		this.embedded = input(false, ...ngDevMode ? [{ debugName: "embedded" }] : /* istanbul ignore next */ []);
 		this.pageChange = output();
 		this.totalPages = computed(() => Math.ceil(this.totalItems() / this.pageSize()) || 1, ...ngDevMode ? [{ debugName: "totalPages" }] : /* istanbul ignore next */ []);
 		this.startItem = computed(() => (this.page() - 1) * this.pageSize() + 1, ...ngDevMode ? [{ debugName: "startItem" }] : /* istanbul ignore next */ []);
@@ -561,10 +562,20 @@ var PaginationComponent = class PaginationComponent {
 					isSignal: true,
 					isRequired: false,
 					transformFunction: null
+				},
+				embedded: {
+					classPropertyName: "embedded",
+					publicName: "embedded",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
 				}
 			},
 			outputs: { pageChange: "pageChange" },
-			host: { properties: { "class.pagination-detached": "detached()" } },
+			host: { properties: {
+				"class.pagination-detached": "detached()",
+				"class.pagination-embedded": "embedded()"
+			} },
 			ngImport: i0,
 			template: `
     @if (totalItems() > pageSize()) {
@@ -589,7 +600,7 @@ var PaginationComponent = class PaginationComponent {
     }
   `,
 			isInline: true,
-			styles: [".pagination{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #e2e8f0;border-top:none;border-radius:0 0 10px 10px}:host(.pagination-detached) .pagination{border:1px solid #e2e8f0;border-radius:10px;margin-top:4px}.pagination-info{font-size:.8125rem;color:#64748b}.pagination-controls{display:flex;align-items:center;gap:4px}.pagination-nav{width:32px;height:32px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#334155;font-family:inherit;transition:background .1s}.pagination-nav:hover:not(:disabled){background:#f8fafc;border-color:#cbd5e1}.pagination-nav:disabled{opacity:.4;cursor:default}.pagination-nav:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pagination-page{min-width:32px;height:32px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#334155;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:inherit;transition:background .1s,border-color .1s}.pagination-page:hover{background:#f8fafc;border-color:#cbd5e1}.pagination-page.active{background:#3b82f6;color:#fff;border-color:#3b82f6}.pagination-page:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pagination-ellipsis{padding:0 4px;color:#94a3b8;font-size:.8125rem}@media(max-width:640px),(pointer:coarse){.pagination-controls{flex-wrap:wrap;justify-content:center}.pagination-nav{width:44px;height:44px}.pagination-page{min-width:44px;height:44px}}@media(max-width:480px){.pagination{justify-content:center;padding:10px 12px}.pagination-info{width:100%;text-align:center}}\n"],
+			styles: [".pagination{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #e2e8f0;border-top:none;border-radius:0 0 10px 10px}:host(.pagination-detached) .pagination{border:1px solid #e2e8f0;border-radius:10px;margin-top:4px}:host(.pagination-embedded) .pagination{background:transparent;border:none;border-radius:0;padding:0;margin-top:0}.pagination-info{font-size:.8125rem;color:#64748b}.pagination-controls{display:flex;align-items:center;gap:4px}.pagination-nav{width:32px;height:32px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#334155;font-family:inherit;transition:background .1s}.pagination-nav:hover:not(:disabled){background:#f8fafc;border-color:#cbd5e1}.pagination-nav:disabled{opacity:.4;cursor:default}.pagination-nav:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pagination-page{min-width:32px;height:32px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#334155;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:inherit;transition:background .1s,border-color .1s}.pagination-page:hover{background:#f8fafc;border-color:#cbd5e1}.pagination-page.active{background:#3b82f6;color:#fff;border-color:#3b82f6}.pagination-page:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pagination-ellipsis{padding:0 4px;color:#94a3b8;font-size:.8125rem}@media(max-width:640px),(pointer:coarse){.pagination-controls{flex-wrap:wrap;justify-content:center}.pagination-nav{width:44px;height:44px}.pagination-page{min-width:44px;height:44px}}@media(max-width:480px){.pagination{justify-content:center;padding:10px 12px}.pagination-info{width:100%;text-align:center}}\n"],
 			changeDetection: i0.ChangeDetectionStrategy.OnPush
 		});
 	}
@@ -605,7 +616,10 @@ i0.ɵɵngDeclareClassMetadata({
 			selector: "ui-pagination",
 			standalone: true,
 			changeDetection: ChangeDetectionStrategy.OnPush,
-			host: { "[class.pagination-detached]": "detached()" },
+			host: {
+				"[class.pagination-detached]": "detached()",
+				"[class.pagination-embedded]": "embedded()"
+			},
 			template: `
     @if (totalItems() > pageSize()) {
       <nav class="pagination" role="navigation" aria-label="Pagination">
@@ -628,7 +642,7 @@ i0.ɵɵngDeclareClassMetadata({
       </nav>
     }
   `,
-			styles: [".pagination{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #e2e8f0;border-top:none;border-radius:0 0 10px 10px}:host(.pagination-detached) .pagination{border:1px solid #e2e8f0;border-radius:10px;margin-top:4px}.pagination-info{font-size:.8125rem;color:#64748b}.pagination-controls{display:flex;align-items:center;gap:4px}.pagination-nav{width:32px;height:32px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#334155;font-family:inherit;transition:background .1s}.pagination-nav:hover:not(:disabled){background:#f8fafc;border-color:#cbd5e1}.pagination-nav:disabled{opacity:.4;cursor:default}.pagination-nav:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pagination-page{min-width:32px;height:32px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#334155;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:inherit;transition:background .1s,border-color .1s}.pagination-page:hover{background:#f8fafc;border-color:#cbd5e1}.pagination-page.active{background:#3b82f6;color:#fff;border-color:#3b82f6}.pagination-page:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pagination-ellipsis{padding:0 4px;color:#94a3b8;font-size:.8125rem}@media(max-width:640px),(pointer:coarse){.pagination-controls{flex-wrap:wrap;justify-content:center}.pagination-nav{width:44px;height:44px}.pagination-page{min-width:44px;height:44px}}@media(max-width:480px){.pagination{justify-content:center;padding:10px 12px}.pagination-info{width:100%;text-align:center}}\n"]
+			styles: [".pagination{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #e2e8f0;border-top:none;border-radius:0 0 10px 10px}:host(.pagination-detached) .pagination{border:1px solid #e2e8f0;border-radius:10px;margin-top:4px}:host(.pagination-embedded) .pagination{background:transparent;border:none;border-radius:0;padding:0;margin-top:0}.pagination-info{font-size:.8125rem;color:#64748b}.pagination-controls{display:flex;align-items:center;gap:4px}.pagination-nav{width:32px;height:32px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#334155;font-family:inherit;transition:background .1s}.pagination-nav:hover:not(:disabled){background:#f8fafc;border-color:#cbd5e1}.pagination-nav:disabled{opacity:.4;cursor:default}.pagination-nav:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pagination-page{min-width:32px;height:32px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#334155;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:inherit;transition:background .1s,border-color .1s}.pagination-page:hover{background:#f8fafc;border-color:#cbd5e1}.pagination-page.active{background:#3b82f6;color:#fff;border-color:#3b82f6}.pagination-page:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pagination-ellipsis{padding:0 4px;color:#94a3b8;font-size:.8125rem}@media(max-width:640px),(pointer:coarse){.pagination-controls{flex-wrap:wrap;justify-content:center}.pagination-nav{width:44px;height:44px}.pagination-page{min-width:44px;height:44px}}@media(max-width:480px){.pagination{justify-content:center;padding:10px 12px}.pagination-info{width:100%;text-align:center}}\n"]
 		}]
 	}],
 	propDecorators: {
@@ -664,6 +678,14 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		embedded: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "embedded",
+				required: false
+			}]
+		}],
 		pageChange: [{
 			type: i0.Output,
 			args: ["pageChange"]
@@ -4316,6 +4338,9 @@ const EXTRA_ICONS = {
 	"card": "M3 4h18a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z M1 10h22",
 	"view-off": "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z M12 9a3 3 0 1 0 0 6 3 3 0 0 0 0-6z M3 3l18 18",
 	"refund": "M3 10h10a8 8 0 0 1 8 8v2 M3 10l6 6 M3 10l6-6",
+	"link": "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71 M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71",
+	"chart": "M18 20V10 M12 20V4 M6 20v-6",
+	"save": "M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z M17 21v-8H7v8 M7 3v5h8",
 	"bank": "M3 21h18 M3 10h18 M5 6l7-3 7 3 M4 10v11 M20 10v11 M8 14v3 M12 14v3 M16 14v3"
 };
 function iconPath(name) {
@@ -4742,6 +4767,7 @@ var TextInputComponent = class TextInputComponent {
 	constructor() {
 		this.label = input("", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
 		this.ariaLabel = input("", ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+		this.inputTestId = input("", ...ngDevMode ? [{ debugName: "inputTestId" }] : /* istanbul ignore next */ []);
 		this.placeholder = input("", ...ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []);
 		this.prefix = input("", ...ngDevMode ? [{ debugName: "prefix" }] : /* istanbul ignore next */ []);
 		this.revealable = input(false, ...ngDevMode ? [{ debugName: "revealable" }] : /* istanbul ignore next */ []);
@@ -4973,6 +4999,13 @@ var TextInputComponent = class TextInputComponent {
 					isRequired: false,
 					transformFunction: null
 				},
+				inputTestId: {
+					classPropertyName: "inputTestId",
+					publicName: "inputTestId",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
 				placeholder: {
 					classPropertyName: "placeholder",
 					publicName: "placeholder",
@@ -5163,16 +5196,20 @@ var TextInputComponent = class TextInputComponent {
     <div class="ti-field" [class.ti-error]="_activeError()" [class.ti-disabled]="disabled()"
          [class.ti-prefixed]="!!prefix() || _revealable()" [style.--ti-input-row]="(prefix() || _revealable()) ? (label() ? 2 : 1) : null">
       @if (label()) {
-        <label class="ti-label" [for]="_inputId">
-          {{ label() }}
-          @if (required()) { <span class="ti-required" aria-hidden="true">*</span> }
-        </label>
+        <div class="ti-label-row">
+          <label class="ti-label" [for]="_inputId">
+            {{ label() }}
+            @if (required()) { <span class="ti-required" aria-hidden="true">*</span> }
+          </label>
+          <ng-content select="[uiLabelEnd]" />
+        </div>
       }
       <input
         class="ti-input"
         [style.padding-left]="_prefixPadding()"
         [style.padding-right]="_revealable() ? '44px' : null"
         [id]="_inputId"
+        [attr.data-testid]="inputTestId() || null"
         [type]="_inputType()"
         [attr.inputmode]="inputmode() || (type() === 'tel' ? 'tel' : integer() ? 'numeric' : null)"
         [placeholder]="placeholder()"
@@ -5214,7 +5251,7 @@ var TextInputComponent = class TextInputComponent {
     </div>
   `,
 			isInline: true,
-			styles: [":host{display:block}.ti-field{display:flex;flex-direction:column;gap:6px}.ti-label{font-size:.8125rem;font-weight:600;color:#374151;line-height:1}.ti-required{color:#dc2626;margin-left:2px}.ti-prefixed{display:grid;grid-template-columns:minmax(0,1fr)}.ti-prefixed .ti-input{grid-row:var(--ti-input-row);grid-column:1}.ti-prefix{grid-row:var(--ti-input-row);grid-column:1;justify-self:start;align-self:center;margin-left:12px;font-size:.875rem;line-height:1;color:#64748b;pointer-events:none}@media(max-width:480px){.ti-prefix{font-size:1rem}}.ti-disabled .ti-prefix{opacity:.5}.ti-reveal{grid-row:var(--ti-input-row);grid-column:1;justify-self:end;align-self:center;margin-right:6px;position:relative;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:0;border-radius:6px;background:transparent;color:#64748b;cursor:pointer}.ti-reveal:hover:not(:disabled){color:#1e293b;background:#f1f5f9}.ti-reveal:focus-visible{outline:2px solid #3b82f6;outline-offset:0}.ti-reveal:disabled{opacity:.5;cursor:not-allowed}@media(pointer:coarse),(max-width:480px){.ti-reveal{width:44px;height:44px;margin-right:0}}.ti-input{width:100%;box-sizing:border-box;padding:9px 12px;font-size:.875rem;font-family:inherit;color:#1e293b;background:#fff;border:1px solid #e2e8f0;border-radius:8px;outline:none;transition:border-color .15s,box-shadow .15s}.ti-input::placeholder{color:#94a3b8}.ti-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61f}.ti-input:read-only{background:#f8fafc;cursor:default}.ti-error .ti-input{border-color:#ef4444}.ti-error .ti-input:focus{box-shadow:0 0 0 3px #ef44441f}.ti-disabled .ti-input{opacity:.5;cursor:not-allowed}.ti-desc{margin:0;font-size:.75rem;line-height:1.4;color:#64748b}.ti-desc-error{color:#dc2626}@media(max-width:480px){.ti-input{font-size:1rem}}@media(pointer:coarse),(max-width:480px){.ti-input{min-height:44px}}\n"],
+			styles: [":host{display:block}.ti-field{display:flex;flex-direction:column;gap:6px}.ti-label-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.ti-label-row>[uiLabelEnd]{margin-left:auto}.ti-label{font-size:.8125rem;font-weight:600;color:#374151;line-height:1}.ti-required{color:#dc2626;margin-left:2px}.ti-prefixed{display:grid;grid-template-columns:minmax(0,1fr)}.ti-prefixed .ti-input{grid-row:var(--ti-input-row);grid-column:1}.ti-prefix{grid-row:var(--ti-input-row);grid-column:1;justify-self:start;align-self:center;margin-left:12px;font-size:.875rem;line-height:1;color:#64748b;pointer-events:none}@media(max-width:480px){.ti-prefix{font-size:1rem}}.ti-disabled .ti-prefix{opacity:.5}.ti-reveal{grid-row:var(--ti-input-row);grid-column:1;justify-self:end;align-self:center;margin-right:6px;position:relative;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:0;border-radius:6px;background:transparent;color:#64748b;cursor:pointer}.ti-reveal:hover:not(:disabled){color:#1e293b;background:#f1f5f9}.ti-reveal:focus-visible{outline:2px solid #3b82f6;outline-offset:0}.ti-reveal:disabled{opacity:.5;cursor:not-allowed}@media(pointer:coarse),(max-width:480px){.ti-reveal{width:44px;height:44px;margin-right:0}}.ti-input{width:100%;box-sizing:border-box;padding:9px 12px;font-size:.875rem;font-family:inherit;color:#1e293b;background:#fff;border:1px solid #e2e8f0;border-radius:8px;outline:none;transition:border-color .15s,box-shadow .15s}.ti-input::placeholder{color:#94a3b8}.ti-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61f}.ti-input:read-only{background:#f8fafc;cursor:default}.ti-error .ti-input{border-color:#ef4444}.ti-error .ti-input:focus{box-shadow:0 0 0 3px #ef44441f}.ti-disabled .ti-input{opacity:.5;cursor:not-allowed}.ti-desc{margin:0;font-size:.75rem;line-height:1.4;color:#64748b}.ti-desc-error{color:#dc2626}@media(max-width:480px){.ti-input{font-size:1rem}}@media(pointer:coarse),(max-width:480px){.ti-input{min-height:44px}}\n"],
 			dependencies: [{
 				kind: "component",
 				type: PasswordRequirementsComponent,
@@ -5261,16 +5298,20 @@ i0.ɵɵngDeclareClassMetadata({
     <div class="ti-field" [class.ti-error]="_activeError()" [class.ti-disabled]="disabled()"
          [class.ti-prefixed]="!!prefix() || _revealable()" [style.--ti-input-row]="(prefix() || _revealable()) ? (label() ? 2 : 1) : null">
       @if (label()) {
-        <label class="ti-label" [for]="_inputId">
-          {{ label() }}
-          @if (required()) { <span class="ti-required" aria-hidden="true">*</span> }
-        </label>
+        <div class="ti-label-row">
+          <label class="ti-label" [for]="_inputId">
+            {{ label() }}
+            @if (required()) { <span class="ti-required" aria-hidden="true">*</span> }
+          </label>
+          <ng-content select="[uiLabelEnd]" />
+        </div>
       }
       <input
         class="ti-input"
         [style.padding-left]="_prefixPadding()"
         [style.padding-right]="_revealable() ? '44px' : null"
         [id]="_inputId"
+        [attr.data-testid]="inputTestId() || null"
         [type]="_inputType()"
         [attr.inputmode]="inputmode() || (type() === 'tel' ? 'tel' : integer() ? 'numeric' : null)"
         [placeholder]="placeholder()"
@@ -5311,7 +5352,7 @@ i0.ɵɵngDeclareClassMetadata({
       }
     </div>
   `,
-			styles: [":host{display:block}.ti-field{display:flex;flex-direction:column;gap:6px}.ti-label{font-size:.8125rem;font-weight:600;color:#374151;line-height:1}.ti-required{color:#dc2626;margin-left:2px}.ti-prefixed{display:grid;grid-template-columns:minmax(0,1fr)}.ti-prefixed .ti-input{grid-row:var(--ti-input-row);grid-column:1}.ti-prefix{grid-row:var(--ti-input-row);grid-column:1;justify-self:start;align-self:center;margin-left:12px;font-size:.875rem;line-height:1;color:#64748b;pointer-events:none}@media(max-width:480px){.ti-prefix{font-size:1rem}}.ti-disabled .ti-prefix{opacity:.5}.ti-reveal{grid-row:var(--ti-input-row);grid-column:1;justify-self:end;align-self:center;margin-right:6px;position:relative;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:0;border-radius:6px;background:transparent;color:#64748b;cursor:pointer}.ti-reveal:hover:not(:disabled){color:#1e293b;background:#f1f5f9}.ti-reveal:focus-visible{outline:2px solid #3b82f6;outline-offset:0}.ti-reveal:disabled{opacity:.5;cursor:not-allowed}@media(pointer:coarse),(max-width:480px){.ti-reveal{width:44px;height:44px;margin-right:0}}.ti-input{width:100%;box-sizing:border-box;padding:9px 12px;font-size:.875rem;font-family:inherit;color:#1e293b;background:#fff;border:1px solid #e2e8f0;border-radius:8px;outline:none;transition:border-color .15s,box-shadow .15s}.ti-input::placeholder{color:#94a3b8}.ti-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61f}.ti-input:read-only{background:#f8fafc;cursor:default}.ti-error .ti-input{border-color:#ef4444}.ti-error .ti-input:focus{box-shadow:0 0 0 3px #ef44441f}.ti-disabled .ti-input{opacity:.5;cursor:not-allowed}.ti-desc{margin:0;font-size:.75rem;line-height:1.4;color:#64748b}.ti-desc-error{color:#dc2626}@media(max-width:480px){.ti-input{font-size:1rem}}@media(pointer:coarse),(max-width:480px){.ti-input{min-height:44px}}\n"]
+			styles: [":host{display:block}.ti-field{display:flex;flex-direction:column;gap:6px}.ti-label-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.ti-label-row>[uiLabelEnd]{margin-left:auto}.ti-label{font-size:.8125rem;font-weight:600;color:#374151;line-height:1}.ti-required{color:#dc2626;margin-left:2px}.ti-prefixed{display:grid;grid-template-columns:minmax(0,1fr)}.ti-prefixed .ti-input{grid-row:var(--ti-input-row);grid-column:1}.ti-prefix{grid-row:var(--ti-input-row);grid-column:1;justify-self:start;align-self:center;margin-left:12px;font-size:.875rem;line-height:1;color:#64748b;pointer-events:none}@media(max-width:480px){.ti-prefix{font-size:1rem}}.ti-disabled .ti-prefix{opacity:.5}.ti-reveal{grid-row:var(--ti-input-row);grid-column:1;justify-self:end;align-self:center;margin-right:6px;position:relative;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:0;border-radius:6px;background:transparent;color:#64748b;cursor:pointer}.ti-reveal:hover:not(:disabled){color:#1e293b;background:#f1f5f9}.ti-reveal:focus-visible{outline:2px solid #3b82f6;outline-offset:0}.ti-reveal:disabled{opacity:.5;cursor:not-allowed}@media(pointer:coarse),(max-width:480px){.ti-reveal{width:44px;height:44px;margin-right:0}}.ti-input{width:100%;box-sizing:border-box;padding:9px 12px;font-size:.875rem;font-family:inherit;color:#1e293b;background:#fff;border:1px solid #e2e8f0;border-radius:8px;outline:none;transition:border-color .15s,box-shadow .15s}.ti-input::placeholder{color:#94a3b8}.ti-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61f}.ti-input:read-only{background:#f8fafc;cursor:default}.ti-error .ti-input{border-color:#ef4444}.ti-error .ti-input:focus{box-shadow:0 0 0 3px #ef44441f}.ti-disabled .ti-input{opacity:.5;cursor:not-allowed}.ti-desc{margin:0;font-size:.75rem;line-height:1.4;color:#64748b}.ti-desc-error{color:#dc2626}@media(max-width:480px){.ti-input{font-size:1rem}}@media(pointer:coarse),(max-width:480px){.ti-input{min-height:44px}}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -5332,6 +5373,14 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		inputTestId: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "inputTestId",
+				required: false
+			}]
+		}],
 		placeholder: [{
 			type: i0.Input,
 			args: [{
@@ -5987,6 +6036,7 @@ var TableToolbarComponent = class TableToolbarComponent {
 					inputs: [
 						"label",
 						"ariaLabel",
+						"inputTestId",
 						"placeholder",
 						"prefix",
 						"revealable",
@@ -7308,7 +7358,7 @@ var SelectComponent = class SelectComponent {
             <option value="" [disabled]="true" [selected]="_value() === ''">{{ placeholder() }}</option>
           }
           @for (opt of options(); track opt.value; let i = $index) {
-            <option [value]="_key(opt)" [selected]="i === _selectedIndex()" [attr.title]="opt.description || null">{{ opt.badge ? opt.label + ' — ' + opt.badge : opt.label }}</option>
+            <option [value]="_key(opt)" [selected]="i === _selectedIndex()" [disabled]="!!opt.disabled" [attr.title]="opt.description || null">{{ opt.badge ? opt.label + ' — ' + opt.badge : opt.label }}</option>
           }
         </select>
         <svg class="sl-chevron" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>
@@ -7379,7 +7429,7 @@ i0.ɵɵngDeclareClassMetadata({
             <option value="" [disabled]="true" [selected]="_value() === ''">{{ placeholder() }}</option>
           }
           @for (opt of options(); track opt.value; let i = $index) {
-            <option [value]="_key(opt)" [selected]="i === _selectedIndex()" [attr.title]="opt.description || null">{{ opt.badge ? opt.label + ' — ' + opt.badge : opt.label }}</option>
+            <option [value]="_key(opt)" [selected]="i === _selectedIndex()" [disabled]="!!opt.disabled" [attr.title]="opt.description || null">{{ opt.badge ? opt.label + ' — ' + opt.badge : opt.label }}</option>
           }
         </select>
         <svg class="sl-chevron" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>
@@ -9960,7 +10010,8 @@ var DataTableComponent = class DataTableComponent {
 		this.showMoreActions = input(true, ...ngDevMode ? [{ debugName: "showMoreActions" }] : /* istanbul ignore next */ []);
 		this.showSearch = input(true, ...ngDevMode ? [{ debugName: "showSearch" }] : /* istanbul ignore next */ []);
 		this.showQuickTabs = input(true, ...ngDevMode ? [{ debugName: "showQuickTabs" }] : /* istanbul ignore next */ []);
-		this._showHeader = computed(() => this.showSearch() || this.showToolbar() || this._effectiveTabs().length > 0, ...ngDevMode ? [{ debugName: "_showHeader" }] : /* istanbul ignore next */ []);
+		this.tableTitle = input("", ...ngDevMode ? [{ debugName: "tableTitle" }] : /* istanbul ignore next */ []);
+		this._showHeader = computed(() => !!this.tableTitle() || this.showSearch() || this.showToolbar() || this._effectiveTabs().length > 0, ...ngDevMode ? [{ debugName: "_showHeader" }] : /* istanbul ignore next */ []);
 		this.countsEndpoint = input("", ...ngDevMode ? [{ debugName: "countsEndpoint" }] : /* istanbul ignore next */ []);
 		this.params = input(null, ...ngDevMode ? [{ debugName: "params" }] : /* istanbul ignore next */ []);
 		this.tableButtons = input([], ...ngDevMode ? [{ debugName: "tableButtons" }] : /* istanbul ignore next */ []);
@@ -10939,6 +10990,13 @@ var DataTableComponent = class DataTableComponent {
 					isRequired: false,
 					transformFunction: null
 				},
+				tableTitle: {
+					classPropertyName: "tableTitle",
+					publicName: "tableTitle",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
 				countsEndpoint: {
 					classPropertyName: "countsEndpoint",
 					publicName: "countsEndpoint",
@@ -11074,6 +11132,9 @@ var DataTableComponent = class DataTableComponent {
         @if (_showHeader()) {
         <div class="dt-sk-toolbar">
           <div class="dt-sk-toolbar-left">
+            @if (tableTitle()) {
+              <h3 class="dt-title">{{ tableTitle() }}</h3>
+            }
             @if (showSearch()) {
             <div class="dt-sk-search">
               <div class="dt-sk-shimmer dt-sk-search-icon"></div>
@@ -11099,6 +11160,9 @@ var DataTableComponent = class DataTableComponent {
       } @else if (_showHeader()) {
         <div class="dt-header alive-header">
           <div class="dt-header-left">
+            @if (tableTitle()) {
+              <h3 class="dt-title">{{ tableTitle() }}</h3>
+            }
             @if (showSearch() && !_emptyUnfiltered()) {
             <ui-search-input
               [value]="_search()"
@@ -11742,7 +11806,7 @@ var DataTableComponent = class DataTableComponent {
     </div>
   `,
 			isInline: true,
-			styles: [":host{display:flex;flex-direction:column;flex:1;min-height:0}.dt-host{display:flex;flex-direction:column;height:100%;min-height:0}.dt-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;justify-content:space-between;position:relative;z-index:10}.dt-header-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;min-width:0}.dt-header-right{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.dt-sk-shimmer{position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-shimmer:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}@keyframes dt-shimmer{to{transform:translate(200%)}}.dt-sk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dt-sk-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dt-sk-toolbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.dt-sk-search{display:flex;align-items:center;gap:10px;width:380px;height:36px;padding:0 12px;border:1px solid #e2e8f0;border-radius:6px;background:#f8fafc;box-sizing:border-box}.dt-sk-search-icon{width:16px;height:16px;border-radius:50%;flex-shrink:0}.dt-sk-search-text{flex:1;height:11px;border-radius:4px}.dt-sk-tab-strip{display:flex;gap:2px;padding:3px;background:#f1f5f9;border-radius:8px}.dt-sk-tab{height:28px;width:70px;border-radius:6px}.dt-sk-icon-btn{width:32px;height:32px;border-radius:6px}.dt-skeleton{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dt-sk-header{display:flex;gap:24px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.dt-sk-row{display:flex;gap:24px;padding:13px 16px;border-bottom:1px solid #f1f5f9}.dt-sk-row:last-child{border-bottom:none}.dt-sk-cell{flex:1;height:13px;border-radius:4px;position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-cell:first-child{max-width:100px}.dt-sk-cell:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}.dt-sk-head{height:10px}.dt-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #e2e8f0;border-radius:10px 10px 0 0}.dt-sk-reload-row td{padding:10px 14px;border-bottom:1px solid #f1f5f9}table{width:100%;border-collapse:collapse;font-size:.875rem}thead tr{background:#f8fafc;border-bottom:1px solid #e2e8f0}thead{position:sticky;top:0;z-index:2}th{padding:10px 14px;font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-right:1px solid #e2e8f0;text-align:center;background:#f8fafc}th:last-child{border-right:none}th.dt-th-sorted{background:#f1f5f9}th.dt-th-actions{width:48px}.dt-th-inner{display:flex;align-items:center;justify-content:center;gap:4px}.dt-sort-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;padding:0;text-transform:inherit;letter-spacing:inherit}.dt-sort-btn:hover{color:#1e293b}.dt-sort-btn:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:2px}@media(pointer:coarse){.dt-sort-btn{position:relative}.dt-sort-btn:after{content:\"\";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}}.dt-sort-icon{transition:transform .15s}.dt-sort-desc{transform:rotate(180deg)}.dt-sort-inactive{opacity:.4}tbody tr{border-bottom:1px solid #f1f5f9;background:#fff;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#f8fafc}.dt-row-clickable{cursor:pointer}.dt-row-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}td{padding:10px 14px;color:#334155;vertical-align:middle;white-space:nowrap;border-right:1px solid #f1f5f9}td:last-child{border-right:none}.dt-td-actions{text-align:center;padding:6px 8px}.dt-td-width{overflow:hidden;text-overflow:ellipsis}.dt-img{display:inline-block;vertical-align:middle;object-fit:cover;border:1px solid #e2e8f0;background:#f1f5f9;flex-shrink:0}.dt-img-ph{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;color:#94a3b8;background:#f1f5f9;border:1px solid #e2e8f0;flex-shrink:0}.dt-img-ph svg{width:55%;height:55%}.dt-img-circle-md{width:40px;height:40px;border-radius:50%}.dt-img-circle-sm{width:28px;height:28px;border-radius:50%}.dt-img-rounded-md{width:48px;height:32px;border-radius:6px}.dt-img-rounded-sm{width:36px;height:24px;border-radius:5px}.dt-avatar-name{display:flex;align-items:center;gap:8px}.dt-name-text{color:#1e293b}.dt-overdue{color:#dc2626;font-weight:500}.dt-none{color:#94a3b8}.dt-link{position:relative;display:inline-block;max-width:100%;padding:1px 2px;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2563eb;text-decoration:none;border-radius:3px;cursor:pointer}.dt-link:hover{text-decoration:underline;color:#1d4ed8}.dt-link:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px;text-decoration:underline}.dt-card-detail-value .dt-link,.dt-card-name .dt-link{white-space:normal;overflow-wrap:anywhere}.dt-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dt-tags{display:flex;align-items:center;gap:4px}.dt-tags-more{font-size:.75rem;font-weight:600;color:#475569;background:#f1f5f9;border-radius:999px;padding:2px 7px;cursor:default;-webkit-user-select:none;user-select:none;border:1px solid #e2e8f0}.dt-tags-more:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:999px}.dt-tag-tooltip{position:fixed;z-index:9999;pointer-events:none;background:#1e293b;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:5px;box-shadow:0 4px 6px #0000000f,0 10px 24px #00000024;transform:translate(-50%) translateY(-100%);animation:dt-tip-in .12s ease;max-width:220px}@keyframes dt-tip-in{0%{opacity:0;transform:translate(-50%) translateY(calc(-100% + 4px))}to{opacity:1;transform:translate(-50%) translateY(-100%)}}.dt-cell-star{margin-right:6px}.dt-actions-cell{display:flex;align-items:center;justify-content:center}.dt-bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;align-self:flex-start;padding:10px 14px;margin-bottom:8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px}.dt-bulk-count{font-size:.875rem;font-weight:600;color:#1e40af;white-space:nowrap;flex-shrink:0}.dt-bulk-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:0}.dt-bulk-actions ui-select{max-width:180px;min-width:120px}.dt-bulk-hint{font-size:.8125rem;line-height:1.35;color:#475569}.dt-card-cb{display:flex;align-items:center;padding:0 0 6px}.dt-card-selected{background:#eff6ff!important;border-color:#bfdbfe!important}.dt-th-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-th-grip{width:36px;padding:0!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-grip{width:36px;padding:0!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-grip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;color:#64748b;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.dt-grip:hover{background:#f1f5f9;color:#334155}.dt-grip:active{cursor:grabbing}.dt-grip:focus-visible{outline:2px solid #3b82f6;outline-offset:1px}.dt-grip-off{color:#cbd5e1;cursor:not-allowed}.dt-grip-off:hover{background:none;color:#cbd5e1}.dt-row-move{display:none}@media(pointer:coarse){.dt-grip{display:none}.dt-row-move{display:inline-flex;flex-direction:column;align-items:center}.dt-th-grip,.dt-td-grip{width:56px}}.dt-row-dragging{opacity:.45}.dt-row-over-before>td{box-shadow:inset 0 2px #3b82f6}.dt-row-over-after>td{box-shadow:inset 0 -2px #3b82f6}.dt-card-move{display:inline-flex;align-items:center;gap:2px;flex-shrink:0}@media(forced-colors:active){.dt-row-over-before>td{box-shadow:inset 0 2px 0 Highlight}.dt-row-over-after>td{box-shadow:inset 0 -2px 0 Highlight}.dt-grip:focus-visible{outline-color:Highlight}}.dt-row-selected{background:#eff6ff!important}.dt-row-selected:hover{background:#dbeafe!important}.dt-state-cell{padding:0!important;border:none!important;background:#fff!important}@media(max-width:1024px){th{padding:10px 12px}td{padding:11px 12px}.dt-sort-btn{padding:4px 0}.dt-td-actions{padding:6px}.dt-bulk-bar{align-self:stretch}}@media(max-width:820px){.dt-header-left{flex-basis:100%}.dt-header-right{flex-basis:100%;justify-content:flex-start}}@media(max-width:768px){th{padding:9px 10px;font-size:.8125rem}td{padding:10px;font-size:.8125rem}.dt-sk-search{width:100%}}@media(max-width:640px){.dt-header{flex-direction:column;align-items:stretch}.dt-header-left,.dt-header-right{width:100%}.dt-table-wrap{display:none}.dt-sk-search{width:100%}.dt-sk-toolbar{flex-direction:column;align-items:stretch;gap:8px}.dt-sk-toolbar-right{align-self:flex-end}.dt-bulk-bar{align-self:stretch;padding:10px 12px;row-gap:8px}.dt-bulk-count{flex:1}.dt-bulk-actions{width:100%}.dt-bulk-hint{flex-basis:100%}.dt-bulk-actions ui-select{max-width:100%;flex:1}}.dt-confirm-msg{margin:0;font-size:.9375rem;color:#334155;line-height:1.5;overflow-wrap:anywhere;word-break:break-word;white-space:pre-line}.dt-confirm-details{margin:10px 0 0;padding-left:20px;font-size:.875rem;color:#64748b;line-height:1.5;overflow-wrap:anywhere;word-break:break-word}.dt-confirm-details li+li{margin-top:4px}ui-pagination{flex-shrink:0}.dt-phone-controls{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;flex-shrink:0}.dt-phone-sort{display:flex;align-items:center;gap:8px}.dt-phone-sort-label{font-size:.8125rem;font-weight:600;color:#64748b;flex-shrink:0}.dt-phone-sort-select{flex:1;min-width:0;min-height:44px;box-sizing:border-box;padding:0 12px;font-family:inherit;font-size:1rem;color:#1e293b;background:#fff;border:1px solid #e2e8f0;border-radius:8px}.dt-phone-filters{display:flex;flex-wrap:wrap;gap:8px}.dt-card-list{display:none;flex-direction:column;gap:8px;flex:1;min-height:0;overflow-y:auto}@media(max-width:640px){.dt-card-list{display:flex;padding-bottom:8px}}.dt-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;contain:layout style;padding:14px 16px;display:flex;flex-direction:column;gap:10px;transition:background .1s}.dt-card:has(.mm-dropdown){position:relative;z-index:1}.dt-card-clickable{cursor:pointer}.dt-card-clickable:active{background:#f8fafc}.dt-card-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.dt-card-header{display:flex;align-items:center;gap:10px}.dt-card-title{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.dt-card-name{min-width:0;font-weight:600;color:#1e293b;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-card-name-plain{flex:1}.dt-card-actions{margin-left:auto;flex-shrink:0}.dt-card-badges{display:flex;flex-wrap:wrap;gap:6px}.dt-card-tags{display:flex;flex-wrap:wrap;gap:4px}.dt-card-details{display:flex;flex-direction:column;gap:5px}.dt-card-detail-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.8125rem}.dt-card-detail-label{color:#64748b;flex-shrink:0}.dt-card-detail-value{color:#334155;font-weight:500;text-align:right;min-width:0;overflow-wrap:anywhere;word-break:break-word}.dt-card-sk{gap:12px}.dt-card-sk-header{display:flex;align-items:center;gap:10px}.dt-card-sk-badges{display:flex;gap:6px}.dt-card-sk-rows{display:flex;flex-direction:column;gap:8px}\n"],
+			styles: [":host{display:flex;flex-direction:column;flex:1;min-height:0}.dt-host{display:flex;flex-direction:column;height:100%;min-height:0}.dt-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;justify-content:space-between;position:relative;z-index:10}.dt-header-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;min-width:0}.dt-header-right{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.dt-title{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b;overflow-wrap:anywhere}.dt-sk-shimmer{position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-shimmer:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}@keyframes dt-shimmer{to{transform:translate(200%)}}.dt-sk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dt-sk-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dt-sk-toolbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.dt-sk-search{display:flex;align-items:center;gap:10px;width:380px;height:36px;padding:0 12px;border:1px solid #e2e8f0;border-radius:6px;background:#f8fafc;box-sizing:border-box}.dt-sk-search-icon{width:16px;height:16px;border-radius:50%;flex-shrink:0}.dt-sk-search-text{flex:1;height:11px;border-radius:4px}.dt-sk-tab-strip{display:flex;gap:2px;padding:3px;background:#f1f5f9;border-radius:8px}.dt-sk-tab{height:28px;width:70px;border-radius:6px}.dt-sk-icon-btn{width:32px;height:32px;border-radius:6px}.dt-skeleton{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dt-sk-header{display:flex;gap:24px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.dt-sk-row{display:flex;gap:24px;padding:13px 16px;border-bottom:1px solid #f1f5f9}.dt-sk-row:last-child{border-bottom:none}.dt-sk-cell{flex:1;height:13px;border-radius:4px;position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-cell:first-child{max-width:100px}.dt-sk-cell:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}.dt-sk-head{height:10px}.dt-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #e2e8f0;border-radius:10px 10px 0 0}.dt-sk-reload-row td{padding:10px 14px;border-bottom:1px solid #f1f5f9}table{width:100%;border-collapse:collapse;font-size:.875rem}thead tr{background:#f8fafc;border-bottom:1px solid #e2e8f0}thead{position:sticky;top:0;z-index:2}th{padding:10px 14px;font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-right:1px solid #e2e8f0;text-align:center;background:#f8fafc}th:last-child{border-right:none}th.dt-th-sorted{background:#f1f5f9}th.dt-th-actions{width:48px}.dt-th-inner{display:flex;align-items:center;justify-content:center;gap:4px}.dt-sort-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;padding:0;text-transform:inherit;letter-spacing:inherit}.dt-sort-btn:hover{color:#1e293b}.dt-sort-btn:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:2px}@media(pointer:coarse){.dt-sort-btn{position:relative}.dt-sort-btn:after{content:\"\";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}}.dt-sort-icon{transition:transform .15s}.dt-sort-desc{transform:rotate(180deg)}.dt-sort-inactive{opacity:.4}tbody tr{border-bottom:1px solid #f1f5f9;background:#fff;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#f8fafc}.dt-row-clickable{cursor:pointer}.dt-row-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}td{padding:10px 14px;color:#334155;vertical-align:middle;white-space:nowrap;border-right:1px solid #f1f5f9}td:last-child{border-right:none}.dt-td-actions{text-align:center;padding:6px 8px}.dt-td-width{overflow:hidden;text-overflow:ellipsis}.dt-img{display:inline-block;vertical-align:middle;object-fit:cover;border:1px solid #e2e8f0;background:#f1f5f9;flex-shrink:0}.dt-img-ph{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;color:#94a3b8;background:#f1f5f9;border:1px solid #e2e8f0;flex-shrink:0}.dt-img-ph svg{width:55%;height:55%}.dt-img-circle-md{width:40px;height:40px;border-radius:50%}.dt-img-circle-sm{width:28px;height:28px;border-radius:50%}.dt-img-rounded-md{width:48px;height:32px;border-radius:6px}.dt-img-rounded-sm{width:36px;height:24px;border-radius:5px}.dt-avatar-name{display:flex;align-items:center;gap:8px}.dt-name-text{color:#1e293b}.dt-overdue{color:#dc2626;font-weight:500}.dt-none{color:#94a3b8}.dt-link{position:relative;display:inline-block;max-width:100%;padding:1px 2px;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2563eb;text-decoration:none;border-radius:3px;cursor:pointer}.dt-link:hover{text-decoration:underline;color:#1d4ed8}.dt-link:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px;text-decoration:underline}.dt-card-detail-value .dt-link,.dt-card-name .dt-link{white-space:normal;overflow-wrap:anywhere}.dt-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dt-tags{display:flex;align-items:center;gap:4px}.dt-tags-more{font-size:.75rem;font-weight:600;color:#475569;background:#f1f5f9;border-radius:999px;padding:2px 7px;cursor:default;-webkit-user-select:none;user-select:none;border:1px solid #e2e8f0}.dt-tags-more:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:999px}.dt-tag-tooltip{position:fixed;z-index:9999;pointer-events:none;background:#1e293b;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:5px;box-shadow:0 4px 6px #0000000f,0 10px 24px #00000024;transform:translate(-50%) translateY(-100%);animation:dt-tip-in .12s ease;max-width:220px}@keyframes dt-tip-in{0%{opacity:0;transform:translate(-50%) translateY(calc(-100% + 4px))}to{opacity:1;transform:translate(-50%) translateY(-100%)}}.dt-cell-star{margin-right:6px}.dt-actions-cell{display:flex;align-items:center;justify-content:center}.dt-bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;align-self:flex-start;padding:10px 14px;margin-bottom:8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px}.dt-bulk-count{font-size:.875rem;font-weight:600;color:#1e40af;white-space:nowrap;flex-shrink:0}.dt-bulk-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:0}.dt-bulk-actions ui-select{max-width:180px;min-width:120px}.dt-bulk-hint{font-size:.8125rem;line-height:1.35;color:#475569}.dt-card-cb{display:flex;align-items:center;padding:0 0 6px}.dt-card-selected{background:#eff6ff!important;border-color:#bfdbfe!important}.dt-th-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-th-grip{width:36px;padding:0!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-grip{width:36px;padding:0!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-grip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;color:#64748b;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.dt-grip:hover{background:#f1f5f9;color:#334155}.dt-grip:active{cursor:grabbing}.dt-grip:focus-visible{outline:2px solid #3b82f6;outline-offset:1px}.dt-grip-off{color:#cbd5e1;cursor:not-allowed}.dt-grip-off:hover{background:none;color:#cbd5e1}.dt-row-move{display:none}@media(pointer:coarse){.dt-grip{display:none}.dt-row-move{display:inline-flex;flex-direction:column;align-items:center}.dt-th-grip,.dt-td-grip{width:56px}}.dt-row-dragging{opacity:.45}.dt-row-over-before>td{box-shadow:inset 0 2px #3b82f6}.dt-row-over-after>td{box-shadow:inset 0 -2px #3b82f6}.dt-card-move{display:inline-flex;align-items:center;gap:2px;flex-shrink:0}@media(forced-colors:active){.dt-row-over-before>td{box-shadow:inset 0 2px 0 Highlight}.dt-row-over-after>td{box-shadow:inset 0 -2px 0 Highlight}.dt-grip:focus-visible{outline-color:Highlight}}.dt-row-selected{background:#eff6ff!important}.dt-row-selected:hover{background:#dbeafe!important}.dt-state-cell{padding:0!important;border:none!important;background:#fff!important}@media(max-width:1024px){th{padding:10px 12px}td{padding:11px 12px}.dt-sort-btn{padding:4px 0}.dt-td-actions{padding:6px}.dt-bulk-bar{align-self:stretch}}@media(max-width:820px){.dt-header-left{flex-basis:100%}.dt-header-right{flex-basis:100%;justify-content:flex-start}}@media(max-width:768px){th{padding:9px 10px;font-size:.8125rem}td{padding:10px;font-size:.8125rem}.dt-sk-search{width:100%}}@media(max-width:640px){.dt-header{flex-direction:column;align-items:stretch}.dt-header-left,.dt-header-right{width:100%}.dt-table-wrap{display:none}.dt-sk-search{width:100%}.dt-sk-toolbar{flex-direction:column;align-items:stretch;gap:8px}.dt-sk-toolbar-right{align-self:flex-end}.dt-bulk-bar{align-self:stretch;padding:10px 12px;row-gap:8px}.dt-bulk-count{flex:1}.dt-bulk-actions{width:100%}.dt-bulk-hint{flex-basis:100%}.dt-bulk-actions ui-select{max-width:100%;flex:1}}.dt-confirm-msg{margin:0;font-size:.9375rem;color:#334155;line-height:1.5;overflow-wrap:anywhere;word-break:break-word;white-space:pre-line}.dt-confirm-details{margin:10px 0 0;padding-left:20px;font-size:.875rem;color:#64748b;line-height:1.5;overflow-wrap:anywhere;word-break:break-word}.dt-confirm-details li+li{margin-top:4px}ui-pagination{flex-shrink:0}.dt-phone-controls{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;flex-shrink:0}.dt-phone-sort{display:flex;align-items:center;gap:8px}.dt-phone-sort-label{font-size:.8125rem;font-weight:600;color:#64748b;flex-shrink:0}.dt-phone-sort-select{flex:1;min-width:0;min-height:44px;box-sizing:border-box;padding:0 12px;font-family:inherit;font-size:1rem;color:#1e293b;background:#fff;border:1px solid #e2e8f0;border-radius:8px}.dt-phone-filters{display:flex;flex-wrap:wrap;gap:8px}.dt-card-list{display:none;flex-direction:column;gap:8px;flex:1;min-height:0;overflow-y:auto}@media(max-width:640px){.dt-card-list{display:flex;padding-bottom:8px}}.dt-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;contain:layout style;padding:14px 16px;display:flex;flex-direction:column;gap:10px;transition:background .1s}.dt-card:has(.mm-dropdown){position:relative;z-index:1}.dt-card-clickable{cursor:pointer}.dt-card-clickable:active{background:#f8fafc}.dt-card-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.dt-card-header{display:flex;align-items:center;gap:10px}.dt-card-title{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.dt-card-name{min-width:0;font-weight:600;color:#1e293b;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-card-name-plain{flex:1}.dt-card-actions{margin-left:auto;flex-shrink:0}.dt-card-badges{display:flex;flex-wrap:wrap;gap:6px}.dt-card-tags{display:flex;flex-wrap:wrap;gap:4px}.dt-card-details{display:flex;flex-direction:column;gap:5px}.dt-card-detail-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.8125rem}.dt-card-detail-label{color:#64748b;flex-shrink:0}.dt-card-detail-value{color:#334155;font-weight:500;text-align:right;min-width:0;overflow-wrap:anywhere;word-break:break-word}.dt-card-sk{gap:12px}.dt-card-sk-header{display:flex;align-items:center;gap:10px}.dt-card-sk-badges{display:flex;gap:6px}.dt-card-sk-rows{display:flex;flex-direction:column;gap:8px}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -11780,7 +11844,8 @@ var DataTableComponent = class DataTableComponent {
 						"page",
 						"pageSize",
 						"totalItems",
-						"detached"
+						"detached",
+						"embedded"
 					],
 					outputs: ["pageChange"]
 				},
@@ -12128,6 +12193,9 @@ i0.ɵɵngDeclareClassMetadata({
         @if (_showHeader()) {
         <div class="dt-sk-toolbar">
           <div class="dt-sk-toolbar-left">
+            @if (tableTitle()) {
+              <h3 class="dt-title">{{ tableTitle() }}</h3>
+            }
             @if (showSearch()) {
             <div class="dt-sk-search">
               <div class="dt-sk-shimmer dt-sk-search-icon"></div>
@@ -12153,6 +12221,9 @@ i0.ɵɵngDeclareClassMetadata({
       } @else if (_showHeader()) {
         <div class="dt-header alive-header">
           <div class="dt-header-left">
+            @if (tableTitle()) {
+              <h3 class="dt-title">{{ tableTitle() }}</h3>
+            }
             @if (showSearch() && !_emptyUnfiltered()) {
             <ui-search-input
               [value]="_search()"
@@ -12795,7 +12866,7 @@ i0.ɵɵngDeclareClassMetadata({
       }
     </div>
   `,
-			styles: [":host{display:flex;flex-direction:column;flex:1;min-height:0}.dt-host{display:flex;flex-direction:column;height:100%;min-height:0}.dt-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;justify-content:space-between;position:relative;z-index:10}.dt-header-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;min-width:0}.dt-header-right{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.dt-sk-shimmer{position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-shimmer:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}@keyframes dt-shimmer{to{transform:translate(200%)}}.dt-sk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dt-sk-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dt-sk-toolbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.dt-sk-search{display:flex;align-items:center;gap:10px;width:380px;height:36px;padding:0 12px;border:1px solid #e2e8f0;border-radius:6px;background:#f8fafc;box-sizing:border-box}.dt-sk-search-icon{width:16px;height:16px;border-radius:50%;flex-shrink:0}.dt-sk-search-text{flex:1;height:11px;border-radius:4px}.dt-sk-tab-strip{display:flex;gap:2px;padding:3px;background:#f1f5f9;border-radius:8px}.dt-sk-tab{height:28px;width:70px;border-radius:6px}.dt-sk-icon-btn{width:32px;height:32px;border-radius:6px}.dt-skeleton{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dt-sk-header{display:flex;gap:24px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.dt-sk-row{display:flex;gap:24px;padding:13px 16px;border-bottom:1px solid #f1f5f9}.dt-sk-row:last-child{border-bottom:none}.dt-sk-cell{flex:1;height:13px;border-radius:4px;position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-cell:first-child{max-width:100px}.dt-sk-cell:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}.dt-sk-head{height:10px}.dt-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #e2e8f0;border-radius:10px 10px 0 0}.dt-sk-reload-row td{padding:10px 14px;border-bottom:1px solid #f1f5f9}table{width:100%;border-collapse:collapse;font-size:.875rem}thead tr{background:#f8fafc;border-bottom:1px solid #e2e8f0}thead{position:sticky;top:0;z-index:2}th{padding:10px 14px;font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-right:1px solid #e2e8f0;text-align:center;background:#f8fafc}th:last-child{border-right:none}th.dt-th-sorted{background:#f1f5f9}th.dt-th-actions{width:48px}.dt-th-inner{display:flex;align-items:center;justify-content:center;gap:4px}.dt-sort-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;padding:0;text-transform:inherit;letter-spacing:inherit}.dt-sort-btn:hover{color:#1e293b}.dt-sort-btn:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:2px}@media(pointer:coarse){.dt-sort-btn{position:relative}.dt-sort-btn:after{content:\"\";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}}.dt-sort-icon{transition:transform .15s}.dt-sort-desc{transform:rotate(180deg)}.dt-sort-inactive{opacity:.4}tbody tr{border-bottom:1px solid #f1f5f9;background:#fff;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#f8fafc}.dt-row-clickable{cursor:pointer}.dt-row-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}td{padding:10px 14px;color:#334155;vertical-align:middle;white-space:nowrap;border-right:1px solid #f1f5f9}td:last-child{border-right:none}.dt-td-actions{text-align:center;padding:6px 8px}.dt-td-width{overflow:hidden;text-overflow:ellipsis}.dt-img{display:inline-block;vertical-align:middle;object-fit:cover;border:1px solid #e2e8f0;background:#f1f5f9;flex-shrink:0}.dt-img-ph{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;color:#94a3b8;background:#f1f5f9;border:1px solid #e2e8f0;flex-shrink:0}.dt-img-ph svg{width:55%;height:55%}.dt-img-circle-md{width:40px;height:40px;border-radius:50%}.dt-img-circle-sm{width:28px;height:28px;border-radius:50%}.dt-img-rounded-md{width:48px;height:32px;border-radius:6px}.dt-img-rounded-sm{width:36px;height:24px;border-radius:5px}.dt-avatar-name{display:flex;align-items:center;gap:8px}.dt-name-text{color:#1e293b}.dt-overdue{color:#dc2626;font-weight:500}.dt-none{color:#94a3b8}.dt-link{position:relative;display:inline-block;max-width:100%;padding:1px 2px;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2563eb;text-decoration:none;border-radius:3px;cursor:pointer}.dt-link:hover{text-decoration:underline;color:#1d4ed8}.dt-link:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px;text-decoration:underline}.dt-card-detail-value .dt-link,.dt-card-name .dt-link{white-space:normal;overflow-wrap:anywhere}.dt-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dt-tags{display:flex;align-items:center;gap:4px}.dt-tags-more{font-size:.75rem;font-weight:600;color:#475569;background:#f1f5f9;border-radius:999px;padding:2px 7px;cursor:default;-webkit-user-select:none;user-select:none;border:1px solid #e2e8f0}.dt-tags-more:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:999px}.dt-tag-tooltip{position:fixed;z-index:9999;pointer-events:none;background:#1e293b;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:5px;box-shadow:0 4px 6px #0000000f,0 10px 24px #00000024;transform:translate(-50%) translateY(-100%);animation:dt-tip-in .12s ease;max-width:220px}@keyframes dt-tip-in{0%{opacity:0;transform:translate(-50%) translateY(calc(-100% + 4px))}to{opacity:1;transform:translate(-50%) translateY(-100%)}}.dt-cell-star{margin-right:6px}.dt-actions-cell{display:flex;align-items:center;justify-content:center}.dt-bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;align-self:flex-start;padding:10px 14px;margin-bottom:8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px}.dt-bulk-count{font-size:.875rem;font-weight:600;color:#1e40af;white-space:nowrap;flex-shrink:0}.dt-bulk-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:0}.dt-bulk-actions ui-select{max-width:180px;min-width:120px}.dt-bulk-hint{font-size:.8125rem;line-height:1.35;color:#475569}.dt-card-cb{display:flex;align-items:center;padding:0 0 6px}.dt-card-selected{background:#eff6ff!important;border-color:#bfdbfe!important}.dt-th-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-th-grip{width:36px;padding:0!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-grip{width:36px;padding:0!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-grip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;color:#64748b;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.dt-grip:hover{background:#f1f5f9;color:#334155}.dt-grip:active{cursor:grabbing}.dt-grip:focus-visible{outline:2px solid #3b82f6;outline-offset:1px}.dt-grip-off{color:#cbd5e1;cursor:not-allowed}.dt-grip-off:hover{background:none;color:#cbd5e1}.dt-row-move{display:none}@media(pointer:coarse){.dt-grip{display:none}.dt-row-move{display:inline-flex;flex-direction:column;align-items:center}.dt-th-grip,.dt-td-grip{width:56px}}.dt-row-dragging{opacity:.45}.dt-row-over-before>td{box-shadow:inset 0 2px #3b82f6}.dt-row-over-after>td{box-shadow:inset 0 -2px #3b82f6}.dt-card-move{display:inline-flex;align-items:center;gap:2px;flex-shrink:0}@media(forced-colors:active){.dt-row-over-before>td{box-shadow:inset 0 2px 0 Highlight}.dt-row-over-after>td{box-shadow:inset 0 -2px 0 Highlight}.dt-grip:focus-visible{outline-color:Highlight}}.dt-row-selected{background:#eff6ff!important}.dt-row-selected:hover{background:#dbeafe!important}.dt-state-cell{padding:0!important;border:none!important;background:#fff!important}@media(max-width:1024px){th{padding:10px 12px}td{padding:11px 12px}.dt-sort-btn{padding:4px 0}.dt-td-actions{padding:6px}.dt-bulk-bar{align-self:stretch}}@media(max-width:820px){.dt-header-left{flex-basis:100%}.dt-header-right{flex-basis:100%;justify-content:flex-start}}@media(max-width:768px){th{padding:9px 10px;font-size:.8125rem}td{padding:10px;font-size:.8125rem}.dt-sk-search{width:100%}}@media(max-width:640px){.dt-header{flex-direction:column;align-items:stretch}.dt-header-left,.dt-header-right{width:100%}.dt-table-wrap{display:none}.dt-sk-search{width:100%}.dt-sk-toolbar{flex-direction:column;align-items:stretch;gap:8px}.dt-sk-toolbar-right{align-self:flex-end}.dt-bulk-bar{align-self:stretch;padding:10px 12px;row-gap:8px}.dt-bulk-count{flex:1}.dt-bulk-actions{width:100%}.dt-bulk-hint{flex-basis:100%}.dt-bulk-actions ui-select{max-width:100%;flex:1}}.dt-confirm-msg{margin:0;font-size:.9375rem;color:#334155;line-height:1.5;overflow-wrap:anywhere;word-break:break-word;white-space:pre-line}.dt-confirm-details{margin:10px 0 0;padding-left:20px;font-size:.875rem;color:#64748b;line-height:1.5;overflow-wrap:anywhere;word-break:break-word}.dt-confirm-details li+li{margin-top:4px}ui-pagination{flex-shrink:0}.dt-phone-controls{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;flex-shrink:0}.dt-phone-sort{display:flex;align-items:center;gap:8px}.dt-phone-sort-label{font-size:.8125rem;font-weight:600;color:#64748b;flex-shrink:0}.dt-phone-sort-select{flex:1;min-width:0;min-height:44px;box-sizing:border-box;padding:0 12px;font-family:inherit;font-size:1rem;color:#1e293b;background:#fff;border:1px solid #e2e8f0;border-radius:8px}.dt-phone-filters{display:flex;flex-wrap:wrap;gap:8px}.dt-card-list{display:none;flex-direction:column;gap:8px;flex:1;min-height:0;overflow-y:auto}@media(max-width:640px){.dt-card-list{display:flex;padding-bottom:8px}}.dt-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;contain:layout style;padding:14px 16px;display:flex;flex-direction:column;gap:10px;transition:background .1s}.dt-card:has(.mm-dropdown){position:relative;z-index:1}.dt-card-clickable{cursor:pointer}.dt-card-clickable:active{background:#f8fafc}.dt-card-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.dt-card-header{display:flex;align-items:center;gap:10px}.dt-card-title{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.dt-card-name{min-width:0;font-weight:600;color:#1e293b;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-card-name-plain{flex:1}.dt-card-actions{margin-left:auto;flex-shrink:0}.dt-card-badges{display:flex;flex-wrap:wrap;gap:6px}.dt-card-tags{display:flex;flex-wrap:wrap;gap:4px}.dt-card-details{display:flex;flex-direction:column;gap:5px}.dt-card-detail-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.8125rem}.dt-card-detail-label{color:#64748b;flex-shrink:0}.dt-card-detail-value{color:#334155;font-weight:500;text-align:right;min-width:0;overflow-wrap:anywhere;word-break:break-word}.dt-card-sk{gap:12px}.dt-card-sk-header{display:flex;align-items:center;gap:10px}.dt-card-sk-badges{display:flex;gap:6px}.dt-card-sk-rows{display:flex;flex-direction:column;gap:8px}\n"]
+			styles: [":host{display:flex;flex-direction:column;flex:1;min-height:0}.dt-host{display:flex;flex-direction:column;height:100%;min-height:0}.dt-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;justify-content:space-between;position:relative;z-index:10}.dt-header-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;min-width:0}.dt-header-right{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.dt-title{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b;overflow-wrap:anywhere}.dt-sk-shimmer{position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-shimmer:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}@keyframes dt-shimmer{to{transform:translate(200%)}}.dt-sk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dt-sk-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.dt-sk-toolbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.dt-sk-search{display:flex;align-items:center;gap:10px;width:380px;height:36px;padding:0 12px;border:1px solid #e2e8f0;border-radius:6px;background:#f8fafc;box-sizing:border-box}.dt-sk-search-icon{width:16px;height:16px;border-radius:50%;flex-shrink:0}.dt-sk-search-text{flex:1;height:11px;border-radius:4px}.dt-sk-tab-strip{display:flex;gap:2px;padding:3px;background:#f1f5f9;border-radius:8px}.dt-sk-tab{height:28px;width:70px;border-radius:6px}.dt-sk-icon-btn{width:32px;height:32px;border-radius:6px}.dt-skeleton{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dt-sk-header{display:flex;gap:24px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.dt-sk-row{display:flex;gap:24px;padding:13px 16px;border-bottom:1px solid #f1f5f9}.dt-sk-row:last-child{border-bottom:none}.dt-sk-cell{flex:1;height:13px;border-radius:4px;position:relative;overflow:hidden;background:#f1f5f9}.dt-sk-cell:first-child{max-width:100px}.dt-sk-cell:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translate(-100%);animation:dt-shimmer 1.4s ease-in-out infinite}.dt-sk-head{height:10px}.dt-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #e2e8f0;border-radius:10px 10px 0 0}.dt-sk-reload-row td{padding:10px 14px;border-bottom:1px solid #f1f5f9}table{width:100%;border-collapse:collapse;font-size:.875rem}thead tr{background:#f8fafc;border-bottom:1px solid #e2e8f0}thead{position:sticky;top:0;z-index:2}th{padding:10px 14px;font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-right:1px solid #e2e8f0;text-align:center;background:#f8fafc}th:last-child{border-right:none}th.dt-th-sorted{background:#f1f5f9}th.dt-th-actions{width:48px}.dt-th-inner{display:flex;align-items:center;justify-content:center;gap:4px}.dt-sort-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;padding:0;text-transform:inherit;letter-spacing:inherit}.dt-sort-btn:hover{color:#1e293b}.dt-sort-btn:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:2px}@media(pointer:coarse){.dt-sort-btn{position:relative}.dt-sort-btn:after{content:\"\";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}}.dt-sort-icon{transition:transform .15s}.dt-sort-desc{transform:rotate(180deg)}.dt-sort-inactive{opacity:.4}tbody tr{border-bottom:1px solid #f1f5f9;background:#fff;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#f8fafc}.dt-row-clickable{cursor:pointer}.dt-row-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}td{padding:10px 14px;color:#334155;vertical-align:middle;white-space:nowrap;border-right:1px solid #f1f5f9}td:last-child{border-right:none}.dt-td-actions{text-align:center;padding:6px 8px}.dt-td-width{overflow:hidden;text-overflow:ellipsis}.dt-img{display:inline-block;vertical-align:middle;object-fit:cover;border:1px solid #e2e8f0;background:#f1f5f9;flex-shrink:0}.dt-img-ph{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;color:#94a3b8;background:#f1f5f9;border:1px solid #e2e8f0;flex-shrink:0}.dt-img-ph svg{width:55%;height:55%}.dt-img-circle-md{width:40px;height:40px;border-radius:50%}.dt-img-circle-sm{width:28px;height:28px;border-radius:50%}.dt-img-rounded-md{width:48px;height:32px;border-radius:6px}.dt-img-rounded-sm{width:36px;height:24px;border-radius:5px}.dt-avatar-name{display:flex;align-items:center;gap:8px}.dt-name-text{color:#1e293b}.dt-overdue{color:#dc2626;font-weight:500}.dt-none{color:#94a3b8}.dt-link{position:relative;display:inline-block;max-width:100%;padding:1px 2px;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#2563eb;text-decoration:none;border-radius:3px;cursor:pointer}.dt-link:hover{text-decoration:underline;color:#1d4ed8}.dt-link:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px;text-decoration:underline}.dt-card-detail-value .dt-link,.dt-card-name .dt-link{white-space:normal;overflow-wrap:anywhere}.dt-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dt-tags{display:flex;align-items:center;gap:4px}.dt-tags-more{font-size:.75rem;font-weight:600;color:#475569;background:#f1f5f9;border-radius:999px;padding:2px 7px;cursor:default;-webkit-user-select:none;user-select:none;border:1px solid #e2e8f0}.dt-tags-more:focus-visible{outline:2px solid #60a5fa;outline-offset:2px;border-radius:999px}.dt-tag-tooltip{position:fixed;z-index:9999;pointer-events:none;background:#1e293b;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:5px;box-shadow:0 4px 6px #0000000f,0 10px 24px #00000024;transform:translate(-50%) translateY(-100%);animation:dt-tip-in .12s ease;max-width:220px}@keyframes dt-tip-in{0%{opacity:0;transform:translate(-50%) translateY(calc(-100% + 4px))}to{opacity:1;transform:translate(-50%) translateY(-100%)}}.dt-cell-star{margin-right:6px}.dt-actions-cell{display:flex;align-items:center;justify-content:center}.dt-bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;align-self:flex-start;padding:10px 14px;margin-bottom:8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px}.dt-bulk-count{font-size:.875rem;font-weight:600;color:#1e40af;white-space:nowrap;flex-shrink:0}.dt-bulk-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:0}.dt-bulk-actions ui-select{max-width:180px;min-width:120px}.dt-bulk-hint{font-size:.8125rem;line-height:1.35;color:#475569}.dt-card-cb{display:flex;align-items:center;padding:0 0 6px}.dt-card-selected{background:#eff6ff!important;border-color:#bfdbfe!important}.dt-th-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-cb{width:44px;padding:0 10px!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-th-grip{width:36px;padding:0!important;border-right:1px solid #e2e8f0;background:#f8fafc}.dt-td-grip{width:36px;padding:0!important;text-align:center!important;border-right:1px solid #f1f5f9}.dt-grip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;color:#64748b;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.dt-grip:hover{background:#f1f5f9;color:#334155}.dt-grip:active{cursor:grabbing}.dt-grip:focus-visible{outline:2px solid #3b82f6;outline-offset:1px}.dt-grip-off{color:#cbd5e1;cursor:not-allowed}.dt-grip-off:hover{background:none;color:#cbd5e1}.dt-row-move{display:none}@media(pointer:coarse){.dt-grip{display:none}.dt-row-move{display:inline-flex;flex-direction:column;align-items:center}.dt-th-grip,.dt-td-grip{width:56px}}.dt-row-dragging{opacity:.45}.dt-row-over-before>td{box-shadow:inset 0 2px #3b82f6}.dt-row-over-after>td{box-shadow:inset 0 -2px #3b82f6}.dt-card-move{display:inline-flex;align-items:center;gap:2px;flex-shrink:0}@media(forced-colors:active){.dt-row-over-before>td{box-shadow:inset 0 2px 0 Highlight}.dt-row-over-after>td{box-shadow:inset 0 -2px 0 Highlight}.dt-grip:focus-visible{outline-color:Highlight}}.dt-row-selected{background:#eff6ff!important}.dt-row-selected:hover{background:#dbeafe!important}.dt-state-cell{padding:0!important;border:none!important;background:#fff!important}@media(max-width:1024px){th{padding:10px 12px}td{padding:11px 12px}.dt-sort-btn{padding:4px 0}.dt-td-actions{padding:6px}.dt-bulk-bar{align-self:stretch}}@media(max-width:820px){.dt-header-left{flex-basis:100%}.dt-header-right{flex-basis:100%;justify-content:flex-start}}@media(max-width:768px){th{padding:9px 10px;font-size:.8125rem}td{padding:10px;font-size:.8125rem}.dt-sk-search{width:100%}}@media(max-width:640px){.dt-header{flex-direction:column;align-items:stretch}.dt-header-left,.dt-header-right{width:100%}.dt-table-wrap{display:none}.dt-sk-search{width:100%}.dt-sk-toolbar{flex-direction:column;align-items:stretch;gap:8px}.dt-sk-toolbar-right{align-self:flex-end}.dt-bulk-bar{align-self:stretch;padding:10px 12px;row-gap:8px}.dt-bulk-count{flex:1}.dt-bulk-actions{width:100%}.dt-bulk-hint{flex-basis:100%}.dt-bulk-actions ui-select{max-width:100%;flex:1}}.dt-confirm-msg{margin:0;font-size:.9375rem;color:#334155;line-height:1.5;overflow-wrap:anywhere;word-break:break-word;white-space:pre-line}.dt-confirm-details{margin:10px 0 0;padding-left:20px;font-size:.875rem;color:#64748b;line-height:1.5;overflow-wrap:anywhere;word-break:break-word}.dt-confirm-details li+li{margin-top:4px}ui-pagination{flex-shrink:0}.dt-phone-controls{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;flex-shrink:0}.dt-phone-sort{display:flex;align-items:center;gap:8px}.dt-phone-sort-label{font-size:.8125rem;font-weight:600;color:#64748b;flex-shrink:0}.dt-phone-sort-select{flex:1;min-width:0;min-height:44px;box-sizing:border-box;padding:0 12px;font-family:inherit;font-size:1rem;color:#1e293b;background:#fff;border:1px solid #e2e8f0;border-radius:8px}.dt-phone-filters{display:flex;flex-wrap:wrap;gap:8px}.dt-card-list{display:none;flex-direction:column;gap:8px;flex:1;min-height:0;overflow-y:auto}@media(max-width:640px){.dt-card-list{display:flex;padding-bottom:8px}}.dt-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;contain:layout style;padding:14px 16px;display:flex;flex-direction:column;gap:10px;transition:background .1s}.dt-card:has(.mm-dropdown){position:relative;z-index:1}.dt-card-clickable{cursor:pointer}.dt-card-clickable:active{background:#f8fafc}.dt-card-clickable:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.dt-card-header{display:flex;align-items:center;gap:10px}.dt-card-title{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.dt-card-name{min-width:0;font-weight:600;color:#1e293b;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-card-name-plain{flex:1}.dt-card-actions{margin-left:auto;flex-shrink:0}.dt-card-badges{display:flex;flex-wrap:wrap;gap:6px}.dt-card-tags{display:flex;flex-wrap:wrap;gap:4px}.dt-card-details{display:flex;flex-direction:column;gap:5px}.dt-card-detail-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.8125rem}.dt-card-detail-label{color:#64748b;flex-shrink:0}.dt-card-detail-value{color:#334155;font-weight:500;text-align:right;min-width:0;overflow-wrap:anywhere;word-break:break-word}.dt-card-sk{gap:12px}.dt-card-sk-header{display:flex;align-items:center;gap:10px}.dt-card-sk-badges{display:flex;gap:6px}.dt-card-sk-rows{display:flex;flex-direction:column;gap:8px}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -12912,6 +12983,14 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		tableTitle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tableTitle",
+				required: false
+			}]
+		}],
 		countsEndpoint: [{
 			type: i0.Input,
 			args: [{
@@ -17205,6 +17284,7 @@ var PhoneNumberPickerComponent = class PhoneNumberPickerComponent {
 					inputs: [
 						"label",
 						"ariaLabel",
+						"inputTestId",
 						"placeholder",
 						"prefix",
 						"revealable",
@@ -19349,6 +19429,7 @@ var BulkMessagePanelComponent = class BulkMessagePanelComponent {
 					inputs: [
 						"label",
 						"ariaLabel",
+						"inputTestId",
 						"placeholder",
 						"prefix",
 						"revealable",
@@ -24562,7 +24643,7 @@ var ListItemComponent = class ListItemComponent {
     </div>
   `,
 			isInline: true,
-			styles: ["ui-list-item{display:block}ui-list-item(.li-bordered){border:1px solid var(--border, #e2e8f0);border-radius:12px;overflow:hidden;background:var(--surface, #fff);margin-bottom:8px;&:last-child{margin-bottom:0}}.li-row{display:flex;align-items:flex-start;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border, #e2e8f0);transition:background .12s;ui-list-item(.li-bordered) &{border-bottom:none}}.li-row:last-child{border-bottom:none}.li-row:hover{background:var(--surface-hover, #f8fafc)}.li-row.li-row--highlighted{background:#f0fdf4}.li-row.li-row--highlighted:hover{background:#dcfce7}.li-row.li-row--static:hover{background:transparent}.li-row.li-row--static.li-row--highlighted,.li-row.li-row--static.li-row--highlighted:hover{background:#f0fdf4}.li-body.li-body--static{cursor:default}.li-row [list-item-action],.li-row [li-action]{flex-shrink:0;align-self:center}.li-input{margin-top:3px;flex-shrink:0;accent-color:#16a34a;width:1rem;height:1rem;cursor:pointer}.li-icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px}.li-icon--slate{background:#f1f5f9;color:#475569}.li-icon--amber{background:#fef3c7;color:#b45309}.li-icon--orange{background:#ffedd5;color:#c2410c}.li-icon--red{background:#fee2e2;color:#b91c1c}.li-icon--blue{background:#dbeafe;color:#1d4ed8}.li-icon--green{background:#dcfce7;color:#15803d}.li-icon--purple{background:#f3e8ff;color:#7e22ce}.li-icon--teal{background:#ccfbf1;color:#0f766e}.li-body{flex:1;min-width:0;cursor:pointer;display:flex;flex-direction:column;gap:4px}.li-title-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.li-title{font-size:.9375rem;font-weight:600;line-height:1.35;color:var(--text-primary, #0f172a)}.li-row--wrap .li-title{min-width:0;word-break:break-word;overflow-wrap:anywhere}.li-details{display:flex;flex-direction:column;gap:2px;font-size:.8125rem;line-height:1.4;color:var(--text-secondary, #64748b)}.li-detail{display:flex;align-items:center;gap:6px;min-width:0}.li-detail-icon{flex:0 0 auto;color:#94a3b8}.li-detail--warning,.li-detail--warning .li-detail-icon{color:#b45309}.li-detail--danger,.li-detail--danger .li-detail-icon{color:#b91c1c}.li-row--wrap .li-detail-text{min-width:0;word-break:break-word;overflow-wrap:anywhere}\n"],
+			styles: ["ui-list-item{display:block}ui-list-item.li-bordered{border:1px solid var(--border, #e2e8f0);border-radius:12px;overflow:hidden;background:var(--surface, #fff);box-shadow:0 1px 2px #0f172a0a;margin-bottom:8px;transition:border-color .15s ease,box-shadow .15s ease}ui-list-item.li-bordered:last-child{margin-bottom:0}ui-list-item.li-bordered:hover{border-color:#cbd5e1;box-shadow:0 2px 6px #0f172a12}@media(prefers-reduced-motion:reduce){ui-list-item.li-bordered{transition:none}}.li-row{display:flex;align-items:flex-start;gap:14px;padding:12px 16px;border-bottom:1px solid var(--border, #e2e8f0);transition:background .12s}.li-row:last-child{border-bottom:none}.li-row:hover{background:var(--surface-hover, #f8fafc)}ui-list-item.li-bordered .li-row{border-bottom:none;padding:14px 16px}.li-row.li-row--highlighted{background:#f0fdf4}.li-row.li-row--highlighted:hover{background:#dcfce7}.li-row.li-row--static:hover{background:transparent}.li-row.li-row--static.li-row--highlighted,.li-row.li-row--static.li-row--highlighted:hover{background:#f0fdf4}.li-body.li-body--static{cursor:default}.li-row [list-item-action],.li-row [li-action]{flex-shrink:0;align-self:center}.li-input{margin-top:3px;flex-shrink:0;accent-color:#16a34a;width:1rem;height:1rem;cursor:pointer}.li-icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px}.li-icon--slate{background:#f1f5f9;color:#475569}.li-icon--amber{background:#fef3c7;color:#b45309}.li-icon--orange{background:#ffedd5;color:#c2410c}.li-icon--red{background:#fee2e2;color:#b91c1c}.li-icon--blue{background:#dbeafe;color:#1d4ed8}.li-icon--green{background:#dcfce7;color:#15803d}.li-icon--purple{background:#f3e8ff;color:#7e22ce}.li-icon--teal{background:#ccfbf1;color:#0f766e}.li-body{flex:1;min-width:0;cursor:pointer;display:flex;flex-direction:column;gap:6px}.li-title-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.li-title{font-size:.9375rem;font-weight:600;line-height:1.4;letter-spacing:-.005em;color:var(--text-primary, #0f172a)}.li-row--wrap .li-title{min-width:0;word-break:break-word;overflow-wrap:anywhere}.li-details{display:flex;flex-direction:column;gap:3px;font-size:.8125rem;line-height:1.4;color:var(--text-secondary, #64748b)}.li-detail{display:flex;align-items:center;gap:6px;min-width:0}.li-detail-icon{flex:0 0 auto;color:#94a3b8}.li-detail--warning,.li-detail--warning .li-detail-icon{color:#b45309}.li-detail--danger,.li-detail--danger .li-detail-icon{color:#b91c1c}.li-row--wrap .li-detail-text{min-width:0;word-break:break-word;overflow-wrap:anywhere}\n"],
 			dependencies: [{
 				kind: "component",
 				type: BadgeComponent,
@@ -24662,7 +24743,7 @@ i0.ɵɵngDeclareClassMetadata({
 
     </div>
   `,
-			styles: ["ui-list-item{display:block}ui-list-item(.li-bordered){border:1px solid var(--border, #e2e8f0);border-radius:12px;overflow:hidden;background:var(--surface, #fff);margin-bottom:8px;&:last-child{margin-bottom:0}}.li-row{display:flex;align-items:flex-start;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border, #e2e8f0);transition:background .12s;ui-list-item(.li-bordered) &{border-bottom:none}}.li-row:last-child{border-bottom:none}.li-row:hover{background:var(--surface-hover, #f8fafc)}.li-row.li-row--highlighted{background:#f0fdf4}.li-row.li-row--highlighted:hover{background:#dcfce7}.li-row.li-row--static:hover{background:transparent}.li-row.li-row--static.li-row--highlighted,.li-row.li-row--static.li-row--highlighted:hover{background:#f0fdf4}.li-body.li-body--static{cursor:default}.li-row [list-item-action],.li-row [li-action]{flex-shrink:0;align-self:center}.li-input{margin-top:3px;flex-shrink:0;accent-color:#16a34a;width:1rem;height:1rem;cursor:pointer}.li-icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px}.li-icon--slate{background:#f1f5f9;color:#475569}.li-icon--amber{background:#fef3c7;color:#b45309}.li-icon--orange{background:#ffedd5;color:#c2410c}.li-icon--red{background:#fee2e2;color:#b91c1c}.li-icon--blue{background:#dbeafe;color:#1d4ed8}.li-icon--green{background:#dcfce7;color:#15803d}.li-icon--purple{background:#f3e8ff;color:#7e22ce}.li-icon--teal{background:#ccfbf1;color:#0f766e}.li-body{flex:1;min-width:0;cursor:pointer;display:flex;flex-direction:column;gap:4px}.li-title-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.li-title{font-size:.9375rem;font-weight:600;line-height:1.35;color:var(--text-primary, #0f172a)}.li-row--wrap .li-title{min-width:0;word-break:break-word;overflow-wrap:anywhere}.li-details{display:flex;flex-direction:column;gap:2px;font-size:.8125rem;line-height:1.4;color:var(--text-secondary, #64748b)}.li-detail{display:flex;align-items:center;gap:6px;min-width:0}.li-detail-icon{flex:0 0 auto;color:#94a3b8}.li-detail--warning,.li-detail--warning .li-detail-icon{color:#b45309}.li-detail--danger,.li-detail--danger .li-detail-icon{color:#b91c1c}.li-row--wrap .li-detail-text{min-width:0;word-break:break-word;overflow-wrap:anywhere}\n"]
+			styles: ["ui-list-item{display:block}ui-list-item.li-bordered{border:1px solid var(--border, #e2e8f0);border-radius:12px;overflow:hidden;background:var(--surface, #fff);box-shadow:0 1px 2px #0f172a0a;margin-bottom:8px;transition:border-color .15s ease,box-shadow .15s ease}ui-list-item.li-bordered:last-child{margin-bottom:0}ui-list-item.li-bordered:hover{border-color:#cbd5e1;box-shadow:0 2px 6px #0f172a12}@media(prefers-reduced-motion:reduce){ui-list-item.li-bordered{transition:none}}.li-row{display:flex;align-items:flex-start;gap:14px;padding:12px 16px;border-bottom:1px solid var(--border, #e2e8f0);transition:background .12s}.li-row:last-child{border-bottom:none}.li-row:hover{background:var(--surface-hover, #f8fafc)}ui-list-item.li-bordered .li-row{border-bottom:none;padding:14px 16px}.li-row.li-row--highlighted{background:#f0fdf4}.li-row.li-row--highlighted:hover{background:#dcfce7}.li-row.li-row--static:hover{background:transparent}.li-row.li-row--static.li-row--highlighted,.li-row.li-row--static.li-row--highlighted:hover{background:#f0fdf4}.li-body.li-body--static{cursor:default}.li-row [list-item-action],.li-row [li-action]{flex-shrink:0;align-self:center}.li-input{margin-top:3px;flex-shrink:0;accent-color:#16a34a;width:1rem;height:1rem;cursor:pointer}.li-icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px}.li-icon--slate{background:#f1f5f9;color:#475569}.li-icon--amber{background:#fef3c7;color:#b45309}.li-icon--orange{background:#ffedd5;color:#c2410c}.li-icon--red{background:#fee2e2;color:#b91c1c}.li-icon--blue{background:#dbeafe;color:#1d4ed8}.li-icon--green{background:#dcfce7;color:#15803d}.li-icon--purple{background:#f3e8ff;color:#7e22ce}.li-icon--teal{background:#ccfbf1;color:#0f766e}.li-body{flex:1;min-width:0;cursor:pointer;display:flex;flex-direction:column;gap:6px}.li-title-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.li-title{font-size:.9375rem;font-weight:600;line-height:1.4;letter-spacing:-.005em;color:var(--text-primary, #0f172a)}.li-row--wrap .li-title{min-width:0;word-break:break-word;overflow-wrap:anywhere}.li-details{display:flex;flex-direction:column;gap:3px;font-size:.8125rem;line-height:1.4;color:var(--text-secondary, #64748b)}.li-detail{display:flex;align-items:center;gap:6px;min-width:0}.li-detail-icon{flex:0 0 auto;color:#94a3b8}.li-detail--warning,.li-detail--warning .li-detail-icon{color:#b45309}.li-detail--danger,.li-detail--danger .li-detail-icon{color:#b91c1c}.li-row--wrap .li-detail-text{min-width:0;word-break:break-word;overflow-wrap:anywhere}\n"]
 		}]
 	}],
 	propDecorators: {
@@ -24796,6 +24877,954 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
+const ICON_PATHS = {
+	call: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 12a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.6 1.27h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L7.91 8.91a16 16 0 0 0 6 6l1-1a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z",
+	email: "M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z M22 7l-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7",
+	sms: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z",
+	task: "M9 11l3 3L22 4 M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11",
+	doc: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z M14 2v6h6",
+	money: "M12 1v22 M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6",
+	deal: "M22 7l-8.5 8.5-5-5L2 17 M16 7h6v6",
+	survey: "M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2 M10 3h4a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z M9 12h6 M9 16h4",
+	property: "M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z M9 22V12h6v10",
+	search: "M11 3a8 8 0 1 0 0 16 8 8 0 0 0 0-16z M21 21l-4.35-4.35",
+	heart: "M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z",
+	calc: "M6 2h12a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2z M8 6h8 M8 10h2 M14 10h2 M8 14h2 M14 14h2 M8 18h2 M14 18h2",
+	repeat: "M17 1l4 4-4 4 M3 11V9a4 4 0 0 1 4-4h14 M7 23l-4-4 4-4 M21 13v2a4 4 0 0 1-4 4H3"
+};
+const CALENDAR_PATH = "M5 4h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z M16 2v4 M8 2v4 M3 10h18";
+const EDIT_PATH = "M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7 M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z";
+const INDICATOR_LABEL = {
+	high: "High priority",
+	medium: "Medium priority",
+	low: "Low priority"
+};
+var CardListItemComponent = class CardListItemComponent {
+	constructor() {
+		this.title = input("", ...ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []);
+		this.description = input(void 0, ...ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []);
+		this.date = input(void 0, ...ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []);
+		this.type = input(void 0, ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
+		this.typeVariant = input("gray", ...ngDevMode ? [{ debugName: "typeVariant" }] : /* istanbul ignore next */ []);
+		this.status = input(void 0, ...ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []);
+		this.statusVariant = input(void 0, ...ngDevMode ? [{ debugName: "statusVariant" }] : /* istanbul ignore next */ []);
+		this.indicator = input("none", ...ngDevMode ? [{ debugName: "indicator" }] : /* istanbul ignore next */ []);
+		this.icon = input(void 0, ...ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []);
+		this.editButton = input(false, ...ngDevMode ? [{ debugName: "editButton" }] : /* istanbul ignore next */ []);
+		this.viewButton = input(false, ...ngDevMode ? [{ debugName: "viewButton" }] : /* istanbul ignore next */ []);
+		this.editAriaLabel = input("", ...ngDevMode ? [{ debugName: "editAriaLabel" }] : /* istanbul ignore next */ []);
+		this.viewAriaLabel = input("", ...ngDevMode ? [{ debugName: "viewAriaLabel" }] : /* istanbul ignore next */ []);
+		this.editClick = output();
+		this.viewClick = output();
+		this.calendarPath = CALENDAR_PATH;
+		this.editPath = EDIT_PATH;
+		this.iconPath = computed(() => {
+			const i = this.icon();
+			return i ? ICON_PATHS[i] ?? null : null;
+		}, ...ngDevMode ? [{ debugName: "iconPath" }] : /* istanbul ignore next */ []);
+		this.indicatorLabel = computed(() => INDICATOR_LABEL[this.indicator()] ?? "", ...ngDevMode ? [{ debugName: "indicatorLabel" }] : /* istanbul ignore next */ []);
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: CardListItemComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.2",
+			type: CardListItemComponent,
+			isStandalone: true,
+			selector: "ui-card-list-item",
+			inputs: {
+				title: {
+					classPropertyName: "title",
+					publicName: "title",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				description: {
+					classPropertyName: "description",
+					publicName: "description",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				date: {
+					classPropertyName: "date",
+					publicName: "date",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				type: {
+					classPropertyName: "type",
+					publicName: "type",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				typeVariant: {
+					classPropertyName: "typeVariant",
+					publicName: "typeVariant",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				status: {
+					classPropertyName: "status",
+					publicName: "status",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				statusVariant: {
+					classPropertyName: "statusVariant",
+					publicName: "statusVariant",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				indicator: {
+					classPropertyName: "indicator",
+					publicName: "indicator",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				icon: {
+					classPropertyName: "icon",
+					publicName: "icon",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				editButton: {
+					classPropertyName: "editButton",
+					publicName: "editButton",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				viewButton: {
+					classPropertyName: "viewButton",
+					publicName: "viewButton",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				editAriaLabel: {
+					classPropertyName: "editAriaLabel",
+					publicName: "editAriaLabel",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				viewAriaLabel: {
+					classPropertyName: "viewAriaLabel",
+					publicName: "viewAriaLabel",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			outputs: {
+				editClick: "editClick",
+				viewClick: "viewClick"
+			},
+			ngImport: i0,
+			template: `
+    <div class="cli-row">
+      @if (iconPath(); as d) {
+        <div class="cli-icon-circle" [class]="'cli-icon-circle cli-icon-circle--' + icon()" aria-hidden="true">
+          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" focusable="false"><path [attr.d]="d" /></svg>
+        </div>
+      } @else if (indicator() !== 'none') {
+        @if (indicatorLabel(); as label) {
+          <div class="cli-dot" [class]="'cli-dot cli-dot--' + indicator()" [uiTooltip]="label" tabindex="0" role="img" [attr.aria-label]="label"></div>
+        } @else {
+          <div class="cli-dot" [class]="'cli-dot cli-dot--' + indicator()" aria-hidden="true"></div>
+        }
+      }
+
+      <div class="cli-body">
+        <div class="cli-title-row">
+          <span class="cli-title">{{ title() }}</span>
+          @if (type()) { <ui-badge [label]="type()!" [variant]="typeVariant()" /> }
+          @if (status() && statusVariant()) { <ui-badge [label]="status()!" [variant]="statusVariant()!" /> }
+        </div>
+        <div class="cli-desc-row">
+          @if (description()) { <span class="cli-description">{{ description() }}</span> }
+          <ng-content select="[card-list-inline]" />
+        </div>
+        @if (date()) {
+          <span class="cli-date">
+            <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path [attr.d]="calendarPath" /></svg>
+            {{ date() }}
+          </span>
+        }
+      </div>
+
+      @if (editButton()) {
+        <button class="cli-chip cli-chip--edit" type="button" [attr.aria-label]="editAriaLabel() || null" (click)="editClick.emit()">
+          <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path [attr.d]="editPath" /></svg>
+          Edit
+        </button>
+      }
+      @if (viewButton()) {
+        <button class="cli-chip cli-chip--view" type="button" [attr.aria-label]="viewAriaLabel() || null" (click)="viewClick.emit()">View</button>
+      }
+      <ng-content select="[card-list-action]" />
+      <ng-content />
+    </div>
+    <ng-content select="[card-stats]" />
+    <ng-content select="[card-detail]" />
+  `,
+			isInline: true,
+			styles: ["ui-card-list-item{display:block;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden;margin-bottom:8px}ui-card-list-item:last-child{margin-bottom:0}ui-card-list-item .cli-row{display:flex;align-items:flex-start;gap:12px;padding:13px 18px;transition:background .12s}ui-card-list-item .cli-row:hover{background:#f8fafc}@media(prefers-reduced-motion:reduce){ui-card-list-item .cli-row{transition:none}}ui-card-list-item .cli-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;margin-top:5px}ui-card-list-item .cli-dot:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}ui-card-list-item .cli-dot--high{background:#ef4444}ui-card-list-item .cli-dot--medium{background:#f59e0b}ui-card-list-item .cli-dot--low{background:#94a3b8}ui-card-list-item .cli-dot--blue{background:#3b82f6}ui-card-list-item .cli-dot--green{background:#22c55e}ui-card-list-item .cli-icon-circle{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}ui-card-list-item .cli-icon-circle--call{background:#dbeafe;color:#2563eb}ui-card-list-item .cli-icon-circle--email{background:#dcfce7;color:#16a34a}ui-card-list-item .cli-icon-circle--sms{background:#fef9c3;color:#ca8a04}ui-card-list-item .cli-icon-circle--task{background:#dbeafe;color:#2563eb}ui-card-list-item .cli-icon-circle--doc{background:#ffedd5;color:#ea580c}ui-card-list-item .cli-icon-circle--money{background:#d1fae5;color:#059669}ui-card-list-item .cli-icon-circle--deal{background:#e0f2fe;color:#0284c7}ui-card-list-item .cli-icon-circle--survey{background:#dbeafe;color:#2563eb}ui-card-list-item .cli-icon-circle--property{background:#fef3c7;color:#d97706}ui-card-list-item .cli-icon-circle--search{background:#e0f2fe;color:#0284c7}ui-card-list-item .cli-icon-circle--heart{background:#fce7f3;color:#db2777}ui-card-list-item .cli-icon-circle--calc{background:#d1fae5;color:#059669}ui-card-list-item .cli-icon-circle--repeat{background:#e0f2fe;color:#0284c7}ui-card-list-item .cli-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;overflow-wrap:anywhere;word-break:break-word}ui-card-list-item .cli-title-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}ui-card-list-item .cli-title{font-size:.875rem;font-weight:600;color:#1e293b}ui-card-list-item .cli-desc-row{display:flex;align-items:center;gap:8px}ui-card-list-item .cli-desc-row:empty{display:none}ui-card-list-item .cli-description{font-size:.8125rem;color:#64748b;min-width:0}ui-card-list-item .cli-date{display:flex;align-items:center;gap:4px;font-size:.75rem;color:#64748b}ui-card-list-item .cli-chip{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;align-self:center;box-sizing:border-box;font-family:inherit;font-size:.8rem;font-weight:500;line-height:1.4;background:none;cursor:pointer;padding:4px 10px;border-radius:6px;text-decoration:none;transition:background .15s,color .15s,border-color .15s}ui-card-list-item .cli-chip--edit{color:#64748b;border:1px solid #e2e8f0}ui-card-list-item .cli-chip--edit:hover{background:#f1f5f9;color:#1e293b}ui-card-list-item .cli-chip--view{color:#2563eb;border:1px solid #dbeafe}ui-card-list-item .cli-chip--view:hover{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}ui-card-list-item .cli-chip:focus-visible,ui-card-list-item .cli-inline-link:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}ui-card-list-item .cli-inline-link{flex-shrink:0;margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-size:.8rem;font-weight:500;color:#2563eb;text-decoration:none;transition:color .15s}ui-card-list-item .cli-inline-link:hover{color:#1d4ed8}@media(pointer:coarse),(max-width:480px){ui-card-list-item .cli-chip{min-height:44px;padding:4px 14px}}ui-card-list-item [card-stats]{display:flex;align-items:stretch;background:#f8fafc;border-top:1px solid #f1f5f9}ui-card-list-item [card-detail]{background:#f8fafc;border-top:1px solid #e2e8f0}ui-card-list-item .cli-stat{flex:1;display:flex;flex-direction:column;gap:2px;padding:10px 14px}ui-card-list-item .cli-stat-label{font-size:.6875rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#64748b}ui-card-list-item .cli-stat-value{font-size:.9375rem;font-weight:600;color:#0f172a}ui-card-list-item .cli-stat-divider{width:1px;background:#e2e8f0;margin:8px 0}\n"],
+			dependencies: [{
+				kind: "component",
+				type: BadgeComponent,
+				selector: "ui-badge",
+				inputs: ["label", "variant"]
+			}, {
+				kind: "directive",
+				type: TooltipDirective,
+				selector: "[uiTooltip]",
+				inputs: ["uiTooltip", "tooltipPosition"]
+			}],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush,
+			encapsulation: i0.ViewEncapsulation.None
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: CardListItemComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-card-list-item",
+			standalone: true,
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			imports: [BadgeComponent, TooltipDirective],
+			template: `
+    <div class="cli-row">
+      @if (iconPath(); as d) {
+        <div class="cli-icon-circle" [class]="'cli-icon-circle cli-icon-circle--' + icon()" aria-hidden="true">
+          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" focusable="false"><path [attr.d]="d" /></svg>
+        </div>
+      } @else if (indicator() !== 'none') {
+        @if (indicatorLabel(); as label) {
+          <div class="cli-dot" [class]="'cli-dot cli-dot--' + indicator()" [uiTooltip]="label" tabindex="0" role="img" [attr.aria-label]="label"></div>
+        } @else {
+          <div class="cli-dot" [class]="'cli-dot cli-dot--' + indicator()" aria-hidden="true"></div>
+        }
+      }
+
+      <div class="cli-body">
+        <div class="cli-title-row">
+          <span class="cli-title">{{ title() }}</span>
+          @if (type()) { <ui-badge [label]="type()!" [variant]="typeVariant()" /> }
+          @if (status() && statusVariant()) { <ui-badge [label]="status()!" [variant]="statusVariant()!" /> }
+        </div>
+        <div class="cli-desc-row">
+          @if (description()) { <span class="cli-description">{{ description() }}</span> }
+          <ng-content select="[card-list-inline]" />
+        </div>
+        @if (date()) {
+          <span class="cli-date">
+            <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path [attr.d]="calendarPath" /></svg>
+            {{ date() }}
+          </span>
+        }
+      </div>
+
+      @if (editButton()) {
+        <button class="cli-chip cli-chip--edit" type="button" [attr.aria-label]="editAriaLabel() || null" (click)="editClick.emit()">
+          <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path [attr.d]="editPath" /></svg>
+          Edit
+        </button>
+      }
+      @if (viewButton()) {
+        <button class="cli-chip cli-chip--view" type="button" [attr.aria-label]="viewAriaLabel() || null" (click)="viewClick.emit()">View</button>
+      }
+      <ng-content select="[card-list-action]" />
+      <ng-content />
+    </div>
+    <ng-content select="[card-stats]" />
+    <ng-content select="[card-detail]" />
+  `,
+			styles: ["ui-card-list-item{display:block;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden;margin-bottom:8px}ui-card-list-item:last-child{margin-bottom:0}ui-card-list-item .cli-row{display:flex;align-items:flex-start;gap:12px;padding:13px 18px;transition:background .12s}ui-card-list-item .cli-row:hover{background:#f8fafc}@media(prefers-reduced-motion:reduce){ui-card-list-item .cli-row{transition:none}}ui-card-list-item .cli-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;margin-top:5px}ui-card-list-item .cli-dot:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}ui-card-list-item .cli-dot--high{background:#ef4444}ui-card-list-item .cli-dot--medium{background:#f59e0b}ui-card-list-item .cli-dot--low{background:#94a3b8}ui-card-list-item .cli-dot--blue{background:#3b82f6}ui-card-list-item .cli-dot--green{background:#22c55e}ui-card-list-item .cli-icon-circle{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}ui-card-list-item .cli-icon-circle--call{background:#dbeafe;color:#2563eb}ui-card-list-item .cli-icon-circle--email{background:#dcfce7;color:#16a34a}ui-card-list-item .cli-icon-circle--sms{background:#fef9c3;color:#ca8a04}ui-card-list-item .cli-icon-circle--task{background:#dbeafe;color:#2563eb}ui-card-list-item .cli-icon-circle--doc{background:#ffedd5;color:#ea580c}ui-card-list-item .cli-icon-circle--money{background:#d1fae5;color:#059669}ui-card-list-item .cli-icon-circle--deal{background:#e0f2fe;color:#0284c7}ui-card-list-item .cli-icon-circle--survey{background:#dbeafe;color:#2563eb}ui-card-list-item .cli-icon-circle--property{background:#fef3c7;color:#d97706}ui-card-list-item .cli-icon-circle--search{background:#e0f2fe;color:#0284c7}ui-card-list-item .cli-icon-circle--heart{background:#fce7f3;color:#db2777}ui-card-list-item .cli-icon-circle--calc{background:#d1fae5;color:#059669}ui-card-list-item .cli-icon-circle--repeat{background:#e0f2fe;color:#0284c7}ui-card-list-item .cli-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;overflow-wrap:anywhere;word-break:break-word}ui-card-list-item .cli-title-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}ui-card-list-item .cli-title{font-size:.875rem;font-weight:600;color:#1e293b}ui-card-list-item .cli-desc-row{display:flex;align-items:center;gap:8px}ui-card-list-item .cli-desc-row:empty{display:none}ui-card-list-item .cli-description{font-size:.8125rem;color:#64748b;min-width:0}ui-card-list-item .cli-date{display:flex;align-items:center;gap:4px;font-size:.75rem;color:#64748b}ui-card-list-item .cli-chip{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;align-self:center;box-sizing:border-box;font-family:inherit;font-size:.8rem;font-weight:500;line-height:1.4;background:none;cursor:pointer;padding:4px 10px;border-radius:6px;text-decoration:none;transition:background .15s,color .15s,border-color .15s}ui-card-list-item .cli-chip--edit{color:#64748b;border:1px solid #e2e8f0}ui-card-list-item .cli-chip--edit:hover{background:#f1f5f9;color:#1e293b}ui-card-list-item .cli-chip--view{color:#2563eb;border:1px solid #dbeafe}ui-card-list-item .cli-chip--view:hover{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}ui-card-list-item .cli-chip:focus-visible,ui-card-list-item .cli-inline-link:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}ui-card-list-item .cli-inline-link{flex-shrink:0;margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-size:.8rem;font-weight:500;color:#2563eb;text-decoration:none;transition:color .15s}ui-card-list-item .cli-inline-link:hover{color:#1d4ed8}@media(pointer:coarse),(max-width:480px){ui-card-list-item .cli-chip{min-height:44px;padding:4px 14px}}ui-card-list-item [card-stats]{display:flex;align-items:stretch;background:#f8fafc;border-top:1px solid #f1f5f9}ui-card-list-item [card-detail]{background:#f8fafc;border-top:1px solid #e2e8f0}ui-card-list-item .cli-stat{flex:1;display:flex;flex-direction:column;gap:2px;padding:10px 14px}ui-card-list-item .cli-stat-label{font-size:.6875rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#64748b}ui-card-list-item .cli-stat-value{font-size:.9375rem;font-weight:600;color:#0f172a}ui-card-list-item .cli-stat-divider{width:1px;background:#e2e8f0;margin:8px 0}\n"]
+		}]
+	}],
+	propDecorators: {
+		title: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "title",
+				required: false
+			}]
+		}],
+		description: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "description",
+				required: false
+			}]
+		}],
+		date: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "date",
+				required: false
+			}]
+		}],
+		type: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "type",
+				required: false
+			}]
+		}],
+		typeVariant: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "typeVariant",
+				required: false
+			}]
+		}],
+		status: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "status",
+				required: false
+			}]
+		}],
+		statusVariant: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "statusVariant",
+				required: false
+			}]
+		}],
+		indicator: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "indicator",
+				required: false
+			}]
+		}],
+		icon: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "icon",
+				required: false
+			}]
+		}],
+		editButton: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "editButton",
+				required: false
+			}]
+		}],
+		viewButton: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "viewButton",
+				required: false
+			}]
+		}],
+		editAriaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "editAriaLabel",
+				required: false
+			}]
+		}],
+		viewAriaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "viewAriaLabel",
+				required: false
+			}]
+		}],
+		editClick: [{
+			type: i0.Output,
+			args: ["editClick"]
+		}],
+		viewClick: [{
+			type: i0.Output,
+			args: ["viewClick"]
+		}]
+	}
+});
+const ACTION_VERB = {
+	load: "loading",
+	save: "saving",
+	create: "creating",
+	update: "updating",
+	delete: "deleting",
+	send: "sending",
+	export: "exporting",
+	import: "importing",
+	upload: "uploading",
+	download: "downloading"
+};
+const ACTION_PERMISSION_VERB = {
+	load: "access",
+	save: "save",
+	create: "create",
+	update: "update",
+	delete: "delete",
+	send: "send",
+	export: "export",
+	import: "import",
+	upload: "upload",
+	download: "download"
+};
+const REQUEST_METHOD = "__forgerouteRequestMethod";
+const errorContextInterceptor = (req, next) => next(req).pipe(catchError$1((err) => {
+	if (err instanceof HttpErrorResponse && !(REQUEST_METHOD in err)) Object.defineProperty(err, REQUEST_METHOD, {
+		value: req.method.toUpperCase(),
+		enumerable: false
+	});
+	return throwError(() => err);
+}));
+function actionFromMethod(error) {
+	switch (error[REQUEST_METHOD]) {
+		case "POST":
+		case "PUT":
+		case "PATCH": return "save";
+		case "DELETE": return "delete";
+		default: return "load";
+	}
+}
+function withoutLeadingArticle(ctx) {
+	return ctx.replace(/^(?:the|an?)\s+/i, "") || ctx;
+}
+function getErrorMessage(error, fallbackContext, action) {
+	const ctx = fallbackContext?.trim() || "data";
+	const act = action ?? (error instanceof HttpErrorResponse ? actionFromMethod(error) : "load");
+	const failed = `There was an error ${ACTION_VERB[act]} ${ctx}.`;
+	if (error instanceof HttpErrorResponse) {
+		if (error.error?.message) return error.error.message;
+		if (typeof error.error === "string" && error.error.length < 200) return error.error;
+		switch (error.status) {
+			case 0: return `${failed} Please check your connection and try again.`;
+			case 401: return "Your session has expired. Please log in again.";
+			case 403: return `You don't have permission to ${ACTION_PERMISSION_VERB[act]} ${ctx}.`;
+			case 404: return `The ${withoutLeadingArticle(ctx)} you're looking for could not be found.`;
+			case 408: return `${failed} The request timed out — please try again.`;
+			case 422: return "The data you submitted is invalid. Please check your input and try again.";
+			case 429: return `${failed} Too many requests — please wait a moment and try again.`;
+			case 502:
+			case 503:
+			case 504: return `${failed} Please try again in a few minutes.`;
+			default: return `${failed} Please try again.`;
+		}
+	}
+	if (error instanceof Error) return error.message;
+	if (typeof error === "string") return error;
+	return `${failed} Please try again.`;
+}
+const NOTES_PAGE_SIZE = 5;
+var NotesComponent = class NotesComponent {
+	initials(name) {
+		const parts = (name || "You").trim().split(/\s+/).filter(Boolean);
+		return ((parts[0]?.[0] ?? "") + (parts.length > 1 ? parts[parts.length - 1][0] : "")).toUpperCase();
+	}
+	get listUrl() {
+		return `${this.apiBase}/notes/${this.resourceType()}/${this.resourceId()}`;
+	}
+	constructor() {
+		this.resourceType = input("", ...ngDevMode ? [{ debugName: "resourceType" }] : /* istanbul ignore next */ []);
+		this.resourceId = input("", ...ngDevMode ? [{ debugName: "resourceId" }] : /* istanbul ignore next */ []);
+		this.readOnly = input(false, ...ngDevMode ? [{ debugName: "readOnly" }] : /* istanbul ignore next */ []);
+		this.totalChange = output();
+		this.http = inject(HttpClient);
+		this.toast = inject(ToastService);
+		this.destroyRef = inject(DestroyRef);
+		this.apiBase = inject(FORGEROUTE_CONFIG, { optional: true })?.baseUrl ?? "/api";
+		this.pageSize = NOTES_PAGE_SIZE;
+		this.notes = signal([], ...ngDevMode ? [{ debugName: "notes" }] : /* istanbul ignore next */ []);
+		this.loading = signal(false, ...ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []);
+		this.saving = signal(false, ...ngDevMode ? [{ debugName: "saving" }] : /* istanbul ignore next */ []);
+		this.page = signal(0, ...ngDevMode ? [{ debugName: "page" }] : /* istanbul ignore next */ []);
+		this.totalElements = signal(0, ...ngDevMode ? [{ debugName: "totalElements" }] : /* istanbul ignore next */ []);
+		this.editingId = signal(null, ...ngDevMode ? [{ debugName: "editingId" }] : /* istanbul ignore next */ []);
+		this.deletingId = signal(null, ...ngDevMode ? [{ debugName: "deletingId" }] : /* istanbul ignore next */ []);
+		this.newBody = "";
+		this.editBody = "";
+		effect(() => {
+			const id = this.resourceId();
+			const type = this.resourceType();
+			if (id && type) untracked(() => this.loadPage(0));
+		});
+	}
+	loadPage(p) {
+		if (!this.resourceType() || !this.resourceId()) return;
+		this.loading.set(true);
+		this.http.get(`${this.listUrl}?page=${p}&size=${this.pageSize}`).pipe(takeUntilDestroyed(this.destroyRef)).subscribe({
+			next: (res) => {
+				this.notes.set(res.content);
+				this.page.set(res.page);
+				this.totalElements.set(res.totalElements);
+				this.loading.set(false);
+				this.totalChange.emit(res.totalElements);
+			},
+			error: (err) => {
+				this.loading.set(false);
+				this.toast.error(getErrorMessage(err, "notes"));
+			}
+		});
+	}
+	addNote() {
+		if (this.readOnly() || !this.newBody.trim() || this.saving()) return;
+		this.saving.set(true);
+		this.http.post(this.listUrl, { body: this.newBody.trim() }).pipe(takeUntilDestroyed(this.destroyRef)).subscribe({
+			next: () => {
+				this.newBody = "";
+				this.saving.set(false);
+				this.loadPage(0);
+			},
+			error: (err) => {
+				this.saving.set(false);
+				this.toast.error(getErrorMessage(err, "note", "create"));
+			}
+		});
+	}
+	startEdit(note) {
+		if (this.readOnly()) return;
+		this.editingId.set(note.id);
+		this.editBody = note.body;
+	}
+	cancelEdit() {
+		this.editingId.set(null);
+		this.editBody = "";
+	}
+	saveEdit(noteId) {
+		if (this.readOnly() || !this.editBody.trim() || this.saving()) return;
+		this.saving.set(true);
+		this.http.put(`${this.apiBase}/notes/${noteId}`, { body: this.editBody.trim() }).pipe(takeUntilDestroyed(this.destroyRef)).subscribe({
+			next: (updated) => {
+				this.notes.update((arr) => arr.map((n) => n.id === noteId ? updated : n));
+				this.editingId.set(null);
+				this.saving.set(false);
+			},
+			error: (err) => {
+				this.saving.set(false);
+				this.toast.error(getErrorMessage(err, "note", "update"));
+			}
+		});
+	}
+	confirmDelete(id) {
+		if (this.readOnly()) return;
+		this.deletingId.set(id);
+	}
+	deleteNote() {
+		const id = this.deletingId();
+		if (this.readOnly() || !id || this.saving()) return;
+		this.saving.set(true);
+		this.http.delete(`${this.apiBase}/notes/${id}`).pipe(takeUntilDestroyed(this.destroyRef)).subscribe({
+			next: () => {
+				this.deletingId.set(null);
+				this.saving.set(false);
+				this.loadPage(this.notes().length === 1 && this.page() > 0 ? this.page() - 1 : this.page());
+			},
+			error: (err) => {
+				this.deletingId.set(null);
+				this.saving.set(false);
+				this.toast.error(getErrorMessage(err, "note", "delete"));
+			}
+		});
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: NotesComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.2",
+			type: NotesComponent,
+			isStandalone: true,
+			selector: "ui-notes",
+			inputs: {
+				resourceType: {
+					classPropertyName: "resourceType",
+					publicName: "resourceType",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				resourceId: {
+					classPropertyName: "resourceId",
+					publicName: "resourceId",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				readOnly: {
+					classPropertyName: "readOnly",
+					publicName: "readOnly",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			outputs: { totalChange: "totalChange" },
+			ngImport: i0,
+			template: `
+    @if (!readOnly()) {
+      <div class="note-add">
+        <ui-textarea-input ariaLabel="Add a note" placeholder="Add a note..." [rows]="3" [disabled]="saving()" [(ngModel)]="newBody"
+          (keydown.meta.enter)="addNote()" (keydown.control.enter)="addNote()" />
+        <div class="note-add-footer">
+          <ui-button variant="primary" size="sm" data-testid="note-add-btn" [loading]="saving()" [disabled]="!newBody.trim()" (click)="addNote()">Add Note</ui-button>
+        </div>
+      </div>
+    }
+
+    @if (loading() && notes().length === 0) {
+      <div class="note-loading" role="status">Loading notes...</div>
+    } @else if (notes().length === 0) {
+      <ui-empty-state iconType="person" title="No notes yet" [message]="readOnly() ? 'No notes have been added.' : 'Add your first note above.'" />
+    } @else {
+      <ul class="note-list" aria-label="Notes">
+        @for (note of notes(); track note.id) {
+          <li class="note-item" [class.editing]="editingId() === note.id">
+            <ui-avatar class="note-avatar" [initials]="initials(note.createdByName)" [name]="note.createdByName || 'You'" [size]="32" />
+            <div class="note-main">
+              <div class="note-head">
+                <span class="note-author">{{ note.createdByName || 'You' }}</span>
+                <span class="note-dot" aria-hidden="true">·</span>
+                <time class="note-date" [attr.datetime]="note.createdAt">{{ note.createdAt | date:'MMM d, yyyy h:mm a' }}</time>
+                @if (note.updatedAt !== note.createdAt) {
+                  <span class="note-edited">edited</span>
+                }
+                @if (!readOnly() && editingId() !== note.id) {
+                  <div class="note-actions">
+                    <ui-button variant="icon" size="xs" ariaLabel="Edit note" uiTooltip="Edit note" (click)="startEdit(note)">
+                      <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>
+                    </ui-button>
+                    <ui-button variant="icon-danger" size="xs" ariaLabel="Delete note" uiTooltip="Delete note" (click)="confirmDelete(note.id)">
+                      <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/><path d="M10 11v6"/><path d="M14 11v6"/></svg>
+                    </ui-button>
+                  </div>
+                }
+              </div>
+              @if (editingId() === note.id) {
+                <ui-textarea-input ariaLabel="Edit note" [rows]="3" [disabled]="saving()" [(ngModel)]="editBody" />
+                <div class="note-item-footer">
+                  <ui-button variant="secondary" size="sm" (click)="cancelEdit()">Cancel</ui-button>
+                  <ui-button variant="primary" size="sm" [loading]="saving()" [disabled]="!editBody.trim()" (click)="saveEdit(note.id)">Save</ui-button>
+                </div>
+              } @else {
+                <p class="note-body">{{ note.body }}</p>
+              }
+            </div>
+          </li>
+        }
+      </ul>
+      <ui-pagination [page]="page() + 1" [pageSize]="pageSize" [totalItems]="totalElements()" (pageChange)="loadPage($event - 1)" />
+    }
+
+    <ui-modal [open]="!!deletingId()" title="Delete Note" maxWidth="420px" dialogTestId="delete-note-modal" (close)="deletingId.set(null)">
+      <p class="note-delete-msg" data-testid="delete-note-message">Delete this note? It is permanently removed from this record and cannot be undone.</p>
+      <ui-button modal-footer-left variant="secondary" size="sm" data-testid="delete-note-cancel" (click)="deletingId.set(null)">Cancel</ui-button>
+      <ui-button modal-footer-right variant="danger" size="sm" data-testid="delete-note-confirm" [loading]="saving()" (click)="deleteNote()">Delete Note</ui-button>
+    </ui-modal>
+  `,
+			isInline: true,
+			styles: [":host{display:block}.note-add{padding:14px;margin-bottom:18px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px}.note-add-footer{display:flex;justify-content:flex-end;margin-top:10px}.note-loading{padding:24px 0;font-size:.875rem;color:#64748b;text-align:center}.note-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.note-item{display:flex;gap:12px;padding:14px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;transition:border-color .15s,box-shadow .15s}@media(hover:hover){.note-item:hover{border-color:#cbd5e1;box-shadow:0 1px 3px #0f172a0f}}.note-item.editing{background:#f8fafc;border-color:#bfdbfe}@media(prefers-reduced-motion:reduce){.note-item{transition:none}}.note-avatar{flex-shrink:0}.note-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.note-head{display:flex;align-items:center;flex-wrap:wrap;gap:2px 6px;min-height:28px}.note-author{font-size:.875rem;font-weight:600;color:#0f172a}.note-dot{color:#94a3b8;font-size:.75rem}.note-date{font-size:.75rem;color:#64748b}.note-edited{font-size:.75rem;font-style:italic;color:#64748b}.note-actions{display:flex;align-items:center;gap:2px;margin-left:auto}.note-body{margin:0;font-size:.9375rem;line-height:1.6;color:#1e293b;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}.note-item-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}.note-delete-msg{margin:0;font-size:.9375rem;line-height:1.5;color:#334155}@media(max-width:480px){.note-item{padding:12px;gap:10px}.note-add{padding:12px}}\n"],
+			dependencies: [
+				{
+					kind: "ngmodule",
+					type: FormsModule
+				},
+				{
+					kind: "directive",
+					type: i1.NgControlStatus,
+					selector: "[formControlName],[ngModel],[formControl]"
+				},
+				{
+					kind: "directive",
+					type: i1.NgModel,
+					selector: "[ngModel]:not([formControlName]):not([formControl])",
+					inputs: [
+						"name",
+						"disabled",
+						"ngModel",
+						"ngModelOptions"
+					],
+					outputs: ["ngModelChange"],
+					exportAs: ["ngModel"]
+				},
+				{
+					kind: "component",
+					type: ButtonComponent,
+					selector: "ui-button",
+					inputs: [
+						"variant",
+						"routerLink",
+						"queryParams",
+						"fragment",
+						"state",
+						"href",
+						"target",
+						"rel",
+						"shortLabel",
+						"shortBelow",
+						"color",
+						"active",
+						"size",
+						"type",
+						"disabled",
+						"loading",
+						"fullWidth",
+						"ariaLabel",
+						"ariaExpanded",
+						"ariaPressed",
+						"ariaDescribedBy",
+						"modal-footer-left",
+						"modal-footer-right"
+					]
+				},
+				{
+					kind: "component",
+					type: ModalComponent,
+					selector: "ui-modal",
+					inputs: [
+						"open",
+						"title",
+						"description",
+						"maxWidth",
+						"bodyOverflow",
+						"dialogTestId",
+						"hideClose",
+						"closable",
+						"returnFocusTo"
+					],
+					outputs: ["close"]
+				},
+				{
+					kind: "component",
+					type: EmptyStateComponent,
+					selector: "ui-empty-state",
+					inputs: [
+						"message",
+						"title",
+						"iconType"
+					]
+				},
+				{
+					kind: "component",
+					type: PaginationComponent,
+					selector: "ui-pagination",
+					inputs: [
+						"page",
+						"pageSize",
+						"totalItems",
+						"detached",
+						"embedded"
+					],
+					outputs: ["pageChange"]
+				},
+				{
+					kind: "component",
+					type: TextareaInputComponent,
+					selector: "ui-textarea-input",
+					inputs: [
+						"label",
+						"ariaLabel",
+						"placeholder",
+						"rows",
+						"maxlength",
+						"required",
+						"readonly",
+						"hint",
+						"hintAsDescription",
+						"error",
+						"monospace",
+						"showErrors",
+						"disabled"
+					],
+					outputs: ["invalidChange"]
+				},
+				{
+					kind: "directive",
+					type: TooltipDirective,
+					selector: "[uiTooltip]",
+					inputs: ["uiTooltip", "tooltipPosition"]
+				},
+				{
+					kind: "component",
+					type: AvatarComponent,
+					selector: "ui-avatar",
+					inputs: [
+						"initials",
+						"name",
+						"size"
+					]
+				},
+				{
+					kind: "pipe",
+					type: DatePipe,
+					name: "date"
+				}
+			],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: NotesComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-notes",
+			standalone: true,
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [
+				DatePipe,
+				FormsModule,
+				ButtonComponent,
+				ModalComponent,
+				EmptyStateComponent,
+				PaginationComponent,
+				TextareaInputComponent,
+				TooltipDirective,
+				AvatarComponent
+			],
+			template: `
+    @if (!readOnly()) {
+      <div class="note-add">
+        <ui-textarea-input ariaLabel="Add a note" placeholder="Add a note..." [rows]="3" [disabled]="saving()" [(ngModel)]="newBody"
+          (keydown.meta.enter)="addNote()" (keydown.control.enter)="addNote()" />
+        <div class="note-add-footer">
+          <ui-button variant="primary" size="sm" data-testid="note-add-btn" [loading]="saving()" [disabled]="!newBody.trim()" (click)="addNote()">Add Note</ui-button>
+        </div>
+      </div>
+    }
+
+    @if (loading() && notes().length === 0) {
+      <div class="note-loading" role="status">Loading notes...</div>
+    } @else if (notes().length === 0) {
+      <ui-empty-state iconType="person" title="No notes yet" [message]="readOnly() ? 'No notes have been added.' : 'Add your first note above.'" />
+    } @else {
+      <ul class="note-list" aria-label="Notes">
+        @for (note of notes(); track note.id) {
+          <li class="note-item" [class.editing]="editingId() === note.id">
+            <ui-avatar class="note-avatar" [initials]="initials(note.createdByName)" [name]="note.createdByName || 'You'" [size]="32" />
+            <div class="note-main">
+              <div class="note-head">
+                <span class="note-author">{{ note.createdByName || 'You' }}</span>
+                <span class="note-dot" aria-hidden="true">·</span>
+                <time class="note-date" [attr.datetime]="note.createdAt">{{ note.createdAt | date:'MMM d, yyyy h:mm a' }}</time>
+                @if (note.updatedAt !== note.createdAt) {
+                  <span class="note-edited">edited</span>
+                }
+                @if (!readOnly() && editingId() !== note.id) {
+                  <div class="note-actions">
+                    <ui-button variant="icon" size="xs" ariaLabel="Edit note" uiTooltip="Edit note" (click)="startEdit(note)">
+                      <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>
+                    </ui-button>
+                    <ui-button variant="icon-danger" size="xs" ariaLabel="Delete note" uiTooltip="Delete note" (click)="confirmDelete(note.id)">
+                      <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/><path d="M10 11v6"/><path d="M14 11v6"/></svg>
+                    </ui-button>
+                  </div>
+                }
+              </div>
+              @if (editingId() === note.id) {
+                <ui-textarea-input ariaLabel="Edit note" [rows]="3" [disabled]="saving()" [(ngModel)]="editBody" />
+                <div class="note-item-footer">
+                  <ui-button variant="secondary" size="sm" (click)="cancelEdit()">Cancel</ui-button>
+                  <ui-button variant="primary" size="sm" [loading]="saving()" [disabled]="!editBody.trim()" (click)="saveEdit(note.id)">Save</ui-button>
+                </div>
+              } @else {
+                <p class="note-body">{{ note.body }}</p>
+              }
+            </div>
+          </li>
+        }
+      </ul>
+      <ui-pagination [page]="page() + 1" [pageSize]="pageSize" [totalItems]="totalElements()" (pageChange)="loadPage($event - 1)" />
+    }
+
+    <ui-modal [open]="!!deletingId()" title="Delete Note" maxWidth="420px" dialogTestId="delete-note-modal" (close)="deletingId.set(null)">
+      <p class="note-delete-msg" data-testid="delete-note-message">Delete this note? It is permanently removed from this record and cannot be undone.</p>
+      <ui-button modal-footer-left variant="secondary" size="sm" data-testid="delete-note-cancel" (click)="deletingId.set(null)">Cancel</ui-button>
+      <ui-button modal-footer-right variant="danger" size="sm" data-testid="delete-note-confirm" [loading]="saving()" (click)="deleteNote()">Delete Note</ui-button>
+    </ui-modal>
+  `,
+			styles: [":host{display:block}.note-add{padding:14px;margin-bottom:18px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px}.note-add-footer{display:flex;justify-content:flex-end;margin-top:10px}.note-loading{padding:24px 0;font-size:.875rem;color:#64748b;text-align:center}.note-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.note-item{display:flex;gap:12px;padding:14px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;transition:border-color .15s,box-shadow .15s}@media(hover:hover){.note-item:hover{border-color:#cbd5e1;box-shadow:0 1px 3px #0f172a0f}}.note-item.editing{background:#f8fafc;border-color:#bfdbfe}@media(prefers-reduced-motion:reduce){.note-item{transition:none}}.note-avatar{flex-shrink:0}.note-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.note-head{display:flex;align-items:center;flex-wrap:wrap;gap:2px 6px;min-height:28px}.note-author{font-size:.875rem;font-weight:600;color:#0f172a}.note-dot{color:#94a3b8;font-size:.75rem}.note-date{font-size:.75rem;color:#64748b}.note-edited{font-size:.75rem;font-style:italic;color:#64748b}.note-actions{display:flex;align-items:center;gap:2px;margin-left:auto}.note-body{margin:0;font-size:.9375rem;line-height:1.6;color:#1e293b;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}.note-item-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}.note-delete-msg{margin:0;font-size:.9375rem;line-height:1.5;color:#334155}@media(max-width:480px){.note-item{padding:12px;gap:10px}.note-add{padding:12px}}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		resourceType: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "resourceType",
+				required: false
+			}]
+		}],
+		resourceId: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "resourceId",
+				required: false
+			}]
+		}],
+		readOnly: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "readOnly",
+				required: false
+			}]
+		}],
+		totalChange: [{
+			type: i0.Output,
+			args: ["totalChange"]
+		}]
+	}
+});
 function provideForgerouteToast(options = {}) {
 	return makeEnvironmentProviders([provideEnvironmentInitializer(() => {
 		if (options.dismissible) inject(ToastService).dismissible.set(true);
@@ -25346,7 +26375,7 @@ var ListComponent = class ListComponent {
     }
   `,
 			isInline: true,
-			styles: ["ui-list{display:block;min-width:0}.ul-list{margin:0;padding:0;min-width:0}.ul-list--unordered{list-style:none}.ul-list--ordered{list-style:decimal;-webkit-padding-start:1.75rem;padding-inline-start:1.75rem}.ul-list--ordered>.ul-item::marker{color:var(--text-secondary, #64748b);font-size:.875rem}.ul-item{min-width:0;transition:background-color .4s ease}.ul-item.ul-item--moved{background-color:var(--surface-hover, #f1f5f9)}.ul-list:not(.ul-list--grid)>.ul-item+.ul-item{margin-top:var(--ul-gap, 0px)}.ul-row{display:flex;align-items:center;gap:8px;min-width:0}.ul-content{flex:1 1 auto;min-width:0;word-break:break-word;overflow-wrap:anywhere}.ul-controls{display:flex;flex:0 0 auto;align-items:center;gap:2px}.ul-item--nav{cursor:pointer;border-radius:10px;transition:background-color .12s ease}.ul-item--nav:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.ul-item--nav:hover{background:var(--surface-hover, #f8fafc)}.ul-item--nav>.ul-row{padding-inline-end:16px}.ul-item--nav:hover .ul-chevron{color:#0f172a}.ul-chevron{flex:0 0 auto;color:#94a3b8;transition:color .15s ease}@media(prefers-reduced-motion:reduce){.ul-chevron{transition:none}}.ul-list.ul-list--grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(var(--ul-min, 130px),100%),1fr));gap:var(--ul-gap, 12px);list-style:none;-webkit-padding-start:0;padding-inline-start:0}.ul-list--grid>.ul-item>.ul-row{flex-direction:column;align-items:stretch;gap:6px}.ul-list--grid>.ul-item>.ul-row>.ul-controls{align-self:center}@media(pointer:coarse),(max-width:480px){.ul-controls{gap:16px}}.ul-item--draggable{-webkit-user-select:none;user-select:none;-webkit-user-drag:element}@media(hover:hover)and (pointer:fine){.ul-item--draggable{cursor:grab}.ul-item--draggable:active{cursor:grabbing}}.ul-item--draggable:focus{outline:2px solid #3b82f6;outline-offset:2px;border-radius:6px}.ul-item--draggable:focus:not(:focus-visible){outline:none}ui-list .ul-item--draggable img,ui-list .ul-item--draggable ui-image-preview{pointer-events:none;-webkit-user-drag:none}.ul-item--dragging{opacity:.5}.ul-item--over{outline:2px dashed #3b82f6;outline-offset:2px;border-radius:6px}@media(prefers-reduced-motion:reduce){.ul-item{transition:none}}@media(forced-colors:active){.ul-item.ul-item--moved{outline:2px solid Highlight;outline-offset:-2px}}@media(forced-colors:active){.ul-item.ul-item--dragging{outline:2px dotted Highlight;outline-offset:2px}.ul-item.ul-item--over{outline:2px dashed Highlight;outline-offset:2px}.ul-item--draggable:focus{outline:2px solid Highlight;outline-offset:2px}}.ul-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"],
+			styles: ["ui-list{display:block;min-width:0}.ul-list{margin:0;padding:0;min-width:0}.ul-list--unordered{list-style:none}.ul-list--ordered{list-style:decimal;-webkit-padding-start:1.75rem;padding-inline-start:1.75rem}.ul-list--ordered>.ul-item::marker{color:var(--text-secondary, #64748b);font-size:.875rem}.ul-item{min-width:0;transition:background-color .4s ease}.ul-item.ul-item--moved{background-color:var(--surface-hover, #f1f5f9)}.ul-list:not(.ul-list--grid)>.ul-item+.ul-item{margin-top:var(--ul-gap, 0px)}.ul-row{display:flex;align-items:center;gap:8px;min-width:0}.ul-content{flex:1 1 auto;min-width:0;word-break:break-word;overflow-wrap:anywhere}.ul-controls{display:flex;flex:0 0 auto;align-items:center;gap:2px}.ul-item--nav{cursor:pointer;border-radius:10px;transition:background-color .12s ease}.ul-item--nav:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.ul-item--nav:hover{background:var(--surface-hover, #f8fafc)}.ul-item--nav:hover:has(>.ul-row>.ul-content>ui-list-item.li-bordered){background:transparent}.ul-item--nav>.ul-row{padding-inline-end:8px}.ul-item--nav:hover .ul-chevron{color:#0f172a;transform:translate(2px)}.ul-chevron{flex:0 0 auto;color:#94a3b8;transition:color .15s ease,transform .15s ease}@media(prefers-reduced-motion:reduce){.ul-chevron{transition:none;transform:none!important}}.ul-list.ul-list--grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(var(--ul-min, 130px),100%),1fr));gap:var(--ul-gap, 12px);list-style:none;-webkit-padding-start:0;padding-inline-start:0}.ul-list--grid>.ul-item>.ul-row{flex-direction:column;align-items:stretch;gap:6px}.ul-list--grid>.ul-item>.ul-row>.ul-controls{align-self:center}@media(pointer:coarse),(max-width:480px){.ul-controls{gap:16px}}.ul-item--draggable{-webkit-user-select:none;user-select:none;-webkit-user-drag:element}@media(hover:hover)and (pointer:fine){.ul-item--draggable{cursor:grab}.ul-item--draggable:active{cursor:grabbing}}.ul-item--draggable:focus{outline:2px solid #3b82f6;outline-offset:2px;border-radius:6px}.ul-item--draggable:focus:not(:focus-visible){outline:none}ui-list .ul-item--draggable img,ui-list .ul-item--draggable ui-image-preview{pointer-events:none;-webkit-user-drag:none}.ul-item--dragging{opacity:.5}.ul-item--over{outline:2px dashed #3b82f6;outline-offset:2px;border-radius:6px}@media(prefers-reduced-motion:reduce){.ul-item{transition:none}}@media(forced-colors:active){.ul-item.ul-item--moved{outline:2px solid Highlight;outline-offset:-2px}}@media(forced-colors:active){.ul-item.ul-item--dragging{outline:2px dotted Highlight;outline-offset:2px}.ul-item.ul-item--over{outline:2px dashed Highlight;outline-offset:2px}.ul-item--draggable:focus{outline:2px solid Highlight;outline-offset:2px}}.ul-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"],
 			dependencies: [{
 				kind: "directive",
 				type: NgTemplateOutlet,
@@ -25474,7 +26503,7 @@ i0.ɵɵngDeclareClassMetadata({
       <div class="ul-sr" role="status" aria-live="polite" aria-atomic="true">{{ announcement() }}</div>
     }
   `,
-			styles: ["ui-list{display:block;min-width:0}.ul-list{margin:0;padding:0;min-width:0}.ul-list--unordered{list-style:none}.ul-list--ordered{list-style:decimal;-webkit-padding-start:1.75rem;padding-inline-start:1.75rem}.ul-list--ordered>.ul-item::marker{color:var(--text-secondary, #64748b);font-size:.875rem}.ul-item{min-width:0;transition:background-color .4s ease}.ul-item.ul-item--moved{background-color:var(--surface-hover, #f1f5f9)}.ul-list:not(.ul-list--grid)>.ul-item+.ul-item{margin-top:var(--ul-gap, 0px)}.ul-row{display:flex;align-items:center;gap:8px;min-width:0}.ul-content{flex:1 1 auto;min-width:0;word-break:break-word;overflow-wrap:anywhere}.ul-controls{display:flex;flex:0 0 auto;align-items:center;gap:2px}.ul-item--nav{cursor:pointer;border-radius:10px;transition:background-color .12s ease}.ul-item--nav:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.ul-item--nav:hover{background:var(--surface-hover, #f8fafc)}.ul-item--nav>.ul-row{padding-inline-end:16px}.ul-item--nav:hover .ul-chevron{color:#0f172a}.ul-chevron{flex:0 0 auto;color:#94a3b8;transition:color .15s ease}@media(prefers-reduced-motion:reduce){.ul-chevron{transition:none}}.ul-list.ul-list--grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(var(--ul-min, 130px),100%),1fr));gap:var(--ul-gap, 12px);list-style:none;-webkit-padding-start:0;padding-inline-start:0}.ul-list--grid>.ul-item>.ul-row{flex-direction:column;align-items:stretch;gap:6px}.ul-list--grid>.ul-item>.ul-row>.ul-controls{align-self:center}@media(pointer:coarse),(max-width:480px){.ul-controls{gap:16px}}.ul-item--draggable{-webkit-user-select:none;user-select:none;-webkit-user-drag:element}@media(hover:hover)and (pointer:fine){.ul-item--draggable{cursor:grab}.ul-item--draggable:active{cursor:grabbing}}.ul-item--draggable:focus{outline:2px solid #3b82f6;outline-offset:2px;border-radius:6px}.ul-item--draggable:focus:not(:focus-visible){outline:none}ui-list .ul-item--draggable img,ui-list .ul-item--draggable ui-image-preview{pointer-events:none;-webkit-user-drag:none}.ul-item--dragging{opacity:.5}.ul-item--over{outline:2px dashed #3b82f6;outline-offset:2px;border-radius:6px}@media(prefers-reduced-motion:reduce){.ul-item{transition:none}}@media(forced-colors:active){.ul-item.ul-item--moved{outline:2px solid Highlight;outline-offset:-2px}}@media(forced-colors:active){.ul-item.ul-item--dragging{outline:2px dotted Highlight;outline-offset:2px}.ul-item.ul-item--over{outline:2px dashed Highlight;outline-offset:2px}.ul-item--draggable:focus{outline:2px solid Highlight;outline-offset:2px}}.ul-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"]
+			styles: ["ui-list{display:block;min-width:0}.ul-list{margin:0;padding:0;min-width:0}.ul-list--unordered{list-style:none}.ul-list--ordered{list-style:decimal;-webkit-padding-start:1.75rem;padding-inline-start:1.75rem}.ul-list--ordered>.ul-item::marker{color:var(--text-secondary, #64748b);font-size:.875rem}.ul-item{min-width:0;transition:background-color .4s ease}.ul-item.ul-item--moved{background-color:var(--surface-hover, #f1f5f9)}.ul-list:not(.ul-list--grid)>.ul-item+.ul-item{margin-top:var(--ul-gap, 0px)}.ul-row{display:flex;align-items:center;gap:8px;min-width:0}.ul-content{flex:1 1 auto;min-width:0;word-break:break-word;overflow-wrap:anywhere}.ul-controls{display:flex;flex:0 0 auto;align-items:center;gap:2px}.ul-item--nav{cursor:pointer;border-radius:10px;transition:background-color .12s ease}.ul-item--nav:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.ul-item--nav:hover{background:var(--surface-hover, #f8fafc)}.ul-item--nav:hover:has(>.ul-row>.ul-content>ui-list-item.li-bordered){background:transparent}.ul-item--nav>.ul-row{padding-inline-end:8px}.ul-item--nav:hover .ul-chevron{color:#0f172a;transform:translate(2px)}.ul-chevron{flex:0 0 auto;color:#94a3b8;transition:color .15s ease,transform .15s ease}@media(prefers-reduced-motion:reduce){.ul-chevron{transition:none;transform:none!important}}.ul-list.ul-list--grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(var(--ul-min, 130px),100%),1fr));gap:var(--ul-gap, 12px);list-style:none;-webkit-padding-start:0;padding-inline-start:0}.ul-list--grid>.ul-item>.ul-row{flex-direction:column;align-items:stretch;gap:6px}.ul-list--grid>.ul-item>.ul-row>.ul-controls{align-self:center}@media(pointer:coarse),(max-width:480px){.ul-controls{gap:16px}}.ul-item--draggable{-webkit-user-select:none;user-select:none;-webkit-user-drag:element}@media(hover:hover)and (pointer:fine){.ul-item--draggable{cursor:grab}.ul-item--draggable:active{cursor:grabbing}}.ul-item--draggable:focus{outline:2px solid #3b82f6;outline-offset:2px;border-radius:6px}.ul-item--draggable:focus:not(:focus-visible){outline:none}ui-list .ul-item--draggable img,ui-list .ul-item--draggable ui-image-preview{pointer-events:none;-webkit-user-drag:none}.ul-item--dragging{opacity:.5}.ul-item--over{outline:2px dashed #3b82f6;outline-offset:2px;border-radius:6px}@media(prefers-reduced-motion:reduce){.ul-item{transition:none}}@media(forced-colors:active){.ul-item.ul-item--moved{outline:2px solid Highlight;outline-offset:-2px}}@media(forced-colors:active){.ul-item.ul-item--dragging{outline:2px dotted Highlight;outline-offset:2px}.ul-item.ul-item--over{outline:2px dashed Highlight;outline-offset:2px}.ul-item--draggable:focus{outline:2px solid Highlight;outline-offset:2px}}.ul-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"]
 		}]
 	}],
 	propDecorators: {
@@ -26942,11 +27971,7 @@ var PanelInfoListComponent = class PanelInfoListComponent {
                   <span [class.pil-muted]="item.muted" [class.pil-danger]="item.danger" [class.pil-multiline]="item.multiline">{{ item.value || '—' }}</span>
                 }
                 @if (item.editAction) {
-                  <ui-button class="pil-edit-btn" variant="icon" size="xs"
-                    [ariaLabel]="item.editTooltip ?? 'Edit'" [attr.title]="item.editTooltip ?? 'Edit'"
-                    (click)="item.editAction!()">
-                    <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>
-                  </ui-button>
+                  <ui-icon class="pil-edit-btn" name="edit" [size]="14" [tooltip]="item.editTooltip ?? 'Edit'" (iconClick)="item.editAction!()" />
                 }
               </span>
             </div>
@@ -26995,33 +28020,19 @@ var PanelInfoListComponent = class PanelInfoListComponent {
 				},
 				{
 					kind: "component",
-					type: ButtonComponent,
-					selector: "ui-button",
+					type: IconComponent,
+					selector: "ui-icon",
 					inputs: [
-						"variant",
-						"routerLink",
-						"queryParams",
-						"fragment",
-						"state",
-						"href",
-						"target",
-						"rel",
-						"shortLabel",
-						"shortBelow",
-						"color",
-						"active",
+						"name",
+						"tooltip",
+						"ariaLabel",
 						"size",
-						"type",
+						"variant",
 						"disabled",
 						"loading",
-						"fullWidth",
-						"ariaLabel",
-						"ariaExpanded",
-						"ariaPressed",
-						"ariaDescribedBy",
-						"modal-footer-left",
-						"modal-footer-right"
-					]
+						"interactive"
+					],
+					outputs: ["iconClick"]
 				}
 			],
 			changeDetection: i0.ChangeDetectionStrategy.OnPush
@@ -27043,7 +28054,7 @@ i0.ɵɵngDeclareClassMetadata({
 				BadgeComponent,
 				RouterLink,
 				EmptyStateComponent,
-				ButtonComponent
+				IconComponent
 			],
 			template: `
     @for (section of displaySections(); track section.title ?? $index) {
@@ -27101,11 +28112,7 @@ i0.ɵɵngDeclareClassMetadata({
                   <span [class.pil-muted]="item.muted" [class.pil-danger]="item.danger" [class.pil-multiline]="item.multiline">{{ item.value || '—' }}</span>
                 }
                 @if (item.editAction) {
-                  <ui-button class="pil-edit-btn" variant="icon" size="xs"
-                    [ariaLabel]="item.editTooltip ?? 'Edit'" [attr.title]="item.editTooltip ?? 'Edit'"
-                    (click)="item.editAction!()">
-                    <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>
-                  </ui-button>
+                  <ui-icon class="pil-edit-btn" name="edit" [size]="14" [tooltip]="item.editTooltip ?? 'Edit'" (iconClick)="item.editAction!()" />
                 }
               </span>
             </div>
@@ -27271,75 +28278,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-const ACTION_VERB = {
-	load: "loading",
-	save: "saving",
-	create: "creating",
-	update: "updating",
-	delete: "deleting",
-	send: "sending",
-	export: "exporting",
-	import: "importing",
-	upload: "uploading",
-	download: "downloading"
-};
-const ACTION_PERMISSION_VERB = {
-	load: "access",
-	save: "save",
-	create: "create",
-	update: "update",
-	delete: "delete",
-	send: "send",
-	export: "export",
-	import: "import",
-	upload: "upload",
-	download: "download"
-};
-const REQUEST_METHOD = "__forgerouteRequestMethod";
-const errorContextInterceptor = (req, next) => next(req).pipe(catchError$1((err) => {
-	if (err instanceof HttpErrorResponse && !(REQUEST_METHOD in err)) Object.defineProperty(err, REQUEST_METHOD, {
-		value: req.method.toUpperCase(),
-		enumerable: false
-	});
-	return throwError(() => err);
-}));
-function actionFromMethod(error) {
-	switch (error[REQUEST_METHOD]) {
-		case "POST":
-		case "PUT":
-		case "PATCH": return "save";
-		case "DELETE": return "delete";
-		default: return "load";
-	}
-}
-function withoutLeadingArticle(ctx) {
-	return ctx.replace(/^(?:the|an?)\s+/i, "") || ctx;
-}
-function getErrorMessage(error, fallbackContext, action) {
-	const ctx = fallbackContext?.trim() || "data";
-	const act = action ?? (error instanceof HttpErrorResponse ? actionFromMethod(error) : "load");
-	const failed = `There was an error ${ACTION_VERB[act]} ${ctx}.`;
-	if (error instanceof HttpErrorResponse) {
-		if (error.error?.message) return error.error.message;
-		if (typeof error.error === "string" && error.error.length < 200) return error.error;
-		switch (error.status) {
-			case 0: return `${failed} Please check your connection and try again.`;
-			case 401: return "Your session has expired. Please log in again.";
-			case 403: return `You don't have permission to ${ACTION_PERMISSION_VERB[act]} ${ctx}.`;
-			case 404: return `The ${withoutLeadingArticle(ctx)} you're looking for could not be found.`;
-			case 408: return `${failed} The request timed out — please try again.`;
-			case 422: return "The data you submitted is invalid. Please check your input and try again.";
-			case 429: return `${failed} Too many requests — please wait a moment and try again.`;
-			case 502:
-			case 503:
-			case 504: return `${failed} Please try again in a few minutes.`;
-			default: return `${failed} Please try again.`;
-		}
-	}
-	if (error instanceof Error) return error.message;
-	if (typeof error === "string") return error;
-	return `${failed} Please try again.`;
-}
 const US_STATES = [
 	{
 		value: "AL",
@@ -33278,6 +34216,7 @@ var DetailCardComponent = class DetailCardComponent {
 		this.subtitle = input("", ...ngDevMode ? [{ debugName: "subtitle" }] : /* istanbul ignore next */ []);
 		this.background = input("", ...ngDevMode ? [{ debugName: "background" }] : /* istanbul ignore next */ []);
 		this.headerBackground = input("", ...ngDevMode ? [{ debugName: "headerBackground" }] : /* istanbul ignore next */ []);
+		this.footerBackground = input("", ...ngDevMode ? [{ debugName: "footerBackground" }] : /* istanbul ignore next */ []);
 		this.textColor = input("", ...ngDevMode ? [{ debugName: "textColor" }] : /* istanbul ignore next */ []);
 		this.showHeader = input(true, ...ngDevMode ? [{ debugName: "showHeader" }] : /* istanbul ignore next */ []);
 		this.collapsible = input(true, ...ngDevMode ? [{ debugName: "collapsible" }] : /* istanbul ignore next */ []);
@@ -33394,6 +34333,13 @@ var DetailCardComponent = class DetailCardComponent {
 					isRequired: false,
 					transformFunction: null
 				},
+				footerBackground: {
+					classPropertyName: "footerBackground",
+					publicName: "footerBackground",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
 				textColor: {
 					classPropertyName: "textColor",
 					publicName: "textColor",
@@ -33509,7 +34455,7 @@ var DetailCardComponent = class DetailCardComponent {
 			},
 			ngImport: i0,
 			template: `
-    <div class="dc" [class.dc-fill]="fill()" [class.dc-has-text-color]="!!textColor()" [class.dc-selectable]="selectable()" [class.dc-selected]="selectable() && selected()"
+    <div class="dc" [class.dc-fill]="fill()" [class.dc-has-text-color]="!!textColor()" [class.dc-has-bg]="!!((selectable() && selected() && selectedBackground()) || background())" [class.dc-selectable]="selectable()" [class.dc-selected]="selectable() && selected()"
          [style.outline-color]="selectable() && selected() ? selectedColor() : null"
          [style.background]="(selectable() && selected() && selectedBackground()) || background() || null" (click)="onCardClick($event)"
          [style.color]="textColor() || null" [style.--dc-text]="textColor() || null">
@@ -33551,10 +34497,11 @@ var DetailCardComponent = class DetailCardComponent {
           <ng-content />
         </div>
       </div>
+      <div class="dc-footer" [class.dc-footer--hidden]="!isOpen()" [style.background]="footerBackground() || null"><ng-content select="[card-footer]" /></div>
     </div>
   `,
 			isInline: true,
-			styles: [":host{display:block;margin-bottom:16px}:host(:last-child){margin-bottom:0}:host(.dc-fill-host){height:100%;margin-bottom:0}.dc.dc-fill{height:100%;box-sizing:border-box;display:flex;flex-direction:column}.dc.dc-fill .dc-body-wrap{flex:1 1 auto;min-height:0}.dc.dc-fill .dc-body{display:flex;flex-direction:column}.dc-selectable{cursor:pointer}.dc-selected{outline:2px solid #3b82f6;outline-offset:-1px}.dc{background:#fff;border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dc-header{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;padding:14px 18px}.dc-header.open{border-bottom:1px solid #f1f5f9}.dc-header.collapsible{cursor:pointer;-webkit-user-select:none;user-select:none}@media(hover:hover){.dc-header.collapsible:hover{background:#f8fafc}}.dc-chevron{flex-shrink:0;color:var(--dc-text, #64748b)}.dc-chevron svg{transition:transform .2s}.dc-chevron svg.rotated{transform:rotate(-90deg)}.dc-header-text{display:flex;flex-direction:column;gap:2px;flex:1 1 160px;min-width:0;word-break:break-word;overflow-wrap:anywhere}.dc-title{font-size:.8125rem;font-weight:800;letter-spacing:.07em;color:var(--dc-text, #1e293b);line-height:1.3;text-transform:uppercase}.dc-title--as-written{text-transform:none}.dc-subtitle{font-size:.75rem;color:var(--dc-text, #475569)}.dc-has-text-color .dc-subtitle{opacity:.8}.dc-has-text-color .dc-header.open{border-bottom-color:#94a3b859}.dc-edit{flex-shrink:0;margin-left:auto}.dc-edit-action{display:inline-flex;align-items:center;justify-content:center;gap:5px;font-family:inherit;font-size:.8rem;font-weight:500;line-height:1.4;color:#64748b;background:none;border:1px solid #e2e8f0;border-radius:6px;padding:4px 10px;cursor:pointer;white-space:nowrap;transition:background-color .15s ease,color .15s ease}.dc-edit-action:hover{background:#f1f5f9;color:#1e293b}.dc-edit-action:focus-visible{outline:2px solid var(--ui-focus, #3b82f6);outline-offset:2px}@media(pointer:coarse),(max-width:480px){.dc-edit-action{min-height:44px}}.dc-body-wrap{display:grid;grid-template-rows:1fr;transition:grid-template-rows .25s ease}.dc-body-wrap.collapsed{grid-template-rows:0fr}.dc-body{padding:16px 18px;min-height:0;overflow:hidden}@media(max-width:480px){.dc-header{padding:12px 14px}.dc-body{padding:14px}.dc-edit{margin-left:0}}@media(prefers-reduced-motion:reduce){.dc-body-wrap,.dc-chevron svg{transition:none}}\n"],
+			styles: [":host{display:block;margin-bottom:16px}:host(:last-child){margin-bottom:0}:host(.dc-fill-host){height:100%;margin-bottom:0}.dc.dc-fill{height:100%;box-sizing:border-box;display:flex;flex-direction:column}.dc.dc-fill .dc-body-wrap{flex:1 1 auto;min-height:0}.dc.dc-fill .dc-body{display:flex;flex-direction:column}.dc-selectable{cursor:pointer}.dc-selected{outline:2px solid #3b82f6;outline-offset:-1px}.dc{background:#fff;border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dc-header{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;padding:14px 18px}.dc-header.open{border-bottom:1px solid #f1f5f9}.dc-has-bg .dc-header.open{border-bottom-color:#94a3b859}.dc-header.collapsible{cursor:pointer;-webkit-user-select:none;user-select:none}@media(hover:hover){.dc-header.collapsible:hover{background:#f8fafc}}.dc-chevron{flex-shrink:0;color:var(--dc-text, #64748b)}.dc-chevron svg{transition:transform .2s}.dc-chevron svg.rotated{transform:rotate(-90deg)}.dc-header-text{display:flex;flex-direction:column;gap:2px;flex:1 1 160px;min-width:0;word-break:break-word;overflow-wrap:anywhere}.dc-title{font-size:.8125rem;font-weight:800;letter-spacing:.07em;color:var(--dc-text, #1e293b);line-height:1.3;text-transform:uppercase}.dc-title--as-written{text-transform:none}.dc-subtitle{font-size:.8125rem;color:var(--dc-text, #475569)}.dc-has-text-color .dc-subtitle{opacity:.8}.dc-has-text-color .dc-header.open{border-bottom-color:#94a3b859}.dc-edit{flex-shrink:0;margin-left:auto}.dc-edit-action{display:inline-flex;align-items:center;justify-content:center;gap:5px;font-family:inherit;font-size:.8rem;font-weight:500;line-height:1.4;color:#64748b;background:none;border:1px solid #e2e8f0;border-radius:6px;padding:4px 10px;cursor:pointer;white-space:nowrap;transition:background-color .15s ease,color .15s ease}.dc-edit-action:hover{background:#f1f5f9;color:#1e293b}.dc-edit-action:focus-visible{outline:2px solid var(--ui-focus, #3b82f6);outline-offset:2px}@media(pointer:coarse),(max-width:480px){.dc-edit-action{min-height:44px}}.dc-body-wrap{display:grid;grid-template-rows:1fr;transition:grid-template-rows .25s ease}.dc-body-wrap.collapsed{grid-template-rows:0fr}.dc-body{padding:16px 18px;min-height:0;overflow:hidden}.dc-footer{padding:10px 18px;border-top:1px solid #f1f5f9}.dc-footer:empty,.dc-footer.dc-footer--hidden{display:none}.dc-has-bg .dc-footer{border-top-color:#94a3b859}@media(max-width:480px){.dc-footer{padding:10px 14px}.dc-header{padding:12px 14px}.dc-body{padding:14px}.dc-edit{margin-left:0}}@media(prefers-reduced-motion:reduce){.dc-body-wrap,.dc-chevron svg{transition:none}}\n"],
 			dependencies: [{
 				kind: "component",
 				type: ButtonComponent,
@@ -33609,7 +34556,7 @@ i0.ɵɵngDeclareClassMetadata({
 				"[attr.aria-label]": "groupLabel()"
 			},
 			template: `
-    <div class="dc" [class.dc-fill]="fill()" [class.dc-has-text-color]="!!textColor()" [class.dc-selectable]="selectable()" [class.dc-selected]="selectable() && selected()"
+    <div class="dc" [class.dc-fill]="fill()" [class.dc-has-text-color]="!!textColor()" [class.dc-has-bg]="!!((selectable() && selected() && selectedBackground()) || background())" [class.dc-selectable]="selectable()" [class.dc-selected]="selectable() && selected()"
          [style.outline-color]="selectable() && selected() ? selectedColor() : null"
          [style.background]="(selectable() && selected() && selectedBackground()) || background() || null" (click)="onCardClick($event)"
          [style.color]="textColor() || null" [style.--dc-text]="textColor() || null">
@@ -33651,9 +34598,10 @@ i0.ɵɵngDeclareClassMetadata({
           <ng-content />
         </div>
       </div>
+      <div class="dc-footer" [class.dc-footer--hidden]="!isOpen()" [style.background]="footerBackground() || null"><ng-content select="[card-footer]" /></div>
     </div>
   `,
-			styles: [":host{display:block;margin-bottom:16px}:host(:last-child){margin-bottom:0}:host(.dc-fill-host){height:100%;margin-bottom:0}.dc.dc-fill{height:100%;box-sizing:border-box;display:flex;flex-direction:column}.dc.dc-fill .dc-body-wrap{flex:1 1 auto;min-height:0}.dc.dc-fill .dc-body{display:flex;flex-direction:column}.dc-selectable{cursor:pointer}.dc-selected{outline:2px solid #3b82f6;outline-offset:-1px}.dc{background:#fff;border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dc-header{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;padding:14px 18px}.dc-header.open{border-bottom:1px solid #f1f5f9}.dc-header.collapsible{cursor:pointer;-webkit-user-select:none;user-select:none}@media(hover:hover){.dc-header.collapsible:hover{background:#f8fafc}}.dc-chevron{flex-shrink:0;color:var(--dc-text, #64748b)}.dc-chevron svg{transition:transform .2s}.dc-chevron svg.rotated{transform:rotate(-90deg)}.dc-header-text{display:flex;flex-direction:column;gap:2px;flex:1 1 160px;min-width:0;word-break:break-word;overflow-wrap:anywhere}.dc-title{font-size:.8125rem;font-weight:800;letter-spacing:.07em;color:var(--dc-text, #1e293b);line-height:1.3;text-transform:uppercase}.dc-title--as-written{text-transform:none}.dc-subtitle{font-size:.75rem;color:var(--dc-text, #475569)}.dc-has-text-color .dc-subtitle{opacity:.8}.dc-has-text-color .dc-header.open{border-bottom-color:#94a3b859}.dc-edit{flex-shrink:0;margin-left:auto}.dc-edit-action{display:inline-flex;align-items:center;justify-content:center;gap:5px;font-family:inherit;font-size:.8rem;font-weight:500;line-height:1.4;color:#64748b;background:none;border:1px solid #e2e8f0;border-radius:6px;padding:4px 10px;cursor:pointer;white-space:nowrap;transition:background-color .15s ease,color .15s ease}.dc-edit-action:hover{background:#f1f5f9;color:#1e293b}.dc-edit-action:focus-visible{outline:2px solid var(--ui-focus, #3b82f6);outline-offset:2px}@media(pointer:coarse),(max-width:480px){.dc-edit-action{min-height:44px}}.dc-body-wrap{display:grid;grid-template-rows:1fr;transition:grid-template-rows .25s ease}.dc-body-wrap.collapsed{grid-template-rows:0fr}.dc-body{padding:16px 18px;min-height:0;overflow:hidden}@media(max-width:480px){.dc-header{padding:12px 14px}.dc-body{padding:14px}.dc-edit{margin-left:0}}@media(prefers-reduced-motion:reduce){.dc-body-wrap,.dc-chevron svg{transition:none}}\n"]
+			styles: [":host{display:block;margin-bottom:16px}:host(:last-child){margin-bottom:0}:host(.dc-fill-host){height:100%;margin-bottom:0}.dc.dc-fill{height:100%;box-sizing:border-box;display:flex;flex-direction:column}.dc.dc-fill .dc-body-wrap{flex:1 1 auto;min-height:0}.dc.dc-fill .dc-body{display:flex;flex-direction:column}.dc-selectable{cursor:pointer}.dc-selected{outline:2px solid #3b82f6;outline-offset:-1px}.dc{background:#fff;border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}.dc-header{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;padding:14px 18px}.dc-header.open{border-bottom:1px solid #f1f5f9}.dc-has-bg .dc-header.open{border-bottom-color:#94a3b859}.dc-header.collapsible{cursor:pointer;-webkit-user-select:none;user-select:none}@media(hover:hover){.dc-header.collapsible:hover{background:#f8fafc}}.dc-chevron{flex-shrink:0;color:var(--dc-text, #64748b)}.dc-chevron svg{transition:transform .2s}.dc-chevron svg.rotated{transform:rotate(-90deg)}.dc-header-text{display:flex;flex-direction:column;gap:2px;flex:1 1 160px;min-width:0;word-break:break-word;overflow-wrap:anywhere}.dc-title{font-size:.8125rem;font-weight:800;letter-spacing:.07em;color:var(--dc-text, #1e293b);line-height:1.3;text-transform:uppercase}.dc-title--as-written{text-transform:none}.dc-subtitle{font-size:.8125rem;color:var(--dc-text, #475569)}.dc-has-text-color .dc-subtitle{opacity:.8}.dc-has-text-color .dc-header.open{border-bottom-color:#94a3b859}.dc-edit{flex-shrink:0;margin-left:auto}.dc-edit-action{display:inline-flex;align-items:center;justify-content:center;gap:5px;font-family:inherit;font-size:.8rem;font-weight:500;line-height:1.4;color:#64748b;background:none;border:1px solid #e2e8f0;border-radius:6px;padding:4px 10px;cursor:pointer;white-space:nowrap;transition:background-color .15s ease,color .15s ease}.dc-edit-action:hover{background:#f1f5f9;color:#1e293b}.dc-edit-action:focus-visible{outline:2px solid var(--ui-focus, #3b82f6);outline-offset:2px}@media(pointer:coarse),(max-width:480px){.dc-edit-action{min-height:44px}}.dc-body-wrap{display:grid;grid-template-rows:1fr;transition:grid-template-rows .25s ease}.dc-body-wrap.collapsed{grid-template-rows:0fr}.dc-body{padding:16px 18px;min-height:0;overflow:hidden}.dc-footer{padding:10px 18px;border-top:1px solid #f1f5f9}.dc-footer:empty,.dc-footer.dc-footer--hidden{display:none}.dc-has-bg .dc-footer{border-top-color:#94a3b859}@media(max-width:480px){.dc-footer{padding:10px 14px}.dc-header{padding:12px 14px}.dc-body{padding:14px}.dc-edit{margin-left:0}}@media(prefers-reduced-motion:reduce){.dc-body-wrap,.dc-chevron svg{transition:none}}\n"]
 		}]
 	}],
 	propDecorators: {
@@ -33721,6 +34669,14 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		footerBackground: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "footerBackground",
+				required: false
+			}]
+		}],
 		textColor: [{
 			type: i0.Input,
 			args: [{
@@ -33951,6 +34907,697 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
+var BoardCardDirective = class BoardCardDirective {
+	constructor() {
+		this.template = inject(TemplateRef);
+	}
+	static ngTemplateContextGuard(_dir, _ctx) {
+		return true;
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: BoardCardDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: BoardCardDirective,
+			isStandalone: true,
+			selector: "ng-template[uiBoardCard]",
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: BoardCardDirective,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "ng-template[uiBoardCard]",
+			standalone: true
+		}]
+	}]
+});
+const DOT_COLORS = {
+	blue: "#3b82f6",
+	cyan: "#06b6d4",
+	green: "#22c55e",
+	teal: "#14b8a6",
+	amber: "#f59e0b",
+	orange: "#f97316",
+	red: "#ef4444",
+	pink: "#ec4899",
+	slate: "#64748b",
+	gray: "#6b7280"
+};
+var BoardComponent = class BoardComponent {
+	constructor() {
+		this.columns = input.required(...ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []);
+		this.itemKey = input.required(...ngDevMode ? [{ debugName: "itemKey" }] : /* istanbul ignore next */ []);
+		this.itemLabel = input.required(...ngDevMode ? [{ debugName: "itemLabel" }] : /* istanbul ignore next */ []);
+		this.cardActions = input([], ...ngDevMode ? [{ debugName: "cardActions" }] : /* istanbul ignore next */ []);
+		this.loading = input(false, ...ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []);
+		this.error = input(null, ...ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []);
+		this.readOnly = input(false, ...ngDevMode ? [{ debugName: "readOnly" }] : /* istanbul ignore next */ []);
+		this.moveDisabled = input(false, ...ngDevMode ? [{ debugName: "moveDisabled" }] : /* istanbul ignore next */ []);
+		this.canMove = input(null, ...ngDevMode ? [{ debugName: "canMove" }] : /* istanbul ignore next */ []);
+		this.ariaLabel = input("Board", ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+		this.emptyMessage = input("Nothing to show.", ...ngDevMode ? [{ debugName: "emptyMessage" }] : /* istanbul ignore next */ []);
+		this.emptyColumnText = input("Nothing here yet", ...ngDevMode ? [{ debugName: "emptyColumnText" }] : /* istanbul ignore next */ []);
+		this.itemNoun = input("item", ...ngDevMode ? [{ debugName: "itemNoun" }] : /* istanbul ignore next */ []);
+		this.itemNounPlural = input("items", ...ngDevMode ? [{ debugName: "itemNounPlural" }] : /* istanbul ignore next */ []);
+		this.retryLabel = input("Retry", ...ngDevMode ? [{ debugName: "retryLabel" }] : /* istanbul ignore next */ []);
+		this.cardClick = output();
+		this.cardAction = output();
+		this.itemMove = output();
+		this.retry = output();
+		this.card = contentChild(BoardCardDirective, ...ngDevMode ? [{ debugName: "card" }] : /* istanbul ignore next */ []);
+		this.cols = linkedSignal(() => this.columns(), ...ngDevMode ? [{ debugName: "cols" }] : /* istanbul ignore next */ []);
+		this.overKey = signal(null, ...ngDevMode ? [{ debugName: "overKey" }] : /* istanbul ignore next */ []);
+		this.draggingKey = signal(null, ...ngDevMode ? [{ debugName: "draggingKey" }] : /* istanbul ignore next */ []);
+		this.announcement = signal("", ...ngDevMode ? [{ debugName: "announcement" }] : /* istanbul ignore next */ []);
+		this.host = inject(ElementRef);
+		this.drag = null;
+		this.skeletonColumns = computed(() => Array.from({ length: Math.max(this.columns().length, 4) }, (_, i) => i), ...ngDevMode ? [{ debugName: "skeletonColumns" }] : /* istanbul ignore next */ []);
+		this.canDrag = computed(() => !this.readOnly() && !this.moveDisabled(), ...ngDevMode ? [{ debugName: "canDrag" }] : /* istanbul ignore next */ []);
+		this.canMoveAny = this.canDrag;
+	}
+	dot(color) {
+		return color && DOT_COLORS[color] || color || "#3b82f6";
+	}
+	onDragStart(event, item, col) {
+		if (!this.canDrag()) {
+			event.preventDefault();
+			return;
+		}
+		this.drag = {
+			item,
+			from: col.key
+		};
+		this.draggingKey.set(this.itemKey()(item));
+		if (event.dataTransfer) {
+			event.dataTransfer.effectAllowed = "move";
+			event.dataTransfer.setData("text/plain", this.itemKey()(item));
+		}
+	}
+	onDragEnd() {
+		this.drag = null;
+		this.draggingKey.set(null);
+		this.overKey.set(null);
+	}
+	onDragOver(event, col) {
+		if (!this.drag || !this.accepts(this.drag.item, this.drag.from, col)) {
+			if (event.dataTransfer) event.dataTransfer.dropEffect = "none";
+			return;
+		}
+		event.preventDefault();
+		if (event.dataTransfer) event.dataTransfer.dropEffect = "move";
+		if (this.overKey() !== col.key) this.overKey.set(col.key);
+	}
+	onDragLeave(event, col) {
+		const related = event.relatedTarget;
+		if ((!related || !event.currentTarget.contains(related)) && this.overKey() === col.key) this.overKey.set(null);
+	}
+	onDrop(event, col) {
+		event.preventDefault();
+		const drag = this.drag;
+		this.onDragEnd();
+		if (drag && this.accepts(drag.item, drag.from, col)) this.move(drag.item, drag.from, col.key);
+	}
+	onCardKey(event, item, col) {
+		if (event.target !== event.currentTarget) return;
+		if (event.key === "Enter" || event.key === " ") {
+			event.preventDefault();
+			this.cardClick.emit(item);
+			return;
+		}
+		if (!event.shiftKey || event.key !== "ArrowLeft" && event.key !== "ArrowRight") return;
+		event.preventDefault();
+		if (!this.canDrag()) return;
+		const cols = this.cols();
+		const step = event.key === "ArrowRight" ? 1 : -1;
+		for (let i = cols.findIndex((c) => c.key === col.key) + step; i >= 0 && i < cols.length; i += step) if (this.accepts(item, col.key, cols[i])) {
+			this.move(item, col.key, cols[i].key);
+			this.announcement.set(`${this.itemLabel()(item)} moved to ${cols[i].label}`);
+			const key = this.itemKey()(item);
+			setTimeout(() => {
+				const cards = this.host.nativeElement.querySelectorAll(".ub-card");
+				Array.from(cards).find((c) => c.dataset["boardKey"] === key)?.focus();
+			});
+			return;
+		}
+	}
+	accepts(item, from, to) {
+		if (from === to.key || to.dropDisabled || this.moveDisabled() || this.readOnly()) return false;
+		const rule = this.canMove();
+		return !rule || rule(item, from, to.key);
+	}
+	move(item, from, to) {
+		const before = this.cols();
+		const key = this.itemKey()(item);
+		this.cols.set(before.map((c) => {
+			if (c.key === from) return {
+				...c,
+				items: c.items.filter((i) => this.itemKey()(i) !== key)
+			};
+			if (c.key === to) return {
+				...c,
+				items: [item, ...c.items]
+			};
+			return c;
+		}));
+		this.itemMove.emit({
+			item,
+			from,
+			to,
+			revert: () => this.cols.set(before)
+		});
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: BoardComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.2",
+			type: BoardComponent,
+			isStandalone: true,
+			selector: "ui-board",
+			inputs: {
+				columns: {
+					classPropertyName: "columns",
+					publicName: "columns",
+					isSignal: true,
+					isRequired: true,
+					transformFunction: null
+				},
+				itemKey: {
+					classPropertyName: "itemKey",
+					publicName: "itemKey",
+					isSignal: true,
+					isRequired: true,
+					transformFunction: null
+				},
+				itemLabel: {
+					classPropertyName: "itemLabel",
+					publicName: "itemLabel",
+					isSignal: true,
+					isRequired: true,
+					transformFunction: null
+				},
+				cardActions: {
+					classPropertyName: "cardActions",
+					publicName: "cardActions",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				loading: {
+					classPropertyName: "loading",
+					publicName: "loading",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				error: {
+					classPropertyName: "error",
+					publicName: "error",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				readOnly: {
+					classPropertyName: "readOnly",
+					publicName: "readOnly",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				moveDisabled: {
+					classPropertyName: "moveDisabled",
+					publicName: "moveDisabled",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				canMove: {
+					classPropertyName: "canMove",
+					publicName: "canMove",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				ariaLabel: {
+					classPropertyName: "ariaLabel",
+					publicName: "ariaLabel",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				emptyMessage: {
+					classPropertyName: "emptyMessage",
+					publicName: "emptyMessage",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				emptyColumnText: {
+					classPropertyName: "emptyColumnText",
+					publicName: "emptyColumnText",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				itemNoun: {
+					classPropertyName: "itemNoun",
+					publicName: "itemNoun",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				itemNounPlural: {
+					classPropertyName: "itemNounPlural",
+					publicName: "itemNounPlural",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				retryLabel: {
+					classPropertyName: "retryLabel",
+					publicName: "retryLabel",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			outputs: {
+				cardClick: "cardClick",
+				cardAction: "cardAction",
+				itemMove: "itemMove",
+				retry: "retry"
+			},
+			queries: [{
+				propertyName: "card",
+				first: true,
+				predicate: BoardCardDirective,
+				descendants: true,
+				isSignal: true
+			}],
+			ngImport: i0,
+			template: `
+    <!-- The card's "⋮" menu. Place it in the card's top row: <ng-container [ngTemplateOutlet]="menu" [ngTemplateOutletContext]="{ $implicit: item }" /> -->
+    <ng-template #menuTpl let-item>
+      @if (cardActions().length) {
+        <div class="ub-card__top-right" (click)="$event.stopPropagation()" (keydown)="$event.stopPropagation()">
+          <ui-more-menu [actions]="cardActions()" [ariaLabel]="'Actions for ' + itemLabel()(item)"
+                        (actionClick)="cardAction.emit({ type: $event, item })" />
+        </div>
+      }
+    </ng-template>
+    <div class="ub-wrap">
+      @if (loading()) {
+        <div class="ub-skeleton" role="status" [attr.aria-label]="'Loading ' + ariaLabel()">
+          @for (n of skeletonColumns(); track n) {
+            <div class="ub-col-skeleton" aria-hidden="true">
+              <div class="ub-col-skeleton__header"></div>
+              @for (c of [1, 2, 3]; track c) { <div class="ub-col-skeleton__card"></div> }
+            </div>
+          }
+        </div>
+      } @else if (error()) {
+        <div class="ub-message" role="alert">
+          <p>{{ error() }}</p>
+          <ui-button variant="secondary" size="sm" (click)="retry.emit()">{{ retryLabel() }}</ui-button>
+        </div>
+      } @else if (cols().length === 0) {
+        <div class="ub-message" role="status"><p>{{ emptyMessage() }}</p></div>
+      } @else {
+        <div class="ub-board" role="region" [attr.aria-label]="ariaLabel()">
+          @for (col of cols(); track col.key) {
+            <div class="ub-col"
+                 [class.ub-col--over]="overKey() === col.key"
+                 [class.ub-col--success]="col.tone === 'success'"
+                 role="group"
+                 [attr.aria-label]="col.label + ' — ' + col.items.length + ' ' + (col.items.length === 1 ? itemNoun() : itemNounPlural())"
+                 (dragover)="onDragOver($event, col)"
+                 (dragleave)="onDragLeave($event, col)"
+                 (drop)="onDrop($event, col)">
+              <div class="ub-col__header">
+                <div class="ub-col__title">
+                  <span class="ub-col__dot" [style.background]="dot(col.color)" aria-hidden="true"></span>
+                  <span class="ub-col__label">{{ col.label }}</span>
+                  <span class="ub-col__count" aria-hidden="true">{{ col.items.length }}</span>
+                </div>
+                @if (col.summary) {
+                  <div class="ub-col__summary" [attr.aria-label]="col.summaryLabel || col.summary">{{ col.summary }}</div>
+                }
+              </div>
+              <div class="ub-col__cards" role="list">
+                @for (item of col.items; track itemKey()(item)) {
+                  <div class="ub-card"
+                       [class.ub-card--success]="col.tone === 'success'"
+                       [class.ub-card--dragging]="draggingKey() === itemKey()(item)"
+                       role="listitem"
+                       tabindex="0"
+                       [attr.data-board-key]="itemKey()(item)"
+                       [attr.aria-label]="itemLabel()(item)"
+                       [attr.aria-keyshortcuts]="canMoveAny() ? 'Shift+ArrowLeft Shift+ArrowRight' : null"
+                       [attr.draggable]="canDrag() ? 'true' : null"
+                       (dragstart)="onDragStart($event, item, col)"
+                       (dragend)="onDragEnd()"
+                       (click)="cardClick.emit(item)"
+                       (keydown)="onCardKey($event, item, col)">
+                    @if (card(); as tpl) {
+                      <ng-container [ngTemplateOutlet]="tpl.template" [ngTemplateOutletContext]="{ $implicit: item, column: col, menu: menuTpl }" />
+                    }
+                  </div>
+                }
+                @if (col.items.length === 0) {
+                  <div class="ub-col__empty" role="status">{{ col.emptyText || emptyColumnText() }}</div>
+                }
+              </div>
+            </div>
+          }
+        </div>
+        <div class="ub-sr-only" role="status" aria-live="polite">{{ announcement() }}</div>
+      }
+    </div>
+  `,
+			isInline: true,
+			styles: ["ui-board{display:flex;flex-direction:column;flex:1;min-height:0}.ub-wrap{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}.ub-board{display:flex;gap:12px;padding:0 0 16px;overflow-x:auto;overflow-y:hidden;height:100%;align-items:flex-start}.ub-board::-webkit-scrollbar{height:6px}.ub-board::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.ub-board::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.ub-col{flex:0 0 280px;min-width:280px;max-width:280px;display:flex;flex-direction:column;background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:10px;max-height:calc(100vh - 200px);transition:border-color .15s,background .15s}.ub-col--over{border-color:#3b82f6;background:#eff6ff}.ub-col--success{background:#f0fdf4;border-color:#bbf7d0}.ub-col--success.ub-col--over{border-color:#22c55e;background:#dcfce7}.ub-col__header{padding:12px 14px 10px;border-bottom:1px solid #e2e8f0;flex-shrink:0}.ub-col__title{display:flex;align-items:center;gap:7px;margin-bottom:2px}.ub-col__dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}.ub-col__label{font-size:12px;font-weight:700;color:#374151;text-transform:uppercase;letter-spacing:.04em;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ub-col__count{font-size:11px;font-weight:600;color:#fff;background:#94a3b8;border-radius:10px;padding:1px 7px;flex-shrink:0}.ub-col__summary{font-size:11px;color:#64748b;font-weight:500;margin-top:2px}.ub-col__cards{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:60px}.ub-col__cards::-webkit-scrollbar{width:4px}.ub-col__cards::-webkit-scrollbar-track{background:transparent}.ub-col__cards::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:2px}.ub-col__empty{text-align:center;padding:24px 12px;color:#94a3b8;font-size:12px;border:1.5px dashed #e2e8f0;border-radius:8px;margin:4px 0}.ub-card{position:relative;background:#fff;border:1.5px solid #e2e8f0;border-radius:8px;padding:11px 12px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:box-shadow .12s,border-color .12s,opacity .12s,transform .12s}.ub-card[draggable=true]{cursor:grab}.ub-card[draggable=true]:active{cursor:grabbing}.ub-card:hover{border-color:#94a3b8;box-shadow:0 2px 8px #00000012}.ub-card:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.ub-card--dragging{opacity:.4;transform:scale(.98);box-shadow:none}.ub-card--success{border-left:3px solid #22c55e}.ub-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:4px}.ub-card__title{font-size:13px;font-weight:600;color:#1e293b;line-height:1.35;flex:1;min-width:0;word-break:break-word}.ub-card:hover .ub-card__title{color:#2563eb}.ub-card__top-right{flex-shrink:0;margin-top:-2px}.ub-card__status-row{margin-bottom:5px}.ub-card__contact{font-size:12px;color:#475569;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ub-card__property{font-size:11px;color:#94a3b8;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ub-card__next-step{display:flex;align-items:flex-start;gap:4px;font-size:11px;color:#64748b;margin-bottom:6px;line-height:1.4}.ub-card__next-step svg{flex-shrink:0;margin-top:1px;color:#94a3b8}.ub-card__footer{display:flex;align-items:center;justify-content:space-between;margin-top:6px;padding-top:6px;border-top:1px solid #f1f5f9}.ub-card__value{font-size:12px;font-weight:700;color:#0f172a}.ub-card__activity{font-size:11px;color:#94a3b8}.ub-card__activity--stale{color:#d97706;font-weight:600}.ub-skeleton{display:flex;gap:12px;padding-bottom:16px}.ub-col-skeleton{flex:0 0 280px;background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:10px}.ub-col-skeleton__header,.ub-col-skeleton__card{background:linear-gradient(90deg,#e2e8f0 25%,#f1f5f9,#e2e8f0 75%);background-size:200% 100%;animation:ub-shimmer 1.4s infinite}.ub-col-skeleton__header{height:32px;border-radius:6px}.ub-col-skeleton__card{height:90px;border-radius:8px}@keyframes ub-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media(prefers-reduced-motion:reduce){.ub-col-skeleton__header,.ub-col-skeleton__card{animation:none}}.ub-message{display:flex;flex-direction:column;align-items:center;gap:12px;padding:48px;color:#64748b;font-size:14px;text-align:center}.ub-message p{margin:0}.ub-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(max-width:640px){.ub-board{flex-direction:column;overflow-x:hidden;overflow-y:auto;height:auto;align-items:stretch}.ub-col{flex:none;min-width:0;max-width:100%;width:100%;max-height:none}.ub-skeleton{flex-direction:column}.ub-col-skeleton{flex:none;width:100%}}\n"],
+			dependencies: [
+				{
+					kind: "directive",
+					type: NgTemplateOutlet,
+					selector: "[ngTemplateOutlet]",
+					inputs: [
+						"ngTemplateOutletContext",
+						"ngTemplateOutlet",
+						"ngTemplateOutletInjector"
+					]
+				},
+				{
+					kind: "component",
+					type: ButtonComponent,
+					selector: "ui-button",
+					inputs: [
+						"variant",
+						"routerLink",
+						"queryParams",
+						"fragment",
+						"state",
+						"href",
+						"target",
+						"rel",
+						"shortLabel",
+						"shortBelow",
+						"color",
+						"active",
+						"size",
+						"type",
+						"disabled",
+						"loading",
+						"fullWidth",
+						"ariaLabel",
+						"ariaExpanded",
+						"ariaPressed",
+						"ariaDescribedBy",
+						"modal-footer-left",
+						"modal-footer-right"
+					]
+				},
+				{
+					kind: "component",
+					type: MoreMenuComponent,
+					selector: "ui-more-menu",
+					inputs: ["ariaLabel", "actions"],
+					outputs: ["actionClick"]
+				}
+			],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush,
+			encapsulation: i0.ViewEncapsulation.None
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: BoardComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-board",
+			standalone: true,
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			imports: [
+				NgTemplateOutlet,
+				ButtonComponent,
+				MoreMenuComponent
+			],
+			template: `
+    <!-- The card's "⋮" menu. Place it in the card's top row: <ng-container [ngTemplateOutlet]="menu" [ngTemplateOutletContext]="{ $implicit: item }" /> -->
+    <ng-template #menuTpl let-item>
+      @if (cardActions().length) {
+        <div class="ub-card__top-right" (click)="$event.stopPropagation()" (keydown)="$event.stopPropagation()">
+          <ui-more-menu [actions]="cardActions()" [ariaLabel]="'Actions for ' + itemLabel()(item)"
+                        (actionClick)="cardAction.emit({ type: $event, item })" />
+        </div>
+      }
+    </ng-template>
+    <div class="ub-wrap">
+      @if (loading()) {
+        <div class="ub-skeleton" role="status" [attr.aria-label]="'Loading ' + ariaLabel()">
+          @for (n of skeletonColumns(); track n) {
+            <div class="ub-col-skeleton" aria-hidden="true">
+              <div class="ub-col-skeleton__header"></div>
+              @for (c of [1, 2, 3]; track c) { <div class="ub-col-skeleton__card"></div> }
+            </div>
+          }
+        </div>
+      } @else if (error()) {
+        <div class="ub-message" role="alert">
+          <p>{{ error() }}</p>
+          <ui-button variant="secondary" size="sm" (click)="retry.emit()">{{ retryLabel() }}</ui-button>
+        </div>
+      } @else if (cols().length === 0) {
+        <div class="ub-message" role="status"><p>{{ emptyMessage() }}</p></div>
+      } @else {
+        <div class="ub-board" role="region" [attr.aria-label]="ariaLabel()">
+          @for (col of cols(); track col.key) {
+            <div class="ub-col"
+                 [class.ub-col--over]="overKey() === col.key"
+                 [class.ub-col--success]="col.tone === 'success'"
+                 role="group"
+                 [attr.aria-label]="col.label + ' — ' + col.items.length + ' ' + (col.items.length === 1 ? itemNoun() : itemNounPlural())"
+                 (dragover)="onDragOver($event, col)"
+                 (dragleave)="onDragLeave($event, col)"
+                 (drop)="onDrop($event, col)">
+              <div class="ub-col__header">
+                <div class="ub-col__title">
+                  <span class="ub-col__dot" [style.background]="dot(col.color)" aria-hidden="true"></span>
+                  <span class="ub-col__label">{{ col.label }}</span>
+                  <span class="ub-col__count" aria-hidden="true">{{ col.items.length }}</span>
+                </div>
+                @if (col.summary) {
+                  <div class="ub-col__summary" [attr.aria-label]="col.summaryLabel || col.summary">{{ col.summary }}</div>
+                }
+              </div>
+              <div class="ub-col__cards" role="list">
+                @for (item of col.items; track itemKey()(item)) {
+                  <div class="ub-card"
+                       [class.ub-card--success]="col.tone === 'success'"
+                       [class.ub-card--dragging]="draggingKey() === itemKey()(item)"
+                       role="listitem"
+                       tabindex="0"
+                       [attr.data-board-key]="itemKey()(item)"
+                       [attr.aria-label]="itemLabel()(item)"
+                       [attr.aria-keyshortcuts]="canMoveAny() ? 'Shift+ArrowLeft Shift+ArrowRight' : null"
+                       [attr.draggable]="canDrag() ? 'true' : null"
+                       (dragstart)="onDragStart($event, item, col)"
+                       (dragend)="onDragEnd()"
+                       (click)="cardClick.emit(item)"
+                       (keydown)="onCardKey($event, item, col)">
+                    @if (card(); as tpl) {
+                      <ng-container [ngTemplateOutlet]="tpl.template" [ngTemplateOutletContext]="{ $implicit: item, column: col, menu: menuTpl }" />
+                    }
+                  </div>
+                }
+                @if (col.items.length === 0) {
+                  <div class="ub-col__empty" role="status">{{ col.emptyText || emptyColumnText() }}</div>
+                }
+              </div>
+            </div>
+          }
+        </div>
+        <div class="ub-sr-only" role="status" aria-live="polite">{{ announcement() }}</div>
+      }
+    </div>
+  `,
+			styles: ["ui-board{display:flex;flex-direction:column;flex:1;min-height:0}.ub-wrap{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}.ub-board{display:flex;gap:12px;padding:0 0 16px;overflow-x:auto;overflow-y:hidden;height:100%;align-items:flex-start}.ub-board::-webkit-scrollbar{height:6px}.ub-board::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.ub-board::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.ub-col{flex:0 0 280px;min-width:280px;max-width:280px;display:flex;flex-direction:column;background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:10px;max-height:calc(100vh - 200px);transition:border-color .15s,background .15s}.ub-col--over{border-color:#3b82f6;background:#eff6ff}.ub-col--success{background:#f0fdf4;border-color:#bbf7d0}.ub-col--success.ub-col--over{border-color:#22c55e;background:#dcfce7}.ub-col__header{padding:12px 14px 10px;border-bottom:1px solid #e2e8f0;flex-shrink:0}.ub-col__title{display:flex;align-items:center;gap:7px;margin-bottom:2px}.ub-col__dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}.ub-col__label{font-size:12px;font-weight:700;color:#374151;text-transform:uppercase;letter-spacing:.04em;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ub-col__count{font-size:11px;font-weight:600;color:#fff;background:#94a3b8;border-radius:10px;padding:1px 7px;flex-shrink:0}.ub-col__summary{font-size:11px;color:#64748b;font-weight:500;margin-top:2px}.ub-col__cards{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:60px}.ub-col__cards::-webkit-scrollbar{width:4px}.ub-col__cards::-webkit-scrollbar-track{background:transparent}.ub-col__cards::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:2px}.ub-col__empty{text-align:center;padding:24px 12px;color:#94a3b8;font-size:12px;border:1.5px dashed #e2e8f0;border-radius:8px;margin:4px 0}.ub-card{position:relative;background:#fff;border:1.5px solid #e2e8f0;border-radius:8px;padding:11px 12px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:box-shadow .12s,border-color .12s,opacity .12s,transform .12s}.ub-card[draggable=true]{cursor:grab}.ub-card[draggable=true]:active{cursor:grabbing}.ub-card:hover{border-color:#94a3b8;box-shadow:0 2px 8px #00000012}.ub-card:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.ub-card--dragging{opacity:.4;transform:scale(.98);box-shadow:none}.ub-card--success{border-left:3px solid #22c55e}.ub-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:4px}.ub-card__title{font-size:13px;font-weight:600;color:#1e293b;line-height:1.35;flex:1;min-width:0;word-break:break-word}.ub-card:hover .ub-card__title{color:#2563eb}.ub-card__top-right{flex-shrink:0;margin-top:-2px}.ub-card__status-row{margin-bottom:5px}.ub-card__contact{font-size:12px;color:#475569;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ub-card__property{font-size:11px;color:#94a3b8;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ub-card__next-step{display:flex;align-items:flex-start;gap:4px;font-size:11px;color:#64748b;margin-bottom:6px;line-height:1.4}.ub-card__next-step svg{flex-shrink:0;margin-top:1px;color:#94a3b8}.ub-card__footer{display:flex;align-items:center;justify-content:space-between;margin-top:6px;padding-top:6px;border-top:1px solid #f1f5f9}.ub-card__value{font-size:12px;font-weight:700;color:#0f172a}.ub-card__activity{font-size:11px;color:#94a3b8}.ub-card__activity--stale{color:#d97706;font-weight:600}.ub-skeleton{display:flex;gap:12px;padding-bottom:16px}.ub-col-skeleton{flex:0 0 280px;background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:10px}.ub-col-skeleton__header,.ub-col-skeleton__card{background:linear-gradient(90deg,#e2e8f0 25%,#f1f5f9,#e2e8f0 75%);background-size:200% 100%;animation:ub-shimmer 1.4s infinite}.ub-col-skeleton__header{height:32px;border-radius:6px}.ub-col-skeleton__card{height:90px;border-radius:8px}@keyframes ub-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media(prefers-reduced-motion:reduce){.ub-col-skeleton__header,.ub-col-skeleton__card{animation:none}}.ub-message{display:flex;flex-direction:column;align-items:center;gap:12px;padding:48px;color:#64748b;font-size:14px;text-align:center}.ub-message p{margin:0}.ub-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(max-width:640px){.ub-board{flex-direction:column;overflow-x:hidden;overflow-y:auto;height:auto;align-items:stretch}.ub-col{flex:none;min-width:0;max-width:100%;width:100%;max-height:none}.ub-skeleton{flex-direction:column}.ub-col-skeleton{flex:none;width:100%}}\n"]
+		}]
+	}],
+	propDecorators: {
+		columns: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "columns",
+				required: true
+			}]
+		}],
+		itemKey: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "itemKey",
+				required: true
+			}]
+		}],
+		itemLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "itemLabel",
+				required: true
+			}]
+		}],
+		cardActions: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "cardActions",
+				required: false
+			}]
+		}],
+		loading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "loading",
+				required: false
+			}]
+		}],
+		error: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "error",
+				required: false
+			}]
+		}],
+		readOnly: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "readOnly",
+				required: false
+			}]
+		}],
+		moveDisabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "moveDisabled",
+				required: false
+			}]
+		}],
+		canMove: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "canMove",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}],
+		emptyMessage: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "emptyMessage",
+				required: false
+			}]
+		}],
+		emptyColumnText: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "emptyColumnText",
+				required: false
+			}]
+		}],
+		itemNoun: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "itemNoun",
+				required: false
+			}]
+		}],
+		itemNounPlural: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "itemNounPlural",
+				required: false
+			}]
+		}],
+		retryLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "retryLabel",
+				required: false
+			}]
+		}],
+		cardClick: [{
+			type: i0.Output,
+			args: ["cardClick"]
+		}],
+		cardAction: [{
+			type: i0.Output,
+			args: ["cardAction"]
+		}],
+		itemMove: [{
+			type: i0.Output,
+			args: ["itemMove"]
+		}],
+		retry: [{
+			type: i0.Output,
+			args: ["retry"]
+		}],
+		card: [{
+			type: i0.ContentChild,
+			args: [i0.forwardRef(() => BoardCardDirective), { isSignal: true }]
+		}]
+	}
+});
 let nextId = 0;
 var ReadonlyFieldsetComponent = class ReadonlyFieldsetComponent {
 	constructor() {
@@ -37781,6 +39428,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { ActionBarComponent, AlertComponent, AppShellComponent, AudioPlayerComponent, AvatarComponent, BADGE_VARIANT_STYLES, BadgeComponent, BarRowComponent, BulkMessagePanelComponent, BusinessHoursComponent, ButtonComponent, CalendarComponent, CheckboxComponent, CheckboxTrailingDirective, ChipComponent, ChipGroupComponent, ColorInputComponent, ColumnFilterComponent, ColumnsComponent, ComboboxComponent, ConfirmOutletComponent, ConfirmService, ContactPickerComponent, DEFAULT_PASSWORD_RULES, DROPDOWN_GROUP, DataTableComponent, DateInputComponent, DateRangePickerComponent, DatetimeInputComponent, DetailCardComponent, DiscountSelectorComponent, DividerComponent, DropdownComponent, EmptyStateComponent, ErrorComponent, ErrorStateComponent, FORGEROUTE_CONFIG, FadeComponent, FileInputComponent, FormColSpanDirective, FormComponent, FormRowComponent, FormSectionComponent, HintComponent, IconComponent, ImageComponent, ImageGalleryComponent, ImageGalleryDialogComponent, ImagePreviewComponent, ImageRepositionComponent, ImportExportComponent, KpiCardComponent, LAYOUT_GAP_PX, ListComponent, ListItemComponent, LiveRegionComponent, ModalComponent, MoreMenuComponent, MultiSelectComponent, PHONE_NUMBER_AREA_CODE_LENGTH, PHONE_NUMBER_ZIP_LENGTH, PageComponent, PaginationComponent, PanelInfoListComponent, PasswordRequirementsComponent, PdfHotspotComponent, PhoneNumberPickerComponent, PillTabsComponent, ProgressBarComponent, ProgressRingComponent, QrCodeComponent, QuickFilterTabsComponent, RICH_TEXT_OPTIONS, RadioComponent, RadioGroupComponent, RadioMatrixComponent, RadioOptionContentDirective, ReadonlyFieldsetComponent, RichTextEditorComponent, SEMANTIC_BADGE_MAP, SearchInputComponent, SectionHeaderComponent, SelectComponent, ShowComponent, SidePanelComponent, SignaturePadComponent, SkeletonComponent, StackComponent, StarComponent, StepperComponent, TableToolbarComponent, TextComponent, TextInputComponent, TextareaInputComponent, TimeInputComponent, TimelineComponent, ToastComponent, ToastService, ToggleBadgeComponent, ToggleComponent, TooltipDirective, US_STATES, UiFieldValidity, acceptLabel, appShellGroupsStorageKey, autoVariant, buildDefaultSchedule, builtInActionIcon, businessTimeOptions, createFieldReveal, decodeFilterValues, digitsOnly, downloadBlob, encodeFilterValue, encodeFilterValues, errorContextInterceptor, fileMatchesAccept, formatAddress, formatCurrency, formatFileSize, formatIsoDate, formatIsoDateTime, formatTime, getEligibleIds, getEligibleOptions, getErrorMessage, humanReadableMessage, iconPath, isoKey, issueToErrors, maxLengthIssue, normalizeHexColor, parseBizHours, parseIso, parseTime, passwordMeetsRules, pluralize, provideForgerouteToast, reorderItems, requiredIssue, resolveLayoutGap, resolvePreset, serializeBizHours };
+export { ActionBarComponent, AlertComponent, AppShellComponent, AudioPlayerComponent, AvatarComponent, BADGE_VARIANT_STYLES, BadgeComponent, BarRowComponent, BoardCardDirective, BoardComponent, BulkMessagePanelComponent, BusinessHoursComponent, ButtonComponent, CalendarComponent, CardListItemComponent, CheckboxComponent, CheckboxTrailingDirective, ChipComponent, ChipGroupComponent, ColorInputComponent, ColumnFilterComponent, ColumnsComponent, ComboboxComponent, ConfirmOutletComponent, ConfirmService, ContactPickerComponent, DEFAULT_PASSWORD_RULES, DROPDOWN_GROUP, DataTableComponent, DateInputComponent, DateRangePickerComponent, DatetimeInputComponent, DetailCardComponent, DiscountSelectorComponent, DividerComponent, DropdownComponent, EmptyStateComponent, ErrorComponent, ErrorStateComponent, FORGEROUTE_CONFIG, FadeComponent, FileInputComponent, FormColSpanDirective, FormComponent, FormRowComponent, FormSectionComponent, HintComponent, IconComponent, ImageComponent, ImageGalleryComponent, ImageGalleryDialogComponent, ImagePreviewComponent, ImageRepositionComponent, ImportExportComponent, KpiCardComponent, LAYOUT_GAP_PX, ListComponent, ListItemComponent, LiveRegionComponent, ModalComponent, MoreMenuComponent, MultiSelectComponent, NotesComponent, PHONE_NUMBER_AREA_CODE_LENGTH, PHONE_NUMBER_ZIP_LENGTH, PageComponent, PaginationComponent, PanelInfoListComponent, PasswordRequirementsComponent, PdfHotspotComponent, PhoneNumberPickerComponent, PillTabsComponent, ProgressBarComponent, ProgressRingComponent, QrCodeComponent, QuickFilterTabsComponent, RICH_TEXT_OPTIONS, RadioComponent, RadioGroupComponent, RadioMatrixComponent, RadioOptionContentDirective, ReadonlyFieldsetComponent, RichTextEditorComponent, SEMANTIC_BADGE_MAP, SearchInputComponent, SectionHeaderComponent, SelectComponent, ShowComponent, SidePanelComponent, SignaturePadComponent, SkeletonComponent, StackComponent, StarComponent, StepperComponent, TableToolbarComponent, TextComponent, TextInputComponent, TextareaInputComponent, TimeInputComponent, TimelineComponent, ToastComponent, ToastService, ToggleBadgeComponent, ToggleComponent, TooltipDirective, US_STATES, UiFieldValidity, acceptLabel, appShellGroupsStorageKey, autoVariant, buildDefaultSchedule, builtInActionIcon, businessTimeOptions, createFieldReveal, decodeFilterValues, digitsOnly, downloadBlob, encodeFilterValue, encodeFilterValues, errorContextInterceptor, fileMatchesAccept, formatAddress, formatCurrency, formatFileSize, formatIsoDate, formatIsoDateTime, formatTime, getEligibleIds, getEligibleOptions, getErrorMessage, humanReadableMessage, iconPath, isoKey, issueToErrors, maxLengthIssue, normalizeHexColor, parseBizHours, parseIso, parseTime, passwordMeetsRules, pluralize, provideForgerouteToast, reorderItems, requiredIssue, resolveLayoutGap, resolvePreset, serializeBizHours };
 
 //# sourceMappingURL=forgeroute-ui.mjs.map