@forgeroute/ui 0.4.14 → 0.4.16

package/fesm2022/forgeroute-ui.mjs

@@ -826,7 +826,7 @@ var QuickFilterTabsComponent = class QuickFilterTabsComponent {
     </div>
   `,
 			isInline: true,
-			styles: [":host{display:block;min-width:0}.tabs-outer{position:relative;display:inline-flex;align-items:center}.tabs{display:flex;align-items:center;gap:2px;background:#f1f5f9;border-radius:8px;padding:3px;overflow-x:auto;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:6px;border:none;background:transparent;font-size:.8125rem;font-weight:500;color:#64748b;cursor:pointer;font-family:inherit;transition:background .1s,color .1s;white-space:nowrap;flex-shrink:0}.tab:hover{color:#1e293b}.tab.active{background:#fff;color:#1e293b;box-shadow:0 1px 3px #00000014}.tab:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}.tab.tab-disabled{opacity:.45;cursor:default;pointer-events:none}.tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;font-size:.6875rem;font-weight:700;background:#e2e8f0;color:#475569;line-height:1}.active .tab-count,.active-count{background:#1e293b;color:#fff}.more-btn{gap:4px}.more-dropdown{position:absolute;top:calc(100% + 4px);right:0;z-index:100;background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 4px 16px #0000001a;min-width:180px;padding:4px;max-height:260px;overflow-y:auto}.more-option{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 12px;background:none;border:none;cursor:pointer;font-size:.875rem;color:#334155;font-family:inherit;border-radius:5px;transition:background .1s;text-align:left;gap:12px}.more-option:hover{background:#f8fafc}.more-option.more-option-active{background:#f1f5f9;color:#1e293b;font-weight:500}.more-option:focus-visible{outline:2px solid #60a5fa;outline-offset:-2px}.more-option-label{flex:1}.more-option-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;font-size:.6875rem;font-weight:700;line-height:1;background:#e2e8f0;color:#475569}.more-option-active .more-option-count{background:#1e293b;color:#fff}@media(max-width:1024px){.tab{padding:7px 12px}}@media(pointer:coarse){.tab{min-height:44px}}@media(max-width:640px){:host{align-self:flex-start}.tab{padding:10px 12px;font-size:.8125rem;min-height:44px}.more-option{padding:12px 14px}}\n"],
+			styles: [":host{display:block;min-width:0}.tabs-outer{position:relative;display:inline-flex;align-items:center;max-width:100%;min-width:0}.tabs{display:flex;align-items:center;gap:2px;background:#f1f5f9;border-radius:8px;padding:3px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;min-width:0;max-width:100%}.tabs::-webkit-scrollbar{display:none}.tab{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:6px;border:none;background:transparent;font-size:.8125rem;font-weight:500;color:#64748b;cursor:pointer;font-family:inherit;transition:background .1s,color .1s;white-space:nowrap;flex-shrink:0}.tab:hover{color:#1e293b}.tab.active{background:#fff;color:#1e293b;box-shadow:0 1px 3px #00000014}.tab:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}.tab.tab-disabled{opacity:.45;cursor:default;pointer-events:none}.tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;font-size:.6875rem;font-weight:700;background:#e2e8f0;color:#475569;line-height:1}.active .tab-count,.active-count{background:#1e293b;color:#fff}.more-btn{gap:4px}.more-dropdown{position:absolute;top:calc(100% + 4px);right:0;z-index:100;background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 4px 16px #0000001a;min-width:180px;padding:4px;max-height:260px;overflow-y:auto}.more-option{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 12px;background:none;border:none;cursor:pointer;font-size:.875rem;color:#334155;font-family:inherit;border-radius:5px;transition:background .1s;text-align:left;gap:12px}.more-option:hover{background:#f8fafc}.more-option.more-option-active{background:#f1f5f9;color:#1e293b;font-weight:500}.more-option:focus-visible{outline:2px solid #60a5fa;outline-offset:-2px}.more-option-label{flex:1}.more-option-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;font-size:.6875rem;font-weight:700;line-height:1;background:#e2e8f0;color:#475569}.more-option-active .more-option-count{background:#1e293b;color:#fff}@media(max-width:1024px){.tab{padding:7px 12px}}@media(pointer:coarse){.tab{min-height:44px}}@media(max-width:640px){:host{align-self:flex-start;max-width:100%}.tab{padding:10px 12px;font-size:.8125rem;min-height:44px}.more-option{padding:12px 14px}}\n"],
 			dependencies: [{
 				kind: "pipe",
 				type: DecimalPipe,
@@ -916,7 +916,7 @@ i0.ɵɵngDeclareClassMetadata({
       }
     </div>
   `,
-			styles: [":host{display:block;min-width:0}.tabs-outer{position:relative;display:inline-flex;align-items:center}.tabs{display:flex;align-items:center;gap:2px;background:#f1f5f9;border-radius:8px;padding:3px;overflow-x:auto;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:6px;border:none;background:transparent;font-size:.8125rem;font-weight:500;color:#64748b;cursor:pointer;font-family:inherit;transition:background .1s,color .1s;white-space:nowrap;flex-shrink:0}.tab:hover{color:#1e293b}.tab.active{background:#fff;color:#1e293b;box-shadow:0 1px 3px #00000014}.tab:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}.tab.tab-disabled{opacity:.45;cursor:default;pointer-events:none}.tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;font-size:.6875rem;font-weight:700;background:#e2e8f0;color:#475569;line-height:1}.active .tab-count,.active-count{background:#1e293b;color:#fff}.more-btn{gap:4px}.more-dropdown{position:absolute;top:calc(100% + 4px);right:0;z-index:100;background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 4px 16px #0000001a;min-width:180px;padding:4px;max-height:260px;overflow-y:auto}.more-option{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 12px;background:none;border:none;cursor:pointer;font-size:.875rem;color:#334155;font-family:inherit;border-radius:5px;transition:background .1s;text-align:left;gap:12px}.more-option:hover{background:#f8fafc}.more-option.more-option-active{background:#f1f5f9;color:#1e293b;font-weight:500}.more-option:focus-visible{outline:2px solid #60a5fa;outline-offset:-2px}.more-option-label{flex:1}.more-option-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;font-size:.6875rem;font-weight:700;line-height:1;background:#e2e8f0;color:#475569}.more-option-active .more-option-count{background:#1e293b;color:#fff}@media(max-width:1024px){.tab{padding:7px 12px}}@media(pointer:coarse){.tab{min-height:44px}}@media(max-width:640px){:host{align-self:flex-start}.tab{padding:10px 12px;font-size:.8125rem;min-height:44px}.more-option{padding:12px 14px}}\n"]
+			styles: [":host{display:block;min-width:0}.tabs-outer{position:relative;display:inline-flex;align-items:center;max-width:100%;min-width:0}.tabs{display:flex;align-items:center;gap:2px;background:#f1f5f9;border-radius:8px;padding:3px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;min-width:0;max-width:100%}.tabs::-webkit-scrollbar{display:none}.tab{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:6px;border:none;background:transparent;font-size:.8125rem;font-weight:500;color:#64748b;cursor:pointer;font-family:inherit;transition:background .1s,color .1s;white-space:nowrap;flex-shrink:0}.tab:hover{color:#1e293b}.tab.active{background:#fff;color:#1e293b;box-shadow:0 1px 3px #00000014}.tab:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}.tab.tab-disabled{opacity:.45;cursor:default;pointer-events:none}.tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;font-size:.6875rem;font-weight:700;background:#e2e8f0;color:#475569;line-height:1}.active .tab-count,.active-count{background:#1e293b;color:#fff}.more-btn{gap:4px}.more-dropdown{position:absolute;top:calc(100% + 4px);right:0;z-index:100;background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 4px 16px #0000001a;min-width:180px;padding:4px;max-height:260px;overflow-y:auto}.more-option{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 12px;background:none;border:none;cursor:pointer;font-size:.875rem;color:#334155;font-family:inherit;border-radius:5px;transition:background .1s;text-align:left;gap:12px}.more-option:hover{background:#f8fafc}.more-option.more-option-active{background:#f1f5f9;color:#1e293b;font-weight:500}.more-option:focus-visible{outline:2px solid #60a5fa;outline-offset:-2px}.more-option-label{flex:1}.more-option-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;font-size:.6875rem;font-weight:700;line-height:1;background:#e2e8f0;color:#475569}.more-option-active .more-option-count{background:#1e293b;color:#fff}@media(max-width:1024px){.tab{padding:7px 12px}}@media(pointer:coarse){.tab{min-height:44px}}@media(max-width:640px){:host{align-self:flex-start;max-width:100%}.tab{padding:10px 12px;font-size:.8125rem;min-height:44px}.more-option{padding:12px 14px}}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -3912,6 +3912,583 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
+let nextTooltipId = 0;
+var TooltipDirective = class TooltipDirective {
+	constructor() {
+		this.uiTooltip = input("", ...ngDevMode ? [{ debugName: "uiTooltip" }] : /* istanbul ignore next */ []);
+		this.tooltipPosition = input("top", ...ngDevMode ? [{ debugName: "tooltipPosition" }] : /* istanbul ignore next */ []);
+		this.host = inject(ElementRef).nativeElement;
+		this.doc = inject(DOCUMENT);
+		this.bubble = null;
+		this.id = `ui-tooltip-${nextTooltipId++}`;
+		inject(DestroyRef).onDestroy(() => this.hide());
+	}
+	show() {
+		const text = this.uiTooltip();
+		if (!text || this.bubble) return;
+		const el = this.doc.createElement("div");
+		el.id = this.id;
+		el.setAttribute("role", "tooltip");
+		el.textContent = text;
+		Object.assign(el.style, {
+			position: "fixed",
+			zIndex: "10000",
+			maxWidth: "280px",
+			padding: "6px 10px",
+			background: "#0f172a",
+			color: "#fff",
+			fontSize: "0.75rem",
+			lineHeight: "1.4",
+			borderRadius: "6px",
+			boxShadow: "0 4px 12px rgba(15,23,42,.25)",
+			whiteSpace: "pre-line",
+			pointerEvents: "none",
+			visibility: "hidden"
+		});
+		this.doc.body.appendChild(el);
+		this.bubble = el;
+		this.host.setAttribute("aria-describedby", this.id);
+		const r = this.host.getBoundingClientRect();
+		const b = el.getBoundingClientRect();
+		const gap = 6;
+		let top = this.tooltipPosition() === "top" ? r.top - b.height - gap : r.bottom + gap;
+		if (top < 4) top = r.bottom + gap;
+		else if (top + b.height > window.innerHeight - 4) top = r.top - b.height - gap;
+		const left = Math.min(Math.max(4, r.left + r.width / 2 - b.width / 2), window.innerWidth - b.width - 4);
+		el.style.top = `${top}px`;
+		el.style.left = `${left}px`;
+		el.style.visibility = "visible";
+	}
+	hide() {
+		this.bubble?.remove();
+		this.bubble = null;
+		this.host.removeAttribute("aria-describedby");
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: TooltipDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "17.1.0",
+			version: "22.2.2",
+			type: TooltipDirective,
+			isStandalone: true,
+			selector: "[uiTooltip]",
+			inputs: {
+				uiTooltip: {
+					classPropertyName: "uiTooltip",
+					publicName: "uiTooltip",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				tooltipPosition: {
+					classPropertyName: "tooltipPosition",
+					publicName: "tooltipPosition",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			host: { listeners: {
+				"mouseenter": "show()",
+				"mouseleave": "hide()",
+				"focusin": "show()",
+				"focusout": "hide()",
+				"keydown.escape": "hide()",
+				"click": "hide()"
+			} },
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: TooltipDirective,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "[uiTooltip]",
+			standalone: true,
+			host: {
+				"(mouseenter)": "show()",
+				"(mouseleave)": "hide()",
+				"(focusin)": "show()",
+				"(focusout)": "hide()",
+				"(keydown.escape)": "hide()",
+				"(click)": "hide()"
+			}
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		uiTooltip: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "uiTooltip",
+				required: false
+			}]
+		}],
+		tooltipPosition: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tooltipPosition",
+				required: false
+			}]
+		}]
+	}
+});
+const EXTRA_ICONS = {
+	"delete": "M3 6h18 M8 6V4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2 M5 6l1 14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-14 M10 11v6 M14 11v6",
+	"add": "M12 5v14 M5 12h14",
+	"close": "M18 6L6 18 M6 6l12 12",
+	"check": "M20 6L9 17l-5-5",
+	"upload": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4 M17 8l-5-5-5 5 M12 3v12",
+	"image": "M19 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2z M8.5 8.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z M21 15l-5-5L5 21",
+	"chevron-up": "M18 15l-6-6-6 6",
+	"chevron-down": "M6 9l6 6 6-6",
+	"arrow-left": "M19 12H5 M12 19l-7-7 7-7",
+	"bell": "M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9 M13.73 21a2 2 0 0 1-3.46 0",
+	"print": "M6 9V2h12v7 M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2 M6 14h12v8H6z",
+	"shield": "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z",
+	"lock": "M5 11h14a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2z M7 11V7a5 5 0 0 1 10 0v4",
+	"arrow-up": "M12 19V5 M5 12l7-7 7 7",
+	"arrow-down": "M12 5v14 M19 12l-7 7-7-7",
+	"arrow-right": "M5 12h14 M12 5l7 7-7 7",
+	"document": "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z M14 2v6h6 M16 13H8 M16 17H8 M10 9H8",
+	"grip": "M9 5h.01 M15 5h.01 M9 12h.01 M15 12h.01 M9 19h.01 M15 19h.01",
+	"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",
+	"bank": "M3 21h18 M3 10h18 M5 6l7-3 7 3 M4 10v11 M20 10v11 M8 14v3 M12 14v3 M16 14v3"
+};
+function iconPath(name) {
+	return Object.prototype.hasOwnProperty.call(EXTRA_ICONS, name) ? EXTRA_ICONS[name] : builtInActionIcon(name);
+}
+var IconComponent = class IconComponent {
+	constructor() {
+		this.name = input.required(...ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []);
+		this.tooltip = input("", ...ngDevMode ? [{ debugName: "tooltip" }] : /* istanbul ignore next */ []);
+		this.ariaLabel = input("", ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
+		this.size = input(16, ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+		this.variant = input("default", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
+		this.disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
+		this.loading = input(false, ...ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []);
+		this.interactive = input(true, ...ngDevMode ? [{ debugName: "interactive" }] : /* istanbul ignore next */ []);
+		this.iconClick = output();
+		this.accessibleName = computed(() => this.ariaLabel() || this.tooltip(), ...ngDevMode ? [{ debugName: "accessibleName" }] : /* istanbul ignore next */ []);
+		this.path = computed(() => iconPath(this.name()), ...ngDevMode ? [{ debugName: "path" }] : /* istanbul ignore next */ []);
+	}
+	onClick(event) {
+		event.stopPropagation();
+		this.iconClick.emit(event);
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: IconComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.2",
+			type: IconComponent,
+			isStandalone: true,
+			selector: "ui-icon",
+			inputs: {
+				name: {
+					classPropertyName: "name",
+					publicName: "name",
+					isSignal: true,
+					isRequired: true,
+					transformFunction: null
+				},
+				tooltip: {
+					classPropertyName: "tooltip",
+					publicName: "tooltip",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				ariaLabel: {
+					classPropertyName: "ariaLabel",
+					publicName: "ariaLabel",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				size: {
+					classPropertyName: "size",
+					publicName: "size",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				variant: {
+					classPropertyName: "variant",
+					publicName: "variant",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				disabled: {
+					classPropertyName: "disabled",
+					publicName: "disabled",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				loading: {
+					classPropertyName: "loading",
+					publicName: "loading",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				interactive: {
+					classPropertyName: "interactive",
+					publicName: "interactive",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			outputs: { iconClick: "iconClick" },
+			ngImport: i0,
+			template: `
+    @if (interactive()) {
+      <button type="button" class="icon-btn" [class.danger]="variant() === 'danger'"
+        [class.loading]="loading()" [disabled]="disabled() || loading()" [attr.aria-busy]="loading() ? 'true' : null"
+        [attr.aria-label]="accessibleName() || null" [uiTooltip]="tooltip()" (click)="onClick($event)">
+        <ng-container *ngTemplateOutlet="glyph" />
+      </button>
+    } @else {
+      <span class="icon-static" [class.danger]="variant() === 'danger'" [attr.aria-busy]="loading() ? 'true' : null"
+        [attr.role]="accessibleName() ? 'img' : null" [attr.aria-label]="accessibleName() || null" [uiTooltip]="tooltip()" [attr.aria-hidden]="accessibleName() ? null : 'true'">
+        <ng-container *ngTemplateOutlet="glyph" />
+      </span>
+    }
+    <ng-template #glyph>
+      @if (loading()) {
+        <span class="spinner" [style.width.px]="size()" [style.height.px]="size()" aria-hidden="true"></span>
+      } @else if (path(); as d) {
+        <svg viewBox="0 0 24 24" [attr.width]="size()" [attr.height]="size()" fill="none" stroke="currentColor"
+          stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
+          <path [attr.d]="d" />
+        </svg>
+      }
+    </ng-template>
+  `,
+			isInline: true,
+			styles: [":host{display:inline-flex}.icon-static{display:inline-flex;align-items:center;justify-content:center;color:inherit}.icon-static.danger{color:#b91c1c}.icon-static svg{display:block}.icon-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:transparent;color:#475569;cursor:pointer;-webkit-appearance:none;appearance:none;font:inherit;transition:background .15s ease,color .15s ease}.icon-btn:hover:not(:disabled){background:#f1f5f9;color:#0f172a}.icon-btn.danger{color:#b91c1c}.icon-btn.danger:hover:not(:disabled){background:#fef2f2;color:#991b1b}.icon-btn:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.icon-btn:disabled{opacity:.5;cursor:not-allowed}.icon-btn.loading:disabled{opacity:1;cursor:progress}.spinner{display:block;box-sizing:border-box;border:2px solid rgba(100,116,139,.3);border-top-color:currentColor;border-radius:50%;animation:ui-icon-spin .6s linear infinite}@keyframes ui-icon-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2s}}.icon-btn:after{content:\"\";position:absolute;inset:-8px}\n"],
+			dependencies: [{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			}, {
+				kind: "directive",
+				type: TooltipDirective,
+				selector: "[uiTooltip]",
+				inputs: ["uiTooltip", "tooltipPosition"]
+			}],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: IconComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-icon",
+			standalone: true,
+			imports: [NgTemplateOutlet, TooltipDirective],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: `
+    @if (interactive()) {
+      <button type="button" class="icon-btn" [class.danger]="variant() === 'danger'"
+        [class.loading]="loading()" [disabled]="disabled() || loading()" [attr.aria-busy]="loading() ? 'true' : null"
+        [attr.aria-label]="accessibleName() || null" [uiTooltip]="tooltip()" (click)="onClick($event)">
+        <ng-container *ngTemplateOutlet="glyph" />
+      </button>
+    } @else {
+      <span class="icon-static" [class.danger]="variant() === 'danger'" [attr.aria-busy]="loading() ? 'true' : null"
+        [attr.role]="accessibleName() ? 'img' : null" [attr.aria-label]="accessibleName() || null" [uiTooltip]="tooltip()" [attr.aria-hidden]="accessibleName() ? null : 'true'">
+        <ng-container *ngTemplateOutlet="glyph" />
+      </span>
+    }
+    <ng-template #glyph>
+      @if (loading()) {
+        <span class="spinner" [style.width.px]="size()" [style.height.px]="size()" aria-hidden="true"></span>
+      } @else if (path(); as d) {
+        <svg viewBox="0 0 24 24" [attr.width]="size()" [attr.height]="size()" fill="none" stroke="currentColor"
+          stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
+          <path [attr.d]="d" />
+        </svg>
+      }
+    </ng-template>
+  `,
+			styles: [":host{display:inline-flex}.icon-static{display:inline-flex;align-items:center;justify-content:center;color:inherit}.icon-static.danger{color:#b91c1c}.icon-static svg{display:block}.icon-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:transparent;color:#475569;cursor:pointer;-webkit-appearance:none;appearance:none;font:inherit;transition:background .15s ease,color .15s ease}.icon-btn:hover:not(:disabled){background:#f1f5f9;color:#0f172a}.icon-btn.danger{color:#b91c1c}.icon-btn.danger:hover:not(:disabled){background:#fef2f2;color:#991b1b}.icon-btn:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.icon-btn:disabled{opacity:.5;cursor:not-allowed}.icon-btn.loading:disabled{opacity:1;cursor:progress}.spinner{display:block;box-sizing:border-box;border:2px solid rgba(100,116,139,.3);border-top-color:currentColor;border-radius:50%;animation:ui-icon-spin .6s linear infinite}@keyframes ui-icon-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2s}}.icon-btn:after{content:\"\";position:absolute;inset:-8px}\n"]
+		}]
+	}],
+	propDecorators: {
+		name: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "name",
+				required: true
+			}]
+		}],
+		tooltip: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tooltip",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		variant: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "variant",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}],
+		loading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "loading",
+				required: false
+			}]
+		}],
+		interactive: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "interactive",
+				required: false
+			}]
+		}],
+		iconClick: [{
+			type: i0.Output,
+			args: ["iconClick"]
+		}]
+	}
+});
+const DEFAULT_PASSWORD_RULES = [
+	{
+		id: "length",
+		label: "At least 8 characters",
+		test: (p) => p.length >= 8
+	},
+	{
+		id: "uppercase",
+		label: "One uppercase letter",
+		test: (p) => /[A-Z]/.test(p)
+	},
+	{
+		id: "lowercase",
+		label: "One lowercase letter",
+		test: (p) => /[a-z]/.test(p)
+	},
+	{
+		id: "digit",
+		label: "One digit",
+		test: (p) => /[0-9]/.test(p)
+	},
+	{
+		id: "special",
+		label: "One special character (!@#$%^&*...)",
+		test: (p) => /[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]/.test(p)
+	}
+];
+function passwordMeetsRules(password, rules = DEFAULT_PASSWORD_RULES) {
+	return rules.every((r) => r.test(password));
+}
+var PasswordRequirementsComponent = class PasswordRequirementsComponent {
+	constructor() {
+		this.value = input("", ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+		this.rules = input(DEFAULT_PASSWORD_RULES, ...ngDevMode ? [{ debugName: "rules" }] : /* istanbul ignore next */ []);
+		this.title = input("Password Requirements:", ...ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []);
+		this._check = iconPath("check");
+		this._results = computed(() => this.rules().map((r) => ({
+			id: r.id,
+			label: r.label,
+			met: r.test(this.value() ?? "")
+		})), ...ngDevMode ? [{ debugName: "_results" }] : /* istanbul ignore next */ []);
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: PasswordRequirementsComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.2",
+			type: PasswordRequirementsComponent,
+			isStandalone: true,
+			selector: "ui-password-requirements",
+			inputs: {
+				value: {
+					classPropertyName: "value",
+					publicName: "value",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				rules: {
+					classPropertyName: "rules",
+					publicName: "rules",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				title: {
+					classPropertyName: "title",
+					publicName: "title",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			ngImport: i0,
+			template: `
+    <div class="pr" role="group" [attr.aria-label]="title()" data-testid="password-requirements">
+      <p class="pr-title">{{ title() }}</p>
+      <ul class="pr-list">
+        @for (r of _results(); track r.id) {
+          <li class="pr-item" [class.pr-met]="r.met" [attr.data-testid]="'password-requirement-' + r.id" [attr.data-met]="r.met">
+            <svg class="pr-icon" viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2.5"
+                 stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
+              @if (r.met) { <path [attr.d]="_check" /> } @else { <circle cx="12" cy="12" r="8" /> }
+            </svg>
+            <span>{{ r.label }}</span>
+            <span class="pr-sr">{{ r.met ? ', met' : ', not met' }}</span>
+          </li>
+        }
+      </ul>
+    </div>
+  `,
+			isInline: true,
+			styles: [":host{display:block}.pr-title{margin:0 0 6px;font-size:.8125rem;color:#64748b}.pr-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.pr-item{display:flex;align-items:center;gap:8px;font-size:.8125rem;line-height:1.3;color:#64748b;transition:color .15s}.pr-icon{flex:0 0 auto}.pr-met{color:#15803d;font-weight:500}.pr-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}\n"],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: PasswordRequirementsComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-password-requirements",
+			standalone: true,
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: `
+    <div class="pr" role="group" [attr.aria-label]="title()" data-testid="password-requirements">
+      <p class="pr-title">{{ title() }}</p>
+      <ul class="pr-list">
+        @for (r of _results(); track r.id) {
+          <li class="pr-item" [class.pr-met]="r.met" [attr.data-testid]="'password-requirement-' + r.id" [attr.data-met]="r.met">
+            <svg class="pr-icon" viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2.5"
+                 stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
+              @if (r.met) { <path [attr.d]="_check" /> } @else { <circle cx="12" cy="12" r="8" /> }
+            </svg>
+            <span>{{ r.label }}</span>
+            <span class="pr-sr">{{ r.met ? ', met' : ', not met' }}</span>
+          </li>
+        }
+      </ul>
+    </div>
+  `,
+			styles: [":host{display:block}.pr-title{margin:0 0 6px;font-size:.8125rem;color:#64748b}.pr-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.pr-item{display:flex;align-items:center;gap:8px;font-size:.8125rem;line-height:1.3;color:#64748b;transition:color .15s}.pr-icon{flex:0 0 auto}.pr-met{color:#15803d;font-weight:500}.pr-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}\n"]
+		}]
+	}],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		rules: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "rules",
+				required: false
+			}]
+		}],
+		title: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "title",
+				required: false
+			}]
+		}]
+	}
+});
 var TextInputComponent = class TextInputComponent {
 	static {
 		this._EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
@@ -3921,6 +4498,9 @@ var TextInputComponent = class TextInputComponent {
 		this.ariaLabel = input("", ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* 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 */ []);
+		this.passwordRequirements = input(false, ...ngDevMode ? [{ debugName: "passwordRequirements" }] : /* istanbul ignore next */ []);
+		this.passwordRules = input(void 0, ...ngDevMode ? [{ debugName: "passwordRules" }] : /* istanbul ignore next */ []);
 		this.type = input("text", ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
 		this.maxlength = input(void 0, ...ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []);
 		this.required = input(false, ...ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []);
@@ -3957,6 +4537,18 @@ var TextInputComponent = class TextInputComponent {
 			if (this.type() === "number" && typeof step === "number" && Number.isFinite(step) && step > 0) return String(step);
 			return this.type() === "number" && this.integer() ? "1" : null;
 		}, ...ngDevMode ? [{ debugName: "_stepAttr" }] : /* istanbul ignore next */ []);
+		this._revealable = computed(() => this.revealable() && this.type() === "password", ...ngDevMode ? [{ debugName: "_revealable" }] : /* istanbul ignore next */ []);
+		this._shown = signal(false, ...ngDevMode ? [{ debugName: "_shown" }] : /* istanbul ignore next */ []);
+		this._inputType = computed(() => this._revealable() && this._shown() ? "text" : this.type(), ...ngDevMode ? [{ debugName: "_inputType" }] : /* istanbul ignore next */ []);
+		this._eyePath = iconPath("view");
+		this._eyeOffPath = iconPath("view-off");
+		this._showRequirements = computed(() => this.passwordRequirements() && this.type() === "password" && this._typed(), ...ngDevMode ? [{ debugName: "_showRequirements" }] : /* istanbul ignore next */ []);
+		this._describedBy = computed(() => {
+			const ids = [this._activeError() || this.hint() ? this._inputId + "-desc" : "", this._showRequirements() ? this._inputId + "-req" : ""].filter(Boolean);
+			return ids.length ? ids.join(" ") : null;
+		}, ...ngDevMode ? [{ debugName: "_describedBy" }] : /* istanbul ignore next */ []);
+		this._typed = signal(false, ...ngDevMode ? [{ debugName: "_typed" }] : /* istanbul ignore next */ []);
+		this._defaultRules = DEFAULT_PASSWORD_RULES;
 		this._warned = false;
 		this._formatting = computed(() => this.phoneFormat() || this.type() === "tel", ...ngDevMode ? [{ debugName: "_formatting" }] : /* istanbul ignore next */ []);
 		this._issue = computed(() => this._check(this._value()), ...ngDevMode ? [{ debugName: "_issue" }] : /* istanbul ignore next */ []);
@@ -3983,6 +4575,7 @@ var TextInputComponent = class TextInputComponent {
 	writeValue(val) {
 		const text = val == null || typeof val === "number" && Number.isNaN(val) && this._numeric() ? "" : String(val);
 		this._value.set(this._formatting() ? TextInputComponent._formatPhone(text) : text);
+		if (text === "") this._typed.set(false);
 	}
 	validate(control) {
 		const v = control.value;
@@ -4006,6 +4599,7 @@ var TextInputComponent = class TextInputComponent {
 		this._cvaDisabled.set(d);
 	}
 	onInput(event) {
+		this._typed.set(true);
 		const input = event.target;
 		const raw = input.value;
 		let val = this._formatting() ? TextInputComponent._formatPhone(raw) : raw;
@@ -4147,6 +4741,27 @@ var TextInputComponent = class TextInputComponent {
 					isRequired: false,
 					transformFunction: null
 				},
+				revealable: {
+					classPropertyName: "revealable",
+					publicName: "revealable",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				passwordRequirements: {
+					classPropertyName: "passwordRequirements",
+					publicName: "passwordRequirements",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				passwordRules: {
+					classPropertyName: "passwordRules",
+					publicName: "passwordRules",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
 				type: {
 					classPropertyName: "type",
 					publicName: "type",
@@ -4300,7 +4915,7 @@ var TextInputComponent = class TextInputComponent {
 			ngImport: i0,
 			template: `
     <div class="ti-field" [class.ti-error]="_activeError()" [class.ti-disabled]="disabled()"
-         [class.ti-prefixed]="!!prefix()" [style.--ti-input-row]="prefix() ? (label() ? 2 : 1) : null">
+         [class.ti-prefixed]="!!prefix() || _revealable()" [style.--ti-input-row]="(prefix() || _revealable()) ? (label() ? 2 : 1) : null">
       @if (label()) {
         <label class="ti-label" [for]="_inputId">
           {{ label() }}
@@ -4310,8 +4925,9 @@ var TextInputComponent = class TextInputComponent {
       <input
         class="ti-input"
         [style.padding-left]="_prefixPadding()"
+        [style.padding-right]="_revealable() ? '44px' : null"
         [id]="_inputId"
-        [type]="type()"
+        [type]="_inputType()"
         [attr.inputmode]="inputmode() || (type() === 'tel' ? 'tel' : integer() ? 'numeric' : null)"
         [placeholder]="placeholder()"
         [value]="_value()"
@@ -4323,7 +4939,7 @@ var TextInputComponent = class TextInputComponent {
         [attr.required]="required() || null"
         [attr.aria-label]="ariaLabel() || null"
         [attr.aria-invalid]="_activeError() ? 'true' : null"
-        [attr.aria-describedby]="(_activeError() || hint()) ? _inputId + '-desc' : null"
+        [attr.aria-describedby]="_describedBy()"
         (input)="onInput($event)"
         (focus)="onFocus()"
         (blur)="onBlur()"
@@ -4332,6 +4948,18 @@ var TextInputComponent = class TextInputComponent {
         <!-- Optional leading mark ("$"): a sibling after the input, laid over it by the grid of .ti-prefixed, so toggling it never recreates the input (focus and caret stay). -->
         <span class="ti-prefix" aria-hidden="true">{{ prefix() }}</span>
       }
+      @if (_revealable()) {
+        <!-- Show / hide toggle laid over the end of the input by the grid of .ti-prefixed. The name stays "Show password"; aria-pressed carries the state. -->
+        <button type="button" class="ti-reveal" data-testid="ti-reveal" aria-label="Show password"
+                [attr.aria-pressed]="_shown()" [attr.aria-controls]="_inputId" [disabled]="disabled()" (click)="_shown.set(!_shown())">
+          <svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
+            <path [attr.d]="_shown() ? _eyeOffPath : _eyePath" />
+          </svg>
+        </button>
+      }
+      @if (_showRequirements()) {
+        <ui-password-requirements [attr.id]="_inputId + '-req'" [value]="_value()" [rules]="passwordRules() ?? _defaultRules" />
+      }
       @if (_activeError()) {
         <p class="ti-desc ti-desc-error" [id]="_inputId + '-desc'" role="alert">{{ _activeError() }}</p>
       } @else if (hint()) {
@@ -4340,7 +4968,17 @@ 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:#ef4444;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-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:#ef4444}@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{font-size:.8125rem;font-weight:600;color:#374151;line-height:1}.ti-required{color:#ef4444;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:#ef4444}@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,
+				selector: "ui-password-requirements",
+				inputs: [
+					"value",
+					"rules",
+					"title"
+				]
+			}],
 			changeDetection: i0.ChangeDetectionStrategy.OnPush
 		});
 	}
@@ -4356,6 +4994,7 @@ i0.ɵɵngDeclareClassMetadata({
 			selector: "ui-text-input",
 			standalone: true,
 			changeDetection: ChangeDetectionStrategy.OnPush,
+			imports: [PasswordRequirementsComponent],
 			providers: [
 				{
 					provide: NG_VALUE_ACCESSOR,
@@ -4374,7 +5013,7 @@ i0.ɵɵngDeclareClassMetadata({
 			],
 			template: `
     <div class="ti-field" [class.ti-error]="_activeError()" [class.ti-disabled]="disabled()"
-         [class.ti-prefixed]="!!prefix()" [style.--ti-input-row]="prefix() ? (label() ? 2 : 1) : null">
+         [class.ti-prefixed]="!!prefix() || _revealable()" [style.--ti-input-row]="(prefix() || _revealable()) ? (label() ? 2 : 1) : null">
       @if (label()) {
         <label class="ti-label" [for]="_inputId">
           {{ label() }}
@@ -4384,8 +5023,9 @@ i0.ɵɵngDeclareClassMetadata({
       <input
         class="ti-input"
         [style.padding-left]="_prefixPadding()"
+        [style.padding-right]="_revealable() ? '44px' : null"
         [id]="_inputId"
-        [type]="type()"
+        [type]="_inputType()"
         [attr.inputmode]="inputmode() || (type() === 'tel' ? 'tel' : integer() ? 'numeric' : null)"
         [placeholder]="placeholder()"
         [value]="_value()"
@@ -4397,7 +5037,7 @@ i0.ɵɵngDeclareClassMetadata({
         [attr.required]="required() || null"
         [attr.aria-label]="ariaLabel() || null"
         [attr.aria-invalid]="_activeError() ? 'true' : null"
-        [attr.aria-describedby]="(_activeError() || hint()) ? _inputId + '-desc' : null"
+        [attr.aria-describedby]="_describedBy()"
         (input)="onInput($event)"
         (focus)="onFocus()"
         (blur)="onBlur()"
@@ -4406,6 +5046,18 @@ i0.ɵɵngDeclareClassMetadata({
         <!-- Optional leading mark ("$"): a sibling after the input, laid over it by the grid of .ti-prefixed, so toggling it never recreates the input (focus and caret stay). -->
         <span class="ti-prefix" aria-hidden="true">{{ prefix() }}</span>
       }
+      @if (_revealable()) {
+        <!-- Show / hide toggle laid over the end of the input by the grid of .ti-prefixed. The name stays "Show password"; aria-pressed carries the state. -->
+        <button type="button" class="ti-reveal" data-testid="ti-reveal" aria-label="Show password"
+                [attr.aria-pressed]="_shown()" [attr.aria-controls]="_inputId" [disabled]="disabled()" (click)="_shown.set(!_shown())">
+          <svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
+            <path [attr.d]="_shown() ? _eyeOffPath : _eyePath" />
+          </svg>
+        </button>
+      }
+      @if (_showRequirements()) {
+        <ui-password-requirements [attr.id]="_inputId + '-req'" [value]="_value()" [rules]="passwordRules() ?? _defaultRules" />
+      }
       @if (_activeError()) {
         <p class="ti-desc ti-desc-error" [id]="_inputId + '-desc'" role="alert">{{ _activeError() }}</p>
       } @else if (hint()) {
@@ -4413,7 +5065,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:#ef4444;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-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:#ef4444}@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{font-size:.8125rem;font-weight:600;color:#374151;line-height:1}.ti-required{color:#ef4444;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:#ef4444}@media(max-width:480px){.ti-input{font-size:1rem}}@media(pointer:coarse),(max-width:480px){.ti-input{min-height:44px}}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -4450,6 +5102,30 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		revealable: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "revealable",
+				required: false
+			}]
+		}],
+		passwordRequirements: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "passwordRequirements",
+				required: false
+			}]
+		}],
+		passwordRules: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "passwordRules",
+				required: false
+			}]
+		}],
 		type: [{
 			type: i0.Input,
 			args: [{
@@ -5066,6 +5742,9 @@ var TableToolbarComponent = class TableToolbarComponent {
 						"ariaLabel",
 						"placeholder",
 						"prefix",
+						"revealable",
+						"passwordRequirements",
+						"passwordRules",
 						"type",
 						"maxlength",
 						"required",
@@ -5565,147 +6244,13 @@ function getEligibleIds(items, selectedIds, action, options = {}) {
 		skippedCount: selected.length - eligible.length
 	};
 }
-let nextTooltipId = 0;
-var TooltipDirective = class TooltipDirective {
-	constructor() {
-		this.uiTooltip = input("", ...ngDevMode ? [{ debugName: "uiTooltip" }] : /* istanbul ignore next */ []);
-		this.tooltipPosition = input("top", ...ngDevMode ? [{ debugName: "tooltipPosition" }] : /* istanbul ignore next */ []);
-		this.host = inject(ElementRef).nativeElement;
-		this.doc = inject(DOCUMENT);
-		this.bubble = null;
-		this.id = `ui-tooltip-${nextTooltipId++}`;
-		inject(DestroyRef).onDestroy(() => this.hide());
-	}
-	show() {
-		const text = this.uiTooltip();
-		if (!text || this.bubble) return;
-		const el = this.doc.createElement("div");
-		el.id = this.id;
-		el.setAttribute("role", "tooltip");
-		el.textContent = text;
-		Object.assign(el.style, {
-			position: "fixed",
-			zIndex: "10000",
-			maxWidth: "280px",
-			padding: "6px 10px",
-			background: "#0f172a",
-			color: "#fff",
-			fontSize: "0.75rem",
-			lineHeight: "1.4",
-			borderRadius: "6px",
-			boxShadow: "0 4px 12px rgba(15,23,42,.25)",
-			whiteSpace: "pre-line",
-			pointerEvents: "none",
-			visibility: "hidden"
-		});
-		this.doc.body.appendChild(el);
-		this.bubble = el;
-		this.host.setAttribute("aria-describedby", this.id);
-		const r = this.host.getBoundingClientRect();
-		const b = el.getBoundingClientRect();
-		const gap = 6;
-		let top = this.tooltipPosition() === "top" ? r.top - b.height - gap : r.bottom + gap;
-		if (top < 4) top = r.bottom + gap;
-		else if (top + b.height > window.innerHeight - 4) top = r.top - b.height - gap;
-		const left = Math.min(Math.max(4, r.left + r.width / 2 - b.width / 2), window.innerWidth - b.width - 4);
-		el.style.top = `${top}px`;
-		el.style.left = `${left}px`;
-		el.style.visibility = "visible";
-	}
-	hide() {
-		this.bubble?.remove();
-		this.bubble = null;
-		this.host.removeAttribute("aria-describedby");
-	}
-	static {
-		this.ɵfac = i0.ɵɵngDeclareFactory({
-			minVersion: "12.0.0",
-			version: "22.2.2",
-			ngImport: i0,
-			type: TooltipDirective,
-			deps: [],
-			target: i0.ɵɵFactoryTarget.Directive
-		});
-	}
-	static {
-		this.ɵdir = i0.ɵɵngDeclareDirective({
-			minVersion: "17.1.0",
-			version: "22.2.2",
-			type: TooltipDirective,
-			isStandalone: true,
-			selector: "[uiTooltip]",
-			inputs: {
-				uiTooltip: {
-					classPropertyName: "uiTooltip",
-					publicName: "uiTooltip",
-					isSignal: true,
-					isRequired: false,
-					transformFunction: null
-				},
-				tooltipPosition: {
-					classPropertyName: "tooltipPosition",
-					publicName: "tooltipPosition",
-					isSignal: true,
-					isRequired: false,
-					transformFunction: null
-				}
-			},
-			host: { listeners: {
-				"mouseenter": "show()",
-				"mouseleave": "hide()",
-				"focusin": "show()",
-				"focusout": "hide()",
-				"keydown.escape": "hide()",
-				"click": "hide()"
-			} },
-			ngImport: i0
-		});
-	}
-};
-i0.ɵɵngDeclareClassMetadata({
-	minVersion: "12.0.0",
-	version: "22.2.2",
-	ngImport: i0,
-	type: TooltipDirective,
-	decorators: [{
-		type: Directive,
-		args: [{
-			selector: "[uiTooltip]",
-			standalone: true,
-			host: {
-				"(mouseenter)": "show()",
-				"(mouseleave)": "hide()",
-				"(focusin)": "show()",
-				"(focusout)": "hide()",
-				"(keydown.escape)": "hide()",
-				"(click)": "hide()"
-			}
-		}]
-	}],
-	ctorParameters: () => [],
-	propDecorators: {
-		uiTooltip: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "uiTooltip",
-				required: false
-			}]
-		}],
-		tooltipPosition: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "tooltipPosition",
-				required: false
-			}]
-		}]
-	}
-});
 var StarComponent = class StarComponent {
 	constructor() {
 		this.tooltip = input("", ...ngDevMode ? [{ debugName: "tooltip" }] : /* istanbul ignore next */ []);
 		this.size = input(16, ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+		this.filled = input(true, ...ngDevMode ? [{ debugName: "filled" }] : /* istanbul ignore next */ []);
+		this.interactive = input(false, ...ngDevMode ? [{ debugName: "interactive" }] : /* istanbul ignore next */ []);
+		this.starClick = output();
 		this.hasTooltip = computed(() => !!this.tooltip(), ...ngDevMode ? [{ debugName: "hasTooltip" }] : /* istanbul ignore next */ []);
 	}
 	static {
@@ -5720,7 +6265,7 @@ var StarComponent = class StarComponent {
 	}
 	static {
 		this.ɵcmp = i0.ɵɵngDeclareComponent({
-			minVersion: "17.1.0",
+			minVersion: "17.0.0",
 			version: "22.2.2",
 			type: StarComponent,
 			isStandalone: true,
@@ -5739,28 +6284,62 @@ var StarComponent = class StarComponent {
 					isSignal: true,
 					isRequired: false,
 					transformFunction: null
+				},
+				filled: {
+					classPropertyName: "filled",
+					publicName: "filled",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				interactive: {
+					classPropertyName: "interactive",
+					publicName: "interactive",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
 				}
 			},
+			outputs: { starClick: "starClick" },
 			ngImport: i0,
 			template: `
-    <span class="star"
-      [uiTooltip]="tooltip()"
-      [attr.role]="hasTooltip() ? 'img' : null"
-      [attr.aria-label]="hasTooltip() ? tooltip() : null"
-      [attr.aria-hidden]="hasTooltip() ? null : 'true'"
-      [attr.tabindex]="hasTooltip() ? 0 : null">
+    @if (interactive()) {
+      <button type="button" class="star star-btn" [class.star-off]="!filled()" [uiTooltip]="tooltip()"
+        [attr.aria-label]="tooltip() || null" (click)="starClick.emit($event)">
+        <ng-container *ngTemplateOutlet="shape" />
+      </button>
+    } @else {
+      <span class="star" [class.star-off]="!filled()"
+        [uiTooltip]="tooltip()"
+        [attr.role]="hasTooltip() ? 'img' : null"
+        [attr.aria-label]="hasTooltip() ? tooltip() : null"
+        [attr.aria-hidden]="hasTooltip() ? null : 'true'"
+        [attr.tabindex]="hasTooltip() ? 0 : null">
+        <ng-container *ngTemplateOutlet="shape" />
+      </span>
+    }
+    <ng-template #shape>
       <svg [attr.width]="size()" [attr.height]="size()" viewBox="0 0 20 20" aria-hidden="true" focusable="false">
         <path class="star-shape" d="M10 1.5l2.6 5.3 5.9.9-4.25 4.15 1 5.85L10 14.9l-5.25 2.8 1-5.85L1.5 7.7l5.9-.9L10 1.5z" />
       </svg>
-    </span>
+    </ng-template>
   `,
 			isInline: true,
-			styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.star{display:inline-flex;align-items:center;justify-content:center;border-radius:3px}.star:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.star-shape{fill:#f5b301;stroke:#d99a00;stroke-width:.75;stroke-linejoin:round}\n"],
+			styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.star{display:inline-flex;align-items:center;justify-content:center;border-radius:3px}.star-btn{border:0;background:none;padding:0;margin:0;cursor:pointer;font:inherit}.star-off .star-shape{fill:none;stroke:#94a3b8;stroke-width:1.25}.star-btn.star-off:hover .star-shape{stroke:#64748b}.star:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.star-shape{fill:#f5b301;stroke:#d99a00;stroke-width:.75;stroke-linejoin:round}\n"],
 			dependencies: [{
 				kind: "directive",
 				type: TooltipDirective,
 				selector: "[uiTooltip]",
 				inputs: ["uiTooltip", "tooltipPosition"]
+			}, {
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
 			}],
 			changeDetection: i0.ChangeDetectionStrategy.OnPush
 		});
@@ -5777,20 +6356,30 @@ i0.ɵɵngDeclareClassMetadata({
 			selector: "ui-star",
 			standalone: true,
 			changeDetection: ChangeDetectionStrategy.OnPush,
-			imports: [TooltipDirective],
+			imports: [TooltipDirective, NgTemplateOutlet],
 			template: `
-    <span class="star"
-      [uiTooltip]="tooltip()"
-      [attr.role]="hasTooltip() ? 'img' : null"
-      [attr.aria-label]="hasTooltip() ? tooltip() : null"
-      [attr.aria-hidden]="hasTooltip() ? null : 'true'"
-      [attr.tabindex]="hasTooltip() ? 0 : null">
+    @if (interactive()) {
+      <button type="button" class="star star-btn" [class.star-off]="!filled()" [uiTooltip]="tooltip()"
+        [attr.aria-label]="tooltip() || null" (click)="starClick.emit($event)">
+        <ng-container *ngTemplateOutlet="shape" />
+      </button>
+    } @else {
+      <span class="star" [class.star-off]="!filled()"
+        [uiTooltip]="tooltip()"
+        [attr.role]="hasTooltip() ? 'img' : null"
+        [attr.aria-label]="hasTooltip() ? tooltip() : null"
+        [attr.aria-hidden]="hasTooltip() ? null : 'true'"
+        [attr.tabindex]="hasTooltip() ? 0 : null">
+        <ng-container *ngTemplateOutlet="shape" />
+      </span>
+    }
+    <ng-template #shape>
       <svg [attr.width]="size()" [attr.height]="size()" viewBox="0 0 20 20" aria-hidden="true" focusable="false">
         <path class="star-shape" d="M10 1.5l2.6 5.3 5.9.9-4.25 4.15 1 5.85L10 14.9l-5.25 2.8 1-5.85L1.5 7.7l5.9-.9L10 1.5z" />
       </svg>
-    </span>
+    </ng-template>
   `,
-			styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.star{display:inline-flex;align-items:center;justify-content:center;border-radius:3px}.star:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.star-shape{fill:#f5b301;stroke:#d99a00;stroke-width:.75;stroke-linejoin:round}\n"]
+			styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.star{display:inline-flex;align-items:center;justify-content:center;border-radius:3px}.star-btn{border:0;background:none;padding:0;margin:0;cursor:pointer;font:inherit}.star-off .star-shape{fill:none;stroke:#94a3b8;stroke-width:1.25}.star-btn.star-off:hover .star-shape{stroke:#64748b}.star:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.star-shape{fill:#f5b301;stroke:#d99a00;stroke-width:.75;stroke-linejoin:round}\n"]
 		}]
 	}],
 	propDecorators: {
@@ -5809,6 +6398,26 @@ i0.ɵɵngDeclareClassMetadata({
 				alias: "size",
 				required: false
 			}]
+		}],
+		filled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "filled",
+				required: false
+			}]
+		}],
+		interactive: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "interactive",
+				required: false
+			}]
+		}],
+		starClick: [{
+			type: i0.Output,
+			args: ["starClick"]
 		}]
 	}
 });
@@ -8631,6 +9240,7 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
+let reorderHelpSeq = 0;
 function formatPhone$1(raw) {
 	if (!raw) return "—";
 	const digits = raw.replace(/\D/g, "");
@@ -8676,6 +9286,96 @@ var DataTableComponent = class DataTableComponent {
 		const listeners = this.rowClick.listeners;
 		return listeners === void 0 ? true : (listeners?.length ?? 0) > 0;
 	}
+	reorderLabel(item) {
+		const name = this.rowAccessibleName(item);
+		return name ? `Reorder ${name}` : "Reorder row";
+	}
+	onGripDragStart(e, index) {
+		if (!this._reorderActive()) {
+			e.preventDefault();
+			return;
+		}
+		this._dragFrom.set(index);
+		this._dragKey = this.trackItem(this._items()[index], index);
+		if (e.dataTransfer) {
+			e.dataTransfer.effectAllowed = "move";
+			e.dataTransfer.setData("text/plain", String(index));
+			const row = e.target.closest("tr, .dt-card");
+			if (row) e.dataTransfer.setDragImage(row, 16, 16);
+		}
+	}
+	onGripDragEnd() {
+		this._dragFrom.set(null);
+		this._dragOver.set(null);
+		this._dragKey = null;
+	}
+	onRowDragOver(e, index) {
+		if (this._dragFrom() === null) return;
+		e.preventDefault();
+		if (e.dataTransfer) e.dataTransfer.dropEffect = "move";
+		this._dragOver.set(index);
+	}
+	onRowDrop(e, index) {
+		const dragged = this._dragFrom();
+		if (dragged === null) return;
+		e.preventDefault();
+		const key = this._dragKey;
+		const from = key === null ? dragged : this._items().findIndex((item, i) => this.trackItem(item, i) === key);
+		this.onGripDragEnd();
+		if (from >= 0) this.moveRow(from, index);
+	}
+	onGripKeydown(e, index) {
+		if (!this._reorderActive()) return;
+		const last = this._items().length - 1;
+		if (e.key === "Enter" || e.key === " ") {
+			e.preventDefault();
+			e.stopPropagation();
+			const name = this.rowAccessibleName(this._items()[index]) || "Row";
+			this._reorderAnnouncement.set("");
+			afterNextRender(() => this._reorderAnnouncement.set(`${name} is at position ${index + 1} of ${last + 1}. Use the up and down arrow keys to move it, Home for the top, End for the bottom.`), { injector: this._injector });
+			return;
+		}
+		const target = e.key === "ArrowUp" ? index - 1 : e.key === "ArrowDown" ? index + 1 : e.key === "Home" ? 0 : e.key === "End" ? last : null;
+		if (target === null) return;
+		e.preventDefault();
+		e.stopPropagation();
+		if (this.moveRow(index, target)) {
+			const key = String(this._items()[Math.max(0, Math.min(last, target))]["id"] ?? target);
+			afterNextRender(() => {
+				this._host.nativeElement.querySelector(`[data-row-key="${CSS.escape(key)}"] .dt-grip`)?.focus();
+			}, { injector: this._injector });
+		}
+	}
+	moveByButton(index, direction) {
+		const key = String(this.trackItem(this._items()[index], index));
+		if (!this.moveRow(index, index + direction)) return;
+		afterNextRender(() => {
+			const row = this._host.nativeElement.querySelector(`[data-row-key="${CSS.escape(key)}"]`);
+			const suffix = direction === -1 ? " up" : " down";
+			(row?.querySelector(`button[aria-label$="${suffix}"]:not(:disabled)`) ?? row?.querySelector(".dt-row-move button:not(:disabled), .dt-card-move button:not(:disabled)"))?.focus();
+		}, { injector: this._injector });
+	}
+	moveRow(from, to) {
+		const items = this._items();
+		if (!this._reorderActive() || !Number.isInteger(from) || from < 0 || from >= items.length) return false;
+		const target = Math.max(0, Math.min(items.length - 1, to));
+		if (target === from) return false;
+		const next = [...items];
+		const [moved] = next.splice(from, 1);
+		next.splice(target, 0, moved);
+		this._items.set(next);
+		const name = this.rowAccessibleName(moved) || "Row";
+		this._reorderAnnouncement.set("");
+		afterNextRender(() => this._reorderAnnouncement.set(`${name} moved to position ${target + 1} of ${next.length}`), { injector: this._injector });
+		this.rowReorder.emit({
+			item: moved,
+			from,
+			to: target,
+			items: next,
+			offset: (this._page() - 1) * this.pageSize()
+		});
+		return true;
+	}
 	_bulkOptionsFor(def) {
 		const opts = this._getOptionsForField(def.field);
 		return def.exclude?.length ? opts.filter((o) => !this._isBulkExcluded(def, o.value)) : opts;
@@ -9036,6 +9736,8 @@ var DataTableComponent = class DataTableComponent {
 		this.tabChange = output();
 		this.bulkAction = output();
 		this.rowDeleted = output();
+		this.reorderable = input(false, ...ngDevMode ? [{ debugName: "reorderable" }] : /* istanbul ignore next */ []);
+		this.rowReorder = output();
 		this.config = inject(FORGEROUTE_CONFIG);
 		this.http = inject(HttpClient);
 		this.destroyRef = inject(DestroyRef);
@@ -9132,6 +9834,15 @@ var DataTableComponent = class DataTableComponent {
 		this._emptyUnfiltered = computed(() => this._hasLoaded() && !this._loading() && !this._error() && this._items().length === 0 && !this._hasActiveFilters(), ...ngDevMode ? [{ debugName: "_emptyUnfiltered" }] : /* istanbul ignore next */ []);
 		this._toolbarButtons = computed(() => this._emptyUnfiltered() ? this._effectiveButtons().filter((b) => b.variant === "primary" || b.keepWhenEmpty) : this._effectiveButtons(), ...ngDevMode ? [{ debugName: "_toolbarButtons" }] : /* istanbul ignore next */ []);
 		this._keepMoreActions = computed(() => this._emptyUnfiltered() && this._toolbarButtons().some((b) => !b.variant && !b.hidden), ...ngDevMode ? [{ debugName: "_keepMoreActions" }] : /* istanbul ignore next */ []);
+		this._reorderOn = computed(() => this.reorderable() && this._canEdit(), ...ngDevMode ? [{ debugName: "_reorderOn" }] : /* istanbul ignore next */ []);
+		this._reorderActive = computed(() => this._reorderOn() && !this._loading() && !this._error() && !this._sortField() && !this._hasActiveFilters() && this._items().length > 1, ...ngDevMode ? [{ debugName: "_reorderActive" }] : /* istanbul ignore next */ []);
+		this._reorderHint = computed(() => this._items().length < 2 ? "There is nothing to reorder" : "Clear the sort, search and filters to change the order", ...ngDevMode ? [{ debugName: "_reorderHint" }] : /* istanbul ignore next */ []);
+		this._reorderHelpId = `dt-reorder-help-${++reorderHelpSeq}`;
+		this._dragFrom = signal(null, ...ngDevMode ? [{ debugName: "_dragFrom" }] : /* istanbul ignore next */ []);
+		this._dragKey = null;
+		this._dragOver = signal(null, ...ngDevMode ? [{ debugName: "_dragOver" }] : /* istanbul ignore next */ []);
+		this._reorderAnnouncement = signal("", ...ngDevMode ? [{ debugName: "_reorderAnnouncement" }] : /* istanbul ignore next */ []);
+		this._host = inject(ElementRef);
 		this._hasActiveFilters = computed(() => {
 			const cf = this._colFilterValues();
 			return !!this._search() || !!this._activeTab() || Object.values(cf).some((v) => v.length > 0);
@@ -10052,6 +10763,13 @@ var DataTableComponent = class DataTableComponent {
 					isSignal: true,
 					isRequired: false,
 					transformFunction: null
+				},
+				reorderable: {
+					classPropertyName: "reorderable",
+					publicName: "reorderable",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
 				}
 			},
 			outputs: {
@@ -10066,7 +10784,8 @@ var DataTableComponent = class DataTableComponent {
 				selectionChange: "selectionChange",
 				tabChange: "tabChange",
 				bulkAction: "bulkAction",
-				rowDeleted: "rowDeleted"
+				rowDeleted: "rowDeleted",
+				rowReorder: "rowReorder"
 			},
 			providers: [DatePipe, {
 				provide: DROPDOWN_GROUP,
@@ -10221,6 +10940,9 @@ var DataTableComponent = class DataTableComponent {
           <table [attr.aria-label]="tableLabel()" [attr.aria-busy]="_loading()">
             <thead>
               <tr>
+                @if (_reorderOn()) {
+                  <th class="dt-th-grip" scope="col"><span class="dt-sr-only">Reorder</span></th>
+                }
                 @if (_isSelectable()) {
                   <th class="dt-th-cb" scope="col">
                     <ui-checkbox
@@ -10275,6 +10997,9 @@ var DataTableComponent = class DataTableComponent {
               @if (_loading()) {
                 @for (_ of skeletonRows(); track $index) {
                   <tr class="dt-sk-reload-row">
+                    @if (_reorderOn()) {
+                      <td class="dt-td-grip"></td>
+                    }
                     @if (_isSelectable()) {
                       <td class="dt-td-cb"></td>
                     }
@@ -10288,7 +11013,7 @@ var DataTableComponent = class DataTableComponent {
               <!-- Error -->
               @else if (_error()) {
                 <tr>
-                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0)" class="dt-state-cell">
+                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0) + (_reorderOn() ? 1 : 0)" class="dt-state-cell">
                     <ui-error-state [message]="_error()!" [retryLabel]="_retryLabel()" (retry)="load()" />
                   </td>
                 </tr>
@@ -10297,7 +11022,7 @@ var DataTableComponent = class DataTableComponent {
               <!-- Empty (no filters active) -->
               @else if (_items().length === 0 && !_hasActiveFilters()) {
                 <tr>
-                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0)" class="dt-state-cell">
+                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0) + (_reorderOn() ? 1 : 0)" class="dt-state-cell">
                     <ui-empty-state iconType="table" [message]="emptyMessage()" />
                   </td>
                 </tr>
@@ -10306,7 +11031,7 @@ var DataTableComponent = class DataTableComponent {
               <!-- No match -->
               @else if (_items().length === 0 && _hasActiveFilters()) {
                 <tr>
-                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0)" class="dt-state-cell">
+                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0) + (_reorderOn() ? 1 : 0)" class="dt-state-cell">
                     <ui-empty-state iconType="search" message="No results match your search or filters.">
                       <ui-button variant="secondary" size="sm" (click)="clearFilters()">Clear filters</ui-button>
                     </ui-empty-state>
@@ -10322,10 +11047,44 @@ var DataTableComponent = class DataTableComponent {
                     [style.--i]="$index < 8 ? $index : 8"
                     [class.dt-row-clickable]="isRowClickable(item)"
                     [class.dt-row-selected]="_isSelectable() && _selectedIds().has(item['id'])"
+                    [class.dt-row-dragging]="_dragFrom() === $index"
+                    [class.dt-row-over-before]="_reorderOn() && _dragFrom() !== null && _dragOver() === $index && _dragFrom()! > $index"
+                    [class.dt-row-over-after]="_reorderOn() && _dragFrom() !== null && _dragOver() === $index && _dragFrom()! < $index"
+                    [attr.data-row-key]="_reorderOn() ? trackItem(item, $index) : null"
                     [attr.tabindex]="isRowClickable(item) ? 0 : null"
                     [attr.aria-label]="rowLabel(item)"
                     (keydown)="onRowKeydown($event, item)"
+                    (dragover)="onRowDragOver($event, $index)"
+                    (drop)="onRowDrop($event, $index)"
                     (click)="onRowClick(item)">
+                    @if (_reorderOn()) {
+                      <td class="dt-td-grip" (click)="$event.stopPropagation()">
+                        <span class="dt-grip" role="button" [attr.tabindex]="_reorderActive() ? 0 : null"
+                          [attr.draggable]="_reorderActive() ? 'true' : null"
+                          [attr.aria-label]="reorderLabel(item)"
+                          [attr.aria-disabled]="_reorderActive() ? null : 'true'"
+                          [attr.aria-roledescription]="'drag handle'"
+                          [attr.aria-describedby]="_reorderHelpId"
+                          [attr.title]="_reorderActive() ? 'Drag to reorder, or use the up and down arrow keys' : _reorderHint()"
+                          [class.dt-grip-off]="!_reorderActive()"
+                          (dragstart)="onGripDragStart($event, $index)"
+                          (dragend)="onGripDragEnd()"
+                          (keydown)="onGripKeydown($event, $index)">
+                          <svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor" aria-hidden="true" focusable="false"><circle cx="9" cy="6" r="1.6"/><circle cx="15" cy="6" r="1.6"/><circle cx="9" cy="12" r="1.6"/><circle cx="15" cy="12" r="1.6"/><circle cx="9" cy="18" r="1.6"/><circle cx="15" cy="18" r="1.6"/></svg>
+                        </span>
+                        <!-- Touch screens (coarse primary pointer, e.g. a tablet) cannot rely on native drag: they get Move up / Move down instead of the grip. -->
+                        <span class="dt-row-move">
+                          <ui-button variant="icon" size="sm" [ariaLabel]="'Move ' + (rowAccessibleName(item) || 'row') + ' up'"
+                            [disabled]="!_reorderActive() || $first" (click)="moveByButton($index, -1)">
+                            <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 15l6-6 6 6"/></svg>
+                          </ui-button>
+                          <ui-button variant="icon" size="sm" [ariaLabel]="'Move ' + (rowAccessibleName(item) || 'row') + ' down'"
+                            [disabled]="!_reorderActive() || $last" (click)="moveByButton($index, 1)">
+                            <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 9l6 6 6-6"/></svg>
+                          </ui-button>
+                        </span>
+                      </td>
+                    }
                     @if (_isSelectable()) {
                       <td class="dt-td-cb" (click)="$event.stopPropagation()">
                         <ui-checkbox
@@ -10531,6 +11290,7 @@ var DataTableComponent = class DataTableComponent {
             @for (item of _items(); track trackItem(item, $index)) {
               <div
                 class="dt-card alive-row"
+                [attr.data-row-key]="_reorderOn() ? trackItem(item, $index) : null"
                 [style.--i]="$index < 8 ? $index : 8"
                 role="listitem"
                 [class.dt-card-clickable]="isRowClickable(item)"
@@ -10576,6 +11336,18 @@ var DataTableComponent = class DataTableComponent {
                       </span>
                     }
                   }
+                  @if (_reorderOn()) {
+                    <span class="dt-card-move" (click)="$event.stopPropagation()">
+                      <ui-button variant="icon" size="sm" [ariaLabel]="'Move ' + (rowAccessibleName(item) || 'row') + ' up'"
+                        [disabled]="!_reorderActive() || $first" (click)="moveByButton($index, -1)">
+                        <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 15l6-6 6 6"/></svg>
+                      </ui-button>
+                      <ui-button variant="icon" size="sm" [ariaLabel]="'Move ' + (rowAccessibleName(item) || 'row') + ' down'"
+                        [disabled]="!_reorderActive() || $last" (click)="moveByButton($index, 1)">
+                        <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 9l6 6 6-6"/></svg>
+                      </ui-button>
+                    </span>
+                  }
                   @if (_cardCols().actionsCol; as ac) {
                     @let cardActions = _rowActions(ac, item);
                     @if (cardActions.length) {
@@ -10639,6 +11411,13 @@ var DataTableComponent = class DataTableComponent {
         </div>
         }
 
+        @if (_reorderOn()) {
+          <span class="dt-sr-only" [id]="_reorderHelpId">{{ _reorderActive()
+            ? 'Drag to reorder with a mouse, or use the up and down arrow keys; Home moves to the top and End to the bottom.'
+            : _reorderHint() }}</span>
+          <span class="dt-sr-only" role="status" aria-live="polite" aria-atomic="true">{{ _reorderAnnouncement() }}</span>
+        }
+
         <!-- ── PAGINATION ─────────────────────────────────────────── -->
         @if (_total() > pageSize()) {
           <ui-pagination
@@ -10697,7 +11476,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-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: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-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",
@@ -10840,7 +11619,13 @@ var DataTableComponent = class DataTableComponent {
 					kind: "component",
 					type: StarComponent,
 					selector: "ui-star",
-					inputs: ["tooltip", "size"]
+					inputs: [
+						"tooltip",
+						"size",
+						"filled",
+						"interactive"
+					],
+					outputs: ["starClick"]
 				},
 				{
 					kind: "component",
@@ -11208,6 +11993,9 @@ i0.ɵɵngDeclareClassMetadata({
           <table [attr.aria-label]="tableLabel()" [attr.aria-busy]="_loading()">
             <thead>
               <tr>
+                @if (_reorderOn()) {
+                  <th class="dt-th-grip" scope="col"><span class="dt-sr-only">Reorder</span></th>
+                }
                 @if (_isSelectable()) {
                   <th class="dt-th-cb" scope="col">
                     <ui-checkbox
@@ -11262,6 +12050,9 @@ i0.ɵɵngDeclareClassMetadata({
               @if (_loading()) {
                 @for (_ of skeletonRows(); track $index) {
                   <tr class="dt-sk-reload-row">
+                    @if (_reorderOn()) {
+                      <td class="dt-td-grip"></td>
+                    }
                     @if (_isSelectable()) {
                       <td class="dt-td-cb"></td>
                     }
@@ -11275,7 +12066,7 @@ i0.ɵɵngDeclareClassMetadata({
               <!-- Error -->
               @else if (_error()) {
                 <tr>
-                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0)" class="dt-state-cell">
+                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0) + (_reorderOn() ? 1 : 0)" class="dt-state-cell">
                     <ui-error-state [message]="_error()!" [retryLabel]="_retryLabel()" (retry)="load()" />
                   </td>
                 </tr>
@@ -11284,7 +12075,7 @@ i0.ɵɵngDeclareClassMetadata({
               <!-- Empty (no filters active) -->
               @else if (_items().length === 0 && !_hasActiveFilters()) {
                 <tr>
-                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0)" class="dt-state-cell">
+                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0) + (_reorderOn() ? 1 : 0)" class="dt-state-cell">
                     <ui-empty-state iconType="table" [message]="emptyMessage()" />
                   </td>
                 </tr>
@@ -11293,7 +12084,7 @@ i0.ɵɵngDeclareClassMetadata({
               <!-- No match -->
               @else if (_items().length === 0 && _hasActiveFilters()) {
                 <tr>
-                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0)" class="dt-state-cell">
+                  <td [attr.colspan]="visibleCols().length + (_isSelectable() ? 1 : 0) + (_reorderOn() ? 1 : 0)" class="dt-state-cell">
                     <ui-empty-state iconType="search" message="No results match your search or filters.">
                       <ui-button variant="secondary" size="sm" (click)="clearFilters()">Clear filters</ui-button>
                     </ui-empty-state>
@@ -11309,10 +12100,44 @@ i0.ɵɵngDeclareClassMetadata({
                     [style.--i]="$index < 8 ? $index : 8"
                     [class.dt-row-clickable]="isRowClickable(item)"
                     [class.dt-row-selected]="_isSelectable() && _selectedIds().has(item['id'])"
+                    [class.dt-row-dragging]="_dragFrom() === $index"
+                    [class.dt-row-over-before]="_reorderOn() && _dragFrom() !== null && _dragOver() === $index && _dragFrom()! > $index"
+                    [class.dt-row-over-after]="_reorderOn() && _dragFrom() !== null && _dragOver() === $index && _dragFrom()! < $index"
+                    [attr.data-row-key]="_reorderOn() ? trackItem(item, $index) : null"
                     [attr.tabindex]="isRowClickable(item) ? 0 : null"
                     [attr.aria-label]="rowLabel(item)"
                     (keydown)="onRowKeydown($event, item)"
+                    (dragover)="onRowDragOver($event, $index)"
+                    (drop)="onRowDrop($event, $index)"
                     (click)="onRowClick(item)">
+                    @if (_reorderOn()) {
+                      <td class="dt-td-grip" (click)="$event.stopPropagation()">
+                        <span class="dt-grip" role="button" [attr.tabindex]="_reorderActive() ? 0 : null"
+                          [attr.draggable]="_reorderActive() ? 'true' : null"
+                          [attr.aria-label]="reorderLabel(item)"
+                          [attr.aria-disabled]="_reorderActive() ? null : 'true'"
+                          [attr.aria-roledescription]="'drag handle'"
+                          [attr.aria-describedby]="_reorderHelpId"
+                          [attr.title]="_reorderActive() ? 'Drag to reorder, or use the up and down arrow keys' : _reorderHint()"
+                          [class.dt-grip-off]="!_reorderActive()"
+                          (dragstart)="onGripDragStart($event, $index)"
+                          (dragend)="onGripDragEnd()"
+                          (keydown)="onGripKeydown($event, $index)">
+                          <svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor" aria-hidden="true" focusable="false"><circle cx="9" cy="6" r="1.6"/><circle cx="15" cy="6" r="1.6"/><circle cx="9" cy="12" r="1.6"/><circle cx="15" cy="12" r="1.6"/><circle cx="9" cy="18" r="1.6"/><circle cx="15" cy="18" r="1.6"/></svg>
+                        </span>
+                        <!-- Touch screens (coarse primary pointer, e.g. a tablet) cannot rely on native drag: they get Move up / Move down instead of the grip. -->
+                        <span class="dt-row-move">
+                          <ui-button variant="icon" size="sm" [ariaLabel]="'Move ' + (rowAccessibleName(item) || 'row') + ' up'"
+                            [disabled]="!_reorderActive() || $first" (click)="moveByButton($index, -1)">
+                            <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 15l6-6 6 6"/></svg>
+                          </ui-button>
+                          <ui-button variant="icon" size="sm" [ariaLabel]="'Move ' + (rowAccessibleName(item) || 'row') + ' down'"
+                            [disabled]="!_reorderActive() || $last" (click)="moveByButton($index, 1)">
+                            <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 9l6 6 6-6"/></svg>
+                          </ui-button>
+                        </span>
+                      </td>
+                    }
                     @if (_isSelectable()) {
                       <td class="dt-td-cb" (click)="$event.stopPropagation()">
                         <ui-checkbox
@@ -11518,6 +12343,7 @@ i0.ɵɵngDeclareClassMetadata({
             @for (item of _items(); track trackItem(item, $index)) {
               <div
                 class="dt-card alive-row"
+                [attr.data-row-key]="_reorderOn() ? trackItem(item, $index) : null"
                 [style.--i]="$index < 8 ? $index : 8"
                 role="listitem"
                 [class.dt-card-clickable]="isRowClickable(item)"
@@ -11563,6 +12389,18 @@ i0.ɵɵngDeclareClassMetadata({
                       </span>
                     }
                   }
+                  @if (_reorderOn()) {
+                    <span class="dt-card-move" (click)="$event.stopPropagation()">
+                      <ui-button variant="icon" size="sm" [ariaLabel]="'Move ' + (rowAccessibleName(item) || 'row') + ' up'"
+                        [disabled]="!_reorderActive() || $first" (click)="moveByButton($index, -1)">
+                        <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 15l6-6 6 6"/></svg>
+                      </ui-button>
+                      <ui-button variant="icon" size="sm" [ariaLabel]="'Move ' + (rowAccessibleName(item) || 'row') + ' down'"
+                        [disabled]="!_reorderActive() || $last" (click)="moveByButton($index, 1)">
+                        <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 9l6 6 6-6"/></svg>
+                      </ui-button>
+                    </span>
+                  }
                   @if (_cardCols().actionsCol; as ac) {
                     @let cardActions = _rowActions(ac, item);
                     @if (cardActions.length) {
@@ -11626,6 +12464,13 @@ i0.ɵɵngDeclareClassMetadata({
         </div>
         }
 
+        @if (_reorderOn()) {
+          <span class="dt-sr-only" [id]="_reorderHelpId">{{ _reorderActive()
+            ? 'Drag to reorder with a mouse, or use the up and down arrow keys; Home moves to the top and End to the bottom.'
+            : _reorderHint() }}</span>
+          <span class="dt-sr-only" role="status" aria-live="polite" aria-atomic="true">{{ _reorderAnnouncement() }}</span>
+        }
+
         <!-- ── PAGINATION ─────────────────────────────────────────── -->
         @if (_total() > pageSize()) {
           <ui-pagination
@@ -11683,7 +12528,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-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: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-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: () => [],
@@ -11936,6 +12781,18 @@ i0.ɵɵngDeclareClassMetadata({
 			type: i0.Output,
 			args: ["rowDeleted"]
 		}],
+		reorderable: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "reorderable",
+				required: false
+			}]
+		}],
+		rowReorder: [{
+			type: i0.Output,
+			args: ["rowReorder"]
+		}],
 		_ieRef: [{
 			type: i0.ViewChild,
 			args: ["ieRef", { isSignal: true }]
@@ -15963,6 +16820,9 @@ var PhoneNumberPickerComponent = class PhoneNumberPickerComponent {
 						"ariaLabel",
 						"placeholder",
 						"prefix",
+						"revealable",
+						"passwordRequirements",
+						"passwordRules",
 						"type",
 						"maxlength",
 						"required",
@@ -16516,7 +17376,7 @@ var PillTabsComponent = class PillTabsComponent {
     </div>
   `,
 			isInline: true,
-			styles: [".pill-wrap{position:relative}.pill-fade{position:absolute;top:0;bottom:0;width:28px;pointer-events:none;opacity:0;transition:opacity .15s}.pill-fade.visible{opacity:1}.pill-fade--start{left:0;background:linear-gradient(to right,var(--ui-pill-tabs-fade, #fff),transparent)}.pill-fade--end{right:0;background:linear-gradient(to left,var(--ui-pill-tabs-fade, #fff),transparent)}.pill-tabs{display:flex;gap:8px;flex-wrap:wrap}@media(max-width:768px){.pill-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px;scrollbar-width:none}.pill-tabs::-webkit-scrollbar{display:none}}.pill-tab{position:relative;display:inline-flex;align-items:center;gap:6px;padding:7px 16px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#64748b;cursor:pointer;transition:all .15s;font-family:inherit}.pill-tab:hover:not(.disabled):not(.active){background:#f8fafc;border-color:#94a3b8}.pill-tab:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pill-tab .pill-count{background:#e2e8f0;color:#475569;font-size:.7rem;font-weight:600;padding:1px 6px;border-radius:999px;line-height:1.4}.pill-tab.active{background:#1e293b;color:#fff;border-color:#1e293b}.pill-tab.active .pill-count{background:#fff3;color:#fff}.pill-tab.active:hover{background:#1e293b;color:#fff}.pill-tab.disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.pill-tab .pill-info-icon{flex-shrink:0;opacity:.7}.pill-tab:hover .pill-info-icon,.pill-tab:focus-visible .pill-info-icon{opacity:1}.pill-tab .pill-info-tip{position:absolute;left:0;top:calc(100% + 8px);z-index:20;width:max-content;max-width:280px;padding:8px 12px;border-radius:8px;background:#1e293b;color:#fff;font-size:.75rem;font-weight:400;line-height:1.45;text-align:left;white-space:normal;box-shadow:0 4px 12px #0f172a40;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s,visibility .12s}.pill-tab:hover .pill-info-tip,.pill-tab:focus-visible .pill-info-tip{opacity:1;visibility:visible}@media(pointer:coarse),(max-width:480px){.pill-tab{min-height:44px}}\n"],
+			styles: [".pill-wrap{position:relative}.pill-fade{position:absolute;top:0;bottom:0;width:28px;pointer-events:none;opacity:0;transition:opacity .15s}.pill-fade.visible{opacity:1}.pill-fade--start{left:0;background:linear-gradient(to right,var(--ui-pill-tabs-fade, #fff),transparent)}.pill-fade--end{right:0;background:linear-gradient(to left,var(--ui-pill-tabs-fade, #fff),transparent)}.pill-tabs{display:flex;gap:8px;flex-wrap:wrap}@media(max-width:768px){.pill-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px;scrollbar-width:none}.pill-tabs::-webkit-scrollbar{display:none}}.pill-tab{position:relative;display:inline-flex;align-items:center;gap:6px;padding:7px 16px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#64748b;cursor:pointer;transition:all .15s;font-family:inherit}.pill-tab:hover:not(.disabled):not(.active){background:#f8fafc;border-color:#94a3b8}.pill-tab:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pill-tab .pill-count{background:#e2e8f0;color:#475569;font-size:.7rem;font-weight:600;padding:1px 6px;border-radius:999px;line-height:1.4}.pill-tab.active{background:#1e293b;color:#fff;border-color:#1e293b}.pill-tab.active .pill-count{background:#fff3;color:#fff}.pill-tab.active:hover{background:#1e293b;color:#fff}.pill-tab.disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.pill-tab .pill-info-icon{flex-shrink:0;opacity:.7}.pill-tab:hover .pill-info-icon,.pill-tab:focus-visible .pill-info-icon{opacity:1}.pill-tab .pill-info-tip{position:absolute;left:0;top:calc(100% + 8px);z-index:20;width:max-content;max-width:280px;padding:8px 12px;border-radius:8px;background:#1e293b;color:#fff;font-size:.75rem;font-weight:400;line-height:1.45;text-align:left;white-space:normal;box-shadow:0 4px 12px #0f172a40;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s,visibility .12s}.pill-tab:hover .pill-info-tip,.pill-tab:focus-visible .pill-info-tip{opacity:1;visibility:visible}.pill-tab:last-child .pill-info-tip{left:auto;right:0}@media(pointer:coarse),(max-width:480px){.pill-tab{min-height:44px}}\n"],
 			changeDetection: i0.ChangeDetectionStrategy.OnPush
 		});
 	}
@@ -16562,7 +17422,7 @@ i0.ɵɵngDeclareClassMetadata({
     <span class="pill-fade pill-fade--end" [class.visible]="canScrollEnd()" aria-hidden="true" data-testid="pill-fade-end"></span>
     </div>
   `,
-			styles: [".pill-wrap{position:relative}.pill-fade{position:absolute;top:0;bottom:0;width:28px;pointer-events:none;opacity:0;transition:opacity .15s}.pill-fade.visible{opacity:1}.pill-fade--start{left:0;background:linear-gradient(to right,var(--ui-pill-tabs-fade, #fff),transparent)}.pill-fade--end{right:0;background:linear-gradient(to left,var(--ui-pill-tabs-fade, #fff),transparent)}.pill-tabs{display:flex;gap:8px;flex-wrap:wrap}@media(max-width:768px){.pill-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px;scrollbar-width:none}.pill-tabs::-webkit-scrollbar{display:none}}.pill-tab{position:relative;display:inline-flex;align-items:center;gap:6px;padding:7px 16px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#64748b;cursor:pointer;transition:all .15s;font-family:inherit}.pill-tab:hover:not(.disabled):not(.active){background:#f8fafc;border-color:#94a3b8}.pill-tab:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pill-tab .pill-count{background:#e2e8f0;color:#475569;font-size:.7rem;font-weight:600;padding:1px 6px;border-radius:999px;line-height:1.4}.pill-tab.active{background:#1e293b;color:#fff;border-color:#1e293b}.pill-tab.active .pill-count{background:#fff3;color:#fff}.pill-tab.active:hover{background:#1e293b;color:#fff}.pill-tab.disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.pill-tab .pill-info-icon{flex-shrink:0;opacity:.7}.pill-tab:hover .pill-info-icon,.pill-tab:focus-visible .pill-info-icon{opacity:1}.pill-tab .pill-info-tip{position:absolute;left:0;top:calc(100% + 8px);z-index:20;width:max-content;max-width:280px;padding:8px 12px;border-radius:8px;background:#1e293b;color:#fff;font-size:.75rem;font-weight:400;line-height:1.45;text-align:left;white-space:normal;box-shadow:0 4px 12px #0f172a40;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s,visibility .12s}.pill-tab:hover .pill-info-tip,.pill-tab:focus-visible .pill-info-tip{opacity:1;visibility:visible}@media(pointer:coarse),(max-width:480px){.pill-tab{min-height:44px}}\n"]
+			styles: [".pill-wrap{position:relative}.pill-fade{position:absolute;top:0;bottom:0;width:28px;pointer-events:none;opacity:0;transition:opacity .15s}.pill-fade.visible{opacity:1}.pill-fade--start{left:0;background:linear-gradient(to right,var(--ui-pill-tabs-fade, #fff),transparent)}.pill-fade--end{right:0;background:linear-gradient(to left,var(--ui-pill-tabs-fade, #fff),transparent)}.pill-tabs{display:flex;gap:8px;flex-wrap:wrap}@media(max-width:768px){.pill-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px;scrollbar-width:none}.pill-tabs::-webkit-scrollbar{display:none}}.pill-tab{position:relative;display:inline-flex;align-items:center;gap:6px;padding:7px 16px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;font-size:.8125rem;font-weight:500;color:#64748b;cursor:pointer;transition:all .15s;font-family:inherit}.pill-tab:hover:not(.disabled):not(.active){background:#f8fafc;border-color:#94a3b8}.pill-tab:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.pill-tab .pill-count{background:#e2e8f0;color:#475569;font-size:.7rem;font-weight:600;padding:1px 6px;border-radius:999px;line-height:1.4}.pill-tab.active{background:#1e293b;color:#fff;border-color:#1e293b}.pill-tab.active .pill-count{background:#fff3;color:#fff}.pill-tab.active:hover{background:#1e293b;color:#fff}.pill-tab.disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.pill-tab .pill-info-icon{flex-shrink:0;opacity:.7}.pill-tab:hover .pill-info-icon,.pill-tab:focus-visible .pill-info-icon{opacity:1}.pill-tab .pill-info-tip{position:absolute;left:0;top:calc(100% + 8px);z-index:20;width:max-content;max-width:280px;padding:8px 12px;border-radius:8px;background:#1e293b;color:#fff;font-size:.75rem;font-weight:400;line-height:1.45;text-align:left;white-space:normal;box-shadow:0 4px 12px #0f172a40;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s,visibility .12s}.pill-tab:hover .pill-info-tip,.pill-tab:focus-visible .pill-info-tip{opacity:1;visibility:visible}.pill-tab:last-child .pill-info-tip{left:auto;right:0}@media(pointer:coarse),(max-width:480px){.pill-tab{min-height:44px}}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -18103,6 +18963,9 @@ var BulkMessagePanelComponent = class BulkMessagePanelComponent {
 						"ariaLabel",
 						"placeholder",
 						"prefix",
+						"revealable",
+						"passwordRequirements",
+						"passwordRules",
 						"type",
 						"maxlength",
 						"required",
@@ -26969,281 +27832,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}]
 });
-const EXTRA_ICONS = {
-	"delete": "M3 6h18 M8 6V4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2 M5 6l1 14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-14 M10 11v6 M14 11v6",
-	"add": "M12 5v14 M5 12h14",
-	"close": "M18 6L6 18 M6 6l12 12",
-	"check": "M20 6L9 17l-5-5",
-	"upload": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4 M17 8l-5-5-5 5 M12 3v12",
-	"image": "M19 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2z M8.5 8.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z M21 15l-5-5L5 21",
-	"chevron-up": "M18 15l-6-6-6 6",
-	"chevron-down": "M6 9l6 6 6-6",
-	"arrow-left": "M19 12H5 M12 19l-7-7 7-7",
-	"bell": "M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9 M13.73 21a2 2 0 0 1-3.46 0",
-	"print": "M6 9V2h12v7 M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2 M6 14h12v8H6z",
-	"shield": "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z",
-	"lock": "M5 11h14a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2z M7 11V7a5 5 0 0 1 10 0v4",
-	"arrow-up": "M12 19V5 M5 12l7-7 7 7",
-	"arrow-down": "M12 5v14 M19 12l-7 7-7-7",
-	"arrow-right": "M5 12h14 M12 5l7 7-7 7",
-	"document": "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z M14 2v6h6 M16 13H8 M16 17H8 M10 9H8",
-	"grip": "M9 5h.01 M15 5h.01 M9 12h.01 M15 12h.01 M9 19h.01 M15 19h.01",
-	"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",
-	"bank": "M3 21h18 M3 10h18 M5 6l7-3 7 3 M4 10v11 M20 10v11 M8 14v3 M12 14v3 M16 14v3"
-};
-function iconPath(name) {
-	return Object.prototype.hasOwnProperty.call(EXTRA_ICONS, name) ? EXTRA_ICONS[name] : builtInActionIcon(name);
-}
-var IconComponent = class IconComponent {
-	constructor() {
-		this.name = input.required(...ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []);
-		this.tooltip = input("", ...ngDevMode ? [{ debugName: "tooltip" }] : /* istanbul ignore next */ []);
-		this.ariaLabel = input("", ...ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []);
-		this.size = input(16, ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
-		this.variant = input("default", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
-		this.disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
-		this.loading = input(false, ...ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []);
-		this.interactive = input(true, ...ngDevMode ? [{ debugName: "interactive" }] : /* istanbul ignore next */ []);
-		this.iconClick = output();
-		this.accessibleName = computed(() => this.ariaLabel() || this.tooltip(), ...ngDevMode ? [{ debugName: "accessibleName" }] : /* istanbul ignore next */ []);
-		this.path = computed(() => iconPath(this.name()), ...ngDevMode ? [{ debugName: "path" }] : /* istanbul ignore next */ []);
-	}
-	onClick(event) {
-		event.stopPropagation();
-		this.iconClick.emit(event);
-	}
-	static {
-		this.ɵfac = i0.ɵɵngDeclareFactory({
-			minVersion: "12.0.0",
-			version: "22.2.2",
-			ngImport: i0,
-			type: IconComponent,
-			deps: [],
-			target: i0.ɵɵFactoryTarget.Component
-		});
-	}
-	static {
-		this.ɵcmp = i0.ɵɵngDeclareComponent({
-			minVersion: "17.0.0",
-			version: "22.2.2",
-			type: IconComponent,
-			isStandalone: true,
-			selector: "ui-icon",
-			inputs: {
-				name: {
-					classPropertyName: "name",
-					publicName: "name",
-					isSignal: true,
-					isRequired: true,
-					transformFunction: null
-				},
-				tooltip: {
-					classPropertyName: "tooltip",
-					publicName: "tooltip",
-					isSignal: true,
-					isRequired: false,
-					transformFunction: null
-				},
-				ariaLabel: {
-					classPropertyName: "ariaLabel",
-					publicName: "ariaLabel",
-					isSignal: true,
-					isRequired: false,
-					transformFunction: null
-				},
-				size: {
-					classPropertyName: "size",
-					publicName: "size",
-					isSignal: true,
-					isRequired: false,
-					transformFunction: null
-				},
-				variant: {
-					classPropertyName: "variant",
-					publicName: "variant",
-					isSignal: true,
-					isRequired: false,
-					transformFunction: null
-				},
-				disabled: {
-					classPropertyName: "disabled",
-					publicName: "disabled",
-					isSignal: true,
-					isRequired: false,
-					transformFunction: null
-				},
-				loading: {
-					classPropertyName: "loading",
-					publicName: "loading",
-					isSignal: true,
-					isRequired: false,
-					transformFunction: null
-				},
-				interactive: {
-					classPropertyName: "interactive",
-					publicName: "interactive",
-					isSignal: true,
-					isRequired: false,
-					transformFunction: null
-				}
-			},
-			outputs: { iconClick: "iconClick" },
-			ngImport: i0,
-			template: `
-    @if (interactive()) {
-      <button type="button" class="icon-btn" [class.danger]="variant() === 'danger'"
-        [class.loading]="loading()" [disabled]="disabled() || loading()" [attr.aria-busy]="loading() ? 'true' : null"
-        [attr.aria-label]="accessibleName() || null" [uiTooltip]="tooltip()" (click)="onClick($event)">
-        <ng-container *ngTemplateOutlet="glyph" />
-      </button>
-    } @else {
-      <span class="icon-static" [class.danger]="variant() === 'danger'" [attr.aria-busy]="loading() ? 'true' : null"
-        [attr.role]="accessibleName() ? 'img' : null" [attr.aria-label]="accessibleName() || null" [uiTooltip]="tooltip()" [attr.aria-hidden]="accessibleName() ? null : 'true'">
-        <ng-container *ngTemplateOutlet="glyph" />
-      </span>
-    }
-    <ng-template #glyph>
-      @if (loading()) {
-        <span class="spinner" [style.width.px]="size()" [style.height.px]="size()" aria-hidden="true"></span>
-      } @else if (path(); as d) {
-        <svg viewBox="0 0 24 24" [attr.width]="size()" [attr.height]="size()" fill="none" stroke="currentColor"
-          stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
-          <path [attr.d]="d" />
-        </svg>
-      }
-    </ng-template>
-  `,
-			isInline: true,
-			styles: [":host{display:inline-flex}.icon-static{display:inline-flex;align-items:center;justify-content:center;color:inherit}.icon-static.danger{color:#b91c1c}.icon-static svg{display:block}.icon-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:transparent;color:#475569;cursor:pointer;-webkit-appearance:none;appearance:none;font:inherit;transition:background .15s ease,color .15s ease}.icon-btn:hover:not(:disabled){background:#f1f5f9;color:#0f172a}.icon-btn.danger{color:#b91c1c}.icon-btn.danger:hover:not(:disabled){background:#fef2f2;color:#991b1b}.icon-btn:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.icon-btn:disabled{opacity:.5;cursor:not-allowed}.icon-btn.loading:disabled{opacity:1;cursor:progress}.spinner{display:block;box-sizing:border-box;border:2px solid rgba(100,116,139,.3);border-top-color:currentColor;border-radius:50%;animation:ui-icon-spin .6s linear infinite}@keyframes ui-icon-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2s}}.icon-btn:after{content:\"\";position:absolute;inset:-8px}\n"],
-			dependencies: [{
-				kind: "directive",
-				type: NgTemplateOutlet,
-				selector: "[ngTemplateOutlet]",
-				inputs: [
-					"ngTemplateOutletContext",
-					"ngTemplateOutlet",
-					"ngTemplateOutletInjector"
-				]
-			}, {
-				kind: "directive",
-				type: TooltipDirective,
-				selector: "[uiTooltip]",
-				inputs: ["uiTooltip", "tooltipPosition"]
-			}],
-			changeDetection: i0.ChangeDetectionStrategy.OnPush
-		});
-	}
-};
-i0.ɵɵngDeclareClassMetadata({
-	minVersion: "12.0.0",
-	version: "22.2.2",
-	ngImport: i0,
-	type: IconComponent,
-	decorators: [{
-		type: Component,
-		args: [{
-			selector: "ui-icon",
-			standalone: true,
-			imports: [NgTemplateOutlet, TooltipDirective],
-			changeDetection: ChangeDetectionStrategy.OnPush,
-			template: `
-    @if (interactive()) {
-      <button type="button" class="icon-btn" [class.danger]="variant() === 'danger'"
-        [class.loading]="loading()" [disabled]="disabled() || loading()" [attr.aria-busy]="loading() ? 'true' : null"
-        [attr.aria-label]="accessibleName() || null" [uiTooltip]="tooltip()" (click)="onClick($event)">
-        <ng-container *ngTemplateOutlet="glyph" />
-      </button>
-    } @else {
-      <span class="icon-static" [class.danger]="variant() === 'danger'" [attr.aria-busy]="loading() ? 'true' : null"
-        [attr.role]="accessibleName() ? 'img' : null" [attr.aria-label]="accessibleName() || null" [uiTooltip]="tooltip()" [attr.aria-hidden]="accessibleName() ? null : 'true'">
-        <ng-container *ngTemplateOutlet="glyph" />
-      </span>
-    }
-    <ng-template #glyph>
-      @if (loading()) {
-        <span class="spinner" [style.width.px]="size()" [style.height.px]="size()" aria-hidden="true"></span>
-      } @else if (path(); as d) {
-        <svg viewBox="0 0 24 24" [attr.width]="size()" [attr.height]="size()" fill="none" stroke="currentColor"
-          stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
-          <path [attr.d]="d" />
-        </svg>
-      }
-    </ng-template>
-  `,
-			styles: [":host{display:inline-flex}.icon-static{display:inline-flex;align-items:center;justify-content:center;color:inherit}.icon-static.danger{color:#b91c1c}.icon-static svg{display:block}.icon-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:transparent;color:#475569;cursor:pointer;-webkit-appearance:none;appearance:none;font:inherit;transition:background .15s ease,color .15s ease}.icon-btn:hover:not(:disabled){background:#f1f5f9;color:#0f172a}.icon-btn.danger{color:#b91c1c}.icon-btn.danger:hover:not(:disabled){background:#fef2f2;color:#991b1b}.icon-btn:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.icon-btn:disabled{opacity:.5;cursor:not-allowed}.icon-btn.loading:disabled{opacity:1;cursor:progress}.spinner{display:block;box-sizing:border-box;border:2px solid rgba(100,116,139,.3);border-top-color:currentColor;border-radius:50%;animation:ui-icon-spin .6s linear infinite}@keyframes ui-icon-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2s}}.icon-btn:after{content:\"\";position:absolute;inset:-8px}\n"]
-		}]
-	}],
-	propDecorators: {
-		name: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "name",
-				required: true
-			}]
-		}],
-		tooltip: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "tooltip",
-				required: false
-			}]
-		}],
-		ariaLabel: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "ariaLabel",
-				required: false
-			}]
-		}],
-		size: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "size",
-				required: false
-			}]
-		}],
-		variant: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "variant",
-				required: false
-			}]
-		}],
-		disabled: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "disabled",
-				required: false
-			}]
-		}],
-		loading: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "loading",
-				required: false
-			}]
-		}],
-		interactive: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "interactive",
-				required: false
-			}]
-		}],
-		iconClick: [{
-			type: i0.Output,
-			args: ["iconClick"]
-		}]
-	}
-});
 var TimelineComponent = class TimelineComponent {
 	constructor() {
 		this.items = input([], ...ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []);
@@ -36511,6 +37099,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, 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, 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, pluralize, provideForgerouteToast, reorderItems, requiredIssue, resolveLayoutGap, resolvePreset, serializeBizHours };
+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 };
 
 //# sourceMappingURL=forgeroute-ui.mjs.map